/* CSS Document */
body{
	background-color: #c0e0b8;
}
h1{
	font-family:raleway, sans-serif;
	color:#02A64D;
	font-size:1.8em;
	text-decoration:underline
}
h2{
	font-family:raleway, sans-serif;
	font-size:1.4em;
	padding: 1% 0;
	text-align:center;
}
h3{
	font-family:raleway, sans-serif;
	font-size:1.3em;
	text-align:center;
	padding-bottom:2%
}
h6{
	margin-top:2em;
	font-family:serif
}
p{
	font-family:arial,sans-serif;
	font-size: 1.2em;
	text-align:justify;
	line-height:1.25em
}
#bio{
	margin-top:3%
}
header{
	border-bottom: #e1a326 solid 3px;
	text-align: center;
	padding:2.5% 0
}
img{
	max-width:100%;
}
#portrait{
	display:block;
	margin-left:auto;
	margin-right:auto;
}
#cropportrait{
	display:none
}
.gallery{
	transition: filter 0.2s
}
.gallery a{
	max-width:33%;
}
.gallery:hover{
	filter:grayscale(0.7)
}
section{
	border-bottom: #e1a326 solid 3px;
	border-top: #e1a326 solid 3px;
	padding: 3%
}
a:link, a:active, a:visited{
	color:#fff;
	font-family:arial;
	font-weight:300;
	text-decoration:none;;
	font-size:1.5em;
}
a:hover{
	color:#e1a326
}
#bottomlink{
	display:block;
	text-align:center;
	text-decoration:underline;
	padding-bottom:2%;
	transition: font-size 0.3s
}
#bottomlink:link, #bottomlink:active, #bottomlink:visited{
	color:#C18A1A
}
#bottomlink:hover{
	color:#513908;
	font-size:2em
}
footer{
	background-color: #03a64c;
	color:white;
	text-align:center;
	padding-bottom:3%
}
footer p{
	text-align:center;
	padding-bottom:3%
}
#miniportcontainer{
	display:flex;
	flex-wrap:wrap;
}
#miniportcontainer a{
	display: inline;
	width:33%;
}
#miniportcontainer img{
	max-width:100%;
	border:2px solid #e1a326
}
#mobilenav{
	text-align: center;
	background-color:#03a64c;
	display:none
}
#largenav{
	display:none;
	padding:3% 0
}
#bottomnav li{
	padding-top: 0.55em
}
.upbutton{
	position:fixed;
	background-color:#333;
	bottom:15px;
	border-radius:50%;
	width:45px;
	height:45px;
	margin-left:1em;
	text-align:center
}
.logo{
	max-width:80%;
	display:block;
	margin: 0 auto;
}
.parallax{
	display:none
}
/*Tablet Media Query*/
@media screen and (min-width:768px){
	h1{
		display:none;
	}
	.logo{
		max-width: 50%
	}
	#portrait{
		max-width:50%;
		display:none
	}
	#cropportrait{
		display:block
	}
	#menubutton{
		display:none;
	}
	#mobilenav{
		display:none !important;
	}
	#largenav{
		display:block;
		background-color:#03a64c;
		padding:1.7%
	}
	#largenav ul{
		display:flex;
		justify-content:space-around;
		
	}
}
/*Desktop Media Query*/
@media screen and (min-width:1000px){
	.logo{
		max-width:30%;
	}
	#largenav{
		padding:1.5%
	}
	header{
		padding: 1% 0
	}
	main{
		max-width:70%;
		margin:auto
	}
	#cropportrait{
		display:none;
	}
	.parallax{
	  display:block;
			  /* The image used */
	  background-image: url("../img/homepage/photocrop.jpg");
		filter:grayscale(50%);
		filter:blur(2px);
		transition:0.5s;

	  /* Set a specific height */
	  min-height: 450px;

	  /* Create the parallax scrolling effect */
	  background-attachment: fixed;
	  background-position: center;
	  background-repeat: no-repeat;
	  background-size: cover;
		}
	.parallax:hover{
		filter:blur(0px)
	}
}
@media screen and (min-width:1400px){
		main{
		max-width:980px;
	}
}
@media screen and (min-width:1921px){
	body{
		max-width:1400px;
		margin:0 auto;
		border-right:6px solid #03a64c;
		border-left:6px solid #03a64c;
	}
}