@import url(/stylesheets/site.css);

/******************************************
 * 4-argument padding/margin order is: top, right, bottom, left.
 *
 * BROWSER COMPATIBILITY:
 * ----------------------
 * - New styles should use 'em' or 'ex' for sizing relative to text, and 'px'
 *   for sizing relative to images.
 *   We have not fully converted IncidentNews to this due to the significant
 *   browser-specific problems we had.  The older rule was to use 'px', and
 *   that 'em' is too large on IE6/Windows.  That may no longer be the case now
 *   that we're using HTML 4.01 Transitional instead of HTML 3.2.
 *   Named font sizes ("medium", "small", etc). look too big on Safari even
 *   though ResponseLINK has converted to those.
 *
 * - Redundant font-size's are used because IE and Safari do not inherit
 *   the style properly.
 *
 * COLORS:
 * -------
 * #FF8C00 = orange
 * #FF69B4 = hot pink
 * #EE0000 = red
 * AliceBlue = #f0f8ff
 * beige = #F5F5DC
 * light blue = #E9F0F8
 * mint ice cream = #C5E3BF
 * camo1 = #CFDBC5
 * honeydew2 = #E0EEE0
 * navajo white = #EECFA1
 * wheat2 = #EED8AE
 * moon = #DBE6E0
 * beige = #F5F5DC
 * lightgoldenrodyellow = #FAFAD2
 * erikas gray = #D1D1D1
 * compat chart = #E0EEE0
 * light gray = #F2F2F2
 * dark green = #006400
 *
 * CAMEOChem's aliceblue(SVG) #F0F8FF too light on IE6
 * slategray1 #C6E2FF a little darker
 * lavender(SVG) #E6E6FA
 * silver #E6E8FA
 * quartz #D9D9F3
 *****************************************/


/******************************************
/ Default styles for every page
******************************************/

body {
    background-color: white;
    color: black; 
    min-width: 600px;
    margin: 0 0 10px 0;
    background-image: url(/images/left_sidebar.jpg);
    background-repeat: repeat-y;
    background-position: left;
    /* some default font settings */
    font-family: sans-serif;
    font-size: 12px; 
    }

h1 {font-size: 14px;}
h2 {font-size: 12px;}

p {
    font-family: sans-serif;
    font-size: 12px;
    line-height: 1.5em;
    }

/* These apply to all hyperlinks, including in the sidebar and footer. */
a {color: #15008E; text-decoration: none;}
a:visited {color: #15008E; text-decoration: none;}
a:hover {color: #15008E; text-decoration: underline;}

/* All clickable images. */
a img {
    border-style: solid;
    border-width: 1px;
    border-color: #999999;
    }

/* Squash excess vertical margins in blockqoutes. */
blockquote {
    margin-top: 0;
    margin-bottom: 0;
    }

/* Make definition tables easier to read. */
dt {
    font-weight: bold;
    }

dd {
    margin-top: 5px;
    margin-bottom: 20px;
    }

table {
    font-size: 12px;  /* Redundant but IE/Safari don't inherit properly.  */
    vertical-align: top;
    }

td {
    vertical-align: top;
    }

caption {
    font-weight: bold;
    }

li {
    margin-bottom: 1ex;
    }


/******************************************
 * Pages with right sidebar
 *
 * Implement as a one-row table.
 * The content cell should be <td#content-with-sidebar>.
 * The sidebar should be <td#right-sidebar>.
 *****************************************/

td#content-with-sidebar {
    vertical-align: top;
    }

td#right-sidebar {
    vertical-align: top;
    }


/*****************************************
 * Optional styles for any page
 ****************************************/

/* The main page title used in the site template. */
h1.page-title {
    margin-top: 5px;
    margin-bottom: 0px;
    /*color: #006400;*/
    /*color: #153566;*/
    /*color: black;*/
    color: #153566;
    font-family: Georgia, serif;
    font-size: 20px;
    }

/* A section-level title for any page. */
h2.section-title {font-size: 14px; font-family: sans-serif; margin-top: 0px; margin-bottom: 2ex;}

/* A special site notice, usually on the home page. */
.admin-note {
    margin: 1ex 4ex;
    padding: 1ex;
    border: solid 1px;
    }

/* A "More..." link. */
div.see-more {
    margin-top: 1em;
    margin-bottom: 2em;
    }

.disabled {  /* Use for disabled controls and NULL values. */
    color: #888888;
}

/* A link that looks kinda like a button. */
.pseudo-button {
    padding: 4px;
    font-size: 12px; 
    font-weight: normal;
    border-style: outset;
    background-color: #FAFAFA;
    }

/* A fixed-hight div with a scrollbar that shows if there's more than one
 * screenful of text. Individual div's can override the width & height.
 */
div.scroll {
    width: 540px;
    height: 115px;
    overflow: auto;
    border: solid;
    border-width: 1px;
    }

/* Shade every other table row to make it easier to see the rows. */
tr.even {background-color: #F0F8FF;}
tr.odd {background-color: white;}

.instructions {font-style: italic;}
.small {font-size: 10px;}

hr.divider {margin-top: 20px;}

.disclaimer {
    margin-top: 1ex;
    margin-bottom:1ex;
    border: 1px solid #999999;
    padding: 5px;
    background-color: #ffffcc;
    }

/* An inline feed icon placed in text. */
img.feed-icon {
    vertical-align: middle;
    }

.highlight {
    background-color: #b4eeb4;
    /* font-weight: normal; */
    }

.search-engine-links {
    display: none;
    font-size: 10px;
    }

/* Search results */
table.results {
    border-spacing: 0 1em;
    }

table.results td {
    padding: 1em;
    border: solid 1px black;
    }

.release-unit-note {
    font-size: 10px;
    font-style: italic;
    margin: 1ex 4ex;
    border: solid 1px black;
    }

/* Forms */

fieldset {
    margin: 1em 3em 2em 1em;
    padding-top: 0.5em;
    }

fieldset legend { 
    color: #036;
    font-weight: normal; 
    font-size: medium; 
    }

label {
    margin-top: 1em;
    font-weight: bold;
    font-size: 12px;
    }

div.submit input {
    margin-right: 1em;
    }

.required {
    color: red;
    margin-left: 1ex;
    margin-right: 1ex;
}

.error {
    color: #cc0000;
    }

.error-message {
    color: #cc0000;
    background-color: #ffeeee;
    font-size: large;
    font-weight: bold;
    font-style: italic;
    padding: 4px;
    }

blockquote.widget {
    margin-top: 2px;
    margin-left: 15px;
    margin-bottom: 10px;
    }

.hint {
    font-style:italic;
    color:#006400;
    }


/*****************
 * Map page
 ****************/

#map {
    border-style: solid;
    border-width: 2px;
    border-color: #999999;
    }
/*
form.mapyear {
    font-family: sans-serif;
    font-size: 12px;
    }
*/

table.maptable {
    margin-top: 1em;
    font-family: sans-serif;
    }

/*****************
 * Emphasized fields
 ****************/
 

/* Incident name hyperlink */
a.name {
    color: #3232CC; 
    text-decoration: none;
    font-family: sans-serif;
    font-size: 12px;
    font-weight: bold;
    }
a.name:visited {color: #3232CC; text-decoration: none;}
a.name:hover {color: #3232CC; text-decoration: underline;}

.location {color: #666666; /* font-weight: bold;*/ font-size: 12px;}
.location-emphasized {color: #666666; font-weight: bold; font-size: 12px;}
.date {color: #666666; font-weight: bold; font-size: 12px;}

td.headline-img {vertical-align:top; padding-bottom: 30px; padding-right: 10px;}
td.headline-body {vertical-align:top; padding-bottom: 30px;}

/*****************
 * List tables
 ****************/

/* All list tables get this. */
table.list {
    /*width: 100%;*/
    }

/* All list tables have this <th>. */
table.list th {
    /* padding: 4px; */
    text-align: left;
    }

/* All list tables have this <td>. */
table.list td {
    /* padding: 4px; */
    }

/* Incident name columns in list tables*/
table.list td.name {
    }

/* Date columns in list tables */
table.list td.date {
    width: 12ex;
    }

/*****************
 * Thumbnails tables
 ****************/

table.thumbnails {
    }

table.thumbnails td {
    padding-left: 30px;
    width: 200px;
    vertical-align: top;
    /* vertical-align: bottom; */
    }

/*************
 * Incident page
 *************/

.view-map-link {
    margin-top: 4px;
    line-height: 1em;
    }
 
.detail-title {
    font-size: 12px;
    font-weight: normal;
    }

.detail-value {
    font-size: 12px;
    font-weight: bold;
    }

.orr-blurb {
    margin: 4ex 10ex 0 10ex;
    padding: 0.5ex;
    font-style: italic;
    border: solid 1px;
    background-color: #F0F8FF;
    }

/*************
 * Entry Stuff
 *************/

table.entry-details {
    margin-top: 0.5ex;
    margin-bottom: 0.5ex;
    font-weight: normal;
    }

table.entry-details th {
    text-align: right;
    font-size: 12px;
    font-weight: bold;
    }

pre.entry-text {
    /*font-family: "Courier New", Courier, monospace;*/
    /*font-family: Palatino, "Times New Roman", serif;*/
    /*font-family: sans-serif;*/
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 14px;
    line-height: 1.5em;
    font-weight: normal;
    }

div.attachment-title {
    margin-top: 1ex;
    margin-bottom: 2em;
    font-size: 12px;
    font-weight: normal;
    }

/*************
 * Classic Hazweb navigation bar
 * XXX Not currently used
 *************/

.navigation {
    font-size: 14px;
}

.page-links {
    background-color: #eeeeee;
    padding: 10px;
    display: inline;  /* To prevent box from spreading the entire width. */
}

.page-link-item {
    border-style: outset;
    border-color: black;
    border-width: 1px;
    padding: 2px;
    margin-right: 5px;
}

/********************
 * Searching
 *******************/

form.search {
    border: solid 1px black;
    padding: 1em;
    font-size: 12px;
    margin-top: 1em;
    }


/********************
 * Famous spills page
 *******************/
dl.famous-spills dt {
    margin: 20px 0 5px 0;
    }

/******************
 * Glossary section
 *****************/
.navbar-in-content {
    font-size: small;
    font-weight: bold;
    }

.navbar-in-content .item {
    /* border-style: solid; */
    /* border-width: 2px; */
    padding: 3px;
    }

.navbar-in-content .current {
    }
    
.navbar-in-content .non-current {
    }

.references p {text-indent: -5%;  margin-left: 5%;}

/******************
 * "All Incidents" page
 *****************/

.all-incidents dt {
    margin-top: 10px;
    }

.all-incidents dd {
    margin: 0;
    }

.all-incidents ul {
    margin: 0;
    }

.all-incidents li {
    margin: 0;
    }

/*********************
 * "Incidents per Year" page
 *********************/

table.incidents-per-year {
    border: solid 1px black;
    border-spacing: 2px;
    }

table.incidents-per-year th {
    border: solid 1px black;
    padding: 2px;
    }

table.incidents-per-year td {
    border: solid 1px black;
    padding: 2px;
    text-align: right;
    min-width: 5em;
    }