/*
Theme Name: Bootstrap Wordpress
Theme URI: http://trioniclabs.com
Description: Bootstrap Basic Theme
Author: Ed Burns
Author URI: http://trioniclabs.com 
Version: 1.0
*/

@import url("css/bootstrap.min.css");
@import url("css/bootstrap-responsive.min.css");

/*infographic */
#CoastalCover:hover, #AtmosphericCover:hover, #AirandSeaCover:hover, #OceanCover:hover, #PlumeCover:hover {
	cursor: pointer;
}

table.table th {
background: #d5e4e9;
}

.alignleft {
	float: left;
	margin-right: 10px;
}

.info_content {
		width: 400px;
		float: right;
		margin-top: -350px;
		position: relative; 
		z-index: 99999999999999;
}

#stage {
    width: 1200px;
    height: 1033px;
}

.contentphoto {
	border: 1px solid #00253e;
}

h3.sidepromo {
	font-size: 1.1em;
}

/* colors
dark blue: #00253e
light blue: #5792a8
really light blue: #d5e4e9;
*/

.bump10 {
    margin-top: 10px;
}

.bump20 {
    margin-top: 20px;
}

.bump50 {
    margin-top: 50px;
}

a {
    color: #5792a8;
}

a.arrow {

    display: inline-block;
    padding-right: 18px;
    background:  url('img/arrow.png') no-repeat right center;

}

.alignright {
	float: right;
}

body {
    margin-top: 10px;
    color: #00253e;
}

h3, h2 {
    font-family: 'Merriweather Sans', sans-serif;
    font-weight: 500;
}

.small {
    font-size: 0.8em;
}

.pi-login {
    float: right;
    width: 8em;;
    text-align: right;
}

/* header */

.navbar-inner {
  background-color: #d5e4e9;
  background-image: none;
  background-repeat: no-repeat;
  filter: none;
  border: none;
  padding-left: 0px;
  border-radius: 0;
  box-shadow: none;
}

.home .navbar-inner {
background-color: #fff;	
}

.navbar .nav>li>a {
color: #00253e;
text-shadow: none;
}

.navbar .nav>li>a:hover {
color: #5792a8;
}



.home .navbar .nav>li>a {
color: #00253e;
}

/* colors
dark blue: #00253e
light blue: #5792a8
really light blue: #d5e4e9;
*/


.navbar .nav>.active>a, .navbar .nav>.active>a:hover, .navbar .nav>.active>a:focus {
color: #fff;
background-color: #5792a8;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

.home .navbar .nav>.active>a, .navbar .nav>.active>a:hover, .navbar .nav>.active>a:focus {
color: #5792a8;
background-color: #fff;
}

.dropdown-menu .active>a, .dropdown-menu .active>a:hover {
color: #333;
text-decoration: none;
background-color: #d5e4e9;
background-image: none;
background-image: none;
background-image: none;
background-image: none;
background-image: none;
background-repeat: repeat-x;
outline: 0;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc',endColorstr='#ff0077b3',GradientType=0);
}



.dropdown-menu {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}


.affix {
    top: 13px;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .065);
    -moz-box-shadow: 0 1px 4px rgba(0,0,0,.065);
    box-shadow: 0 1px 4px rgba(0, 0, 0, .065);
	position: fixed;
	min-width: 270px;
}

.affix-top {
	position: static;
}

#right {
	margin-top: 10px;
}

.nav-list>.active>a, .nav-list>.active>a:hover, .nav-list>.active>a:focus {
	background-color: #00253e;
}


/* all inputs and selects*/
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.btn-search {
    text-shadow: none;
    background-color: #fff;
    background-image: none;
    background-repeat: repeat-x;
    border: 1px solid #CCC;
    border-color: #E6E6E6;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffffff',GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.btn:hover, .btn:focus, .btn:active, .btn.active, .btn.disabled, .btn[disabled] {
    color: #00253e;
    background-color: #d5e4e9;
}

/*home big image */

.homepage .hero {
position: relative;
margin-bottom: 15px;
}

.homepage .hero .hero-image {
max-height: 450px;
overflow: hidden;
}

.homepage .hero .hero-image img {
width: 100%;
vertical-align: top;
}

.homepage .hero .hero-content {
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.3);
-moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.3);
position: absolute;
width: 100%;
top: 0;
padding-top: 30px;
}

.homepage .hero .hero-content .slogan, .homepage .hero .hero-content .tagline {
color: #FFF;
text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.9);
margin-bottom: 20px;
font-weight: 500;
line-height: 1.4em;
}

.homepage .hero .hero-content .slogan {
    text-transform: uppercase;
    font-size: 2em;
    font-weight: 100;
    letter-spacing: 0.09em;
}

.homepage .hero .hero-content .tagline {
    text-transform: uppercase;
    font-size: 1.2em;
    font-weight: 300;
    letter-spacing: 0.09em;
}

.homepage .hero .hero-content .video {
	background-color: rgba(0, 0, 0, 0.6);
	padding: 10px;
	width: 350px;
	margin-top: 20px;
}

/* home left nav */

.quote {
       font-size: 1.2em;
       font-weight: 300;
       letter-spacing: 0.09em;
}


/* news headlines */

h3.title {
    margin-top: 0;
}

.headline h4 {
    font-size: 1.2em;
    font-weight: 500;
    letter-spacing: 0.09em;
    line-height: 1.5em;
}

.headline h4 a, .headline a {
    color: #00253e;
}

.headline img {
    width: 20%;
    margin: 3px 10px 5px 0;
    border: 1px solid #00253e;
    float: left;
}

/* footer */

.footer {
    background-color: #5792a8;
    color: #fff;
    box-shadow: inset 2px 5px 9px -6px black;
    padding: 10px;
    border-bottom: 1px solid #3c768c;
	margin-top: 30px;
	letter-spacing: 0.1em;
	font-weight: 200;
}



.footer a {
    color: #fff;
}

/* secondary pages */

/* colors
dark blue: #00253e
light blue: #5792a8
really light blue: #d5e4e9;
*/

.leftnav {
	background-color: #5792a8;
}

.leftnav a {
	color: #ffffff;
	text-shadow: 0 1px 0 rgba(0, 37, 62, 0.5) !important;
	border-bottom: #d5e4e9 1px solid;
}

.leftnav>li>a:hover, .leftnav>li>a:focus {
text-decoration: none;
background-color: #00253e;
}

.rightcol h1, .leftcol h1 {
	font-weight: 500;
	font-size: 2em;
	margin-top: 0;
	
}

.rightcol h1:first-letter, .leftcol h1:first-letter{
text-transform: capitalize
}

.rightcol h2, .leftcol h2 {
	font-weight: 300;
	font-size: 1.8em;
	margin-top: 0.7em;
}

.rightcol p {
    line-height: 1.7em;
}


.rightcol .top {
    max-height: 300px;
    overflow: hidden;
    margin-bottom: 20px;
}

.rightcol .top img {
width: 100%;
vertical-align: top;
    border: 1px solid #00253e;
}



/* modal */

.modal {
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

.modal-header h3 {
	color: #949599;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-weight: 700 !important;
	font-family: 'Merriweather Sans', sans-serif;
}

.modal-body h6 {
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: 0.2em;
	font-family: 'Merriweather Sans', sans-serif;
	background-color: #949599;
	color: #fff;
	padding: 2px 0 2px 4px;
}

.modal-header img {
	width: 50px;
	height: 50px;
}



/* end modal */




@media (max-width: 1200px) {
    .affix{  position: static;
      width: auto;
      top: 0;
    }

	.homepage .hero .hero-content .video {
		padding: 10px;
		width: 250px;
		margin-top: 30px;
	}
	
	/*Infographic*/
	.infographicContainer .infographicInstructions {
		position: absolute;
		right: 200px;
		bottom: 100px;
	}


}

/* background on navbar for smaller devices */
@media (max-width: 979px) {

#menu-item-44 {
	display: none;
}
	.homepage .hero .hero-content .video {
		padding: 10px;
		width: 250px;
		margin-top: 20px;
	}
	
		.homepage .hero .hero-content .video img {
		width: 100%;
		}

.homepage .hero .hero-content .slogan {
font-size: 1.5em;
}

.homepage .hero .hero-content .tagline {
font-size: 1.0em;
margin-top: 0px;
}

    .navbar  .btn-navbar {
        background-color: #5792a8;
        background-image: none;
    }

    .navbar  .btn-navbar:hover {
            background-color: #d5e4e9;
        }
    .navbar-inner {
      min-height: 40px;
      padding-right: 20px;
      padding-left: 20px;
      background-color: #fafafa;
      background-image: -moz-linear-gradient(top, #d5e4e9, #5792a8);
      background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#d5e4e9), to(#5792a8));
      background-image: -webkit-linear-gradient(top, #d5e4e9, #5792a8);
      background-image: -o-linear-gradient(top, #d5e4e9, #5792a8);
      background-image: linear-gradient(to bottom, #d5e4e9, #5792a8);
      background-repeat: repeat-x;
      border: 1px solid #d5e4e9;
      -webkit-border-radius: 4px;
         -moz-border-radius: 4px;
              border-radius: 4px;
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d5e4e9', endColorstr='#5792a8', GradientType=0);
      *zoom: 1;
      -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
         -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
              box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    }

    .navbar .nav:first-child {
        margin-top: 8px;
    }

    .navbar .nav>.active>a, .navbar .nav>.active>a:hover, .navbar .nav>.active>a:focus {
    color: #5792a8;
    background-color: #d5e4e9;
        -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
        -moz-box-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
        box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    }
}
/* Landscape phone to portrait tablet */
@media (min-width: 768px) and (max-width: 979px) {


    .modal-infographic {
        margin-left: -350px;
    }

}  /* Portrait tablet to landscape and desktop */
@media (min-width: 1200px) {

    .modal-infographic {
        margin-left: -550px;
    }
}                        /* Large desktop */



/*responsive */

/* Landscape phones and down*/
@media (max-width: 480px) {


}
@media (max-width: 767px) {

.homepage .hero .hero-content .video {
	padding: 10px;
	margin-top: 30px;
	width: auto;
}

/*home big image ipads */

.homepage .hero .hero-content {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
position: relative;
width: 100%;
top: 0;
padding-top: 30px;
}

.homepage .hero .hero-content .slogan, .homepage .hero .hero-content .tagline {
color: #00253e;
text-shadow: none;
margin-bottom: 20px;
font-weight: 500;
line-height: 1.4em;
}

.homepage .hero .hero-content .slogan {
    text-transform: uppercase;
    font-size: 2em;
    font-weight: 100;
    letter-spacing: 0.09em;
}

.homepage .hero .hero-content .tagline {
    text-transform: uppercase;
    font-size: 01em;
    font-weight: 300;
    letter-spacing: 0.09em;
    margin-bottom:-20px;
}

}
/* end max-width 767px */