@font-face{font-family:'Open Sans Bold';src:url(../fonts/OpenSans-Bold.ttf) format('truetype')}
@font-face{font-family:'Open Sans Bold Italic';src:url(../fonts/OpenSans-BoldItalic.ttf) format('truetype')}
@font-face{font-family:'Open Sans Extra Bold';src:url(../fonts/OpenSans-ExtraBold.ttf) format('truetype')}
@font-face{font-family:'Open Sans Extra Bold Italic';src:url(../fonts/OpenSans-ExtraBoldItalic.ttf) format('truetype')}
@font-face{font-family:'Open Sans Italic';src:url(../fonts/OpenSans-Italic.ttf) format('truetype')}
@font-face{font-family:'Open Sans Light';src:url(../fonts/OpenSans-Light.ttf) format('truetype')}
@font-face{font-family:'Open Sans Light Italic';src:url(../fonts/OpenSans-LightItalic.ttf) format('truetype')}
@font-face{font-family:'Open Sans Regular';src:url(../fonts/OpenSans-Regular.ttf) format('truetype')}
@font-face{font-family:'Open Sans Semibold';src:url(../fonts/OpenSans-Semibold.ttf) format('truetype')}
@font-face{font-family:'Open Sans Semibold Italic';src:url(../fonts/OpenSans-SemiboldItalic.ttf) format('truetype')}


body {
  color:#454545;
  font-family:'Open Sans Regular';
}
 
#header { background: url('../images/watermark.png') no-repeat 45% #001332;  position:relative; z-index:1; width:100%;}
#header .toplinks {float:right;}
#header .toplinks ul {list-style:none; padding-top:10px;}
#header .toplinks ul li {float:left;}
#header .toplinks ul li a {font-family: "Open Sans semibold"; font-size:13px; padding-left:30px; color:#CCCCCC; }
#header .logo {padding-top:30px;}

#header li.logo img { margin-top:-50px;}

#header nav .container {padding-left:0;}

#header .navbar {padding-left:0;}
#header .navbar ul {list-style:none; padding-left:0; padding-top:25px;}

/**EM 30.06.2020 - padding-right:50px changed to padding-right:28px **/
#header .navbar ul li {float:left; font-family: "Open Sans Bold"; font-size:15px; padding-right:28px; padding-bottom:10px;}
#header .navbar ul li a {color:#FFF;}
#header .navbar ul li a:hover {color:#00B0F0; text-decoration:none;}
#header .navbar ul li i.fa {color:#00B0F0; font-size:25px;}

#header .navbar-default {background:none; border-color: transparent;}
#header .navbar {margin-bottom:0;}
#header .nav > li > a {display:inline; padding:0;}
#header  .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {background-color: transparent;}
#header .navbar ul.dropdown-menu {background-color:#337AB7; border:none; padding-top:0; border-radius:0;}
#header ul li.open {padding-bottom:15px;}
#header ul.dropdown-menu li {width:200px; padding-right:0px; padding-bottom:0px;}
#header .dropdown-menu > .active > a, .dropdown-menu > .active > a:focus, .dropdown-menu > .active > a:hover {background-color:#001332;}
#header .dropdown-menu > li > a {padding-top:8px; padding-bottom:8px;}
#header ul.dropdown-menu li a:hover {color:#00B0F0; text-decoration:none;}
 

#header .login-btn {text-align:right; padding-top:15px;}

#header .search-div { background:#0C5E79; height:130px;}
#header .search-div .input-group { padding-top:40px;}
#header .search-div input {height:45px; border-radius:0;}
#header .search-div .btn-primary {border:2px solid #fff; color:#fff; border-radius:0;}
#header .search-div .btn-primary:hover {border:2px solid #00B0F0; color:#fff; border-radius:0; background:#00B0F0;}



#map {margin-top:-30px; padding-bottom:30px;}

#sliderbox {position:relative;}

.btn {padding:12px;border-color: #FF9000; padding:10px 15px; border-radius:20px;font-family: "Open Sans Semibold"; font-size:15px;}
.btn-primary {background: none;border: 2px solid #00B0F0; color:#00B0F0; }
.btn-primary:hover {background-color: #666666;border-color:#666666; }
.btn-default {color: #FF9000;}
.btn-lg .fa {font-size: 20px; line-height: inherit; position: absolute; right: 16px; top: 0;}
.btn-lg {border-radius: 0px;box-sizing: content-box;display: inline-block;font-family: "Open Sans Semibold",sans-serif;font-size: 16px; height: 48px; line-height: 48px; padding: 0 85px; position: relative;text-transform: uppercase;}

/**EM 04.12.2020 - carousel-caption top:130px changed to top:200px **/
.carousel-caption {top:200px;bottom:0; text-shadow: 2px 2px 4px #000000; right:10%; left:10%; color:#fff; } 

.carousel-caption h1 {font-family: "Open Sans Extra Bold"; font-size:50px; text-align:center; padding-bottom:30px;}
.carousel-caption p {font-family: "Open Sans Regular"; font-size:17px; text-align:right; margin-bottom:35px;}
.carousel-control.left {background-image:none;}
.carousel-control.right {background-image:none;}

/**EM 01.09.2021 - marquee definition **/
.marquee1 {height: 50px; overflow: hidden; position: relative; background: #fefefe; color: #333;}
.marquee1 p {position: absolute; width: 100%; height: 100%; margin: 0; line-height: 50px; text-align: center; animation: scroll-left 20s linear infinite;}

     
#search {width:1049px; height:143px; background:#324251; position:absolute; z-index:2; bottom:0; left:12%; opacity:0.8;}

#content {padding-bottom:100px;}
#content h1 {color: #001332; font-family: "Open Sans Bold"; font-size: 33px; padding-bottom: 20px; text-transform: uppercase; border-bottom:2px solid #001332; margin-bottom:30px; padding-top:40px; }
#content h2 {color: #0C5E79; font-family: "Open Sans Light"; font-size: 30px; padding-bottom: 30px; padding-top: 0px;}

/**EM 30.06.2020 - new header h4 **/
#content h4 {color:#2E74B5;font-family: "Open Sans Semibold"; font-size:15px; margin-top:0;  }

/**EM 08.06.2021 - new header h5 **/
#content h5 {color:#2E74B5;font-family: "Open Sans Semibold"; font-size:16px; margin-top:0;  }

/**EM 08.06.2021 - new header h6 **/
#content h6 {color:#000000;font-family: "Open Sans Semibold"; font-size:16px; margin-top:0;  }

#content .alert {border-radius:0;}

#main a {color:#00B0F0; font-weight:bold;}
#main p {text-align:justify;}

#main .panel {margin-top:75px; border-radius:0;}
#main .panel-info > .panel-heading {background-color:#001332;border-color:#001332; color:#fff; border-radius:0; text-transform:uppercase; font-family: "Open Sans SemiBold";}
#main .list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover {background-color:#d9edf7; border-color:#d9edf7;}
 
#research {min-height:660px;background:#0C5E79 url("../images/research-bg.jpg") no-repeat scroll 100% 100%;}
#research .sticker-heading {margin-top:60px;}
#research .sticker-heading h1 {font-family: "Open Sans Extra Bold"; font-size:34px; color:#fff; padding-left:0px; border-bottom:1px solid #fff; padding-bottom:25px; margin-bottom:35px;}

#research  .nav-tabs {border-bottom:0; margin-bottom:50px;}
#research  .nav-tabs > li {border-right:1px solid #fee5c3;}
#research  .nav-tabs > li.last {border:none;}
#research  .nav-tabs > li > a {color:#FEE5C3;font-family: "Open Sans Light"; font-size:25px; padding:0 15px; }
#research  .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {background:none; border:none;}
#research  .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {color:#FEE5C3;font-family: "Open Sans Semibold"; font-size:25px; }
#research  .nav-tabs > li > a:hover {background:none; border:none;}
#research  .tab-pane ul {list-style:none; padding:0; margin-bottom:45px;}
#research  .tab-pane ul li {padding-left:15px;}
#research  .tab-pane ul li a {color:#FFF;font-family: "Open Sans Regular"; font-size:20px; padding:0 15px 0 0; line-height:45px; }
#research  .btn-primary {background: none;border: 2px solid #fff; color:#fff; }
#research  .btn-primary:hover {background-color: #00B0F0;border-color:#00B0F0; color:#fff }

/**EM 02.09.2021 - Define h1 for maqruee type text **/
#research .marquee-zone h1 {font-family: "Open Sans Semibold"; font-size:16px; color:#ffffff; padding-left:0px;}
#research .marquee-zone a {color: #fff;}

#events {min-height:665px;background:rgba(0, 0, 0, 0) url("../images/ocean-bg.jpg") no-repeat scroll 100% 100% / 100% auto;}
#events .sticker-heading {margin-top:60px;}
#events .sticker-heading h1 {font-family: "Open Sans Extra Bold"; font-size:34px; color:#fff; padding-left:0px; padding-bottom:25px; margin-bottom:35px;}
#events  .nav-stacked > li > a {color:#FEE5C3;font-family: "Open Sans Light"; font-size:25px; padding-bottom:20px; border-right:1px solid #FEE5C3; padding-top:20px;}
#events .nav-stacked > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {background:none; border-left:1px solid #FEE5C3; border-top:1px solid #FEE5C3; border-bottom:1px solid #FEE5C3; border-right:0;}
#events  .nav-stacked > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {color:#FEE5C3;font-family: "Open Sans Semibold"; font-size:25px; }
#events .nav-stacked > li > a:hover {background:none; border-right:1px solid #FEE5C3;}
#events  .btn-primary {background: none;border: 2px solid #fff; color:#fff; }
#events  .btn-primary:hover {background-color: #00B0F0;border-color:#00B0F0; color:#fff }
#events  h3 {color:#FEE5C3;font-family: "Open Sans Semibold"; font-size:15px; margin-top:0;  }
#events  p {margin-bottom:50px; color:#fff;font-family: "Open Sans Regular"; font-size:20px;  }
#events  p a {color:#fff;font-family: "Open Sans Regular"; font-size:20px;  }
#events  ul li { color:#fff;font-family: "Open Sans Regular"; font-size:20px;  }
#events  ul li a { color:#fff;font-family: "Open Sans Regular"; font-size:20px;  }
 
#publications {min-height:664px;background:rgba(0, 0, 0, 0) url("../images/undersea-bg.jpg") no-repeat scroll 100% 100% / 100% auto;}
#publications .sticker-heading {margin-top:60px;}
#publications .sticker-heading h1 {font-family: "Open Sans Extra Bold"; font-size:34px; color:#001D3F; padding-left:0px; padding-bottom:25px; margin-bottom:35px;}
#publications .report-div {text-align:center;}
#publications .home-docs ul {list-style:none;}
#publications .home-docs ul li a {
    color: #fff;
    font-family: "Open Sans Regular";
    font-size: 25px;
    padding-left: 40px;
}
#publications .home-docs ul li {
    background: rgba(0, 0, 0, 0) url("../images/pdf-icon.png") no-repeat scroll 0 50%;
    border-bottom: 1px solid #fff;
    line-height: 55px;
    vertical-align: middle;
}
#publications .home-docs ul li.last {border-bottom:0;}
#publications  .btn-primary {background: none;border: 2px solid #001D3F; color:#001D3F; margin-top:40px; margin-left:25px; }
#publications .btn-primary:hover {background-color: #001D3F;border-color:#001D3F; color:#fff;}

#gallery {min-height:660px;background:#011E40;}
#gallery .sticker-heading {margin-top:60px;}
#gallery .sticker-heading h1 {font-family: "Open Sans Extra Bold"; font-size:34px; color:#fff; padding-left:0px;   padding-bottom:25px; margin-bottom:35px;}
#gallery .gallery-div {text-align:center; border:2px solid #fff; width:405px;}
#gallery h3 {color:#FEE5C3;font-family: "Open Sans Light"; font-size:30px; padding:10px; }
#gallery a:hover {text-decoration:none;}

#footer {background:#0C5E79 url("../images/corals-bg.png") no-repeat scroll 85% 100%;; height:270px;}
#footer img.footer-logo {float:left; margin-right:20px;}
#footer p {margin-left:10px; font-family: "Open Sans Regular"; font-size:12px;color:#ffffff; }
#footer p span.bright {color:#FEE5C3;font-family: "Open Sans Semibold";}

#footer .row {padding-top:60px; font-family: "Open Sans Regular"; font-size:13px; color:#ffffff;}
#footer .row a {text-decoration:none; color:#ffffff;}
#footer  span.credit { display:block; font-size:13px; padding-top:40px;}
#footer ul.social-links {padding-top:0px; list-style:none; padding-left:0px; margin-top: -15px;}
#footer ul.social-links  li {float:left; margin-right:10px;}

.form td.label {
	color:#5d6166;
	font-size:100%;
	padding-left:0;
}

.form input.form-control {
	margin-bottom:20px;
	border-radius:0;
	border:1px solid #d3cfce;
	height:40px;
	padding:8px 12px;
	box-shadow:none;
	
} 

.form select.form-control {
	margin-bottom:20px;
	border-radius:0;
	border:1px solid #d3cfce;
	height:40px;
	padding:8px 12px;
	box-shadow:none;
	
} 



.form textarea {
	border-radius:0;
	
}

.form input.submit {
	background: #001332 none repeat scroll 0 0;
    border: medium none;
    color: #fff;
    margin-left: 10px;
    margin-top: 20px;
    text-transform: uppercase;
	font-family: "Open Sans Semibold",sans-serif;
    font-size: 16px;
    height: 48px;
    line-height: 48px;
    padding: 0 85px;
}

.form input.reset {
	background: #f0f1f2 none repeat scroll 0 0;
    border: medium none;
    color: #5d6166;
    margin-top: 20px;
    padding: 0 85px;
    text-transform: uppercase;
	height:48px;
}

#slider img {
	width:100%;
}

#thumb-div .img-thumbnail {
	width:250px;
	margin:15px;
}

/** EM 30.06.2020 new div for forecasting images **/
#forecastthumb-div .img-thumbnail{
	width:220px;
	margin:10px;
}

#banner-img img {
	width:100%;
}

	
/** Mobile **/
@media (max-width: 768px) {
	
.carousel-caption {top:0;}
.carousel-caption h1 {font-size:17px;}

 

}

/** Tablet Portrait **/

@media (max-width: 992px) {

 

#header .navbar ul li {float:none; padding-right:0;}	
#header ul.dropdown-menu li {width:100%;}
.navbar {margin-bottom:0;}
.nav > li { text-align:center;}
#navbar ul{list-style:none; text-align:center;}
#navbar ul li a {color:#fff; line-height:30px;}
.navbar-default {background-color:#a9533a; border-color:#a9533a;}
.navbar-default .navbar-toggle .icon-bar {background-color:#fff;}
.navbar-default .navbar-toggle {border-color:#fff;}
.navbar-default .navbar-toggle:hover {background-color:#333;}
.navbar-default .navbar-toggle:focus {background-color:#333;}

.container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header {margin-left:0;}

#footer {height:470px;}

#research .nav-tabs > li > a {font-size:18px;}
#research .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {font-size:18px;}
#research .nav-tabs {margin-bottom:25px;}
#research {min-height:1000px;}

#gallery .gallery-div {width:auto; margin-bottom:40px;}

#publications {background:#3b949c url("../images/undersea-bg.jpg") no-repeat scroll 100% 100% / 100% auto;}
#publications .home-docs ul li a {font-size:20px;}
#publications .btn-primary {margin-bottom:80px;}

#events {background:#236587 url("../images/ocean-bg.jpg") no-repeat scroll 100% 100% / 100% auto;}
#events ul.nav-stacked {margin-bottom:40px;}

 
 
}

/** PC & Tablet Landscape **/

@media (min-width: 992px) {
	
.container {width:1080px;}

	 
	
}

@media (min-width: 1200px) {
	 
}