/******************************************
/ CSS for CAMEO Chemicals Report Preview Pages
/
/ This is NOT the main cameo CSS. That one is called 'default.css'
/
/ Since these pages are meant to be printed, they need to be void of all the
/ normal web page things like the banner and footer and sidebar.
/ Also, we are going to layout the contents of the pages differently than normal.
/
/ Notes
/ - The units 'em' don't work reliably on IE for Windows v6, they are way too big compared to how the same value
/	is displayed in Netscape, Firefox on Windows and Netscape, Firefox, Safari, and IE on Mac
/ - So, I am using mostly pixel units for margins, etc.
/
******************************************/

/* 4-argument padding/margin order is: top, right, bottom, left. */

/******************************************
/ actually being used stuff as of Nov 18, 2008
******************************************/

body
{
	background-color: white;
	color: black; 
	font-size: 11pt; 
	font-family: Times, serif;
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
}

/* this is just eye candy, it doesn't do anything and can be dropped */
/* it uses the trick that browsers don't print background images... it could break later */
div.pagebreak
{
	float: none;
	clear: none;
	page-break-after: always;
	background-image: url(/images/pagebreak.png);
	background-position: center;
	background-repeat: no-repeat;
}

h1
{
	margin: 16px;
    font-weight: normal; 
    font-size: 18pt;
}

h2
{
	margin-top: 1em;
	margin-bottom: 1em;
	border-style: solid;
	border-width: 1px;
	padding: 0.5em;
	font-weight: normal; 
	font-size: 11pt; 
}

h3
{
	margin-top: 0.25em; 
	margin-bottom: 0.5em; 
	font-weight: bold; 
	font-size: 11pt; 
}

p { margin-top: 0.5em; margin-bottom: 0.5em; }

.spaced li
{
    margin-bottom: 1em;
}

div.pretitle
{
	font-weight: bold;
	margin-top: 1em;
	margin-bottom: 0.5em;
}

/* IE 6 & 7: width=100% causes table's right side border to be cropped */
table.title-box
{
	float: none;
	clear: none;
	width: 98%;
	border: 1px dashed #AAAAAA;
	margin-top: 0;
	margin-bottom: 1em;
}

div.field_label { margin-top: 1em; margin-bottom: 0.5em; font-weight: bold; }
div.field_contents { margin-top: 0.5em; margin-bottom: 1.5em; }

div.physical_props { margin-top: 0.5em; margin-bottom: 0.5em; }

.prop_label { font-weight: bold; }

.no_data { font-size: 10pt; }

/******************************************
/ Lists and footnotes
*******************************************/

/* "no-bullet" lists have no item marker, just the items themselves
   in a vertical line. 
*/

ul.no-bullet {
    list-style: none;
    padding-left: 2em;
    }

ul.no-bullet2 {
    list-style: none;
    padding-left: 0;
    }

ul.no-bullet3 {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 0;
    }

ul.no-bullet3 {
    margin-bottom: 0.1em;
    }

/* "spaced" lists have extra space below each item. */

ul.spaced > li, ol.spaced > li, dl.spaced > dd {
    margin-bottom: 1em;
    }

ul.spaced2 > li, ol.spaced2 > li, dl.spaced2 > dd {
    margin-bottom: 2em;
    }

ul.spaced3 > li, ol.spaced3 > li, dl.spaced3 > dd {
    margin-bottom: 0.4em;
    }

/* "footnotes" div has vertical space; lists have no marker and
   specific vertical spacing.
*/

div.footnotes {
    margin: 0.3em 0;
    }

ul.footnotes {
    margin: 0.25em 0 1em 0;
    padding: 0;
    list-style: none;
    }

ul.footnotes li {
    margin: 0 0 0.5em 0;
    padding: 0;
    }

/* "warnings" lists have a warning icon instead of a bullet */

ul.warnings {
	list-style-image: url(/images/warning.png);
}

ul.warnings li {
	vertical-align: top;
	margin-left: 1em;
}


/******************************************
* Gridded tables (LOCs, Dupont, NFPA, etc)
*******************************************/

/* Gridded tables on datasheets have a common look and feel. 

   The known gridded tables are class="gridded dupont", "gridded aegls",
   "gridded erpgs", "gridded pacs", and "gridded lol". Some of the latter
   classes do not have distinct styles at this time.
*/


table.gridded {
    border-spacing: 0;
    border-collapse: collapse;
    }

table.gridded caption {
    text-align: left;
    font-weight: bold;
    text-align: center;
    }

table.gridded th {
    /* background-color: rgb(240, 248, 255); */
    text-align: left;
    }

table.gridded th, table.gridded td {
    border: solid 1px;
    border-color: rgb(140, 140, 140);
    padding: 0.3em 0.3em;
    vertical-align: bottom;
    }

/**** AEGL table ****/
table.aegl th, table.aegl td {
    }

table.aegl td.value {
    min-width: 6em;
    }

div.aegl-cas {
    margin: 1em 0;
    }

/**** ERPG and PAC tables ****/
table.erpg th, table.erpg td, table.pac th, table.pac td {
    }

table.erpg td.name, table.pac td.name {
    /* width: 12em; */
    min-width: 10em;
    max-width: 20em;
    }

table.erpg td.value, table.pac td.value {
    min-width: 6em;
    }

/**** CFATS table ****/

th.empty-th {
    border: none !important;
    }

th.cfats-release {
    text-align: center !important;
    }

th.cfats-theft {
    text-align: center !important;
    }

th.cfats-sabotage {
    text-align: center !important;
    }


/**** PSM table ****/

table.psm th {
    height: 2em;
    vertical-align: bottom;
    }



/* UNNA table styles below should be consolidated into this section. */

/* NFPA table (not diamond) */

table.nfpa td.diamond {
    vertical-align: top;
    }

table.nfpa td.hazard {
    vertical-align: bottom;
    }

table.nfpa td.value {
    vertical-align: bottom;
    text-align: center;
    }

table.nfpa td.description {
    vertical-align: bottom;
    }

/* NFPA diamond table 
   (not gridded but sometimes contained in a gridded table)
   NOTE: Must override incompatible styles inherited from table.gridded .
*/

table.nfpa-diamond
{
	background-image: url(/images/nfpa/nfpa.png);
	background-position: center;
	background-repeat: no-repeat;
	font-weight: bold;
	font-size: 16px;
	font-family: sans-serif;
    width: 75px;
    height: 75px;
    border-spacing: 0;
    border-collapse: collapse;
}

table.nfpa-diamond td {
    /* Override incompatible styles inherited from surrounding 
       table.gridded . Also styles common to all diamond cells.
    */

    padding: 0;
    border: none;
    width: 33%;
    height: 33%;
    }

table.nfpa-diamond td.nfpa-flam {
    text-align: center;
    vertical-align: bottom;
    }

table.nfpa-diamond td.nfpa-health {
    text-align: right;
    vertical-align: middle;
    }

table.nfpa-diamond td.nfpa-react {
    text-align: left;
    vertical-align: middle;
    }

table.nfpa-diamond td.nfpa-special-1 {
    text-align: center;
    vertical-align: top;
    }

table.nfpa-diamond td.nfpa-special-2 {
    text-align: center;
    vertical-align: top;
    }

table.nfpa-diamond td.nfpa-special-3 {
    text-align: right;
    vertical-align: bottom;
    }


/******************************************
/ Styles specifically for Chemical datasheets
******************************************/

/* table with multiple fields displayed */
table.horizontal-fields
{
	width: 98%;
	margin-bottom: 1em;
	/*this may work, but I don't care that much -- margin-left: -1px;*/
	border: 0px;
}

table.horizontal-fields th
{
	text-align: left;
}

table.horizontal-fields td
{
	vertical-align: top;
	padding: 0 0 1em 0;
}



/******************************************
/ Styles specifically for UNNA datasheets
******************************************/

table.erg_info
{
	width: 98%;
	margin-top: 0.5em;
	margin-bottom: 1em;
}

div.erg_guide
{
	border: 2px solid #E3701A;
	padding: 0.5em;
}

div.erg_greenpages
{
	border: 2px solid #009900;
	margin-bottom: 1em;
	padding: 0.5em;
}

div.erg_names
{
	border: 2px solid #3B6AA0;
	padding: 0.5em;
}

/* Indenting li elements courtesy of CSS Cookbook (O'Reilly) p.107 */
div.erg_names ul
{
	padding: 0;
	margin: 0;
	list-style: none;
}

div.erg_names li
{
	text-indent: -1em;
	margin: 0.33em 0.5em 0.33em 2em;
}

table.erg_distances
{
	width: 98%;
	border: 1px solid #B4B4B4;
	margin-top: 1em;
}

table.erg_distances thead th
{
	font-weight: normal; 
	text-align: center;
}

table.cfr49
{
	width: 98%;
	border: 1px solid #B4B4B4;
}

table.cfr49 thead th
{
	border-right: 1px solid #B4B4B4;
	padding-left: 1em;
	padding-right: 1em;
	text-align: left;
}

table.cfr49 tfoot td
{
	font-size: 10pt;
}

table.cfr49 tbody td
{
	padding-left: 1em;
}

/******************************************
/ Styles specifically for Reactivity
******************************************/

div.pairwise
{
	margin-top: 1.5em;
	margin-bottom: 1em;
}