html, body{
	height:100%;
	}

body{
	margin: 0;
	background-color: #cccccc;
	color: #ffffff;
	font-family: Outfit, 'Tahoma', Geneva, sans-serif;
	font-size: 130%;
	padding: 0px 50px 0px 50px;
	}

a{
	color: #ffffff;
	text-decoration:none;
	border:0;
	outline:none;
	}

h1{
	display:flex;
	justify-content:center; 
	font-size:140%;
	}

p{
	max-width: 85%;
	margin: 0 auto;
	text-align:center;
	padding: 10px 0px 10px 0px;
	letter-spacing: 0.02em;
	line-height: 1.2;
	}

a:hover{
	color: #333333;
	transition: all 0.5s;
	}

hr{
	color: #ffffff;
	}

@font-face{
	font-family: 'Outfit';
	src: url('fonts/Outfit-Light.ttf');
	}

.flex-container-home{
	display:flex;
	height:100%;
	padding: 0;
	margin: 0;
	flex-direction: column;
	align-items:center;
	justify-content:center;
	}
.flex-container-content{
	display:flex;
	height:100%;
	padding: 0;
	margin: 0;
	flex-direction: column;
	align-items:center;
	justify-content:flex-start;
	}

.logo{
	padding-bottom:1%;
	}

.logosize{
	 display: block;
  	 margin-left: auto;
  	 margin-right: auto;
  	 max-width: 30%;
    min-width: 300px;
    height: auto;
	 padding-left: 15px;
	}

.alt_logo{
	max-width:30%;
	min-width:300px;
	display:block;
	margin-left:auto;
	margin-right:auto;
	padding-bottom:20px;
	padding-top:40px;
	}

.homenav{
	display:flex;
	justify-content:center;
	padding: 2px 10px 2px 10px;
	}

.navbar{
	display:flex;
	flex-direction:row;
	justify-content:center;
	}

.navitems{
	padding: 0px 5px 0px 5px;
	}

.social{
	width:25px;
	padding-left:10px;
	padding-right:10px;
	}

.social:hover{
	filter:brightness(150%);
	transition: all 0.5s;
	}

.social-box{
	display:flex; 
	justify-content:center;
	padding: 1% 0% 2% 0%;
	}

.back{
	font-size:80%;
	padding:0% 0% 1% 0%;
	}	

.contact{
	display:flex;
	justify-content:center;
	font-size:80%;
	}

.title{
	display:flex;
	justify-content:center;
	padding-top:0.5%;
	padding-bottom:1%;
	}

.pictureflex{
	display:flex;
	flex-direction:row;
	}

.picture{
	width:100%;
	max-width:350px;
	height:auto;
	
	border:solid;
	border-width:thin;
	border-color:#ffffff;
	margin: 2%; 

	filter:brightness(100%);
	transition: all 0.5s;
	}

.picture:hover{
	filter:brightness(85%);
	transition: all 0.5s;
	}

.sidepadding{
	padding: 0% 1% 0% 1%;
}

@media(max-width:800px){

	.pictureflex{
		display:flex;
		flex-direction:column;
		}

	.picture{
		width:100%;
		max-width:300px;
		height:auto;
		
		border:solid;
		border-width:thin;
		border-color:#ffffff;
		margin: 2%; 

		filter:brightness(100%);
	}
}