/* css reset settings */
*,
*::after,
*::before { margin:0; padding:0; box-sizing:border-box; }
body { font-family:lato, sans-serif; font-weight:300; overflow-y:scroll; } 
@media only screen and (max-width:600px) { 
	div.contents h1	{ margin:0px 0px 0px 0px; font-size:1.8em; }	
	div.contents h2	{ margin:5px 0px 0px 0px; font-size:1.3em; }			
	div.contents p	{ margin:10px 0px 0px 0px; font-size:0.9em; }
	div.contents ul li	{ margin:0px 0px 0px 0px; line-height:120%; font-size:0.9em; }
	div.contents ol li	{ margin:0px 0px 0px 0px; line-height:120%; font-size:0.9em; }
}
@media only screen and (max-width:768px) {
	div.header 		{ display:none; }
	div.header img 	{ display:none; }
	div.header h1	{ display:none; }		
	div.header h2	{ display:none; }
	div.section1	{ padding:70px 0px 0px 0px; }
	div.section5	{ padding:70px 10px 40px 0px; }
	div.contents .content h1  { font-size:1.8em; }
	div.contents .content h2  { font-size:1.4em; }
	div.contents .content h3  { font-size:1.8em; }
	div.contents .content p	{ font-size:0.9em; }
	div.contents .content ul li	{ font-size:0.9em; }
}
@media only screen and (min-width:768px) { 
	.footer { text-align:center; padding:25px 0px; }
	div.mobile-nav img { display:none; }	
}
.main { display:flex; }
/* .imagetop { background-color:#2B5784; } */
/* .imagetop { background-color:#1C3753; } */
/* .imagetop { background-color:#204060; } */
.imagetop { background-color:#2B5784; }
/* Header-Logo Section */
.header { height:220px; margin:auto; padding:60px 0px 0px 20px; max-width:1000px; background-color:#2B5784; }
.header img	{ float:left; margin:0px 30px 0px 0px; border-radius:3px; }
.header h1 { padding:20px 0px 0px 0px; color:#ffffff; font-size:3em; }
.header h2 { padding:0px 0px 0px 0px; color:#ffffff; font-size:2.5em; }
/* Contents */
.contents .content h1 { padding:40px 0px 20px 20px; color:#000000; font-size:2.5em; }
.contents .content h2 { padding:0px 0px 20px 20px; color:#000000; font-size:2em; }
.contents .content h3 { padding:40px 0px 10px 20px; color:#000000; font-size:2.5em; }
.contents .content p { margin:0px 20px 0px 20px; line-height:150%; color:#000000; font-size:1em; }
.contents .content p a { text-decoration:none; }
.contents .content p a:link { color:#0153A5; } 
.contents .content p a:visited { color:#0153A5; }
.contents .content p a:active { color:#0153A5; }
.contents .content p a:hover { color:#66CCFF; }
.contents .content p a:focus { color:#0153A5; }
.contents .content ul { margin:10px 0px 0px 70px; }
.contents .content ul li { padding:0px 20px 10px 0px; line-height:150%; color:#000000; font-size:1em; }
.contents .content ol { margin:10px 0px 20px 50px; }
/* Section 1 */
.section1	{ display:block; overflow:auto; padding:0px 0px 50px 0px; background-color:#ffffff; }
.section1 .content { margin:auto; max-width:1000px; }
.section1 .content img { display:block; margin-left:auto; margin-right:auto; border-radius:3px;
	box-shadow:2px 2px 3px rgba(0,0,0,0.12), 2px 2px 2px rgba(0,0,0,0.24); }
/* Section 2 */
.section2	{ display:block; overflow:auto; padding:0px 0px 50px 0px; background-color:#F4F4F2; }
.section2 .content { margin:auto; max-width:1000px; }
.section2 .content img	{ float:left; margin:5px 10px 0px 20px; border-radius:3px; border-style:solid; border-color:#CCCCCC; border-width:thin; }
/* Section 3 */
.section3	{ display:block; overflow:auto; padding:0px 0px 50px 0px; background-color:#ffffff; }
.section3 .content { margin:auto; max-width:1000px; }
.section3 .content img	{ float:left; padding:0px 10px 0px 20px; border-radius:3px; }
/* Section 4 */
.section4	{ display:block; overflow:auto; padding:0px 0px 50px 0px; background-color:#666666; }
.section4 .content { margin:auto; max-width:1000px; }
.section4 .content h1 { color:#ffffff;}
.section4 .content p { color:#ffffff; }
.section4 .content p a:link { color:#99CCFF; }
.section4 .content p a:visited { color:#99CCFF; }
.section4 .content p a:active { color:#99CCFF; }
.section4 .content p a:hover { color:#CAE4FF; }
.section4 .content p a:focus { color:#99CCFF; }
/* Section 5 */
.section5	{ display:block; overflow:auto; padding:0px 0px 50px 0px; background-color:#ffffff; }
.section5 .content { margin:auto; max-width:1000px; }
.section5 .content img	{ float:left; padding:0px 10px 0px 20px; border-radius:3px; }
/* Desktop Nav Menu Bar */
.nav-container {
	margin:auto;
	background:#29537C;
	box-shadow:0px 2px 4px rgba(0,0,0,0.12), 0px 2px 3px rgba(0,0,0,0.24); 
	height:44px;
	z-index:300;
	position:fixed;
	left:0;
	top:0;
	right:0;
}
.nav-container nav {
	width:1000px;
	margin:0px auto;
	padding:0 8px;
	height:100%;
}
nav .desktop-nav { 
 	display:flex; 
 	justify-content:space-between;
 	align-items:center;
 	list-style:none;
 	margin:12px 0px 0px 0px;
}
nav .desktop-nav li a {
	padding:0px 30px 0px 30px;
	color:#ffffff;
	text-decoration:none;
	font-size:14px;
	opacity:1;
	transition:opacity 400ms;
}
nav .desktop-nav li a:hover { 
	color:beige;
	opacity:0.5; 
}
/* Media Queries */
@media (max-width:1000px) {		
	.nav-container nav {
		width:100%;
		padding:0px 0px;
	}
}
@media (max-width:768px) {
.nav-container {
	margin:auto;
	background:#000000;
	box-shadow:0px 2px 4px rgba(0,0,0,0.12), 0px 2px 3px rgba(0,0,0,0.24); 
	height:74px;
	z-index:300;
	position:fixed;
	left:0;
	top:0;
	right:0;
}
.nav-container .desktop-nav {
	flex-direction:column;
	position:fixed;
	top:62px;
	left:0;
	width:100%;
	height:0vh;
	background:#152B40;
	justify-content:start;
	overflow:hidden;
	z-index:-1;
	transition:all 400ms ease;
}
.nav-container.active .desktop-nav {
	height:300px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
}
.nav-container .desktop-nav li {
	padding:0 32px;
}
.nav-container .desktop-nav li a {
	padding:16px 0;
	display:inline-block;
	border-bottom:1px solid #616161;
	width:100%;
	font-size:17px;
	transform:translateY(-80px);
	opacity:0;
	transition:all 400ms ease;
}
.nav-container.active .desktop-nav li a {
	transform:translateY(0);
	opacity:1;
}
nav .desktop-nav li a:hover { 
	color:#FFB10F;
	opacity:0.5; 
}

/* Mobile Nav Icon */
nav .mobile-nav {
	display: flex;
	width: 100%;
	justify-content:space-between;
	list-style:none;
}
nav .menu-icon-container {
	width:20px;
	height:;
	margin:0px 0px 0px 30px;		
	display:flex;
	align-items:center;
	cursor:pointer;
}
nav .menu-icon {
	position:relative;
	width:100%;
}
nav .menu-icon .line-1,
nav .menu-icon .line-2,
nav .menu-icon .line-3 {
	position:absolute;
	height:1px;
	width:100%;
	background:#ffffff;
	transition-property:transform, top;
	transition-delay:0ms, 160ms;
	transition-duration:200ms;
}
nav .menu-icon .line-1 {
	top:-6px;
}
nav .menu-icon .line-2 {
	top:0px;
}
nav .menu-icon .line-3 {
	top:6px;
}
.nav-container.active nav .menu-icon-container .menu-icon .line-1 {
	top:0px;
	transform:rotate(45deg);
	transition-property:top, transform;
	transition-delay:0ms, 160ms;
	transition-duration:200ms;
}
.nav-container.active nav .menu-icon-container .menu-icon .line-2 {
	top:0px;
	transform:rotate(-45deg);
	transition-property:top, transform;
	transition-delay:0ms, 160ms;
	transition-duration:200ms;
}
.nav-container.active nav .menu-icon-container .menu-icon .line-3 {
	top:0px;
	transform:rotate(-45deg);
	transition-property:top, transform;
	transition-delay:0ms, 160ms;
	transition-duration:200ms;
}
.footer { text-align:center; padding:25px 0px; }