/***********************************
*        Ashburn Chemical          *
* Internet Marketing and Design by *
*            TopSpot IMS           *
*   	www.topspotims.com         *
***********************************/


/***************** Genreal Redeclarations *******************/

html, body {
text-align:center;
background:#1b549a url(images/bkgrd.gif) repeat-x;
padding:0;
margin:0;
font:"Century Gothic" Arial, Helvetica, sans serif;
}

form {
color: #000;
margin-left:15px;
font:.9em "Century Gothic" Arial, Helvetica, sans serif;
}

input, textarea { /* Global field attributes */
border: solid 1px #222;
margin-bottom: .3em;
color: #000;
font: normal .85em "Century Gothic", Arial, Verdana, sans-serif;
padding:2px;
}

input {
width: 200px;
}

textarea {
width: 400px;
}

fieldset {
margin: 0 10px 10px 0;
padding: 10px;
width: 75%;
}

legend {
color: #000;
}

/**************** Div Declarations ****************/

#wrapper {
width:785px;
border-right:1px solid #222;
border-left:1px solid #222;
background:#FFF;
margin:0 auto;
}

/**************** Header ********************/

#banner {
width:785px;
background:url(images/banner.jpg) no-repeat;
height:300px;
text-align:left;
position:relative;
margin:0;

}

#banner h1 {
margin:0;
}

.logo {
width:262px;
height:64px;
text-indent:-9999px;
}

.logo a {
background:url(images/logo.gif) no-repeat;
border:none;
width:262px;
height:64px;
position:absolute;
left: 50px;
top:14px;
float:left;
}

.floatRight {
float:right;
padding-left:4px;
}

/**************** Navigation ******************/

#nav {
background:url(images/nav_bkgrd.gif) repeat-x;
height:34px;
font:.9em "Century Gothic" Arial, Helvetica, sans-serif;
margin:0;

}

#nav ul {
list-style:none;
margin:0;
padding:0;
}

#nav a {
display:block;
text-decoration:none;
color:#222;
}

#nav a:hover {
color:#9e0f0f;
}

#nav li { /* all list items */
float:left;
margin:9px 0px 0 40px;
}

#nav li.last {
margin-right:0;
}

#nav li ul { /* second-level lists */
position: absolute;
background:#fefa29;
width: 10em;
left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

#nav li ul li {
font:.88em "Centruy Gothic" Arial, Helvetica, sans-serif;
width:10em;
margin:0;
text-align:left;
padding:6px;
border-right:5px solid #f4e32b;
border-left:5px solid #f4e32b;
border-bottom:3px solid #f4e32b;
}

#nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
left:auto;
}

/**************** Content Area *******************/

#mainBody {
text-align:left;
width:785px;
font:.95em "Century Gothic" Arial, Helvetica, sans-serif;
margin:0;
padding: 0;
}

#mainBody h1, h2, h3 {
color:#9e0f0f;
padding-left:10px;
margin-top:20px;
}

#mainBody h1 {
font:1.5em Georgia, "Times New Roman", Times, serif;
}

#mainBody h2 {
font:1.2em Georgia, "Times New Roman", Times, serif;
margin-bottom:-8px;
}

#mainBody h3 {
font:1em Georgia, "Times New Roman", Times, serif;
margin-bottom:-8px;
}

#mainBody h1 a {
color:#9e0f0f;
border-bottom:1px dotted #9e0f0f;
text-decoration:none;
}

#mainBody h1 a:hover {
color:#0066CC;
border-bottom:1px dotted #0066CC;
text-decoration:none;
}

#mainBody h2 a {
color:#9e0f0f;
border-bottom:1px dotted #9e0f0f;
text-decoration:none;
}

#mainBody h2 a:hover {
color:#0066CC;
border-bottom:1px dotted #0066CC;
text-decoration:none;
}

#mainBody p {
font-size:.9em;
color:#222;
margin-left:10px;
margin-right:12px;
line-height:1.8em;
}

#mainBody ul {
margin-left:10px;
}

#mainBody li {
margin-left:10px;
font:.9em "Century Gothic" Arial, Helvetica, sans-serif;
color:#222;
margin-bottom:.8em;
}

#mainBody img {
margin-left:10px;
}

/*************** Buckets **************/
.buckets {
width:230px;
border:1px solid #222;
padding:0 0 10px 0;
line-height:normal !important;
float:left;
clear:right;
}

.bucketTitle a {
font: bold .95em "Century Gothic" Arial, Helvetica, sans-serif;
color:#9e0f0f;
border-top:8px solid #CCC;
display:block;
width:225px;
padding:5px 0 0 5px;
}

.listDescriptions {
font:.83em "Century Gothic" Arial, Helvetica, sans-serif;
font-weight: normal;
padding:5px 2px 0 5px;
display:block;
}

a.arrow {
text-decoration:none;
display:block;
background:url(images/triangle_white.gif) right center no-repeat;
color:#222;
float:left;
padding:0 10px 0 0;
}

a.arrow:hover {
text-decoration:none;
color:#9e0f0f;
}

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

.imgLeft {
float:left;
padding:0 12px 10px 10px;
}

a, a:hover {
color: #0066CC;
}

a {
text-decoration:none;
}

a:hover {
text-decoration:underline;
}

a.pdf {
text-decoration:none;
background:url(images/pdf_icon.gif) 145px center no-repeat;
border:1px solid #E0E0E0;
margin:0 0 0 10px;
padding:15px 15px 10px 13px;
display:block;
width:155px;
color:#0066CC;
text-decoration:none;
}

a.pdf:hover {
background: #FFFF99 url(images/pdf_icon.gif) 145px center no-repeat;
text-decoration:none;
color:#5A4833;
}

p.download {
float:left;
margin:0 10px 10px 0;
}

.clear {
clear:both;
}

h1.msdsTitle {
font:1.2em Georgia, "Times New Roman", Times, serif;
color:#9e0f0f;
display:block;
width:550px;
padding-bottom:4px;
border-bottom:1px dashed #9e0f0f;
}


#fluidTech {
width:270px;
height:120px;
text-align:center;
float:right;
margin-right:65px;
margin-top:25px;
border: 1px solid #393939;
padding:4px;
background:#d7d7d7;
}

#fluidTech p {
font:1.2em "Times New Roman", Times, serif;
color:#9e0f0f;
padding:0 auto;
margin:0 auto;
}

ul.msdsJump {
font-size:.88em;
margin:0 auto;
list-style:none;
}



/***************** Product Guide ***************/

.productTS {
margin:30px 0 10px 10px;
font:.9em "Century Gothic" Arial, Helvetica, sans-serif;
}

#solubleOils, #semiSyn, #synthetics, #specialtyCoolants { /********** Container **********/
background:#E0E0E0;
height:150px;
width:565px;
padding:10px 0 0 10px;
}

#solubleOils li, #semiSyn li, #synthetics li, #specialtyCoolants li {
float:left;
list-style:none;
margin:0 8px 0 0;
text-align:center;
padding:0;
}

#solubleOils li a, #semiSyn li a, #synthetics li a, #specialtyCoolants li a {
border:1px solid #999;
display:block;
font:bold .9em Arial, Helvetica, sans-serif;
height:120px;
width:101px;
line-height:.9em;
text-decoration:none;
width:110px;
padding:10px;
}

#solubleOils li a:hover, #semiSyn li a:hover, #synthetics li a:hover, #specialtyCoolants li a:hover {
color:#FFF;
}

/*********** Soluble Oils *******************/

.apex9500 { background:#FFF url(images/apex9500.gif) no-repeat center 30px;}
.apex9500:hover { background:#1c559b url(images/apex9500.gif) no-repeat center 30px;}

.apex9700 { background:#FFF url(images/apex9700.gif) no-repeat center 30px;}
.apex9700:hover { background:#1c559b url(images/apex9700.gif) no-repeat center 30px;}

.apex9000 { background:#FFF url(images/apex9000.gif) no-repeat center 30px;}
.apex9000:hover { background:#1c559b url(images/apex9000.gif) no-repeat center 30px;}

.ashburn10000 {background:#FFF;}
.ashburn10000:hover {background:#1c559b;}

.apex7700 {background:#FFF url(images/apex7700.gif) no-repeat center 30px;}
.apex7700:hover {background:#1C559B url(images/apex7700.gif) no-repeat center 30px;}

.apex7000 {background:#FFF url(images/apex7000.gif) no-repeat center 30px;}
.apex7000:hover {background:#1C559B url(images/apex7000.gif) no-repeat center 30px;}

.apex3500 {background:#FFF url(images/apex3500.gif) no-repeat center 30px;}
.apex3500:hover {background:#1C559B url(images/apex3500.gif) no-repeat center 30px;}

/***************** Footer *********************/

#footer {
text-align:center;
background:#4a81c5;
width:785;
clear:left;
padding-bottom:2px;
}

#footer p {
font:.7em "Century Gothic" Arial, Helvetica, sans-serif;
color:#FFF;
padding:8px 0 0 0;
}

#footer a, #footer a:hover {
color:#fff;
text-decoration:none;
}