/* ********** Defaults - gets all browser baselines in sync, copied from last version of page ****** */
/*removed fieldset from below list*/
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote {margin:0; padding:0;}
/*Below was screwing up Stephane's forms*/
/*input {margin:0; padding:0;}*/
img {border:none;}
/*Below was screwing up Stephane's forms*/
/*fieldset,img {border:none;}*/
caption,th {text-align:left;}
table {border-collapse:collapse; border-spacing:0;}
.clear {clear:both; height:0; overflow:hidden; line-height:1px; font-size:1px;}
/***************************************************************************/

/*********** basics - main typography, mostly from previous version of site *********** */
body {
background-color:#E5E5E5;
color: #000;
font: normal 1em Verdana, Helvetica, sans-serif;
position: relative;
}
h1, h2, h3, h4, h5, h6 {
font-family: Verdana, Helvetica, sans-serif;
padding-top:.6em;
margin-bottom: .4em;
}
h1 {
font-size: 175%;
}
h2 {
font-size: 145%;
}
h3 {
font-size: 125%;
color: #ba7d00;
}
h4 {
font-size: 105%;
}
h5 {
font-size: 90%;
}
h6 {
font-size: 80%;
}
/* Smaller gray deck */
h1.subhead {
font-size:130%;
color:#555;
margin-top:-.5em;
}
/* removes vertical separator in front of first item in horizontal list */
#outside li.first {
border-left: 0;
}

hr {
border: 0;
border-top: 2px dotted #e3d6bf;
width: 50%;
height: 1px;
margin: 1em 0;
}

/******************************************************************/

/* Skip to main content - for keyboard users, not needed anymore for screen readers. */
/*FIX SKIP LINK, NOT WORKING!*/
#skip a {
position:relative;
display:block;
font-size: 80%;
color:#FFFFFF;
}
#skip a:focus {
display:block;
text-decoration:underline;
}

/*Footer, modified from previous version of page, then further modified for NCEDC page. **/

#footer {
font-size: 0.7em;
text-align:left;
padding-bottom:1em;
margin-top:10px;
width:1000px;
margin-right:auto;
margin-left:auto;
}

#footer a, #footer a:visited {
text-decoration:none;
color: #31418c;
}
#footer a:hover, #footer a:visited:hover {
text-decoration:underline;
color: #c19e36;
}

#footerTextblock{width:27%;height:80px;float:left;margin-left:12px;}
#footerTextblock td{vertical-align:top;}
#footerLogos{width:70%;height:80px;float:right;}
#footerLogos img{margin-right:7px;float:right;}
#footerLogos #lastLogo {margin-right:0px;}

/***********Blue header at the top of the page*********/

#blueheader {
margin-left:auto;
margin-right:auto;
background-color:#005A9C;
width:1000px;
height:100px;
margin-top:10px;
border-width:0px;
border-top-right-radius: 15px;
-moz-border-radius-topright: 15px;
-webkit-border-top-right-radius:15px;
border-top-left-radius: 15px;
-moz-border-radius-topleft: 15px;
-webkit-border-top-left-radius:15px;
-webkit-background-clip:padding-box;
position:relative;
}

/***********styles for some divs in header*********/

#altnav {
width:400px;
height:1px;
margin-right:auto;
margin-left:auto;
position:relative;
margin-left:490px;
}

#altnav a {
position:absolute;
color:white;
left:-9999px;
}

#altnav a:focus {
color:black;
left:0px;
margin-top:2px;
}

#skip {
color:red;
visibility:hidden;
}

#skip a:focus {
visibility:visible;
}

#ucb a:hover, #ucb a:active {
text-decoration:underline;
}

#NCEDCLogo {
position:absolute;
top: 9px;
/*Added left margin 2/15/11*/
margin-left:20px;
overflow:hidden;
}

#NCEDCLogoImage{
overflow:hidden;
}

#BSLLogo {float:right;margin-top:40px;margin-right:10px;height:80px;}

#BSLLogoImage{
overflow:hidden;
}

/*Styling the search bar*/
#tools {
color:white;
position:absolute;
top: 9px;
font-size:80%;
right: 7px;
vertical-align: top;
text-align: right;
}
#tools form {
display:inline;
}
#tools input {
margin: 2px 0;
border:none;
color:black;
background-color:#fff;
}
#tools input.go {
margin-bottom:-4px;
}
#tools a, #tools a:visited {
text-decoration:none;
color: #fff;
}
#tools a:hover, #tools a:visited:hover {
text-decoration:underline;
}

/*A couple of styles just for the homepage*/
.homepage a:link {
color:#1621DE;
}
.homepage a:visited {
color:#404040;
}

/*Box enclosing mega-dropdown menu*/
#dropbox{
background-color: #005A9C;
width:1000px;
height:30px;
display:block;
margin-left:auto;
margin-right:auto;
}

.dropdown, .dropdown ul {
        font-size:12px;
        text-align:center;
	padding: 0;
	margin:0;
	list-style: none;
}

.dropdown a {
padding-top:3px;
padding-bottom:1px;
color:#ffffff;
text-decoration:none;
/*JTaggart 6/25/2013 looks like below is not necessary*/
/*display:block;*/
}

.dropdown > li {
/*JCT 1/10/2013 makes outline on hover extend all the way down.*/
height:20px;
}

.dropdown > li:after {
margin-left: 5px; content: '\25BC';
}

.privacy a:hover {
text-decoration:underline;
}

/*Take care of IE css jitter problem when hovered elements change size in any way. */
/*Border always there with color same as background, changes color when hovered.*/
.dropdown li {
float:left;
border-top-right-radius: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius:10px;
border-top-left-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius:10px;
border-top: 3px solid #005A9C;
border-right: 3px solid #005A9C;
border-left: 3px solid #005A9C;
}

.dropdown li:hover {
border-top: 3px solid #FDB93C;
border-right: 3px solid #FDB93C;
border-left: 3px solid #FDB93C;
}

/*dropNetworks is the dropdown associated with Networks.*/
.dropdown #dropNetworks {
        background-color:#FFFFFF;
	position: absolute;
	z-index:9999;
	text-align:left;
        margin-top:4px;
	margin-left:-3px;
	width:530px;
	min-height:350px;
        left: -9999px;
	float:none;
	color:#000000;
        /*border:5px solid #FDB93C;*/
	border:3px solid #FDB93C;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-top-right-radius: 15px;
        -moz-border-radius-bottomleft: 15px;
        -moz-border-radius-bottomright: 15px;
        -moz-border-radius-topright: 15px;
	-webkit-border-bottom-left-radius:15px;
        -webkit-border-bottom-right-radius:15px;
        -webkit-border-top-right-radius:15px;
}

/*Makes the bit directly under Networks white instead of yellow*/
.dropdown #dropNetworks:after {
content:'';
position: absolute;
top: -3px; left:0px;
width:95px;
height:3px;
background-color:white;
}

.dropdown #dropNetworks a{
font-size:12px;
padding-top:2px;
padding-bottom:0px;
text-align:left;
color:#000000;
text-decoration:none;
}
.dropdown #dropNetworks li{
text-align:left;
border:none;
}
.dropdown #dropNetworks a:hover {
text-decoration:underline;
}

.dropdown #dropAccessData {
        background-color:#FFFFFF;
	position: absolute;
        z-index:9999;
	text-align:left;
	margin-left:-3px;
        margin-top:4px;
        width:300px;
        left: -9999px;
	float:none;
	color:#000000;
        border:3px solid #FDB93C;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        -moz-border-radius-bottomleft: 15px;
        -moz-border-radius-bottomright: 15px;
	-webkit-border-bottom-left-radius:15px;
        -webkit-border-bottom-right-radius:15px;
        border-top-right-radius: 15px;
        -moz-border-radius-topright: 15px;
        -webkit-border-top-right-radius:15px;
}

.dropdown #dropAccessData:after {
content:'';
position: absolute;
top: -3px; left:0px;
width:110px;
height:3px;
background-color:white;
}

.dropdown #dropAccessData a{
font-size:12px;
padding-top:2px;
padding-bottom:0px;
text-align:left;
color:#000000;
text-decoration:none;
}
.dropdown #dropAccessData li{
text-align:left;
border:none;
}
.dropdown #dropAccessData a:hover {
text-decoration:underline;
}

.dropdown #dropEarthquakeCatalogs {
	position: absolute;
        z-index:9999;
        background-color:#FFFFFF;
	text-align:left;
        margin-top:4px;
	margin-left:-3px;
        width:380px;
        left: -9999px;
	float:none;
	color:#000000;
        border:3px solid #FDB93C;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-top-right-radius: 15px;
        -moz-border-radius-bottomleft: 15px;
        -moz-border-radius-bottomright: 15px;
        -moz-border-radius-topright: 15px;
	-webkit-border-bottom-left-radius:15px;
        -webkit-border-bottom-right-radius:15px;
        -webkit-border-top-right-radius:15px;
}

.dropdown #dropEarthquakeCatalogs:after {
content:'';
position: absolute;
top: -3px; 
left:0px;
width:165px;
height:3px;
background-color:white;
}

.dropdown #dropEarthquakeCatalogs a {
font-size:12px;
padding-top:2px;
padding-bottom:0px;
text-align:left;
color:#000000;
text-decoration:none;
}
.dropdown #dropEarthquakeCatalogs li{
text-align:left;
border:none;
}
.dropdown #dropEarthquakeCatalogs a:hover {
text-decoration:underline;
}


.dropdown #dropOther {
	position: absolute;
        z-index:9999;
        background-color:#FFFFFF;
	text-align:left;
        margin-top:4px;
	margin-left:-3px;
        width:220px;
        left: -9999px;
	float:none;
	color:#000000;
        border:3px solid #FDB93C;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-top-right-radius: 15px;
        -moz-border-radius-bottomleft: 15px;
        -moz-border-radius-bottomright: 15px;
        -moz-border-radius-topright: 15px;
	-webkit-border-bottom-left-radius:15px;
        -webkit-border-bottom-right-radius:15px;
        -webkit-border-top-right-radius:15px;
}

.dropdown #dropOther:after {
content:'';
position: absolute;
top: -3px; left:0px;
width:73px;
height:3px;
background-color:white;
}

.dropdown #dropOther a{
font-size:12px;
padding-top:2px;
padding-bottom:0px;
text-align:left;
color:#000000;
text-decoration:none;
}
.dropdown #dropOther li{
text-align:left;
border:none;
}
.dropdown #dropOther a:hover {
text-decoration:underline;
}


/***********/
.dropdown #dropShortcuts {
	position: absolute;
        z-index:9999;
        background-color:#FFFFFF;
	text-align:left;
        margin-top:4px;
	margin-left:-3px;
	width:240px;
	float:left;
        left: -9999px;
	float:none;
	color:#000000;
        border:3px solid #FDB93C;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-top-right-radius: 15px;
        -moz-border-radius-bottomleft: 15px;
        -moz-border-radius-bottomright: 15px;
        -moz-border-radius-topright: 15px;
	-webkit-border-bottom-left-radius:15px;
        -webkit-border-bottom-right-radius:15px;
        -webkit-border-top-right-radius:15px;
}

.dropdown #dropShortcuts:after {
content:'';
position: absolute;
top: -3px; 
left:0px;
width:100px;
height:3px;
background-color:white;
}

.dropdown #dropShortcuts a{
font-size:12px;
padding-top:2px;
padding-bottom:0px;
text-align:left;
color:#000000;
text-decoration:none;
}
.dropdown #dropShortcuts li{
text-align:left;
border:none;
}
.dropdown #dropShortcuts a:hover {
text-decoration:underline;
}
/************/

.dropdown li li {
	float:none;
}

.dropdown li:hover #dropNetworks {
left:0px;
}
.dropdown li:hover #dropAccessData {
left:0px;
}
.dropdown li:hover #dropEarthquakeCatalogs {
left:0px;
}
.dropdown li:hover #dropOther {
left:0px;
}
.dropdown li:hover #dropShortcuts {
left:0px;
}


/******Working design for megadropdown menu had lots of inline styles. Factored them out to make the html more readable. Some unnecessary use of IDs for the sake of getting things done.******/
/*Factored out from menu*/
#Networks{width:95px;position:relative;padding-top:7px;padding-bottom:0px;color:#FFFFFF;text-decoration:none;list-style-position:inside;}
#AccessData{width:110px;position:relative;padding-top:7px;padding-bottom:0px;color:#FFFFFF;text-decoration:none;list-style-position:inside;}
#EarthquakeCatalogs{width:165px;position:relative;padding-top:7px;padding-bottom:0px;color:#FFFFFF;text-decoration:none;list-style-position:inside;}
#Other{width:73px;position:relative;padding-top:7px;padding-bottom:0px;color:#FFFFFF;text-decoration:none;list-style-position:inside;}
#Shortcuts{width:100px;position:relative;padding-top:7px;padding-bottom:0px;color:#FFFFFF;text-decoration:none;list-style-position:inside;}
.makeBlue{font-size:12px;color:#005A9C !important;}
.spacedListItem{margin-top:10px;}
#networksListMain{margin-left:15px;margin-top:8px; margin-bottom:15px;}
#networksListA{margin-left:20px;text-indent:-10px;margin-bottom:15px;}
#networksListB{margin-left:20px;text-indent:-10px;margin-bottom:15px;}
#networksListC{margin-left:20px;text-indent:-10px;margin-bottom:15px;}
#accessDataListContainer{width:300px;float:left;}
#accessDataList{margin-top:10px;float:left;margin-left:30px;text-indent:-10px;margin-bottom:15px;}
#earthquakeCatalogListContainer{float:left;width:380px;margin-bottom:15px;}
#earthquakeCatalogList{margin-top:10px;float:left;margin-left:30px;text-indent:-10px;}
#otherList{margin-top:10px;float:left;margin-left:30px;text-indent:-10px;margin-bottom:15px;}
#shortcutsListContainer{float:left;width:240px;margin-top:10px; margin-bottom:10px;}
#shortcutsList{text-indent:-10px;margin-right:10px;margin-left:30px;}
/************/

/*Styles for div bodybox*/
#bodybox{border-left:2px solid #CCCCCC;border-right:2px solid #CCCCCC;border-bottom:2px solid #CCCCCC;margin-left:auto;margin-right:auto;background-color:#FFFFFF;width:996px;min-height:601px;}
/************************/

/************ Main content div styles, div is commented out for homepage styling, most of this is copied from a previous version of the site *************/
/*Made content a class instead of an ID because it was so hard to override styles in BSL site*/
.content {
text-align:left;
margin-right:10px;
margin-left:10px; 
margin-bottom:10px;
padding-bottom:10px;
padding-left:5px;
font-size: 90%;
}
.content p {
margin: 1em 0;
}
.content ul li {
margin: .3em 0 .3em 1.3em;
}
.content ol {
margin-left:3em;
}
.content ol li {
margin: .3em 0;
}
.content a {
color:#527091;
text-decoration:underline;
}
.content a:hover, #content a:hover:visited {
color:#ba7d00;
}
.content a:visited {
color:#666;
}

/* NCEDC site was coded old-style, which made "both ends" of in-page */ 
/* links (the one with the href and the one with the name attribute) */ 
/* get the link styles. Topics that were linked TO looked like you */
/* could click on them. Code below fixes this unless you have a link with */
/* an href and a name (there are none with both as of 11/19/2013)*/

.content a[name]{color:#000000;text-decoration:none;}
.content a[name]:hover {color:#000000;text-decoration:none;}

/* puts all images in #content section on separate line; override for individual img's with display:inline; if required */
.content img {
display:block;
}
.content form {
margin-top:1em;
margin-bottom:1em;
}


/* Pages that are lists of links, such as seismo 
press and research reports, looked hard to read 
with the new style sheet JCT 2011/04/01*/
.linklist {
margin-bottom:.8em; 
margin-left:2em; 
line-height:1.5em;
}

/* ********* images  *********** */
/* Apply class to <div> containing image and optional caption. Specify div width inline to match img width */

/* For image floated on right of text */
.pixRight {
margin: .1em 0 .3em .5em;
float: right;
font-size: 75%;
color: #300;
}
/* For image floated on left of text */
.pixLeft {
margin: .1em .5em .3em 0;
float: left;
font-size: 75%;
color: #300;
}

/*Styles created during the content revamp of the NCEDC site - keep these!*/
/*Adding more heirarchy to the Help and Documents page*/
.firstLevelIndent{margin-left:40px;}
.secondLevelIndent{margin-left:80px;}
.thirdLevelIndent{margin-left:120px;}

/*Indent wasn't working for docs page paragraphs due to content class, set explicitly*/
p.firstLevelIndent {margin-left:40px;}
p.secondLevelIndent {margin-left:80px;}
p.thirdLevelIndent {margin-left:120px;}

/*Some styles from the old NCEDC pages, these will make things more legible at first.*/
dt.emp {
      /*color:navy;*/
	/*font-size: medium; */
	font-weight:bold;
      }  


/*New class "news" replicates FF browser styles associated with definition lists. For Doug N.'s use on the "news" pages*/
dt.news {font-weight:bold;margin-top:1em;}
dt.news + dd {margin-left:40px;}

/*Stephane's styles for the catalog searches*/
.shaded {
  padding: 8px !important;
  border: 1px solid #CCC;
  box-shadow:8px 8px 12px #888;
  border-radius:6px;
/*Add styles to override style resets at top*/
border-collapse:separate;
border-spacing:2px 2px;
/*Note that margin-right won't work if table width is set to 100%*/
}

/*Doesn't work table.shaded {border-collapse:none;}*/

/*Explicitly state table, fieldset, and legend styles for [some] catalog searches since browser styles have been reset*/
.shaded fieldset {padding-bottom:12px;padding-left:10px;padding-right:10px;padding-top:5px;margin-left:2px;margin-right:2px;}
.shaded legend {padding-left:2px;padding-right:2px;}
.shaded td {padding:1px;}

/*Fix up the form for the ANSS catalog search*/
#anssform{width:55%;}
#anssformLeft{float:left;}
#anssformRight{float:right;}
label.anssform {display:inline-block;width:9em;}
/*Put some space below "Select..."*/
dt.anssform {margin-bottom:0.4em;font-weight:bold;font-size:125%;}

/*-------------------This bit is Styles for jQuery slide downs-----------------------*/
.instructions{
padding-left:10px;
padding-right:10px;
padding-bottom:5px;
/*width: 800px;*/
width: 60%;
/*height:150px;*/
border-radius:5px;
border: 2px #ccc solid;
/*background-color:#e5e5e5;*/
box-shadow:3px 3px 3px #ccc;
font-size:85%;
margin-bottom:10px;
}

.instructions p{margin-top:0px;padding-top:5px;margin-bottom:3px;}

.instructions button{margin-top:0px;padding-top:0px;}

.slideDownTopic{
cursor: hand;
cursor: pointer;
}

h2.slideDownTopic{font-size:125%;padding-top:.3em;margin-bottom: .2em;}
h3.slideDownTopic{font-size:105%;padding-top:.3em;margin-bottom: .2em;}

.slideDownTopic:hover{
text-decoration:underline;
/*color:blue;*/
color:#c19e36;
}

.slideDownTopic:after {
margin-left: 5px; 
content: '+';
}

h2.selected{font-size:125%;padding-top:.3em;margin-bottom: .2em;}
h3.selected{font-size:105%;padding-top:.3em;margin-bottom: .2em;}

.selected{
/*color:blue;*/
cursor: hand;
cursor: pointer;
}

.selected:after {
margin-left: 5px; 
content: '-';
}

.selected:hover{
text-decoration:underline;
/*color:blue;*/
color:#c19e36;
}

/*slideDownText is displayed in the print style sheet*/
.slideDownText{
overflow:hidden;
display: none;
}
/*------------------------------*/

/* Styles for quicklook seismogram page */
.quickLookRow {width:971px;}
div.quickLook {width:320px;float:left;}
img.quickLook {width:300px;margin-left:auto;margin-right:auto;}
div.clear {clear: both;}
div.quickLook p {margin-left:60px;margin-bottom:60px;margin-top:0px;font-weight:bold;}
