/* ================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: #3B84AC url("/images/banners/water_banner4.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: #3B84AC; */ 
    background-color: #0061A3;
    color: #ffffff; 
} 

/* 
Media query to remove USGS Home,Contact,Search graphic 
in upper right hand corner of header and a portion of the footer
to simplify like nwisweb does
----------------------------------------
*/
@media (max-width: 450px) {
  #usgsccsa { 
	display: none;
  } 
  #usgsfootertext { 
	display: none;
  }   
}

/* 
REQUIRED for Smart Menu
----------------------------------------
*/
#main-menu {
	position:relative;
	z-index:9999;
	width:auto;
}
#main-menu ul {
	width:12em; /* fixed width only please - you can use the "subMenusMinWidth"/"subMenusMaxWidth" script options to override this if you like */
}


/* -moz-border-radius is not W3C valid !! 
----------------------------------------
*/
.note {
    border: 1px solid #444444;
    -moz-border-radius: 5px;
    padding: 0.75em;
    background: #f7f2ea;
    font-size: 73%; 
    margin-right: 200px;
}


/* For Help text boxes
----------------------------------------
*/
.box {
	background-color:#EFF7FA;
	margin:5px;
	padding:5px;
	border-style:dashed;
	border-width:1px;
	width:95%;
	display: none;
}

/* Only for divs on waterservices index page
----------------------------------------
*/
.boxForIndex {
	background-color:#EFF7FA;
	margin:5px;
	padding:5px;
	border-style:dashed;
	border-width:1px;
	width:95%;
}


/* Make All Text Inputs 95%                    */
/* An easy way to make this quickly responsive */
/* ------------------------------------------- */
input[type="text"] { width: 95%; }

.nonpublic {background-color:rgb(255,243,236); margin:5px; padding:5px; border-style:dashed; border-width:1px;}
th { background-color: #EFF7FA; }



/* bolds questions in docs/faq.html            */
/* ------------------------------------------- */
dt {
	font-weight:bold;
}


/* Below are being used in some html files             */
/* Saving these styles for now, can see right now that */
/* setting margins on all tables will not work         */
/* --------------------------------------------------- */
/* 
table {
	margin-left: 50px;
	border-collapse: collapse;
}
 */
 
h3 {
	margin-top: 15px;
	margin-bottom: 15px;
}

.twiceNormalSize {
	font-size: 200%;
}

.example {
	font-family: "Courier New", Courier, monospace;
}

.fixed-width {
	font-family: "Courier New", Courier, monospace;
	font-size: 12px;
}

.ui-widget-header .ui-icon {
	background-image: url("/images/ui-icons_222222_256x240.png");
}

.centered {
	text-align: center;
}