/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.b-b-qshop.com/
   TEMPLATE NAME:  B-B-Q Shop
   DATE:           Jul-17th-2008
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #5c5d5f url('images/bg.gif') repeat-x;
} 

a:focus {outline-style: none;} /* REMOVES DOTTED BORDER IN FF */

/* ----------Centered Container Or the Layout--------------------- */

#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 796px;
} 

font, table, tr, td {
font-family: 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
}

table, td, tr {
border: none;
}

table b {
color: #5c5d5f;

}

table a {
color: #ef1e31
}

table hr {
border: none;
border-bottom: 1px solid #b5b5b5;
height: 0px;
}

/* --------------LABELS BUTTONS & FORMS-----------*/
 
label {
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #ef1e31;
}
 
.form, #name, #name0, textarea {
width: 20em;
border: 1px solid #96989b;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
padding: 4px;
margin-bottom: 20px;
}

 
#login, #main .leftside input {
width: 10em;
border: 1px solid #96989b;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
padding: 4px;
margin-bottom: 10px;
}


#main .leftside font  { font-weight: bold; color: #ef1e31; }
#main .leftside table {
	margin-left: 6px;
}
#main .leftside td { text-align: left;}



.loginbutton {
width: 4em;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #fff;      
background: url(/images/buttonbg.gif) repeat-x;
padding: 3px 4px;
border: none;
text-transform: uppercase;
text-align: center;
cursor: pointer
}


 
.contactbutton {
width: 8em;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #fff;      
background: url(/images/buttonbg.gif) repeat-x;
padding: 3px 4px;
border: none;
text-transform: uppercase; 
cursor: pointer
}

/* --------------HEADER------------- */

#header {
height: 72px;
background: url('images/headerbg.gif') repeat-x;
}

#header ul {
margin: 0px;
padding: 0px;
font: 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
}

#header li {
display: inline;
}

#header li a {
color: white;
border-right: 1px solid #fff;
text-transform:uppercase;
padding-right: 10px;
padding-left: 10px;
}



/* --------------TOPNAV------------------------------------------------------------- */


.suckertreemenu {
width: 796px;
height: 43px;
padding-top: 30px;
}

.suckertreemenu ul{
margin: 0;
padding-left: 0px;
padding-top: 8px;
list-style-type: none;
letter-spacing: 0px;
}

/*Top level list items*/
.suckertreemenu ul li{
position: relative;
display: inline;
float: left;
}

/*Top level menu link items style*/
.suckertreemenu ul li a{
display: inline;
padding: 3px 14px;
font: 8pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
color: #FFF;
text-decoration: none;
}

.suckertreemenu ul li a:hover {
color: #DF0000;
text-decoration: underline
}

	
/*1st sub level menu*/
.suckertreemenu ul li ul{
left: 0.8em;
position: absolute;
top: 0em; /* no need to change, as true value set by script */
display: block;
visibility: hidden;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.suckertreemenu ul li ul li{
display: list-item;
float: none;
}

/*All subsequent sub menu levels offset after 1st level sub menu */
.suckertreemenu ul li ul li ul{ 
left: 159px; /* no need to change, as true value set by script */
top: 0;
}

/* Sub level menu links style */
.suckertreemenu ul li ul li a {
display: block;
margin: 0px;
text-align: left;
font: 8pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
text-transform:uppercase;
width: 120px; /*width of sub menu levels*/
color: #FFF;
text-decoration: none;
padding: 4px;
border-right: 1px solid #757273;
border-left: 1px solid #757273;
border-top: 1px solid #757273;
background: url(/images/dropdown_bg.gif) repeat-x;
}

.suckertreemenu ul li a:hover {
color: #e8e1d1;
}

.suckertreemenu ul li ul li a:hover{
background: url(/images/dropdown_bg.gif) repeat-x;
border-right: 1px solid #757273;
border-left: 1px solid #757273;
text-decoration:underline
}

* html p#iepara{ /*For a paragraph (if any) that immediately follows suckertree menu, add 1em top spacing between the two in IE*/
padding-top: 1em;
}
	
/* Holly Hack for IE \*/
* html .suckertreemenu ul li { float: left; height: 1%; }
* html .suckertreemenu ul li a { height: 1%; }
/* End */




/* --------------LOGO IN HEADER *always use this*------------------------------------------ */

.logolink {
background-image: url('/images/logo.gif');
background-repeat: no-repeat;
height: 134px;
width: 254px;
float:left
}
 
.logolink a { float: left;  }
 
#swap {background-image: url(/images/logo.gif);  width: 254px;  height: 134px;  }
 
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */

/* --------------TOPNAV------------- */

#top {
height: 134px;
}

#top .cart {
float: right;
width: 180px;
text-align:right;
margin-top: 6px;
}

#top .cart a {
color: #000;
font: 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
text-transform:uppercase;
text-decoration: none
}

#top td {
text-align: right;
font: 8pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
text-transform:uppercase
}

#top font {
color: #000;
}


/* --------------MISSION AREA--------------------------- */

#mission {
height: 230px;
background: url(/images/mission_bg.gif) repeat-x;
padding: 6px;
}

img {
border: none;
padding-bottom: 2px;
}

#mission .rtr {
float: left;
background: url(/images/rtrgraphic.jpg) no-repeat;
height: 216px;
width: 486px;
border: 1px solid #e89336;
}

#mission .buttons {
float: right;
width: 280px;
height: 200px;
}



/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 700px;
height: auto !important; 
height: 100%; 
background-color: #FFF; /* Main DIV Background Img */
margin-top: 10px;
padding: 6px;
}

#main a {
font: bold 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
color: #ef1e31
}

#main .content {
padding: 0px 4px 20px 15px;
margin-left: 257px;
margin-right: 0px;
min-height: 0px; /* Height of Background Img */
height: auto;
}

#main p, #model li {
font: 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
color: #5c5d5f;
line-height: 19px;
}

#main h1 {
font: bold 16pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
text-transform: uppercase;
color: #ef1e31;
letter-spacing: -1px;
margin-top: 8px;
margin-bottom: 8px;
}

#main .states {
background: url(/images/states.gif) no-repeat;
height: 246px;
height: 305px;
}

.button {
cursor: pointer
}


/* --------------LEFTSIDE------------- */

#main .leftside {
float:left; 
width: 257px;
margin: 0px;
padding: 0px;
background: none;
}

#main .leftside ul {
padding: 0px 0px 12px 12px;
margin: 0px;
font: 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
color: #5c5d5f;
list-style-type: none
}

#main .leftside li {
display: block;
background: url(/images/icon_pdf.gif) no-repeat left top; /*custom bullet list image*/
list-style-type: none;
line-height: 21px;
padding-left: 25px; /*link text is indented 19px*/
}

#main .leftside li a {
font: 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
text-decoration: underline
}

#main .leftside .brochure, #main .leftside .contact {
margin: 0px;
padding: 0px;
font: 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
}

#main .leftside .brochure h4 {
background: url('/images/header_brochure.gif') no-repeat;
height: 65px;
width: 257px;
}

#main .leftside .login h4 {
background: url('/images/header_login.gif') no-repeat;
height: 65px;
width: 257px;
}


#main .leftside .contact h4 {
background: url('/images/header_contactus.gif') no-repeat;
height: 65px;
width: 257px;
}

#main .leftside .brochure .inside, #main .leftside .contact .inside, #main .leftside .login .inside {
background: url('/images/leftside_bg.gif') repeat-y;
}

#main .leftside p {
padding: 12px;
color: #5c5d5f;
}

#main .leftside .login p {
padding: 6px 12px 3px 12px;
}

#main .leftside strong, strong {
font: bold 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
color: #ef1e31
}

#main .leftside .brochure .bottom, #main .leftside .contact .bottom, #main .leftside .login .bottom  {
background: url('/images/leftside_bottom.gif') no-repeat;
height: 8px;
}

#main .leftside .vendors {
margin: 0px;
padding: 0px;
}

#main .leftside .vendors h2 {
background: url('/images/vendors_head.gif') no-repeat;
height: 56px;
}

#main .leftside .vendors .logos {
background: url('/images/vendors_logos.gif') no-repeat;
height: 106px;
}

#main .leftside input {

}


/* --------------FEATURED----------------*/

#featured {
padding: 0px;
margin-top: 10px;
text-transform:uppercase
}

#featured .head {
background: url('/images/featuredhead.gif') no-repeat;
height: 89px;
}

#featured b {
float: left;
padding:30px 0px 0px 8px;
width: 60px;
font: bold 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
color:white;
letter-spacing: 0px;
}

#featured h1 {
padding:21px 0px 0px 8px;
float: right;
width: 420px;
text-align: left;
font: bold 14pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
color:white;
letter-spacing: -0.8px;
}

#featuredtext {
padding: 0px;
margin: 0px;
background: #fff url(/images/featuredbg.gif) repeat-x;
height: 300px;
margin-left: 7px;
}

#featuredtext img {
float: left;
margin-left: 8px;
}

#featuredtext p {
float:right;
width: 380px;
}



/* --------------NEWSAUCES KEEEEPPPPPP------------- */


.newsauce{
width: 510px;
background: #fff url(/images/productsbg.gif) repeat-x;
margin-bottom: 20px;
}

.newsauce .imagefloat {
float: left;
width: 86px;
background: url(/images/splashflag.gif) no-repeat;
margin: 6px;
}

.newsauce img {
padding: 4px;
margin: 12px;
border: 1px solid #a3a3a3;
background-color: #FFF;
}

.newsauce h3 {
padding: 12px 0px 0px 124px;
color: #ef1e31;
font: bold 14pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
text-transform:uppercase;
letter-spacing: -0.8px;
margin-bottom: 8px;
}


* html .newsauce p{ /* IE 3px jog hack*/
height: 1%;
}

.newsauce p{
padding: 6px 10px 6px 6px;
margin-top: 0;
margin-left: 120px;
}

.newsauce a {
background: url(/images/bullet_arrow.gif) no-repeat center left; /*custom bullet list image*/
padding-left: 17px; /*link text is indented 19px*/
}



/* --------------MODELS------------- */

.model {
float: right;
margin: 0px;
}

#model ul {
margin: 0px 0px 20px 0px;
padding: 0px;
font: 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
color: #5c5d5f;
list-style-type: none
}

#model li {
display: block;
background: url(/images/bullet_arrow.gif) no-repeat left top; /*custom bullet list image*/
list-style-type: none;
padding-left: 19px; /*link text is indented 19px*/
}



/* --------------PELLET TABLE------------- */

#pellets {
font: 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
}

#pellets td {
padding: 4px;
}

#pellets .head {
font-weight: bold;
color: #FFF;
background-color:#ef1e31;
padding: 4px;
text-align:center
}

#pellets .greyrow {
background-color: #eaeaea;
}

#pellets .x {
text-align: center;
}


/* --------------FOOTER------------- */

.clear {
clear: both;
}

#footer, .push { 
clear: both;
width: 796px;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background-color: #231f20;
height: 100px;
height: auto;
}

#footer .content { 
width: 796px; 
margin: 0 auto; 
position: relative; 
}

/* --------------FOOTER LINKS------------- */

#footer ul {
padding: 10px;
}

#footer .links ul {
margin: 0px;
padding: 0px;
}

#footer .links li {
display: inline;
list-style-type: none;
}

#footer .links li a {
color: #d6d6d6;
text-decoration: none;
border-right: 1px solid;
padding: 0px 10px 0px 10px;
font: 8pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
}

#footer .links li a:hover {
text-decoration: underline;
}

#footer .asc ul {
margin: 0px;
padding: 0px;
}

#footer .asc li {
display: block;
list-style-type: none;
}

#footer .asc li a {
color: #d6d6d6;
text-decoration: none;
padding: 0px 10px 0px 10px;
font: 8pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
}

#footer .links li a:hover {
text-decoration: underline;
}

#seo     	 { font-family: 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif; text-decoration: none; color: #d6d6d6; font-size: 8pt; }

a.seo:link {  font-family: 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif; text-decoration: none; color: #d6d6d6; font-size: 8pt;}
a.seo:visited  { font-family: 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif; text-decoration: none; color: #d6d6d6; font-size: 8pt; }
a.seo:hover { font-family: 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif; text-decoration: underline; color: #d6d6d6; font-size: 8pt;}

a.seo2:link {  font-family: 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif; text-decoration: none !important; color: #5C5D5F !important; font-size: 10pt;}
a.seo2:visited  { font-family: 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif; text-decoration: none; color: #5C5D5F; font-size: 10pt; }
a.seo2:hover { font-family: 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif; text-decoration: none; color: #5C5D5F; font-size: 10pt;}

/* ----- Customer Cart TABLES ---------- */
#awscustomertables table{margin: 1em; border-collapse: collapse;}
#awscustomertables td{ padding: .3em; border: 1px #F2F2F2 solid; }
#awscustomertables th{ padding: .3em; border: 1px #F2F2F2 solid; background: #F2F2F2; }