@charset "utf-8";
/* CSS Document */
/*General rules*/
a{
	color:#24496B;
	text-decoration:none;
}
a:active, a:visited {
    color: #595959;s
}
input:focus, button:focus, textarea:focus{
	outline:#edb864 solid 3px;
}


body {	
	min-height: 100vh;
        width:960px;
	font: 80% Verdana, Arial, Helvetica, sans-serif;
      
        background:  url("../images/background_top.jpg") top no-repeat, url("../images/background_bottom.jpg") bottom no-repeat, url("../images/background-mid.jpg") center repeat;
            
	margin: 0 auto;
	padding: 0;
	text-align: center; 
	color: #000000;
}
.layout{
background-color:#FFFFFF;
border-radius: 6px;
height: 100%;
opacity: 0.85;
}
.noaa {
padding: 5px;
min-height:37px;
background-color: #FFFFFF;
background-image: url("../images/noaa_left.png"), url("../images/noaa_right.png");
background-repeat: no-repeat, no-repeat;
background-attachment: scroll, scroll;
background-position: left top, right top;
background-clip: border-box, border-box;
background-origin: padding-box, padding-box;
background-size: auto auto, auto auto;
}
.noaa a {
    float: left;
    display: block;
    width: 100%;
    height: 36px;
    text-indent: -9999px;
}
.clearfix{
clear:both;}
.roundbutton{
background-color:#001f33;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	border:1px solid #18ab29;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:arial;
	font-size:14px;
	font-weight:bold;
	padding:10px 20px;
	text-decoration:none;
}
/*gototop*/
.gototop{
position:fixed;
right:20px;
bottom:20px;
opacity:0.5;
transition: opacity .25s ease-in-out;
}
.gototop:hover{
opacity:1;
}
/* contact form*/
.required{
color:#001f33;
}
.contact_label{
margin-bottom:1em;
}
.contact_textarea{
width:100%;
box-shaddow:none;
border:1px solid #e3e3e3;
margin-bottom:1em;
}
/*table*/
a.download {
position:relative;
z-index:1;
}
a.download img {
border:none;
}
a.download b {
border:1px solid #000000;
position:absolute;
visibility:hidden;
width:auto;
}
a.download:hover {
border:medium none;
text-decoration:underline;
z-index:1000;
}
a.download:hover b {
cursor:pointer;
height:auto;
left:0;
top:1.5em;
visibility:visible;
z-index:500;
}
a.download:hover b img {
border:medium none;
}
table.download {
border:thin solid #F0F8FE;
border-spacing:0;
text-align:center;
}
table.download tr td {
vertical-align:middle;
border-bottom:thin solid #F0F8FE;
padding:0 0 6px 0;
}
.hdr {
background-color:#DEE7EC;
border-bottom:thin solid #8CACBB;
font-weight:bold;
}
.graylight{
background-color:#CED8F6;
border-bottom:thin solid #8CACBB;
font-weight:bold;
}
.graydark{
background-color:#A9BCF5;
border-bottom:thin solid #8CACBB;
font-weight:bold;
}
/*vertical datum transformation Integrating America's Elevation Data*/
.headline{
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size:24px;
	text-align: center;
	text-transform:uppercase;
    font-weight: normal;
    color:  #fff;
	letter-spacing:0.3em;
}
.subheadline{
        font-family: "Lucida Grande", Tahoma;
	font-size: 10px;
	font-weight: lighter;
	font-variant: normal;
	text-transform: uppercase;
	color: #ccc;
    line-height:2em;
	text-align: center!important;
	letter-spacing: 0.3em;
}
/* Dropdown menu*/
#cssmenu {
  border: none;
  border: 0px;
  margin: 0;
  padding-top: 20px;
  font: 1.2em 'Lucida Sans Unicode', 'Bitstream Vera Sans', 'Trebuchet Unicode MS', 'Lucida Grande', Verdana, Helvetica, sans-serif;
  font-weight: bold;
  height:2em;
  /*background:#333333;*/
  height:35px;
  width:auto;
  text-align:center;
}
#cssmenu ul {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  width:100%;
  display:inline-block;
}
#cssmenu ul li {
  display:inline-block;
  padding: 0px;
}
#cssmenu li a {
  background: url('../images/seperator.gif') bottom right no-repeat;
  display: block;
  font-weight: normal;
  line-height: 35px;
  margin: 0px;
  padding: 0px 25px;
  text-align: center;
  text-decoration: none;
}
#cssmenu >ul >li >a {
 color:white;
}
#cssmenu ul ul a {
  color: white;
}
#cssmenu li >a:hover,
#cssmenu ul li:hover >a {
  background:  #4682B4 url('../images/hover.png') bottom center no-repeat;
  color: #FFFFFF;
  text-decoration: none;
}
#cssmenu li ul {
  background:  #4682B4;
  display: none;
  height: auto;
  padding: 0px;
  margin: 0px;
  border: 0px;
  position: absolute;
  width: 250px;
  z-index: 200;  
}
#cssmenu li:hover ul {
  display: block;
}
#cssmenu li li {
  background:  #4682B4 url('../images/sub_sep.gif') bottom left no-repeat;
  display: block;
  float: none;
  margin: 0px;
  padding: 0px;
  width: 250px;
}
#cssmenu li:hover li a {
  background: none;
}
#cssmenu li ul a {
  display: block;
  height: 35px;
  font-size: 12px;
  font-style: normal;
  margin: 0px;
  padding: 0px 10px 0px 15px;
  text-align: left;
}
#cssmenu li ul a:hover,
#cssmenu li ul li:hover >a {
  background: #333333 url('../images/hover_sub.png') center left no-repeat;
  border: 0px;
  /*color: #ffffff;*/
  color: #F7F8E0;
  text-decoration: none;
}
#cssmenu p {
  clear: left;
}
/*footer*/
#footernav{
  border-top: thin solid #001F33;
  margin: 0 auto;
  padding: 0px;
  font: 67.5% 'Lucida Sans Unicode', 'Bitstream Vera Sans', 'Trebuchet Unicode MS', 'Lucida Grande', Verdana, Helvetica, sans-serif;
  font-size: 14px;
  width: auto;
}
#footernav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  height:35px;
}
#footernav ul li {
  display:inline;
  padding:0 10px;
}
#footernav ul li a {
  text-align: center;
  text-decoration: none;
  line-height:35px;
}
#footernav ul li a:hover {
  text-decoration:underline;
}
/* content */
.content{
padding:0 20px;
}
.lefttoc{
float:left;
width: 25%;
text-align:left;
}
.leftwrapper{
float:left;
margin:0;
padding:0 0 0 10px;
width:25%;
text-align:left;
}
.rightwrapper{
float:right;
margin:0;
padding:0;
width:70%;
text-align:left;
}
/*Portrait to landscape*/
@media (max-width: 960px) and (min-width:680px) {
body{width:auto;padding:0;}
.layout{
width:auto;
margin:0 auto;
}
}
@media (max-width:650px){
body{width:650px;}
.layout{
width:650px;
margin: 0 auto;
}
}
