﻿/*------------------------------------------
Goldenrod:	#F9CC60	(Menu - Hover BG)
Brick Red:	#AB3D02 (Menu - Hover FG)
Creamsicle:	#FFE9BD (Menu - Normal)
Teal: 		#0071BC (Links)
50% Gray:	#808080	(Gray Text on BG) 
Dark Gray: 	#131313 (Background)

Width:  960px
Col:    182px = 10px + 10px + 162px
Main:   778px = 20px + 20px + 738px
-----------------------------------------*/
body {
    background-color: #131313;
    font-size:.75em;
    font-family:Verdana, Helvetica, Sans-Serif;
    margin:0;
    padding:0;
    color:#000;
    }
form, span, input, label { float:left; display:block; } 
a:link {color:#3671a1;text-decoration: underline; outline:none;}
a:visited {color:#505abc;outline:none;}
a:hover { color:navy;outline:none;} /*background:#F9CC60;*/
a:active { outline:none;}
a img { border:0; } 
br { clear:both; } 
/*form { width:100%; }*/
ul {list-style:none; line-height:1.6em; } 
ul.normal  { list-style:square; } 
li {clear:left;}
p { margin:0; padding:8px 0 16px 0; line-height: 1.6em;}
p.summary { font-size:125%; border-bottom:1px dotted silver; } 
pre { font-family:Verdana, Arial, Helvitica; border-left:1px solid silver;  } 
/* HEADINGS   
-----------------------------------------*/
h1, h2, h3, h4, h5, h6 {font-size:1.5em;color:#000;font-family:Arial,Helvetica,sans-serif;margin:0; padding:0; clear:left;width:100%;}
h1 {font-size: 2em;padding:0;margin:0 0 10px 0; color:#AB3D02;}
h2 {padding:10px 0 0 0;  font-size:1.5em;}
h3 {font-size:1.2em;color:#AB3D02;}
h4 {font-size:1.1em;}
h5, h6 {font-size:1em;}
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2 {margin-top:0;}


/* PRIMARY LAYOUT ELEMENTS   
-----------------------------------------*/
.page {
    width:960px;
    margin-left:auto;
    margin-right:auto;
    }
#header {
    height:222px;
    width:960px;
    background:url('../content/images/top-bar.jpg') no-repeat;
    position:relative;
    margin:45px 0px 0px 0px;
    color:#000;
    padding:0;
    }
#header span {
    font-weight:bold;
    padding:5px 0;
    margin:10px 0px 0px 10px;
    color:#fff;
    border:none;
    line-height:2em;
    font-family:Arial, Helvetica, sans-serif;
    font-size:32px !important;
    width:150px;
    height:120px;
    display:block;
    }
    #header span a {text-indent:-5000px; width:140px; height:120px; float:left; }
#wrap {
    float:left;
    _height:1px; /*IE6*/
    width:960px;
    }
#wrap #col {
    width:182px;
    height:auto;
    _height:160px; /*IE6 - JW, not sure this works*/
    float:left;
    }

#wrap #main {
    float:left;
    width:738px;
    padding:0px 20px 0px 20px;
    background:url('../content/images/main-bottom.jpg') no-repeat 0 bottom #fff;
    }
    
    #wrap #main #main-content{min-height:290px; }
#footer {
    float:left; 
    padding-left:182px;    
    padding-bottom:30px;
    width:778px;
    color:#999;
    margin:10px auto 0px auto; 
    text-align:center;
    line-height:normal;   
    font-size:.9em;
    }   
    #footer a{color:#999;}
/* #wrap > #col a { color:#fff; } */
#wrap > div { display:block; float:left; } 
#colContent { 
    float:left;
    background:url('../content/images/sidebar-bk.jpg');
    padding:0px 10px 10px 10px;
    } 
    #col > #colContent { width:100%;} /*IE6 - CJM */
#col h3 { margin-top:10px; } 
#col a { border-bottom:1px solid #777; text-decoration:none; color:#EEE; } 
#col a:link { border-bottom:1px solid #777;  } 
#col a:visited { border-bottom:1px solid #777;   }
#col a:hover { color:#FFE9BD; border-bottom:1px solid #fff; background:none;} 
#col a:active { border-bottom:1px solid #777;  }  
#col hr { margin:10px 0 10px 0; }
    
#colfooter {background:url('../content/images/sidebar-bottom-orange.jpg') no-repeat 0 top #131313; height:10px;width:100%; float:left;}
#colmiddle{background:url('../content/images/sidebar-middle.jpg') no-repeat 0 top #AD3C00; width:100%; float:left; height:53px;}
    
/* Delivery
-----------------------------------------*/
 #delivery{
    _height:91px; /*IE6 - JW, not sure this works*/
    float:left;
     background:url('../content/images/delivery-middle.jpg') #000;
     text-align:center;
     width:100%; /*Fixes Chrome display bug*/
 }
 #delivery input[type="text"] { font-size:125%;font-weight:bold;margin:0 auto 0 auto; float:left;} 
 #delivery input[type="submit"] { margin:0 auto; float:none; display:inline; width:80px;} 
    #delivery label { color:White; font-size:110%;} 
    #delivery h2 {color:White; font-size:125%;  padding:0 0 15px 0;}
    #delivery #deliverygraph{
    width:160px;
    height:100px;
    }
#deliverycontent { margin:auto; width:80%; float:none; }
#deliverycontent p{padding:0; margin:0 auto 5px 0; float:left; width:100%;}
#deliverycontent button{float:none;}

#deliverycosts { width:95%; background-color:#FFE9BD; margin:10px 0 10px 0; padding:5px 10px 10px 10px; float:left; } 
#deliverycosts h2 { text-align:center; } 
#deliverycosts ul { width:600px;} 
#deliverycosts li { width:100px;float:left; display:block; clear:none; text-align:center;} 


#main .alert { width:90%; float:left; } 

/* Menu (Top Nav)
-----------------------------------------*/
#menucontainer {
    float:right;
    margin-right:20px;
    width:510px;
    margin-top:-5px;
    }
ul#menu {
    padding:0px 0px 0px 0px;
    position:relative;
    margin:0;
    text-align:left;
    }
ul#menu li {display:inline;list-style:none;}
ul#menu li#greeting {
    padding: 10px 20px;
    font-weight: bold;
    text-decoration: none;
    line-height: 2.8em;
    color: #fff;
    }
ul#menu li a {
    padding:10px 20px;
    font-weight:bold;
    text-decoration:none;
    line-height:2.8em;
    color:#F9CC60;
    }
ul#menu li a:hover {background-color:#F9CC60;color:#AB3D02;text-decoration:none;}
ul#menu li a:active {background-color:orange;text-decoration:none;}
ul#menu li.selected a {background-color:#fff;color:#000;}

/* Column
-----------------------------------------*/
#col h3 {margin:8px 0 4px 0;  } 
#col h3 a { color:#AB3D02;border-bottom:0px solid black;}
#col ul { list-style:none;margin:0 0 0 0;padding:0 0 0 0;  } 

/* Alternate Nav (Bottom)
-----------------------------------------*/
#altnavcontainer {font-size:.9em;margin-top:35px;float:left; text-align:center; width:100%; } 
ul#altnav {
    padding: 0px 0px 0px 0px;
    position:relative;
    margin: 0px 0 10px 0px;   /* Manual centering - Figure out if it can be done differently. -JW */
    }
ul#altnav li {
    display: inline;
    list-style: none;
    padding:0 5px 0 5px;
    border-left:1px solid #000;
    }
ul#altnav li:first-child {border-left:0;}

/* FORM LAYOUT ELEMENTS   
-----------------------------------------
fieldset {margin:1em 0;padding:1em;border:1px solid #CCC;}
fieldset p {margin:2px 12px 10px 10px; clear:left; padding:5px 0;}
fieldset label {display:block; width:115px; }
fieldset label.inline {display:inline; float:left; margin-right:5px; }
fieldset span{float:left;}
fieldset li{float:left; clear:left;}
legend {font-size: 1.1em;font-weight: 600;padding: 2px 4px 8px 4px;}
input {float:left; }
input[type="text"] {width:200px;border:1px solid #CCC; }
input[type="password"] {width:200px;border:1px solid #CCC; }
select { float:left; } */

/* FORM LAYOUT ELEMENTS   
-----------------------------------------*/
fieldset {margin:1em 0;padding:1em;border:1px solid #CCC; width:600px;}
fieldset p {margin:2px 12px 10px 10px; clear:left; padding:5px 0;}
fieldset label {display:block; width:auto; position:relative; }
fieldset label.inline {display:inline; float:left; margin-right:5px; }
fieldset label em { position: absolute; left: 22.2em; top: 2.1em; color: Silver; font-size: 85%; font-style:normal; font-weight:normal;  }
fieldset span{float:left; clear:left;}
fieldset li{float:left; clear:left;}
fieldset h3.indent{padding:20px 4px 0px 4px;}
td fieldset {width:auto;}
legend {font-size: 1.1em;font-weight: 600;padding: 2px 4px 8px 4px;}
input {float:left;   }
textarea{float:left; width:200px;}
input[type="checkbox"] {margin-top:2px;  }
fieldset input[type="text"] {width:200px;border:1px solid #CCC;  clear:left; }
input[type="password"] {width:200px;border:1px solid #CCC; clear:left; }
input[type="checkbox"].clear {margin-left:17px; clear:left; }
fieldset input[type="submit"] {}
select { float:left; margin-top:6px; } 
.tinynote { font-size:x-small;}

/* TABLE
-----------------------------------------*/
table {border:solid 1px #e8eef4;border-collapse:collapse;}
table td {padding:5px;border:solid 1px #e8eef4;}
table th {padding:6px 5px;text-align:left;background-color:#e8eef4;border:solid 1px #e8eef4;}
#orderTotals td{text-align:right;}

/* PRODUCT  
-----------------------------------------*/
.productList {clear:left; display:inline; padding:0;}
.productList .product { width:200px; display: inline-block; margin:10px 20px; text-align:center; min-height:325px; vertical-align:top; zoom: 1;
        *display: inline; _height: 325px } 
.productList .product-row {float:left;}
.price { color: #AB3D02; font-weight:bold; } 
.addToCart { margin-top:5px; }
.addToCart input[type="submit"] {float:none;}
.product a[href="#disclaimer"] {cursor:help; color:#AB3D02;} 

/* MISC  
-----------------------------------------*/
.clear {clear:both;}
.error {color:Red;}
.tip { background-color:#E0E0E0; font-size:75%; color:#808080; padding:3px 3px; margin-left:25px; clear:left; white-space:nowrap;}

div#title {display: block;float: left;text-align: left;}

#logindisplay {
    font-size: 1.1em;
    display: block;
    text-align: right;
    position: relative;
    top: -30px;
    color: White;
    margin-right: 25px;
    }
#logindisplay a:link {color:#fff;text-decoration:underline;}
#logindisplay a:visited {color:#fff;text-decoration:underline;}
#logindisplay a:hover {color:#fff;text-decoration: none;}
#loginForm { float:left; width:400px; } 
#register {float:left; clear:left;}
.resetLink {font-size:smaller; margin-left:5px;}
#reset{padding:5px;}
.cancel {float:right;}
.cancel a {color:Red;}
#privacyAlert  {
	width:185px;	
	float:right;
	margin:75px 0 0 10px;
	} 

.alert { color:#808080; background-color:#FFE9BD; padding:8px 8px 8px 8px; float:left; }
.alert .message { line-height:150%; font-size:90%; width:100%; clear:left;  } 
.alert .headline { font-weight:bold; font-size:110%;margin-bottom:5px; }

.field-validation-error {color:#ff0000; float:left; width:200px; padding-left:10px; clear:none;}
.input-validation-error {border:1px solid #ff0000;background-color:#ffeeee;}

.validation-summary-errors {font-weight:bold;color:#ff0000;}

div.blockMsg {
    background-color:#fff;
    border:1px solid #ddd;
    height:100px;
    width:270px;
    text-align:center;
    }
    
.progress {
    background-image:url('../content/images/progress-indicator.gif');
    background-position:center center;
    background-repeat:no-repeat;
    cursor:wait;
    }

div.blockMsg #content{}
.blur{color:Gray; font-style:italic}
.input {float:left; clear:left;}
.input .label {width:60px; text-align:right; display:block; float:left;}

#cartItems { width:98%; border:0px; clear:left; } 
#cartItems .productName { width:60%; } 
#cartItems .productName > a { font-weight:bold; font-size:120%; } 
#cartItems .addRemove { width:20%; font-size:75%; } 
#cartItems .qty { width:10%; } 
td.money { text-align:right; padding:5px 5px; } 
td.price {text-align:right; } 
#cartItems td { border-left:0px; border-right:0px;} 


#cartTotals { border:0px; width:98%; } 
#cartTotals td, #cartTotals tr, #cartTotals th { border:0px;  }
#cartTotals th { background:none; border-bottom:1px solid #E0E0E0; } 
#cartTotals td.money { border-bottom:1px solid #E0E0E0;} 

.deliveryList li {float:left;}
.action {float:left; clear:left;}

.options {float:left;}
.options form {clear:left; margin-bottom:10px;}
.options p { padding:0; }
.options .ccpayment {border:1px solid orange; float:left; padding:10px 10px 10px 45px; margin-bottom:50px; background:url(../content/images/lock.png) no-repeat; background-position:10px 13px;}
.options .ccpayment p { padding-bottom:8px; }
.options .AuthorizeNetSeal {float:right; padding-left:16px;}

#locationSummary { display:block; width:568px; float:left; padding:4px 4px 4px 165px; background:url('../content/images/pellets-in-hand.jpg') 5px 15px no-repeat #FFECB6; } 
#locationSummary h2 { color:#AB3D02; padding-top:0px;font-size:120%; } 
#locationSummary .location {float:left; width:200px; margin-top:10px; margin-right:20px;} 
#locationSummary h2 a { color:#AB3D02; } 
#pickupSummary {clear:left; text-align:center; width:100%;} 
h2.highlight { color:#AB3D02;  }

#orderstable .notes td {border-top:#e8eef4 2px dotted; }
#orderstable .notes td:first-child{text-align:right;}

#echeck {float:left; margin-top:10px;}
.ccfee{ font-size:120%;}
a[href='#fees'] { text-decoration:none; cursor:help;}

/* Order History
-----------------------------------------*/
#history { list-style:none;  padding:0 0 0 0; margin:0 0 0 0; float:left; width:500px;}  /*history=ol*/
#history li { padding:10px 10px 10px 10px; float:left; clear:left; width:100%; }
#history li.historyitem:first-child {border: 3px solid green;}

/* Delivery
-----------------------------------------*/
.delivery {float:left; clear:left; width:100%;}
.delivery .text{width:65%; display:block; float:left;}
.delivery .image {width:20%; display:block; float:right; padding-right:50px;}

/* Contact Form 
-----------------------------------------*/
#looking-for-delivery-rates{font-size:140%;}
#looking-for-delivery-rates p {line-height:normal; padding:8px 0 0 6px; float:left;}
#looking-for-delivery-rates img{float:left;}
.contact, .contact span, .contact input, .contact textarea, .contact label, .contact form { display:block;  } 
.contact ol, .contact li {float:left;}
.contact {margin-bottom:10px; width:500px; } 
.contact { float:left; } 
.contact .field .recipient { font-weight:bold; font-size:150%; border:1px solid silver; width:480px;color:Silver; } 
.contact .field { width:480px; padding:10px 10px 10px 10px; } 
.contact .field .field-validation-error { width:90%; display:block;  } 
.contact .field textarea { width:480px; height:150px; font-family:Verdana, Arial, Helvetica; } 
.contact .field input { width:480px; font-size:150%; } 
.contact .field input[type=submit] { font-size:120%; height:30px; width:auto;} 
.contact .field label { width:100%; font-weight:bold;  padding-right:10px; font-size:120%; } 

/* Contact Info (Phone, Address, etc...)
------------------------------------------*/
#contactInfo  {
	float:right;
	width:185px;
	margin:0px 8px 0px 20px;
}


/* Overrides for various jquery ui elements
------------------------------------------*/
.ui-widget li {clear:none;}
.ui-widget span{float:none; display:inline;}

#managetags .editor {width:95%; margin-bottom:20px; float:left; clear:left;}

.photo { float:right; } 
.map { border-bottom:1px dotted silver; padding-bottom:10px; } 

.create { margin:15px 0 15px 0; padding:10px 10px 10px 10px; background-color:#F9CC60; border:1px dotted silver; float:left; width:95%; }
.editor select { margin:0 5px 0 5px; } 
.editor input[type="submit"] { margin-top:-2px; } 
form label { padding-top:2px; } 
.ui-tabs-hide {
     display: none;
}

/* Product Info (Details)
----------------------------------------------*/
#productDetails {clear:left; float:left; margin:10px 0;}
#productDetails .prod-info { float:left; width:400px; } 
#productDetails .price {float:left; text-align:left; width:100%; font-size:125%; } 
#productDetails .tags { margin-top:15px; } 
#productDetails .tags label { font-weight:bold; padding-right:5px; } 
#productDetails .prod-img { float:left; width:200px; }
.brand { padding:0;} 
.productTitle { margin:0;}
.addToCart button{clear:left;}
.productList .prod-info form { width:100%; float:left;}
.addToCart {float:left; width:100%;text-align:center; }
.addToCart label {float:none; display:inline;}
.addToCart label .tons {font-size:125%;float:none; display:inline; margin:3px 0 0 3px;}
/* Product Info (Summary)
----------------------------------------------*/
.prod-info .alert { font-size:125%; font-weight:bold; display:block; float:left; text-transform:uppercase;} 
.prod-info .prod-description { width:100%; float:left; margin:15px 0 15px 0; } 
.prod-info .price { width:100%; text-align:center;} 

.prod-img { float:left; width:100%; text-align:center; } 
.prod-img img { margin:0 auto 0 auto; }

#productimage {float:left;clear:left;}
#productimage .alert{color:Red; font-weight:bold;}
.fileUploadProgress {clear:both;}

#loginForm { width:500px; } 
#loginForm h3 { padding-top:10px; } 

#chimney { list-style-type:circle;}

.address-form .field { margin:8px 0 8px 0; } 
.address-form label { width:125px; float:left; clear:none; text-align:right;padding-right:15px;} 
.address-form input[type="text"] { clear:none; } 
.address-form textarea { clear:none; } 
.address-form .tip { width:100%; background:none; margin:0 0 0 0;} 

.delivery-details-form .field { margin:8px 0 8px 0; } 
.delivery-details-form label { float:left; clear:none; text-align:right;padding-right:15px;} 
.delivery-details-form input[type="text"] { clear:none; } 
.delivery-details-form textarea { clear:left; width:350px; } 
.delivery-details-form .tip { width:100%; background:none; margin:0 0 0 0;} 

/* ---------->>> jtip <<<---------------------------------------------------------------*/

#JT_arrow_left{
	background-image: url(../../Content/images/arrow_left.gif);
	background-repeat: no-repeat;
	background-position: left top;
	position: absolute;
	z-index:101;
	left:-12px;
	height:23px;
	width:10px;
    top:-3px;
}

#JT_arrow_right{
	background-image: url(../../Content/images/arrow_right.gif);
	background-repeat: no-repeat;
	background-position: left top;
	position: absolute;
	z-index:101;
	height:23px;
	width:11px;
    top:-2px;
}

#JT {
	position: absolute;
	z-index:100;
	border: 2px solid #CCCCCC;
	background-color: #fff;
}

#JT_copy{
	padding:10px 10px 10px 10px;
	color:#333333;
}

.JT_loader{
	background-image: url(../../Content/images/loader.gif);
	background-repeat: no-repeat;
	background-position: center center;
	width:100%;
	height:12px;
}

#JT_close_left{
	background-color: #CCCCCC;
	text-align: left;
	padding-left: 8px;
	padding-bottom: 5px;
	padding-top: 2px;
	font-weight:bold;
}

#JT_close_right{
	background-color: #CCCCCC;
	text-align: left;
	padding-left: 8px;
	padding-bottom: 5px;
	padding-top: 2px;
	font-weight:bold;
}

#JT_copy p{
margin:3px 0;
font-size:70%;
}

#JT_copy img{
	padding: 1px;
	border: 1px solid #CCCCCC;
}

.jTip{
cursor:help;

}
