/****  SITE SPECIFIC STYLES  ****/

.body-bottom-2 {
background: url("/images_template/floor03.jpg") center bottom repeat-x;
}

#maindiv #center img {
  max-width:100%;
}

/* Global */
html body {
  background: url("/images_template/surface03.jpg") center top repeat-x;
  background-color:#02183D;
}

html body #header {
  height:84px;
}

img {
  padding:0px;
  margin:0px;
}

img.photo {
 padding:10px; 
}

#noaa-nav a {
    margin: 9px 6px;
}


#maindiv {
  /*background:url("/images_template/nwr_bg.jpg") repeat-y scroll 0 0 transparent; */
 
  background-color:rgba(255,242,212,0);
}

#maindiv #center {
  width:793px;
  margin:0; 
  min-height:300px;
  
  background-color:rgba(255,242,212,1);
}

#maindiv #left-side {
  margin-right:0;
  padding:0;
  
}

#maindiv #left-side div.sidenav h4 
  {
  font-size:12px;
  font-family: Arial,Helvetica,sans-serif;
} 

#maindiv .green_seperator {
 height:12px; background:#A7DAF5;
}



#maindiv #center h1,
#maindiv #center h2,
#maindiv #center h3,
#maindiv #center h4,
#maindiv #center h5,
#maindiv #center h6 {

 padding: 0 25px;
 text-align:left;
  
}



#maindiv #center h1
  {
 font-size:30px; 
  padding-top:15px;
  padding-bottom:0;
  letter-spacing:-1px;
}

#maindiv #center h2 {
  font-size:20px; 
  padding:10px 25px 0 25px;
}

#maindiv #center h3 {
 padding: 0 25px; 
 font-size:16px;
}

#maindiv #center h4 {
 padding: 0 25px; 
 font-size:14px;
 color:#003C79;
  font-weight:bold;
}
#maindiv #center h5 {
 padding: 0 25px; 
 font-size:12px;
 color:#003C79;
 text-decoration:none;
  font-style:italic;
  font-weight:bold;
}

#maindiv #center h2,
#maindiv #center h3,
#maindiv #center h4,
#maindiv #center h5,
#maindiv #center h6{
  margin: 10px 0 5px; 
}

#maindiv #center p {
	font-weight:normal;
	color:#000000;
	font-size:12px;
	line-height: 1.4em;
	font-family:Arial, Helvetica, sans-serif;
  padding:0 25px;
}

#maindiv #center p a:hover {
      color:#003C79;
}


#maindiv #center ul {
  margin-top:-6px;
  padding-top:0;
  margin-bottom:3px;


}

#maindiv #center ul ul {
 margin-left:-10px; 
}



#maindiv #center ul li {
  color:#000;
  /*margin-left:5px;*/
  padding:8px 0 0 0;
  /*left:20px;*/
}

#maindiv #center ul li a:hover {
    color:#003C79;
}

#maindiv #center ol {
  margin:-5px 40px 20px 10px;
  padding-top:0;
}

#maindiv #center ol ol {
 margin-left:-10px; 
}

#maindiv #center ol li {
  color:#000;
  margin-left:10px;
  padding:8px 0 0 0;
}


#maindiv #center ol li a:hover {
    color:#003C79;
}


#maindiv #center #col1of2 {
  width:351px;
  margin:0; 
  padding:0 10px 0 0;
  float:left;
}

#maindiv #center #col2of2 {
  width:351px;
  margin:0; 
  padding:0 10px 0 10px;
  float:left;
}

#maindiv #center #col1of3 {
  width:264px;
  margin:0; padding:0;
	float:left;
}
#maindiv #center #col2of3 {
  width:264px;
  margin:0; padding:0;
	float:left;
}

#maindiv #center #col3of3 {
  width:264px;
  margin:0; padding:0;
	float:left;
}

#maindiv #center #blurbcallout {
	width:500px;
	margin:0;
	padding:10px 0 0 10px;
	float:left;
	filter:alpha(opacity=95);opacity:.95;
}
#maindiv #center #col1of2callout {
  width:250px;
	margin:0; 
	padding:10px 0 0 10px;
	float:left;
	filter:alpha(opacity=95);opacity:.95;

}
#maindiv #center #col2of2callout {
  width:250px;
	margin:0; 
	padding:10px 0 0 10px;
	float:left;
	filter:alpha(opacity=95);opacity:.95;

}

#maindiv #center #callout {
  width:240px;
	margin:1px; 
	padding:5px;
	float:right;
	background-color:#CBDCED;
	border:2px solid #31608E;
	filter:alpha(opacity=95);opacity:.95;
	}
#maindiv #center #callout p {

	font-size:16px;
	font-style:italic;
}
#maindiv #center #callout h1 {
	font-size:18px;
	font-weight:bold;
	text-align:center;
	font-style:italic;
	color:#000066;
}
/* Fix Navigation padding */

#left-side {
  background-color:rgba(0,0,0,0);
}
#left-side .left_navigation li a {
  padding: 8px 5px 8px 8px;
  
}

#left-side .left_navigation ul ul a {
  padding: 2px 0 2px 4px;
  
}

#left-side li.cat_title {
    background: none repeat scroll 0 0 transparent;
    font-size: 12px;
    font-weight: bold;
    margin: 12px 10px;
    color:#FFFFFF;
}

/* Breadcrumbs */
.BreadCrumbs a {
    color:#00968A;
}

.BreadCrumbs a:hover {
    color:#003C79;
}

.BreadCrumbs p {
    font-weight: normal;
    margin: 3px 15px 5px 15px;
    padding: 0;
    font-style:normal;
}


.BreadCrumbs {
    background: none repeat scroll 0 0 #A7DAF5;
    border-top: 1px solid #83CFEA;
    float: left;
    height: 24px;
    width: 793px;
  box-shadow:0 2px 3px -2px #003C79;
}



/**** HOME SLIDER ****/
#maindiv #center #slide_show #number_menu {
 background-image:none;
  width:100%;
  padding:0;
}
#maindiv #center #slide_show {
  width:100%;
  margin:0;
}

#maindiv #center #slide_show ul li {
  width:100%;
  margin:0;
  padding:0;
}

#maindiv #center #slide_show .slider_image {
   width:100%;
  margin:0;
}


#maindiv #center #slide_show ul li .slider_image h2 {
 background-image:none;
 background-color:transparent;
 margin: 0;
 padding: 0 25px;
 width: 743px;
}


#maindiv #center #slide_show ul li .slider_image p {
 margin-top:8px;
 font-family:Arial, Helvetica, sans-serif;
 font-weight:bold;
 color:#FFFFFF; 
 font-size:14px;
}

#maindiv #center #slide_show ul li .slider_image p a {
  font-size:14px;
  font-style: italic;
}

#maindiv #center #slide_show ul li .slider_image p a:hover {
  color:#87CEEB;
  font-size:14px;
  font-style: italic;
  text-decoration:none;
  
}


#maindiv #center #slide_show > ul {
  width:100%;
  padding:0px;
  margin:0px;
}

#maindiv #center #slide_show > ul > li {
  padding:0;
  width:100%;
  margin:0;
}

/*
#maindiv #slide_show .slider_image h2 {
    margin: 0;
    padding: 0 25px;
    width: 743px;
}

#maindiv #slide_show .slider_image p {
    font-size: 16px;
    font-weight: bold;
}

#maindiv #slide_show .slider_image p a {
    font-size: 12pt;
    font-weight: bold;
}*/

/**** HOME PAGE SUPPORTING BOXES ****/

#regions-accordion .puget {
	background: url("/images_template/accordion_puget.jpg");
}
#regions-accordion .columbia {
	background: url("/images_template/accordion_columbia.jpg");
}
#regions-accordion .willamette {
	background: url("/images_template/accordion_willamette.jpg");
}
#regions-accordion .klamath {
	background: url("/images_template/accordion_klamath.jpg");
}
#regions-accordion .central {
	background: url("/images_template/accordion_central.jpg");
}

#regions-accordion dd h2,
#regions-accordion a,
#maindiv #center #regions-accordion p a:hover {
	color: #fff;
	background: #21497D;
	opacity: .8;
}

#maindiv #center #regions-accordion dd h2 {
	margin-top: 75px !important; 
	margin-bottom: 0 !important; 
	padding-left: 16px;
}

#maindiv #center #regions-accordion p {
	padding: 0 16px 8px 16px;
	margin: 0;
	color: #fff;
	background: #21497D;
	opacity: .8;	
}

#maindiv #center #salmon_recovery {
    background: #E9E9CE;
    /*border-right: 1px solid #BFBFA3;*/
    float: left;
    width: 241px;
	height: 275px;
}

#maindiv #center #salmon_recovery h2 {
  padding-left:15px;
  font-size:16px
  
}

#maindiv #center #salmon_recovery ul {
 
  padding: 3px 15px;
  list-style:none;
  
}
#maindiv #center #salmon_recovery ul li {
  
  list-style:none;
  margin-top:5px;
  
}

#maindiv #center #regions {
    margin-right: 0; 
	height: 250px;
    background: url("/images_template/mid_sec_bg.jpg") repeat-x scroll 0 0 #E9E9CE;
    /*border-right: 1px solid #BFBFA3;*/
    float: left;
}

#maindiv #center #latest_news {
    height: 250px;
    background: #E9E9CE;
    float: left;
    width: 483px;	
}

#maindiv #center #latest_news dl.newsroom  {
  margin-left:15px;
  padding-top:5px;
  height:120px;
}

#maindiv #center #latest_news p#newsroom_link {
  font-size:16px;
  padding-left: 15px;
}
#maindiv #center #featured_image {
	background: url("/images_template/mid_sec_bg.jpg") repeat-x scroll 0 0 #E9E9CE;
    /*border-right: 1px solid #BFBFA3;*/
    float: left;
    width: 309px;
	height: 250px;
}

#maindiv #center #featured_image h2 {
	padding-left: 15px;
	padding-bottom: 10px;
}

#maindiv #center #fishwatch_box {
	background: url("/images_template/fishwatch_logo.jpg") no-repeat scroll 8px 25px #E9E9CE;
	height: 250px;
	width: 309px;
}

#maindiv #center #fishwatch_box h2 {
	display: none;
}

#fishwatch_box p.elink a {
	position: absolute;
	top: 185px;
	left: 7px;
	font-size: 11px;
	height: 18px;
}

#fishwatch_box .fish_link {
	top: 25px;
	display: block;
	height: 150px;
	position: absolute;
	left: 5px;
	width: 274px;
	text-indent: -9999px;
}

#maindiv #center .more {
margin-top:24px;
}

#center #featured_image #image_wrap {
  overflow:hidden;
  width:191px;
  height:131px;
  margin-left: 15px;
}


#center #featured_image p.elink a {
  position:inherit;
}


#center #featured_image p.elink {
  margin-top:10px;
  padding-left: 15px;
}

/**** List with Thumbnails ****/

#maindiv #center div.imgai ul li {
 margin:0 15px 0 25px; 
  
}
/**** Footer Section ****/

#maindiv #footer {
  height:100px;
}

#maindiv #footer .footer-links-pad a {
  font-size:12px;
  padding:3px 0;
  display:block;

}

#maindiv #footer #footer-logos {
  
}
/**** Banner Styles ****/
#banner_area {
 float:left;
  width:793px;
  position:relative;
  overflow:hidden;
}

#banner_area img {
  max-width:100%;
}

/**** how do I box****/

#left-side div.sidenav {
  background-color:#A7DAF5;
}

#left-side div.sidenav h4 {
color:#fff;
  text-align:center;
}

/**** Content Styles ****/

table {
  margin: 10px 30px;
  padding:20px;
}
#data_table table {
  border-collapse:collapse;
  align:center;
  margin: 10px 30px;
  padding:20px;
}

#data_table table,th,td {
  padding:5px;
  border: 1px solid #DCDCDC;
  
}

.pdf {
  font-size:10px;
  font-style:italic;

}

table.data_table {
  border-collapse:collapse;
  margin: 10px 30px;
  padding:20px;
 
}

table.data_table th,td {
  padding:5px;
  border: 1px solid #DCDCDC;
  
}

table.data_table th,td a:hover {
    color:#003C79;
}


/** Special style for pdf doc list with file size **/

#center dl.newsroom {
 /*margin:25px 35px 0 25px;*/ 
}

#center dl.newsroom > span {
  display:block;
  text-indent:-73px;
  padding-left:81px;
  padding-bottom:15px;
  margin:10px 35px 0 15px;
}

#center dl.newsroom a.ipdfframe:hover {
  color:#003C79;
  
}




#noaa-navspace {
  background-color: #FFFFFF;
}
  
#noaa-nav a {
  color: #003C79;
}

#noaa-nav a:hover {
  color: #0079F3;
}

.top_search {
  border: 1px solid #003C79;
  right: 3px;
}

.green_seperator {
  background-color: #a7daf5;
  clear: both;
  height: 10px;
}

#newsletter {
  background: url("/images_template/news_signup_bg2.jpg") no-repeat scroll 12px 4px #A7DAF5;
}

.sidenav {
  background-color: #A7DAF5;
}

.top_dropnav ul {    background: #00a3e3;    display: block;    float: left;    margin: 0 0 0 -11px;    padding: 0;    width: 793px;}

.BreadCrumbs {
 background: #a7daf5;
}


#maindiv #footer .footer-links-pad a {
font-size: 11px;
padding: 0px;
}


#center .fsBody .fsForm {
	background-color: rgba(0, 0, 0, 0);
	margin: 10px;
	border: none;
}

#center .fsForm .fsSubmit {
	background-color: rgba(0, 0, 0, 0);
}



/* temporary navigation test */

#test-nav {
     margin: 0 0 0 25px;
     padding: 0;
}

#test-nav li {
     list-style-type: none;
     float: left;
     position: relative;
}

#test-nav li a {
    display: block;
    padding: 6px 9px;
    margin: 0;
    background: #999;
    color: #fff;
    border-left: 1px solid #666;
    border-right: 1px solid #aaa;
}

#test-nav li a:first-child {
    border-left: none;
}

#test-nav li ul {
    padding: 0 0 0 10px;
    margin-top: 100px;
    position: absolute;
    top: 40px;
    left: 0;
}

#test-nav li li {
    display: none;  
    float: none;
    margin: 0;
    padding: 0;
    background: #666;
    width: 180px;
}

#test-nav li:hover li {
    display: block;  
}


#test-nav li li a {
    background: #666;
}


/* social media icons */

.social-links {
	margin-top: 80px !important;
	list-style-type: none;
	overflow: hidden;
	margin-left: 0;
	padding-left: 8px;
}
.social-links li {
  display: inline;
}
.social-links li a {
  display: block;
  float: left;
  width: 25px;
  height: 25px;
  text-indent: -9999px;
  margin-right: 12px;
  outline: none;
}
.social-links li.fb a {
  background: url('/images_template/fb1.png') no-repeat left top;
}
.social-links li.tw a {
  background: url('/images_template/tw1.png') no-repeat left top;
}
.social-links li.yt a {
  background: url('/images_template/yt1.png') no-repeat left top;
  width: 69px;
}



#maindiv #center ul.link-list {
	margin: 12px 0 0 25px;
	padding: 0;
}


#maindiv #center ul.link-list li {
	display: inline-block;
	width: 224px;
	/*border-top: 1px solid #d9d7c6;*/
	padding: 8px 0 6px 0;
	margin-right: 24px;
}

#maindiv #center ul.link-list li:before {
	color: #7f97a6;
	content:"\2022";
	font-size: 1em;
	padding-right: .5em;
	position: relative;
	top: .1em;
}

#maindiv #center div.project-listing {

}

#maindiv #center div.project {
	margin: 0px 25px 0px 25px;
	overflow: hidden;
	background: #fffcf4;
	height: 30px; 
	border: 1px solid #dbd0b6;
	border-top: none;
}  

#maindiv #center div.project.open {
	height: auto;
}	


#maindiv #center div.project:first-child {
	border-top: 1px solid #dbd0b6;
}

#maindiv #center div.project:nth-of-type(odd) {
	background: #fff5dd;
}

#maindiv #center div.project h3 {
	color: #00968a;
	font-size: 14px;
	margin: 0;
	float: left;
	padding: 7px 12px;
        cursor: pointer;
}

#maindiv #center div.project ul {
	margin: 0px;
	padding: 5px 10px 10px 10px;
	list-style-type: none;
	clear: both;
}

#maindiv #center div.project ul li {
	display: inline-block;
	width: 31%;
	margin-left: 12px;
	padding: 3px 0;
}

#maindiv #center div.project ul.two-column li {
	width: 47%;
}

#maindiv #center div.project ul li:before {
	color: #7f97a6;
	content:"\2022";
	font-size: 1em;
	padding-right: .5em;
	position: relative;
	top: .1em;
}


#maindiv #center .video-box {
 	margin: 10px 10px 25px 25px; 
	overflow: hidden;
}

#maindiv #center .video-group {
	margin: 25px 0px 0 22px;
	padding: 10px 5px;
	background: #fffcf4;
	overflow: hidden;
}

#maindiv #center .video-group .group {
	float: left;
	width: 240px;
	padding: 0;
	margin: 0 10px 0 0;
}

#maindiv #center .video-group .group h3 {
	margin: 0 0 8px 2px;
	padding: 0;
	font-size: 14px;
}

/* Events page */

#maindiv #center .event {
	clear: both;
	margin: 20px 25px 0 25px;
	overflow: hidden;
}

#maindiv #center .date {
  width: 50px;
  height: 50px;
  border: 1px solid #d2d2d2;
  border-radius: 4px;
  float: left;
	background: #FFFCF4;
}
#maindiv #center .date p {
  font-family: Helvetica, sans-serif;
  font-size: 14px;
  text-align: center;
  color: #666;
	margin: 0;
	padding: 0;	
}
#maindiv #center .date p span {
  font-size: 26px;
  font-weight: bold;
  color: #738539;
  text-transform: uppercase;
  display: block;
  border-top: 1px solid #ddd;
  border-radius: 0 0 4px 4px;
  padding: 5px 0 6px 0;
}
#maindiv #center .eventDetails {
  float: left;
  font-size: 12px;
  min-height: 52px;
  padding-left: 4px;
  color: #273c76;
  width: 90%;
}

#maindiv #center .eventDetails h3, 
#maindiv #center .eventDetails p {
	margin: 5px 10px;
	padding: 0;
}



/* Salmon Recovery Mapping Tool */

a#mapping-tool-link {
  position: absolute;
  top: 35px;
  right: 35px;
  height: 160px;
  width: 180px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden; 
}



/* Table styles */

#maindiv #center .formatted {
    border-collapse: collapse;
    border-spacing: 0;
    empty-cells: show;
    border: 1px solid #cbcbcb;
}

#maindiv #center .formatted th {
    margin: 0;
    padding: 12px 10px;
    font-size: 14px;
    color: #000;
    background: #A7DAF5;
    text-align: left !important;
}

#maindiv #center .formatted td {
    padding: 10px;
    margin: 0;
    vertical-align: middle;
}

#maindiv #center .formatted p {
    margin: 0;
    padding: 0;
}

#maindiv #center .formatted-2 {
   border: 1px solid #cbcbcb;
}

#maindiv #center .formatted-2 td,
#maindiv #center .formatted-2 th {
    border-left: 1px solid #f2f2f2;
    border-width: 0 0 0 1px;
    font-size: inherit;
    margin: 0;
    overflow: visible; 
    padding: 0.5em 1em; 
}

#maindiv #center .formatted-2 th {
    margin: 0;
    padding: 12px 10px;
    font-size: 14px;
    color: #000;
    background: #A7DAF5;
    text-align: left !important;
}

/* Consider removing this next declaration block, as it causes problems when
there's a rowspan on the first cell. Case added to the tests. issue#432 */
/*#maindiv #center .formatted-2 td:first-child,
#maindiv #center .formatted-2 th:first-child {
    border-left-width: 0;
}*/

#maindiv #center .formatted-2 thead {
    background-color: #e0e0e0;
    color: #000;
    text-align: left;
    vertical-align: bottom;
}

#maindiv #center .formatted-2 td {
    background-color: transparent;
}

#maindiv #center .formatted-2 tr:nth-child(2n-1) td {
    background-color: #f2f2f2;
}

#maindiv #center .formatted-2 td {
    border-bottom: 1px solid #cbcbcb;
}
#maindiv #center .formatted-2 tbody > tr:last-child > td {
    border-bottom-width: 0;
}

#maindiv #center .formatted-2 td,
#maindiv #center .formatted-2 th {
    border-width: 0 0 1px 0;
    border-bottom: 1px solid #cbcbcb;
}
#maindiv #center .formatted-2 tbody > tr:last-child > td {
    border-bottom-width: 0;
}

#maindiv #center #sortable thead tr .header {
    background-image: url(../images_template/bg.gif);
    background-repeat: no-repeat;
    background-position: right 15px;
    cursor: pointer;
    vertical-align: top;
    border-left: 1px solid #fff;
}    

#maindiv #center #sortable thead tr .header:first-child {
    border-left: none;
}

#maindiv #center #sortable thead tr .headerSortUp {
    background-image: url(/images_template/asc.gif);
}
#maindiv #center #sortable thead tr .headerSortDown {
    background-image: url(/images_template/desc.gif);
}