/* ================INSTRUCTIONS=================*/
/* By changing the classes below, you can add your own custom styles for various areas of the header. In order for your changes to work though, you MUST include a reference in your HTML pages to both the common CSS file and custom CSS file in that order.
Instructions are provided below for customizing these classes. */
/* ================BANNER=======================*/
/* TO DISPLAY A CUSTOM BANNER IMAGE:
If you want to display a custom banner, change the "background: url" to point to a local banner, or external, image location.
TO DISPLAY A CUSTOM BANNER COLOR (NO IMAGE):
If you would rather display a color instead of a banner image, change the "background: url" portion to point to "" and set the background color (#006633) to whatever color you wish to display.
NOTE: You can use either hexadecimal color codes (i.e. - #006633, #063) or HTML color names (i.e. - "black"). */
#usgscolorband {
background: #347595 url(../images/banner.jpg) 178px 0px no-repeat;
}
/* ================SITE TITLE===================*/
/* TO DISPLAY A CUSTOM SITE TITLE BAR:
The #usgstitle class is specific to the colored site title bar that lies beneath the USGS identifier. To change the color of this bar, set the "background-color" attribute below to the color you wish to display and change the "color" attribute to set the text color.
NOTE: You can use either hexadecimal color codes (i.e. - #000000) or HTML color names (i.e. - "black"). */
#usgstitle {
background-color: #284d68;
color: #ffffff;
}
/* =============STANDARD CONTENT===============*/
/* TO CHANGE THE TEXT SIZE OF THE CONTENT:
By default, USGS has set the font size to "small" in order to provide a consistent size for content across all pages. If you would prefer not to have a pre-defined font size for your pages, change the "font-size" attributes below to "font-size: 100%;". */
body {
font-size: small;
}
th, td {
font-size: small;
}
/* =============CUSTOM CONTENT===============*/
/* ***** ALL PAGES ******* */
/*make sure all html5 elements are displayed as block-level elements */
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }
body {
min-width:1180px;
}
.clear_both {
clear:both;
}
.hidden {
display: none;
}
.instruction {
font-size:12px;
font-weight:bolder;
}
.caption {
display:block;
font-family: verdana, geneva, arial, helvetica, sans-serif;
font-size: 10px;
line-height:normal;
}
/* color: #0e97c5;
*/
a:link {
color: #4979a9;
text-decoration:none;
}
a:visited {
color: #4979a9;
}
a:hover {
color: #4979a9;
text-decoration:underline;
}
a:active {
color: #4979a9;
}
a.grayout {
color: #666;
}
/* style the headers */
h1 {
font-family:Arial, Helvetica, sans-serif;
color:#000;
font-size:22px;
margin-left: 5px;
margin-top: 12px;
margin-bottom: 20px;
}
/* style the headers */
h2 {
font-family:Arial, Helvetica, sans-serif;
color:#000;
font-size:16px;
}
.firstp {
margin-top:0;
padding-top:0;
}
/* style the boxes of content */
.box {
display: block;
margin-bottom: 10px;
border: solid 1px #7cd2e9;
font-size:1em;
padding: 5px;
}
.box h2 {
font-size:1em;
background-image:url(../images/backsmall.jpg);
background-repeat:repeat-x;
padding: 2px;
color: #fff;
margin-top: 0;
}
img.floatright {
float: right;
padding: 15px;
}
img.floatleft {
float: left;
padding: 15px;
}
/* style all the "class=more" links */
.page_container a.more {
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
color: #4979a9;
}
/* style all the "class=more" links */
.page_container .more {
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
color: #4979a9;
}
/* style the left hand navigation bar */
ul#mainnav {
list-style-type:none;
margin:0;
padding:0;
}
ul#mainnav li {
border: solid 1px #afcbe6;
margin: 2px;
}
ul#mainnav li #search_form {
margin:0;
padding:0;
border: 0;
}
ul#mainnav li.search {
display:block;
margin:0;
padding: 5px;
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-size:12px;
color: #5388b8;
width: 130px;
border-bottom: 0;
padding-top: 10px;
border: 0;
}
ul#mainnav li a {
display:block;
text-decoration:none;
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
padding: 3px;
font-size:12px;
color: #5388b8;
background-color: #e4eef7;
}
ul#mainnav li.selected a {
display:block;
text-decoration:none;
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-size:12px;
background-color:#d3e2f0;
}
ul#mainnav li a:hover {
background-color:#d3e2f0;
text-decoration:underline;
}
/* style the bread crumbs */
p.breadcrumbs {
margin-top:5px;
margin-left: 5px;
margin-bottom: 0px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color: #999;
}
/* min-width: 1181px;
page layout */
/* contains the whole page */
.page_container {
min-width: 1181px;
border-right: dotted 1px #c7d9e9;
margin-bottom: 10px;
margin-right: 10px;
padding-right: 10px;
}
/* defines left navigation column */
.page_container .left_nav_col {
width: 180px;
float: left;
}
/* defines content area to the right side of the nav column on every page width: 980px;*/
.page_container .page_content {
margin-left: 10px;
padding-left: 10px;
border-left: solid 1px #c7d9e9;
float: left;
width: 980px
}
/* *****HOME PAGE STYLES******* */
/* style rotator image and caption */
#home_rotator {
width: 680px;
float: left;
}
/* style action area to right of rotator */
.home_action {
width: 300px;
float: left;
color: #fff;
font-family:Verdana, Geneva, sans-serif;
}
.home_action #research_themes, .home_action #keywords, .home_action #site_search {
height: 116px;
width: 300px;
background-image:url('../images/back.jpg');
border-bottom: solid 1px #bcc9c1;
display: block;
}
.home_action #search_form, .home_action #keyword_form, .home_action #theme_form {
padding-top: 30px;
padding-left: 40px;
}
.home_action h2 {
color: #fff;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
margin:0;
padding:0;
font-weight:normal;
padding-bottom: 10px;
}
/* define column 1 of content section of home page */
.home_col1 {
width: 270px;
float: left;
padding: 0 5px 5px 5px;
margin-top: 10px;
}
/* define column 2 of content section of home page */
.home_col2 {
width: 680px;
float: left;
margin-left: 20px;
margin-top: 10px;
}
/* style about the program section */
#aboutcmgp {
margin-bottom: 20px;
border-bottom: solid 1px #c7d9e9;
padding-bottom: 10px;
}
/* style all the home page
text */
.home_col1 p, .home_col2 p {
font-family:Arial, Helvetica, sans-serif;
color:#666;
font-size:14px;
}
/* style dates in the news section */
#news {
background-color:#f8f9fa;
padding: 5px;
}
#news .date {
font-family:Arial, Helvetica, sans-serif;
color:#999;
font-size:12px;
font-style:italic;
}
#themes a:link {
text-decoration:none;
display: block;
margin-bottom: 20px;
height: 120px;
}
#themes a:visited {
text-decoration:none;
diplay: block;
margin-bottom: 15px;
padding: 10px;
}
#themes a:hover {
background-color: #f8f9fa;
text-decoration:none;
}
#themes img {
width: 180px;
height: 110px;
float: left;
margin-right: 10px;
border: solid 1px #ccc;
}
#themes h3 {
font-family:Arial, Helvetica, sans-serif;
color:#666;
font-size:15px;
margin:0;
padding:0;
margin-bottom: 5px;
margin-top: -5px;
}
#themes p {
margin:0;
padding:0;
}
#themes a:hover .more {
text-decoration:underline;
color: #0e97c5;
}
/* margins, padding, and border for the soundwaves section */
#soundwaves {
margin-top: 0px;
padding-top: 10px;
margin-bottom: 20px;
}
#soundwaves .cover {
font-size:11px;
}
/* *****CONTACT PAGE ******* */
/* column 1 of bottom section of page */
.page_container .contact_page_col1 {
width: 580px;
float: left;
}
/* column 2 of bottom section of page */
.page_container .contact_page_col2 {
width: 360px;
float: left;
margin-left: 20px;
background-color:#EEE;
padding: 10px;
}
/* *****NEWS PAGE ******* */
img.landscape {
float: right;
margin-left: 10px;
margin-bottom: 10px;
width: 200px;
padding: 1px;
border: solid 1px #ccc;
}
img.portrait {
float: right;
margin-left: 10px;
margin-bottom: 10px;
width: 175px;
padding: 1px;
border: solid 1px #ccc;
}
/* *****ABOUT US PAGE ******* */
/* column 1 of bottom section of page */
.page_container .field_page_col1 {
width: 680px;
float: left;
}
/* column 2 of bottom section of page */
.page_container .field_page_col2 {
width: 280px;
float: left;
margin-left: 20px;
}
/* column 1 of bottom section of page */
.page_container .page_col1 {
width: 680px;
float: left;
}
/* column 2 of bottom section of page */
.page_container .page_col2 {
width: 280px;
float: left;
margin-left: 20px;
}
/* goals section */
.page_container #goals {
font-family:Arial, Helvetica, sans-serif;
padding: 15px;
background-color: #eeeeee;
margin-bottom: 20px;
}
.page_container .goal {
margin-bottom: 10px;
}
.page_container #goals h2 {
color: #666;
font-size:20px;
margin-top: 5px;
margin-left: 5px;
}
.page_container .goalnum {
color: #666;
font-size:50px;
float: left;
display:block;
width: 35px;
margin-top: -5px;
}
.goalnum a:hover {
text-decoration:none;
}
.page_container .goaltext {
color: #666;
font-size:14px;
float: left;
display:block;
width: 210px;
}
.page_container .goaltext h3 {
color: #666;
font-size:14px;
margin:0;
padding:0;
}
.page_container .goaltext p {
color: #666;
font-size:12px;
margin:0;
padding:0;
}
.resources li {
margin-bottom: 10px;
}
.projectlist li {
margin-bottom: 10px;
}
.newssource {color: #666; font-size: 10px; font-family: verdana, arial, helvetica, sans-serif; text-align: right; display: block; margin: 0; padding: 0;}