@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900');
* {box-sizing:border-box;border:none;}
html, body {height:100%;}
body {margin:0;padding:0;font-family:"Source Sans Pro", sans-serif;font-size:100%;color:#000;background:#0b1926 url(images/background.jpg)repeat;}
h1, h2, h3 {margin:0;padding:0;font-weight:bold;color:#8B2635;}
h1 {margin-bottom:.7em;font-size:2em;text-transform:uppercase;}
h2 {margin-bottom:.3em;font-size:1.7em;}
h3 {margin-bottom:.5em;font-size:1.6em;}
p, ol, ul {margin-top:0;}
p {line-height:1.5;}
a {color:#26408B;text-decoration:underline;}
a:visited {color:#AF3800;}
a:hover, a:focus {text-decoration:none;}
/*********************/
/* Button Style      */
/*********************/

.button {position:absolute;bottom:40px;left:50%;margin:0 auto;
	transform:translatex(-50%);display:inline-block;
	-webkit-border-radius:10px;
	-webkit-box-shadow:
		0px 3px rgba(32,75,114,1), /* gradient effects */
		0px 4px rgba(26,68,105,1),
		0px 5px rgba(19,44,66,1),
		0px 6px 6px -1px rgba(11,25,38,1);/* shadow */
	-webkit-transition:-webkit-box-shadow .1s ease-in-out;}
.button span {background-color:#24a0c7;
	background-image:
	/* gradient */
		-webkit-gradient(
			linear, left bottom, left top,
			color-stop(50%,rgba(255,255,255,0)),
			color-stop(50%,rgba(255,255,255,0.3)),
			color-stop(100%,rgba(255,255,255,0.2))),
		-webkit-gradient(
			linear, left top, right top,
			color-stop(0%,rgba(210,210,210,0.3)),
			color-stop(20%,rgba(210,210,210,0)),
			color-stop(80%,rgba(210,210,210,0)),
			color-stop(100%,rgba(210,210,210,0.3))),
		-webkit-gradient(
			linear, left top, right top,
			color-stop(0%,rgba(255,255,255,0)),
			color-stop(20%,rgba(255,255,255,0.3)),
			color-stop(80%,rgba(255,255,255,0.3)),
			color-stop(100%,rgba(255,255,255,0))),
	/* hatching */
		-webkit-gradient(
			linear, 0% 100%, 100% 0%,
			color-stop(0%,rgba(255,255,255,0)),
			color-stop(40%,rgba(255,255,255,0)),
			color-stop(60%,rgba(255,255,255,0)),
			color-stop(100%,rgba(255,255,255,0)));
	-webkit-box-shadow:0px 1px 1px #FFF;/* bottom edge */
	-webkit-background-size:100%, 100%, 100%, 4px 4px;
	-webkit-border-radius:10px;
	-webkit-transition:-webkit-transform .1s ease-in-out;
	display:inline-block;padding:10px 0px;width:200px;margin:0px auto;
	color:#0b1926;text-transform:uppercase;
	font-family:'Tahoma';font-weight:bold;font-size:1em;
	text-shadow:0px 1px #fff, 0px -1px #262F33;}
.button span:hover {color:#F5F3F5;
	text-shadow:0px -1px #0b1926;}
.button:active {
	-webkit-box-shadow:
		0px 3px rgba(128,128,128,1),
		0px 4px rgba(118,118,118,1),
		0px 5px rgba(108,108,108,1),
		0px 6px rgba(98,98,98,1),
		0px 7px rgba(88,88,88,1),
		0px 8px rgba(78,78,78,1),
		0px 10px 2px 0px rgba(128,128,128,.6);/* shadow */	}
.button:active span{
	-webkit-transform:translate(0, 5px);/* depth of button press */}

/*********************/
/* skip link         */
/*********************/
#skip a {position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden;}
#skip a:focus {position:static;padding-left:15px;width:auto;height:auto;color:#F5F3F5;font-size:1em;}

/*********************/
/* logo              */
/*********************/
#header {text-transform:uppercase;display:flex;flex-wrap:wrap;width:100%;margin:auto;}
#site-title {padding-left:5px;flex-grow:1;width:75%;}
#site-title h1 {font-size:8vw;line-height:1.2;text-shadow:0px 2px 2px #24a0c7;color:#F5F3F5;margin-bottom:0;}
#site-title .subtitle {font-size:5vw;font-weight:bold;margin:0;text-shadow:0px 1px 2px #24a0c7;color:#F5F3F5}
#site-title img {width:100%;height:auto;}
#logo {max-width:18vw;width:20%;margin:0;flex-grow:1;}
#logo img {display:block;margin:0;width:100%;}

/*********************/
/* Nav               */
/*********************/
/*****Main nav*****/
nav {width:100%;border-bottom:4px solid #24a0c7;border-top:4px solid #24a0c7;background:#0b1926 url(images/background.jpg) repeat;}
nav ul {margin:0;padding:0;width:100%;list-style:none;text-align:left;}
#nav {width:100%;display:none;}
#nav li {position:relative;}
#nav a {display:block;width:100%;padding:0em .5em;line-height:2.5;letter-spacing:1px;
	text-decoration:none;text-transform:uppercase;font-size:1.2em;font-weight:600;color:#F5F3F5;text-align:left;}
#nav a:hover, #nav a:focus {text-decoration:underline;}
#nav .current > a {color:#0D1E30;text-decoration:none;background:#24a0c7;}
#nav .current a:hover, #nav .current a:focus {text-decoration:underline;}
#nav .dropbtn {position:relative;}
#nav > li {width:100%;display:inline-block;padding:0;margin:0 -1px;z-index:1;}
#nav > li > ul {display:none;width:100%;position:relative;left:20px;border-bottom:none;white-space:nowrap;}
#nav > li > ul a {background:#0b1926 url(images/background.jpg) repeat;text-decoration:none;display:block;line-height:1.5;padding:.2em .5em;}
.menudrop {display:block;height:2.5em;cursor:pointer;padding:0;padding-top:5px;}
.menudrop a {color:#F5F3F5;text-decoration:none;}
.menudrop a:hover, .menudrop a:focus {text-decoration:underline;}
.box-shadow-menu {display:block;vertical-align:bottom;position:relative;
	font-weight:600;font-size:1.2em;margin-left:1em;padding-left:1.5em;}
.box-shadow-menu:hover, .box-shadow-menu:focus {text-decoration:none;}
.box-shadow-menu:before {content:"";
	position:absolute;left:0;top:0.4em;
	width:1.3em;height:.1em;background:#F5F3F5;
	box-shadow:0 .3em #F5F3F5, 0 .6em #F5F3F5;}

/*****Hidden nav*****/
#hidenav {font-size:.9em;font-weight:600;text-align:center;width:100%;margin:0 auto;padding:0px;
	display:inline-block;background-color:#c3bfbf;list-style:none;border:#c3bfbf solid;}
#hidenav a {padding:0px 10px;}
#hidenav a:link {color:#26408B;}
#hidenav a:visited {color:#AF3800;}
#hidenav .hidebtn {cursor:pointer;line-height:1.5;color:#26408B;}
.hide-content {background:#c3bfbf;display:none;line-height:2.5;}

.hide-content li::after {content:"|";color:#26408B;}
.hide-content li::before {content:"|";color:#26408B;margin-left:-4px;}
/*********************/
/* content           */
/*********************/
.container {width:100%;margin:0em auto 1em;background:#FFF;overflow:hidden;border-bottom:4px solid #24a0c7;font-size:1.1em;}
.container h1 {width:100%;text-align:center;color:#0b1926;margin-bottom:.5em;}
.container h2 {font-size:1.6em;}

/*****Home*****/
.welcome {display:none;background:initial;width:100%;}
.welcome h2 {letter-spacing:0.10em;text-transform:uppercase;margin:0;font-size:1.85em;color:#F5F3F5;text-align:center;}
#banner {display:none;}
#mobilebanner {display:block;margin:0;text-align:center;width:100%;overflow:hidden;border-bottom:#24a0c7 solid 2px;}

/*****Sidebar*****/
.sidebar {padding:30px 30px 50px;display:flex;flex-wrap:wrap;justify-content:space-around;align-items:stretch;}
.sidebar p {padding:0;}
.sidebar h2 {margin-bottom:.5em;}
div.left {width:70%;flex:3;padding:20px 20px 10px;min-width:300px;}
.left hr {background-color:#838383;height:2px;border-collapse:collapse;width:90%;margin:0 auto 10px;}
.left img {padding:0 0 10px;width:100%;float:right;}
.left .fig img {padding:0;width:100%;}
.sidebar aside {flex:1;width:30%;min-width:300px;padding:20px 20px 10px;position:relative;}
.sidebar aside h2 {text-align:center;}
.sidebar aside p {padding:0;margin-bottom:2px;}

@media all and (min-width:475px)
{.left img {padding:0 0 0 10px;max-width:275px;}}

/***Call-out***/
.call-out {background:#c3bfbf;border-radius:25px 75px;margin:5px 6%;padding:20px;}

/***Three box***/
.three-box {display:flex;flex-wrap:wrap;}
#box1, #box2, #box3 {padding:40px 40px 100px;min-width:300px;position:relative;flex:1;}

/***Full width***/
.full {padding:50px;display:flex;flex-wrap:wrap;justify-content:space-around;align-items:stretch;}
.full p {padding:20px 0px;}

/***Rows***/
.rows {padding:20px 0;}
.rows .imgbox {width:100%;height:250px;overflow:hidden;margin-bottom:20px;}
.rows .col {flex:1 0 285px;max-width:550px;}
.rows .col img {max-width:100%;padding-bottom:10px;}
.rows .col img.float {padding:0 20px 0 5px;}
.rows .split {flex: 1 0 300px;width:45%;margin:2% 0;}
.no-grid .thumbnails {max-width:100%;}
.row {display:flex;flex-wrap:wrap;width:100%;padding:0 6% 1em;margin:auto;overflow:hidden;justify-content:space-between;align-items:center;}
.row-col {align-items:stretch;}
.rows .port-text {flex:4 0 250px;}
.right-text {flex-wrap:wrap-reverse;}
table.thumbnails {flex:2 0 250px;border-collapse:collapse;
/*for mobile only*/width:100%;text-align:center;}
.thumbnails * {overflow:hidden;}
.thumbnails tr td {border:none;padding:0;text-align:center;display:flex;flex-wrap:wrap;justify-content:space-around;}
.thumbnails tr td a {flex:1 1 200px;max-width:250px;}
.thumbnails td img {display:inline;padding:6px;max-width:100%;}
.port-wide-box > iframe {width:330px;height:245px;}
.rows .hidemobile {display:none;}

#about.rows {padding:0 0 20px;}
#about .row {padding:0 0 30px;}
#about h2, #about p {padding:0 6%;}
#about ul {padding:0 6%;margin-left:20px;}
#about .col {flex:1 0 270px;}
#about .col img {max-width:80%;}

/*********************/
/* footer            */
/*********************/
#footer	{width:100%;color:#24a0c7;padding:1em 1em 6em;font-size:.8em;letter-spacing:0.20em;text-align:center;text-transform:uppercase;clear:both;}
#footer p {text-align:center;color:#c3bfbf;margin:auto;padding-top:3px;}
#footer a {color:#F5F3F5;text-decoration:none;}
#footer a:hover, #footer a:focus {text-decoration:underline;}

/*****Share*****/
#share {position:fixed;bottom:0;left:5px;border-radius:0;padding:0;}

/*****Top*****/
div.top {position:fixed;bottom:0px;right:-10px;background:none;overflow:hidden;}
div.top img {width:60%;}