/* Sidebar settings */
#sidenav{
	position: fixed;
	top: 165px;
	z-index: 60;
}

#sidenav a{
	display: block;
	width: 165px;
	padding: 10px /*<-Top*/ 10px /*<-Right*/ 10px /*<-Bottom*/ 25px /*<-Left*/;
	margin-bottom: 5px;
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	background: #6abcf1; /* For browsers that do not support gradients */    
    background: -webkit-gradient(linear, left top, right top, color-stop(10%, #8a8a8a), color-stop(10%, #8a8a8a), color-stop(10%, #6abcf1));    
    background: -webkit-linear-gradient(left, #8a8a8a 10%, #8a8a8a 10%, #6abcf1 10%);    
    background: -o-linear-gradient(left, #8a8a8a 10%, #8a8a8a 10%, #6abcf1 10%);    
    background: linear-gradient(to right, #8a8a8a 10%, #8a8a8a 10%, #6abcf1 10%); /* Standard syntax */
	color: #ffffff;
	-webkit-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
	        box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
}

#sidenav a.current-tab{
	background: #3e93c9; /* For browsers that do not support gradients */    
    background: -webkit-gradient(linear, left top, right top, color-stop(10%, #595959), color-stop(10%, #595959), color-stop(10%, #3e93c9));    
    background: -webkit-linear-gradient(left, #595959 10%, #595959 10%, #3e93c9 10%);    
    background: -o-linear-gradient(left, #595959 10%, #595959 10%, #3e93c9 10%);    
    background: linear-gradient(to right, #595959 10%, #595959 10%, #3e93c9 10%); /* Standard syntax */
}

#sidenav a:hover{
	text-decoration: none;
	background: #6abcf1; /* For browsers that do not support gradients */    
    background: -webkit-gradient(linear, left top, right top, color-stop(10%, #434343), color-stop(10%, #434343), color-stop(10%, #2f6f97));    
    background: -webkit-linear-gradient(left, #434343 10%, #434343 10%, #2f6f97 10%);    
    background: -o-linear-gradient(left, #434343 10%, #434343 10%, #2f6f97 10%);    
    background: linear-gradient(to right, #434343 10%, #434343 10%, #2f6f97 10%); /* Standard syntax */
}

#expand-button{
	display: none;
}
	
@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	#sidenav{
		cursor: pointer;
		top: calc(50vh - 240px);
		left: -140px;
		-webkit-transition: .25s all ease;
		-o-transition: .25s all ease;
		transition: .25s all ease;
	}

	#sidenav a{
		width: 140px;
		font-size: 16px;
		margin-bottom: 0px;
		border-top-right-radius: 0px;
		border-bottom-right-radius: 0px;
	}

	#expand-button{
		display: block;
		height: 50px;
		width: auto;
		position: absolute;
		top: calc(50% - 24.5px);
		left: 140px;
		border-top-right-radius: 10px;
		border-bottom-right-radius: 10px;
		-webkit-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
		        box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
	}
	
	#sidenav:hover{
		left: 0;
		-webkit-transition: .25s all ease;
		-o-transition: .25s all ease;
		transition: .25s all ease;
	}
}



/* Text settings */
h4{
	margin: 0px;
	padding: 60px /*<-Top*/ 80px /*<-Right*/ 40px /*<-Bottom*/ 0px /*<-Left*/;
	color: #0061a6;
	font-size: 36px;
}

h5{
	margin: 0px;
	color: #052369;
	font-size: 30px;
}

h6{
	margin: 0px;
	padding: 20px /*<-Top*/ 80px /*<-Right*/ 10px /*<-Bottom*/ 0px /*<-Left*/;
	font-size: 24px;
}

.h7{
	font-style: italic;
	text-decoration: underline;
	padding-bottom: 5px;
}

.h8{
	font-family: 'Arvo';
	padding-right: 80px;
}

.h9{
	text-align: center;
	font-style: italic;
	font-weight: bold;
	font-size: 22px;
}

@media only screen and (max-width: 960px){ /* Applies when screen size <= 960px */
	.h8{
		text-align: center;
	}
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	h4{
		padding: 60px /*<-Top*/ 80px /*<-Right*/ 40px /*<-Bottom*/ 80px /*<-Left*/;
	}
	
	h5{
		padding: 0px /*<-Top&Bottom*/ 80px /*<-Sides*/;
	}
	
	h6{
		padding: 20px /*<-Top*/ 80px /*<-Right*/ 10px /*<-Bottom*/ 80px /*<-Left*/;
	}
	
	.h8{
		padding: 0px /*<-Top&Bottom*/ 80px /*<-Sides*/;
	}
}

@media only screen and (max-width: 520px){ /* Applies when screen size <= 520px */
	h4{
		font-size: 24px;
	}
	
	h5{
		font-size: 20px;
	}
	
	h6{
		font-size: 18px;
	}
	
	.h8{
		font-size: 16px;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	h4{
		padding: 50px /*<-Top*/ 40px /*<-Right*/ 40px /*<-Bottom*/ 40px /*<-Left*/;
	}
	
	h5{
		padding: 0px /*<-Top&Bottom*/ 40px /*<-Sides*/;
	}
	
	h6{
		padding: 20px /*<-Top*/ 40px /*<-Right*/ 10px /*<-Bottom*/ 40px /*<-Left*/;
	}
	
	.h8{
		padding: 0px /*<-Top&Bottom*/ 40px /*<-Sides*/;
	}
}

.content-hr{
	border: 0;
	height: 2px;
	background-image: #6abcf1; /* For browsers that do not support gradients */
    background-image: -webkit-gradient(linear, left top, right top, from(#6abcf1), to(#ffffff));
    background-image: -webkit-linear-gradient(left, #6abcf1, #ffffff);
    background-image: -o-linear-gradient(left, #6abcf1, #ffffff);
    background-image: linear-gradient(to right, #6abcf1, #ffffff); /* Standard syntax */
	margin: 8px /*<-Top*/ 80px /*<-Right*/ 8px /*<-Bottom*/ 0px /*<-Left*/;
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	.content-hr{
		margin: 8px /*<-Top&Bottom*/ 80px /*<-Sides*/;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	.content-hr{
		margin: 8px /*<-Top&Bottom*/ 40px /*<-Sides*/;
	}
}

#content{
	max-width: 1210px;
	padding-left: 200px;
	margin: 0;
	-webkit-box-sizing: content-box;
	        box-sizing: content-box;
}

@media only screen and (min-width: 1700px){ /* Applies when screen width >= 900px */
	#content{
		max-width: 1290px;
		padding-left: 0px;
		margin: 0 auto;
	}
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	#content{
		max-width: 1290px;
		padding-left: 0px;
		margin: 0 auto;
	}
}

#content p{
	margin: 0px;
	padding: 0px /*<-Top*/ 80px /*<-Right*/ 20px /*<-Bottom*/ 0px /*<-Left*/;
	line-height: 135%;
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	#content p{
		padding: 0px /*<-Top*/ 80px /*<-Right*/ 20px /*<-Bottom*/ 80px /*<-Left*/;
	}
}

@media only screen and (max-width: 520px){ /* Applies when screen size <= 520px */
	#content p{
		font-size: 16px;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	#content p{
		padding: 0px /*<-Top*/ 40px /*<-Right*/ 20px /*<-Bottom*/ 40px /*<-Left*/;
	}
}

#content ul{
	padding-right: 80px;
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	#content ul{
		padding: 0px /*<-Top*/ 80px /*<-Right*/ 0px /*<-Bottom*/ 120px /*<-Left*/;
	}
}

@media only screen and (max-width: 520px){ /* Applies when screen size <= 520px */
	#content ul{
		font-size: 16px;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	#content ul{
		padding: 0px /*<-Top*/ 40px /*<-Right*/ 0px /*<-Bottom*/ 80px /*<-Left*/;
	}
}



/* Image settings */
.content-pic{
	padding: 40px /*<-Top*/ 0px /*<-Right*/ 0px /*<-Bottom*/ 0px /*<-Left*/;
	width: 100%;
	height: auto;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	.content-pic{
		padding: 40px /*<-Top*/ 80px /*<-Right*/ 0px /*<-Bottom*/ 80px /*<-Left*/;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	.content-pic{
		padding: 40px /*<-Top*/ 40px /*<-Right*/ 0px /*<-Bottom*/ 40px /*<-Left*/;
	}
}

@media only screen and (min-width: 900px) and (min-height: 500px){ /* Applies when screen width >= 900px and screen height >= 500px */
	.cp-img{
		padding-right: 100px;	/* Overrides setting in general.css */
	}
}



/* Download Links settings */
.download-container{
	padding-right: 80px;
	text-align: center;
	font-size: 0.1px;
}


@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	.download-container{
		padding: 0px /*<-Top&Bottom*/ 80px /*<-Sides*/;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	.download-container{
		padding: 0px /*<-Top&Bottom*/ 40px /*<-Sides*/;
	}
}

.download-container a:link{
	color: #805400;
	-webkit-transition: .25s all ease;
	-o-transition: .25s all ease;
	transition: .25s all ease;
}

.download-container a:hover{
	background-color: #ffd870;
	text-decoration: none;
	-webkit-transition: .25s all ease;
	-o-transition: .25s all ease;
	transition: .25s all ease;
}

.download-container a:visited{
	color: #805400;
}

.download-box{
	text-align: center;
	display: block;
	padding: 20px;
	background-color: #ffba00;
	font-size: 20px;
	border-radius: 50px;
	margin: 15px auto;
	max-width: 400px;
}

@media only screen and (max-width: 520px){ /* Applies when screen size <= 520px */
	.download-box{
		font-size: 16px;
		padding: 20px;
		margin: 10px /*<-Top&Bottom*/ 0px /*<-Sides*/;
	}
}/* Sidebar settings */
#sidenav{
	position: fixed;
	top: 165px;
	z-index: 60;
}

#sidenav a{
	display: block;
	width: 165px;
	padding: 10px /*<-Top*/ 10px /*<-Right*/ 10px /*<-Bottom*/ 25px /*<-Left*/;
	margin-bottom: 5px;
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	background: #6abcf1; /* For browsers that do not support gradients */    
    background: -webkit-gradient(linear, left top, right top, color-stop(10%, #8a8a8a), color-stop(10%, #8a8a8a), color-stop(10%, #6abcf1));    
    background: -webkit-linear-gradient(left, #8a8a8a 10%, #8a8a8a 10%, #6abcf1 10%);    
    background: -o-linear-gradient(left, #8a8a8a 10%, #8a8a8a 10%, #6abcf1 10%);    
    background: linear-gradient(to right, #8a8a8a 10%, #8a8a8a 10%, #6abcf1 10%); /* Standard syntax */
	color: #ffffff;
	-webkit-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
	        box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
}

#sidenav a.current-tab{
	background: #3e93c9; /* For browsers that do not support gradients */    
    background: -webkit-gradient(linear, left top, right top, color-stop(10%, #595959), color-stop(10%, #595959), color-stop(10%, #3e93c9));    
    background: -webkit-linear-gradient(left, #595959 10%, #595959 10%, #3e93c9 10%);    
    background: -o-linear-gradient(left, #595959 10%, #595959 10%, #3e93c9 10%);    
    background: linear-gradient(to right, #595959 10%, #595959 10%, #3e93c9 10%); /* Standard syntax */
}

#sidenav a:hover{
	text-decoration: none;
	background: #6abcf1; /* For browsers that do not support gradients */    
    background: -webkit-gradient(linear, left top, right top, color-stop(10%, #434343), color-stop(10%, #434343), color-stop(10%, #2f6f97));    
    background: -webkit-linear-gradient(left, #434343 10%, #434343 10%, #2f6f97 10%);    
    background: -o-linear-gradient(left, #434343 10%, #434343 10%, #2f6f97 10%);    
    background: linear-gradient(to right, #434343 10%, #434343 10%, #2f6f97 10%); /* Standard syntax */
}

#expand-button{
	display: none;
}
	
@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	#sidenav{
		cursor: pointer;
		top: calc(50vh - 240px);
		left: -140px;
		-webkit-transition: .25s all ease;
		-o-transition: .25s all ease;
		transition: .25s all ease;
	}

	#sidenav a{
		width: 140px;
		font-size: 16px;
		margin-bottom: 0px;
		border-top-right-radius: 0px;
		border-bottom-right-radius: 0px;
	}

	#expand-button{
		display: block;
		height: 50px;
		width: auto;
		position: absolute;
		top: calc(50% - 24.5px);
		left: 140px;
		border-top-right-radius: 10px;
		border-bottom-right-radius: 10px;
		-webkit-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
		        box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
	}
	
	#sidenav:hover{
		left: 0;
		-webkit-transition: .25s all ease;
		-o-transition: .25s all ease;
		transition: .25s all ease;
	}
}



/* Text settings */
h4{
	margin: 0px;
	padding: 60px /*<-Top*/ 80px /*<-Right*/ 40px /*<-Bottom*/ 0px /*<-Left*/;
	color: #0061a6;
	font-size: 36px;
}

h5{
	margin: 0px;
	color: #052369;
	font-size: 30px;
}

h6{
	margin: 0px;
	padding: 20px /*<-Top*/ 80px /*<-Right*/ 10px /*<-Bottom*/ 0px /*<-Left*/;
	font-size: 24px;
}

.h7{
	font-style: italic;
	text-decoration: underline;
	padding-bottom: 5px;
}

.h8{
	font-family: 'Arvo';
	padding-right: 80px;
}

.h9{
	text-align: center;
	font-style: italic;
	font-weight: bold;
	font-size: 22px;
}

@media only screen and (max-width: 960px){ /* Applies when screen size <= 960px */
	.h8{
		text-align: center;
	}
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	h4{
		padding: 60px /*<-Top*/ 80px /*<-Right*/ 40px /*<-Bottom*/ 80px /*<-Left*/;
	}
	
	h5{
		padding: 0px /*<-Top&Bottom*/ 80px /*<-Sides*/;
	}
	
	h6{
		padding: 20px /*<-Top*/ 80px /*<-Right*/ 10px /*<-Bottom*/ 80px /*<-Left*/;
	}
	
	.h8{
		padding: 0px /*<-Top&Bottom*/ 80px /*<-Sides*/;
	}
}

@media only screen and (max-width: 520px){ /* Applies when screen size <= 520px */
	h4{
		font-size: 24px;
	}
	
	h5{
		font-size: 20px;
	}
	
	h6{
		font-size: 18px;
	}
	
	.h8{
		font-size: 16px;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	h4{
		padding: 50px /*<-Top*/ 40px /*<-Right*/ 40px /*<-Bottom*/ 40px /*<-Left*/;
	}
	
	h5{
		padding: 0px /*<-Top&Bottom*/ 40px /*<-Sides*/;
	}
	
	h6{
		padding: 20px /*<-Top*/ 40px /*<-Right*/ 10px /*<-Bottom*/ 40px /*<-Left*/;
	}
	
	.h8{
		padding: 0px /*<-Top&Bottom*/ 40px /*<-Sides*/;
	}
}

.content-hr{
	border: 0;
	height: 2px;
	background-image: #6abcf1; /* For browsers that do not support gradients */
    background-image: -webkit-gradient(linear, left top, right top, from(#6abcf1), to(#ffffff));
    background-image: -webkit-linear-gradient(left, #6abcf1, #ffffff);
    background-image: -o-linear-gradient(left, #6abcf1, #ffffff);
    background-image: linear-gradient(to right, #6abcf1, #ffffff); /* Standard syntax */
	margin: 8px /*<-Top*/ 80px /*<-Right*/ 8px /*<-Bottom*/ 0px /*<-Left*/;
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	.content-hr{
		margin: 8px /*<-Top&Bottom*/ 80px /*<-Sides*/;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	.content-hr{
		margin: 8px /*<-Top&Bottom*/ 40px /*<-Sides*/;
	}
}

#content{
	max-width: 1210px;
	padding-left: 200px;
	margin: 0;
	-webkit-box-sizing: content-box;
	        box-sizing: content-box;
}

@media only screen and (min-width: 1700px){ /* Applies when screen width >= 900px */
	#content{
		max-width: 1290px;
		padding-left: 0px;
		margin: 0 auto;
	}
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	#content{
		max-width: 1290px;
		padding-left: 0px;
		margin: 0 auto;
	}
}

#content p{
	margin: 0px;
	padding: 0px /*<-Top*/ 80px /*<-Right*/ 20px /*<-Bottom*/ 0px /*<-Left*/;
	line-height: 135%;
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	#content p{
		padding: 0px /*<-Top*/ 80px /*<-Right*/ 20px /*<-Bottom*/ 80px /*<-Left*/;
	}
}

@media only screen and (max-width: 520px){ /* Applies when screen size <= 520px */
	#content p{
		font-size: 16px;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	#content p{
		padding: 0px /*<-Top*/ 40px /*<-Right*/ 20px /*<-Bottom*/ 40px /*<-Left*/;
	}
}

#content ul{
	padding-right: 80px;
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	#content ul{
		padding: 0px /*<-Top*/ 80px /*<-Right*/ 0px /*<-Bottom*/ 120px /*<-Left*/;
	}
}

@media only screen and (max-width: 520px){ /* Applies when screen size <= 520px */
	#content ul{
		font-size: 16px;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	#content ul{
		padding: 0px /*<-Top*/ 40px /*<-Right*/ 0px /*<-Bottom*/ 80px /*<-Left*/;
	}
}



/* Image settings */
.content-pic{
	padding: 40px /*<-Top*/ 0px /*<-Right*/ 0px /*<-Bottom*/ 0px /*<-Left*/;
	width: 100%;
	height: auto;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	.content-pic{
		padding: 40px /*<-Top*/ 80px /*<-Right*/ 0px /*<-Bottom*/ 80px /*<-Left*/;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	.content-pic{
		padding: 40px /*<-Top*/ 40px /*<-Right*/ 0px /*<-Bottom*/ 40px /*<-Left*/;
	}
}

@media only screen and (min-width: 900px) and (min-height: 500px){ /* Applies when screen width >= 900px and screen height >= 500px */
	.cp-img{
		padding-right: 100px;	/* Overrides setting in general.css */
	}
}



/* Download Links settings */
.download-container{
	padding-right: 80px;
	text-align: center;
	font-size: 0.1px;
}


@media only screen and (max-width: 900px), (max-height: 500px){ /* Applies when screen width <= 900px or screen height <= 500px */
	.download-container{
		padding: 0px /*<-Top&Bottom*/ 80px /*<-Sides*/;
	}
}

@media only screen and (max-width: 470px){ /* Applies when screen size <= 470px */
	.download-container{
		padding: 0px /*<-Top&Bottom*/ 40px /*<-Sides*/;
	}
}

.download-container a:link{
	color: #805400;
	-webkit-transition: .25s all ease;
	-o-transition: .25s all ease;
	transition: .25s all ease;
}

.download-container a:hover{
	background-color: #ffd870;
	text-decoration: none;
	-webkit-transition: .25s all ease;
	-o-transition: .25s all ease;
	transition: .25s all ease;
}

.download-container a:visited{
	color: #805400;
}

.download-box{
	text-align: center;
	display: block;
	padding: 20px;
	background-color: #ffba00;
	font-size: 20px;
	border-radius: 50px;
	margin: 15px auto;
	max-width: 400px;
}

@media only screen and (max-width: 520px){ /* Applies when screen size <= 520px */
	.download-box{
		font-size: 16px;
		padding: 20px;
		margin: 10px /*<-Top&Bottom*/ 0px /*<-Sides*/;
	}
}