/* -----------------------------------------------------------------------
 Graphel Carbon Products Main Stylesheet

   * This document includes the front end css code for Graphel Carbon Products.
	 * Do not edit css documents in the blueprint folder.
	 * Written by Jason Taylor at Signal US Communications.
----------------------------------------------------------------------- */

/* main elements */
body { background: #83817d; font-family: Arial, Helvetica, sans-serif; }
* a:focus, *:focus { outline: none; }
ul { margin: 0; }
.container { width: 100% !important; margin: 0 !important; padding: 0; }
.siteSpace { width: 1000px; margin-right: auto !important; margin-left: auto !important; }

/* Header */
#header { height: 110px; background: url('../img/header_bg.png') 0 0 no-repeat; margin-top: 10px; }
#mainLogo { float: left; width: 240px; height: 110px; }
#mainLogo img { margin: 18px 0 0 14px; }
#promoSpace { float: right; width: 760px; height: 110px; text-align: center; }
#promoSpace .promo { display: block; margin: 18px 0 0 0; }

/* content space */
#contentSpace { background: #fff; }
.outerBorder { border: 2px solid #373535; }

/* left col */
#contentLeftCol { float: left; width: 238px; min-height: 200px; background: #f8f8f8 url('../img/content_left_col_bg.gif') 0 0 repeat-y; }
#leftColTop { padding: 5px 0 0 10px; }
.leftColBox { min-height: 100px; margin: 15px 0 0 0; }
.leftColQuote { text-align: center; color: #3a3a3a; font-size: 12px; font-weight: bold; font-style: italic; line-height: 16px; margin: 15px 10px 10px 10px; }
.quoteMark { color: #53514f; font-size: 15px; padding: 0 2px; }

/* main navigation (in left col) */
#mainNav { background: url('../img/main_nav_bg.png') 0 0 repeat-y; border-top: 1px dotted #d0cfcf; border-bottom: 1px solid #e2e2e2; margin: 20px 0 0 0;  }
#mainNav #nav_list { list-style-type: none; border-bottom: 1px dotted #c7c7c6; }
#mainNav #nav_list li { line-height: 30px; font-size: 16px; text-transform: uppercase; }
#mainNav a { color: #000; text-decoration: none; }
#mainNav a:hover { color: #004a80; }

#homeNav a { float: left; width: 238px; height: 30px; background: url('../img/main_nav_home.png') 0 0 no-repeat; }
#homeNav a:hover { float: left; background-position: -238px 0; }
#homeNav a:active { float: left; background-position: -476px 0; }
#aboutNav a { float: left; width: 238px; height: 30px; background: url('../img/main_nav_about.png') 0 0 no-repeat; }
#aboutNav a:hover { float: left; background-position: -238px 0; }
#aboutNav a:active { float: left; background-position: -476px 0; }
#productsNav a { float: left; width: 238px; height: 30px; background: url('../img/main_nav_products.png') 0 0 no-repeat; }
#productsNav a:hover { float: left; background-position: -238px 0; }
#productsNav a:active { float: left; background-position: -476px 0; }
#materialsNav a { float: left; width: 238px; height: 30px; background: url('../img/main_nav_materials.png') 0 0 no-repeat; }
#materialsNav a:hover { float: left; background-position: -238px 0; }
#materialsNav a:active { float: left; background-position: -476px 0; }
#documentNav a { float: left; width: 238px; height: 30px; background: url('../img/main_nav_document.png') 0 0 no-repeat; }
#documentNav a:hover { float: left; background-position: -238px 0; }
#documentNav a:active { float: left; background-position: -476px 0; }
#contactNav a { float: left; width: 238px; height: 30px; background: url('../img/main_nav_contact.png') 0 0 no-repeat; }
#contactNav a:hover { float: left; background-position: -238px 0; }
#contactNav a:active { float: left; background-position: -476px 0; }
/* sets nav based on page */
#home #homeNav a { float: left; background-position: -714px 0 !important; }
#about #aboutNav a { float: left; background-position: -714px 0 !important; }	
#products #productsNav a { float: left; background-position: -714px 0 !important; }	
#materials #materialsNav a { float: left; background-position: -714px 0 !important; }	
#document #documentNav a { float: left; background-position: -714px 0 !important; }	
#contact #contactNav a { float: left; background-position: -714px 0 !important; }

/* right col */
#contentRightCol { float: right; width: 758px; }
.mainContent { color: #333; font-size: 12px; line-height: 16px; padding: 20px 20px 20px 20px; }
.mainContent a { text-decoration: none; }
.mainContent a:link, .mainContent a:visited { color: #000; border-bottom: 1px solid #999; }
.mainContent a:hover, .mainContent a:active { color: #0072bc; border-bottom: 1px solid #004a80; }
.mainContent ul { color: #212121; font-size: 120%; margin: 0 30px 1.5em 30px; }
.mainContent ul li { list-style-image: url('../img/list_bullet.png'); list-style-type: none; margin: 5px 0; }
.mainContent ol { color: #212121; font-size: 120%; margin: 0 30px 1.5em 30px; }
.mainContent ol li { list-style-type: decimal; margin: 5px 0; }
.contentImg { float: right; margin: 0 0 10px 10px; }
.contentBox { float: right; width: 396px; min-height: 100px; margin: 10px 0 10px 20px; }
.contentBoxHeader { height: 36px; }
.contentBoxBody { background: #f2f2f2; padding: 20px; border-width: 1px 1px 1px 1px; border-style: solid; border-color: #333 #666 #666 #666;  }

/* sub navigation (in right col) */
#subNav { height: 26px; background: #338ec9 url('../img/sub_nav_bg.gif') 0 0 repeat-x;  }
#subNav #subNav_list { list-style-type: none; }
#subNav #subNav_list li { display: inline; line-height: 24px; font-size: 14px; font-weight: bold; text-transform: uppercase; margin: 0 0 0 20px; }
#subNav a { color: #d8e2e7; text-decoration: none; background: url('../img/sub_nav_arrow.png') left center no-repeat; padding-left: 20px; }
#subNav a:hover { color: #fff; }
#subNav a.snOn { color: #fff; background: url('../img/sub_nav_arrow_on.png') left center no-repeat; }
#logout { float: right; font-size: 12px; font-weight: bold; margin: 4px 20px 0 0; }
#logout a { color: #363636; }
#logout a:hover { color: #0072bc; }

/* footer */
#footer { clear: both; height: 22px; background: #262425 url('../img/footer_bg.gif') 0 50% repeat-x; border: 2px solid #373535; }
#footerLeft { float: left; width: 238px; line-height: 22px; }
#footerRight { float: right; width: 758px; line-height: 22px; }
ul.bottomNav { list-style-type: none; text-align: center; }
ul.bottomNav li { display: inline; color: #666; font-size: 12px; }
ul.bottomNav a { padding: 0 2px; }
ul.bottomNav a:link, ul.bottomNav a:visited { color: #bbb; text-decoration: none; }
ul.bottomNav a:hover, ul.bottomNav a:active { color: #fff; text-decoration: underline; }
/* sets nav based on page */
#home #homeSub a, #about #aboutSub a, #products #productsSub a, #materials #materialsSub a, #document #documentSub a, #contact #contactSub a  
{ color: #fff; font-weight: bold; }

/* sub footer */
#subFooter { color: #ddd; font-size: 11px; padding-top: 8px; }
#subFooterLeft { float: left; }
#subFooterRight { float: right; }
#subFooter a { text-decoration: none; }
#subFooter a:link, #subFooter a:visited { color: #ccc; }
#subFooter a:hover, #subFooter a:active { color: #fff; }

/* text */
h1 { text-align: left; color: #222; font-size: 20px; font-weight: bold; font-family: inherit; }
h1.underlines { background: url('../img/h_underlines.png') 0 22px repeat-x; margin-bottom: 0 !important; padding-bottom: 1.5em; }
h2 { text-align: left; color: #222; font-size: 18px; font-weight: bold; font-family: inherit; }
h2.underlines { background: url('../img/h_underlines.png') 0 22px repeat-x; margin-bottom: 0 !important; padding-bottom: 1em; }
h3 { text-align: left; color: inherit; font-size: 15px; font-weight: bold; font-family: inherit; }
h4 { text-align: left; color: inherit; font-size: 13px; font-weight: bold; font-family: inherit; }
.alt { font-family: Warnock Pro, Goudy Old Style, Palatino , Book Antiqua , Georgia, serif; font-style: italic; font-weight: normal; }
.noteText { color: #555; font-size: 90%; font-style: italic; background: url('../img/icons/note.png') 5px 0 no-repeat; margin: 4px 0 0 0; padding: 1px 0 2px 25px !important; }
.centuryFont { font-size: inherit; font-family: Century Gothic, Arial, Helvetica, sans-serif; }
.georgiaFont { font-size: inherit; font-family: Georgia, Times New Roman, Times, serif; }

/* misc */
.hidden {	visibility: hidden; }
.visable { visibility: visible; }
.clear { clear: both; }
a.noBorder { border: none !important; }
.imgBorder { background: #f2f2f2; padding: 4px; border: 1px solid #cdcccc; }
.opacity90 { opacity: .90; filter: alpha(opacity=90);	-moz-opacity: 0.90; }

/* form elements */
input[type=button], input[type=submit] { width: auto; background: #3f83b4 url('../img/button_gradient_bg.gif') repeat-x; color: #e3e3e3; font-size: 120%; font-weight: bold; padding: 2px 8px 2px 8px; border: 1px solid #999; cursor: pointer; }
input[type=button]:hover, input[type=submit]:hover { color: #fff; border: 1px solid #666; }
input[type=text], input[type=password] { font-size: 100%; background: #f9f9f9; border: 1px solid #66aad7; padding: 2px 2px 2px 2px; }
input[type=text]:hover, input[type=password]:hover { background: #f2f8fc; border: 1px solid #0072bc; }
input[type=text]:focus, input[type=password]:focus { background: #f2f8fc; border: 2px solid #0072bc; margin: -1px; }
input[type=checkbox] { width: 14px; height: 14px; }
select { font-size: 100%; background: #f9f9f9; border: 1px solid #66aad7; padding: 1px 0 1px 0; }
select:hover { background: #f2f8fc; border: 1px solid #0072bc; }
select:focus { background: #f2f8fc; border: 2px solid #0072bc; margin: -1px; }
textarea { font-size: 100%; font-family: inherit; background: #f9f9f9; border: 1px solid #66aad7; padding: 2px 2px 2px 2px; }
textarea:hover { background: #f2f8fc; border: 1px solid #0072bc; }
textarea:focus { background: #f2f8fc; border: 2px solid #0072bc; margin: -1px; }
.noteLeft { float: left; font-weight: bold; }
.noteRight { float: right; font-weight: bold; }
.submitButton { padding-top: 15px; }

/* -----------------------------------------------------------------------
   * Section for specific page styles.
----------------------------------------------------------------------- */

/* HOME SECTION */
#productGrid { margin: 0 auto; }
#productGrid td { width: 220px; height: 70px; text-align: center; vertical-align: middle; padding: 7px; }
#productGrid a { text-decoration: none; }
#product-edmElectrodes a { float: left; width: 220px; height: 70px; background: url('../img/product_but_edm_elect.png') 0 0 no-repeat; }
#product-edmElectrodes a:hover { float: left; background-position: 0 -70px; }
#product-graphiteFixtures a { float: left; width: 220px; height: 70px; background: url('../img/product_but_graphite_fix.png') 0 0 no-repeat; }
#product-graphiteFixtures a:hover { float: left; background-position: 0 -70px; }
#product-fluids a { float: left; width: 220px; height: 70px; background: url('../img/product_but_fluids.png') 0 0 no-repeat; }
#product-fluids a:hover { float: left; background-position: 0 -70px; }
#product-edmServices a { float: left; width: 220px; height: 70px; background: url('../img/product_but_edm_serv.png') 0 0 no-repeat; }
#product-edmServices a:hover { float: left; background-position: 0 -70px; }
#product-furnaceTooling a { float: left; width: 220px; height: 70px; background: url('../img/product_but_furnace_tool.png') 0 0 no-repeat; }
#product-furnaceTooling a:hover { float: left; background-position: 0 -70px; }
#product-engineeredSolutions a { float: left; width: 220px; height: 70px; background: url('../img/product_but_engineered_solu.png') 0 0 no-repeat; }
#product-engineeredSolutions a:hover { float: left; background-position: 0 -70px; }
#product-edmSupplies a { float: left; width: 220px; height: 70px; background: url('../img/product_but_edm_sup.png') 0 0 no-repeat; }
#product-edmSupplies a:hover { float: left; background-position: 0 -70px; }
#product-tooling a { float: left; width: 220px; height: 70px; background: url('../img/product_but_tooling.png') 0 0 no-repeat; }
#product-tooling a:hover { float: left; background-position: 0 -70px; }
#product-gauging a { float: left; width: 220px; height: 70px; background: url('../img/product_but_gauging.png') 0 0 no-repeat; }
#product-gauging a:hover { float: left; background-position: 0 -70px; }
#product-graphiteBlanks a { float: left; width: 220px; height: 70px; background: url('../img/product_but_graphite_blanks.png') 0 0 no-repeat; }
#product-graphiteBlanks a:hover { float: left; background-position: 0 -70px; }
#product-machinery a { float: left; width: 220px; height: 70px; background: url('../img/product_but_machinery.png') 0 0 no-repeat; }
#product-machinery a:hover { float: left; background-position: 0 -70px; }
#product-dustCollection a { float: left; width: 220px; height: 70px; background: url('../img/product_but_dust_col.png') 0 0 no-repeat; }
#product-dustCollection a:hover { float: left; background-position: 0 -70px; }


/* ABOUT SECTION */
h3.newsHeading { color: #004a80; padding-bottom: 2px; border-bottom: 1px solid #99c7e4; }
ul#staffList li { list-style-image: url('../img/icons/vcard.png') !important; }
ul#staffList li a { font-weight: bold; }
ul#staffList li a:link, ul#staffList li a:visited { color: #004a80; }
ul#staffList li a:hover, ul#staffList li a:active { color: #0072bc; }
.newsDate { font-size: 13px; font-weight: bold; background: url('../img/icons/calendar.png') no-repeat left center; margin: -2px 0; padding: 2px 0 2px 20px; }

/* PRODUCTS SECTION */
.productImg { float: left; margin: 0 10px 10px 0; }

/* MATERIALS SECTION */

/* DOCUMENT RESOURCES SECTION */
.getReader { min-height: 32px; line-height: 32px; background: #f5f5f5; margin: 20px 0 0 0; padding: 5px 0; border-width: 2px 1px 1px 1px; border-style: solid; border-color: #99c6e4 #ededed #ededed #ededed; }
.getReader .readerButton { float: left; margin: 0 10px; }
.getReader .readerText { float: left; }

/* CONTACT US SECTION */
#contact .contentBlock { float: left; width: 375px; }
#contactForm { float: right; width: 330px; background: #f5f5f5; padding: 5px 0 5px 5px; border-width: 2px 1px 1px 1px; border-style: solid; border-color: #cdcccc #ededed #ededed #ededed; }
#contactForm input[type=text] { width: 180px; }

/* ADMIN */
#loginForm { font-size: 120%; padding: 20px 20px; border-top: 2px solid #cdcccc; }
#loginForm input[type=text], #loginForm input[type=password] { width: 300px; }
#loginForm .loginEmail { background: url('../img/icons/user.png') no-repeat left center; margin: -2px 0; padding: 2px 0 2px 22px; }
#loginForm .loginPass	{ background: url('../img/icons/password.png') no-repeat left center; margin: -2px 0; padding: 2px 0 2px 22px; }
#content_tbl { width: 480px !important; }
#adminMenu { width: 600px; margin: 0 auto; }
.iconBox { float: left; width: 120px; height: 120px; text-align: center; margin: 10px 10px; }
.iconBox a { display: block; width: 100%; height: 100%; border: 1px solid #b1cfe0; text-decoration: none !important; }
.iconBox a:link, .iconBox a:visited { color: #666; background: #ffffff url('../img/admin_icon_bg.png') 50% 50% no-repeat; border: 1px solid #99c7e4; }
.iconBox a:hover, .iconBox a:active { color: #000; background: #eaf7fe url('../img/admin_icon_bg.png') 50% 50% no-repeat; margin: -1px; border: 2px solid #66aad7; }
.iconBox img { margin: 15px 0 5px 0; }
.iconBox span { display: block; font-family: Trebuchet MS; font-weight: bold; }
.adminTable { width: 100%; }
.adminContentHeading { margin: 0 0 4px 0; }
.adminContentTable { background: #f5f5f5; margin-bottom: 15px; border-width: 0 1px 1px 1px; border-style: solid; border-color: #fff #ededed #ededed #ededed; }