/* ------- Menu ------*/
header.masthead { max-width:1440px; margin: 0 auto 0 auto; padding:1% 0 0.2% 0; background-image:url(../images/nav_bg2.png); background-repeat: no-repeat;}
header.masthead:before {content: ""; display: table;}
header.masthead:after {content: ""; display: table; clear: both;}

ul.masthead { float: right; width:60%;}
li.masthead { float: right; margin: 1% 6% 0 6%; line-height: 1.5em; font-size: 12px; list-style: none; font-weight:bold; letter-spacing:3px; text-align: center; font-family: 'Source Sans Pro', sans-serif; position:relative; z-index:100;}
.masthead a:link, .masthead a:visited,
.masthead a:active {color: #FFFFFF; text-decoration:none; font-family: 'Source Sans Pro', sans-serif;}
.masthead a:hover{color: #FFFFFF;  text-decoration: none; font-family: 'Source Sans Pro', sans-serif; border-bottom: 4px solid currentColor;}
.masthead a:onclick {color: #F4BA4D; text-decoration:none; font-family: 'Source Sans Pro', sans-serif;}
/* Hide the list item that contains the link that should open and close the topnav on small screens */
ul.masthead li.icon {display: none;}

/*Submenu*/
ul.masthead ul.sub {display: none; position: absolute; background:#07203c; margin-top:3px; width:200px;}
ul.masthead li:hover ul.sub {display: block; position: absolute; left:-27%; top:-30%;  margin: 0 0 0 0; padding:7% 5% 5% 25%; list-style: none; text-align:left; line-height: 2em; color:#FFFFFF;}
.sublink {color:#87fcfd;}

/* End Menu*/

body {background-color:#ffffff; margin: 0; padding: 0;}
a:link {color:#4b8181; text-decoration:none;} 
a:visited {color:#4b8181; text-decoration:none;} 
a:hover {color:#87fcfd; text-decoration:none;} 
a:active {color:#87fcfd; text-decoration:none;}
h1 {font-family: 'Source Sans Pro', sans-serif; font-size: 40px; text-align: center; font-weight:semibold; color:#05355A;}
h2 {font-family: 'Source Sans Pro', sans-serif; font-size: 18px; text-align: left; font-weight:semibold; color:#05355A; padding-left:9%;}
h3 {font-family: 'Source Sans Pro', sans-serif; font-size: 16px; text-align: center; font-weight:semibold; color:#ffffff; margin-bottom:0;}
h4 {font-family: 'Source Sans Pro', sans-serif; font-size: 14px; text-align: left; font-weight: normal; color:#000000;}
h5 {font-family: 'Source Sans Pro', sans-serif; font-size: 14px; text-align: left; font-weight: bold; color:#000000; padding-left:9%;}
p {font-family: 'Source Sans Pro', sans-serif; font-size: 14px; text-align: left; font-weight: normal; color:#2b2b2b; padding-left:9%; /*padding-right:9%;*/}
p.projects {font-family: 'Source Sans Pro', sans-serif; text-align:center; font-size: 11px; font-weight: normal; color:#ffffff; margin-top:0; padding-left:0;}
p.caption {font-family: 'Source Sans Pro', sans-serif; text-align: left; font-size: 12px; font-weight: normal; color:#2b2b2b; padding-left:0; padding-right:9%;}
p.grey {font-family: 'Source Sans Pro', sans-serif; text-align: left; font-size: 12px; font-weight: normal; color:#2b2b2b; padding-left:0; padding-right:9%;}
p.subnav {display: inline-block; font-family: 'Source Sans Pro', sans-serif; text-align: left; font-size: 16px; font-weight: normal; color:#707070; padding-left:9%;}

.col-container {
  display: flex;
  width: 100%;
}
.col {
  flex: 1;
  padding: 5px;
  margin: 1%;
}

.greybox {display: flex;
  width: 100%; background-color:#efefef; padding:5% 0;}
.smgrey {
  flex: 1;
  padding-left: 10%;
}

/*second footer*/
.footimg { margin:0; width:auto; padding-left:1%; padding-right:1%; vertical-align: middle; display:inline-block;}
.fund {padding: 60px 0; background-color: #383740; color: #fff; height:auto; }
.fundcontainer { max-width: 1140px; margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px;}
.fundrow { margin:0 -15px; position:relative; }
.rowleft {float: left; width: 57.33333%; margin-left:2%; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 1.5; text-align:left;}
.rowright {float: left; width: 30.66667%; padding-left: 10%;}
.logosin {float: left; width: 100%;}
.fundlogos img {width: auto; text-align:center; margin: 0 40px; line-height: 55px; vertical-align: middle; border-style: none;}
.fund a img {opacity: 0.7;}
.fund a:hover img {opacity:1}
.fund img {width:auto;  margin:0 40px; float:left;}
.fund .stsci {height:55px; float:left;}
.fund .ipac {height:40px; float:left;}
.fund .jpl { height:25px; float:left; vertical-align: middle;}
.fund .sao { height:55px; float:left;}
.fund .sonoma { height:35px; float:left;}
.fund .uol { max-width:200px;}
 /* If the browser window is smaller than 600px, make the columns stack on top of each other */
@media only screen and (max-width: 600px) {
  .col {
    display: block;
    width: 100%;
  }
} 

.box {float:left; width:55%; text-align:left; margin:1% 22% 0 23%; border-bottom:#95989a; border-bottom-width:1px; border-bottom-style:solid;}

hr { width:98%; margin:15px 0 15px 0; border-width: 1px; border-color:#CECECE;}
img {display: block; max-width: 100%; height: auto;}
.banner {width:100%; margin: 0 auto 0 auto; background-color:#ffffff;}
#wrapper {margin:auto; padding: 5% 15% 20% 15%; position:relative; background-image: url(/binary/images/body_bg.jpg); background-repeat:repeat-x;}
#subtitle {float: left; border-bottom:#CECECE; border-bottom-width:1px; border-bottom-style:solid;  width:100%; text-align:left;}
#intro {margin:auto; padding: 0 15%; position:relative; /*background-image: url(/binary/images/body_bg.jpg); background-repeat:repeat-x;*/}
.resource {float:left; padding:50px 15px 15px 15px;}
img.resource {display: block; max-width: 100%; height: auto;}
#footer1 { max-width:1380px; padding:5px 10px 30px 50px; margin: 0 auto auto auto; background-color: #000000;}
.footer1_box {font-family: Arial, Helvetica, sans-serif; width: 21% height: 50px; font-size:10px; background-color: #000000; color:#ffffff; display: inline-block; padding:5px; vertical-align: bottom; text-align:left; margin-top:20px; margin-right:4%;}
.social {height:50px; float:left; margin-left:10px;}
.embed-container {position: relative;  padding-bottom: 56.25%; margin-bottom:10%; height: 0; overflow: hidden; max-width: 100%;} 
.embed-container iframe, .embed-container object, .embed-container embed { 
position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  }
video {width:100%; max-width:650px; height:auto;}


@media only screen and (max-width: 800px) {
h1 { font-size:90%;}
h2 { font-size:90%;}
h3 { font-size:90%;}
p { font-size:90%; margin-top:5%;}
}