﻿/* ---------------------------------------------
Screen Stylesheet for http://www.FBCChem.com
Updated:	07/28/08
author:		Susan Nelson
website:	http://www.AuxanoCreative.com
-------------------------------------------------
>> ::COLORS::

>> ::TOC::
	Resets
	Defaults
	Typography
	Forms
	Tables
	Template 
	Links
	Menus
	Global Classes
	Content

------------------------------------------------- */

/* ---------- ::Resets:: --------------------- */
body, address, blockquote, dl, ol, ul, li, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre {
margin:0;
padding:0;
}
fieldset, table {
border:none;
}
/* ---------- ::Document Defaults:: ---------- */
html { 
font-size:100.01%; 
height: 101%;
}
body { 
margin:0 auto;
height:100%;
font:62.5%/1.8em Arial,Helvetica,sans-serif;
background-color:#9e9fb2;
color:#333;
}
/* ---------- ::Typography:: ----------------- */
blockquote, address, pre { /* adjust as needed */
margin:.5em 2em;
}
blockquote, p, li { /* adjust as needed */
padding:0;
}
h1, h2, h4, h5, h6, p { /* adjust as needed */
margin:1em 0;
}
h1 {
font-size:2em;
}
h2 {
font-size:1.6em;
color:#474093;
letter-spacing:1px;
}
h3 {
margin-bottom:.5em;
font-size:1.4em;
color:#474093;
}
h4 {
width:550px;
margin-bottom:.5em;
font-size:1.4em;
color:#474093;
border-bottom:1px solid #9e9fb2;
}
p, li {
font-size:1.2em;
}
ul {
padding-left:25px;
}
ol {
padding: 0 0 10px 25px;
}
ol li {
padding:0 0 5px 0;
}
ul.featured {
margin-left:25px;
font-size:1.2em;
}
.featured li {
padding:3px 0;
}
#sidebar-cat h3 {
margin:16px 0 0 0px;
}
#sidebar-cat ul {
list-style-type:none;
margin:10px 0 0 0px;
}
#sidebar-cat input {
width:100px;
margin:0;
}
/* ---------- ::Forms:: ---------------------- */
input, label {
vertical-align:middle;
}
label {
cursor:pointer;
}
input, select, textarea {
font-size:1.2em;
font-family:inherit;
font-size:inherit;
width:300px;
}
input, textarea {
padding:.2em;
}
textarea {
overflow:auto;
}
.contactform fieldset {
width:350px;
padding: 1em; 
background-color: #BBC6DA;
} 
.contactform fieldset legend {
font-size:1.2em;
font-weight: bold;
} 
.contactform div {
width: 100%;
padding: 0.1em 0;
margin-bottom:10px;
font-size:1.2em;
} 
.contactform div label {
display: block; width: 10em; 
} 
.contactform div.required {
color: #f00;
}
#fbsubmit2 {
width:100px;
}
/* TABLES
============================================== */
table.locations {
width:420px;
margin:0;
}
td.locations {
padding:40px;
}
td.address {
padding: 20px;
}
table.address {
width:300px;
}
/* ---------- ::Template:: ------------------- */
#searchform {
width:880px;
margin:0 auto;
padding:10px 0 0 0;
text-align:right;
}
#wrap {
position:relative;
width:890px;
margin:10px auto 0 auto;
padding:5px 0;
background:#fff;
overflow: hidden;
}
#contactbar {
width:880px;
height:3em;
margin:0 auto;
text-align:right;
background:#474093;
}
#est {
width:200px;
float:left;
margin:0 0 0 115px;
padding:5px 0;
color:#fff;
font-size:15px;
font-style:italic;
}
#phone {
width:300px;
float:right;
padding:5px 0;
margin:0 18px 0 0;
font-size:2em;
font-weight:bold;
color:#fff;
}
#navbar {
width:880px;
height:4em;
margin:0 auto;
background:#8080c0;
}
#logocontainer {
background:transparent url(images/fbc_logo_shadow.png) no-repeat scroll 0pt;
height:158px;
left:40px;
padding:4px 0 0 2px;
position:absolute;
text-align:center;
top:3px;
width:208px;
z-index:5;
}
* html #logocontainer {
behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
this.src = "transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
);
}
/*#logocontainer {
width:188px;
height:146px;
position:absolute;
top:5px;
left:40px;
padding:4px 0 0 2px;
background:#fff;
text-align:center;
}*/
#intro {
width:880px;
height:184px;
margin:0px auto 4px auto;
padding:0;
text-align:center;
background:#fff;
}
#intro img {
text-align:center;
padding:0;
border:0;
}
#navbar2 {
width:880px;
height:2.8em;
margin:0 auto;
padding:0;
background:#8080c0;
}
#content {
width:870px;
margin:0 auto;
padding-bottom:2em;
}
#content-lab {
width: 640px;
float:left;
margin:0 0 10px 10px;
}
#sidebar-cat {
width:200px;
float:right;
margin:0 10px 10px 0;
}
#sidebar-cat img {
margin:10px 0 0 35px;
}
#footer {
width:880px;
height:4em;
margin:0 auto;
background:#8080c0;
color:#fff;
clear:both;
}
#copyright {
width:400px;
float:left;
color:#474093;
letter-spacing:1px;
}
#copyright p {
padding:0 5px;
}
#footernav {
width:400px;
height:2.5em;
float:right;
padding-top:12px;
text-align:right;
}
#credits {
width:890px;
height:3.5em;
margin:0 auto;
text-align:center;
font-size:.9em;
letter-spacing:1px;
}
/* ---------- ::Links:: ---------------------- */
a {
color:#038337;
text-decoration:underline;
}
a:visited {
color:#038337;
text-decoration:underline;
}
a:active, a:focus, a:hover {
color:#038337;
text-decoration:none;
outline:none;
}
a img {
border:none;
}
/* --------- ::Credit Links:: ---------------*/
#credits a, #credits a:visited {
color:#BDC8D9;
text-decoration:none;
}
#credits a:focus, #credits a:hover, #credits a:active {
color:#fff;
text-decoration:none;
}
/* ----------  ::Menus:: ---------------------- */
/* ::Main Menu:: */
#mainnav {
width:700px;
height:3em;
float:right;
margin:0;
padding:7px 18px 0 0;
text-align:right;
}
#mainnav li {
display:inline;
padding:0 0 0 20px;
font-size:1.3em;
line-height:200%;
letter-spacing:1px;
text-transform:uppercase;
font-weight:bold;
color:#fff;
}
#mainnav li a {
color:#fff;
text-decoration:none;
}
#mainnav li a:active, #mainnav li a:focus, #mainnav li a:hover {
color:#fff;
text-decoration:none;
border-bottom:3px solid #fff;
}
dfn {
display:none;
}
/* ::Dropdown Menu:: */
#dropnav {
list-style-type:none;
color:#fff;
margin:0 0 0 80px;
padding:0;
}
#dropnav li {
float:left;
padding:4px 30px 0 0;
font-size:12px;
font-weight:bold;
letter-spacing:2px;
color:#fff;
}
#dropnav li.hidden {display:none;}/*fix for weird CMSMS menu template problem*/
#dropnav li a {
display:block;
text-decoration:none;
font-size:12px;
font-weight:bold;
color:#fff;
}
#dropnav li a:focus, #dropnav li a:hover, #dropnav li a:active {
color:#24256a;
}

/*
#dropnav {
width:880px;
height:2.2em;
margin:0 auto;
padding-top:5px;
text-align:center;
}
#dropnav li {
display:inline;
padding:0 3px;
font-size:1.2em;
letter-spacing:2px;
font-weight:bold;
color:#fff;
}
#dropnav li a {
padding:0 10px;
color:#fff;
text-decoration:none;
}
#dropnav li a:focus, #dropnav li a:hover, #dropnav li a:active {
color:#474093;
text-decoration:none;
}*/
/* --- Child Menu --- */
	#dropnav li ul {
	position:absolute;
	top:-999em;
	left:-999em;
	}
	#dropnav li:hover ul, #dropnav li.hover ul {
	top:auto;
	left:auto;
	margin:0;
	padding:0;
	background:#565B9E;
	color:#fff;
	list-style-type:none;
	width:160px;
	}	
	#dropnav li:hover ul li, #dropnav li.hover ul li {
	text-transform:none;
	padding:5px 10px;
	font-size:12px;
	}
	#dropnav li:hover ul li a, #dropnav li.hover ul li a {
	font-size:12px;
	color:#fff;
	}
	#dropnav li:hover ul li a:focus, #dropnav li:hover ul li a:hover, #dropnav li:hover ul li a:active {
	color:#24256a;
	}

/* ::Footer Menu:: */
#bottomnav ul {
float:right;
color:#fff;
}
#bottomnav li {
display:inline;
padding:0 8px;
letter-spacing:1px;
color:#fff;
}
#bottomnav li a {
color:#474093;
text-decoration:none;
}
#bottomnav li a:active, #bottomnav li a:focus, #bottomnav li a:hover {
color:#fff;
text-decoration:none;
}
/* ---------- ::Global Classes:: ------------- */
.center {
text-align:center;
}
.clear {
clear:both;
padding:0;
margin:0;
line-height:normal;
}
.floatleft {
float:left;
margin:0 10px 10px 0;
}
.floatright {
float:right;
margin:0 90px 20px 0;
}
.floatimgright {
float:right;
margin:0 20px 20px 20px;
}
/*.right {
text-align:right;
}*/
.hidden {
display:none;
visibility:hidden;
}
.inline {
display:inline;
}
.small {
font-size:10px;
font-weight:normal;
}
.large {
font-size:1.4em;
}
.tagline {
font-style:italic;
font-weight:bold;
color:#038337;
font-size:1.6em;
}
/* ---------- ::Content/Pages:: -------------- */
/* HOME 
============================================ */
#homebottomleft {
width:285px;
height:20em;
float:left;
margin:0 10px 20px 0;
}
#homebottommiddle {
width:300px;
height:20em;
float:left;
margin:0 10px 20px 0;
padding:0 5px;
}
#homebottomleft img, #homebottommiddle img {
margin:0 auto;
text-align:center;
}
#homebottomright {
width:250px;
height:20em;
float:left;
margin:0 0 20px 0;
text-align:center;
}
#homebottomright img {
margin-top:10px;
}
/* ABOUT 
============================================ */
.pics { 
width:433px;
height:182px;
padding:0; 
margin:0; 
overflow: hidden 
}
.pics img { 
width: 400px; 
height: 150px; 
padding: 15px; 
border: 1px solid #ccc; 
background-color: #eee; 
top:0; 
left:0 
}
#s2 {
margin:0 auto;
}
.nav {
text-align:center;
}
/* CONTACT 
============================================ */
#contact-left {
width:360px;
float:left;
margin:0;
}
#contact-right {
width:490px;
float:right;
margin:5px 0 0 0;
}
#contact-right p {
padding:0;
margin:0;
}
/* FROM THE LAB 
=========================================== */
.NewsSummary {
font-size:1.2em;
}
.NewsSummaryPostdate {
margin:15px 0 10px 0;
font-size:1.2em;
font-weight:bold;
}
.NewsSummaryLink {
font-weight:bold;
margin-bottom:2em;
}
.NewsSummaryContent {
font-size:.9em;
}
#NewsPostDetailTitle {
margin-top: 10px;
}
#NewsPostDetailCategory, #NewsPostDetailAuthor, #NewsPostDetailSummary, #NewsPostDetailContent {
font-size:1.2em;
}
#NewsPostDetailCategory {
margin-top:15px;
}
#NewsPostDetailContent p {
font-size:1.1em;
}
#NewsPostDetailDate {
font-size:1.4em;
font-weight:bold;
}
#NewsPostDetailPrintLink, #NewsPostDetailReturnLink {
font-size:1.2em;
}
/* CHEMICAL PRODUCTS 
============================================ */
.product {
width:180px;
height:290px;
float:left;
margin:0 30px 20px 0;
text-align:center;
}
.product p {
font-size:1.4em;
text-align:center;
margin:0;
padding:0;
clear:both;
}
img { border:0; }
.product a { display:block; width:180px; line-height:0; }
.product a:link, .product a:visited { border: 3px solid #ccc; }
.product a:hover, .product a:active { border: 3px solid #8080c0; }

.nacd-logo {
display:inline;
width:175px;
height:138px;
float:right;
margin:60px 145px 0 0;
}
/* SUPPLIERS
============================================= */
.left {
display:inline;
width:200px;
float:left;
margin:0 0 0 70px;
}
.right {
width:200px;
float:left;
margin:0 0 0 60px;
}
.nacd-logo-supp {
display:inline;
width:175px;
height:138px;
float:right;
margin:20px 115px 0 0;
}
/* ASPHALT SECTION
============================================= */
#breadcrumbs {
width:100%;
height:15px;
margin-top:10px;
font-size:1.1em;
}
/* FEATURED PRODUCTS
============================================= */
.featured-product {
width:100%;
margin:0 auto;
overflow:hidden;
}
.featured-product-divider {
width:90%;
height:2px;
margin:10px auto 20px auto;
border-bottom:1px solid #9e9fb2;
clear:both;
}
/* CLOSEOUT DEALS
============================================= */
.closeouts-container {
width:580px;
margin:30px 0 0 210px;
}
.closeouts {
display:inline;
width:180px;
height:290px;
float:left;
margin:0 80px 20px 0;
text-align:center;
}
.closeouts p {
font-size:1.4em;
text-align:center;
margin:0;
padding:0;
clear:both;
}
img { border:0; }
.closeouts a { display:block; width:180px; line-height:0; }
.closeouts a:link, .closeouts a:visited { border: 3px solid #ccc; }
.closeouts a:hover, .closeouts a:active { border: 3px solid #8080c0; }
