﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.tbje.com/
   TEMPLATE NAME:  The Beef Jerky Emporium
   DATE:           Jan-05th-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: url(/images/bg.gif) repeat;
}


div .hr {
height: 14px;
background: url('/images/hr.gif') no-repeat;
border: none;
border: 0px;
}


div .newshr {
height: 14px;
margin-bottom: 12px;
margin-top: 6px;
background: url('/images/hr.gif') no-repeat;
border: none;
border: 0px;
}

.clear { clear: both; }

/* ----------CART--------------------- */
font, table, tr, td { border: none; background-color: transparent;}
table, td, tr { border: none; font: 11px Georgia, serif;;color: #996533; }
td { line-height: 20px; }
table b { color: #7f1725; }
table a, tr a, td a, font a, .content table a {color: #6b3806; font: 11px Georgia, serif; }
table a:hover, tr a:hover, td a:hover, font a:hover, .content table a:hover {color: #996533;}
table hr {border: none; border-bottom: 1px solid #996533; height: 0px;}
font img { border: 6px solid #e0d0b2; margin-right: 10px; } 

/* ----------Centered Container Or the Layout--------------------- */
#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -1em; /* make sure this matches in the body footer DIV */
width: 960px;
background: url(/images/pagebg.png) repeat-y;
} 

/* --------------LABELS BUTTONS & FORMS-----------*/

.contactholder { padding-left: 10px; }

label {
color: #6c3907;
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
text-transform: uppercase;
letter-spacing: normal;
}
 
#name, #email {
width:30em;
border: none;
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
color: #6c3a08;      
padding: 8px;
margin-bottom: 20px;
margin-top: 5px;
background: url(/images/searchholderbg.gif) repeat-x;
}

textarea {
width:30em;
height: 160px;
margin-top: 5px;
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
background: url(/images/textareabg.gif) no-repeat;
border: none;
margin-bottom: 8px;
color: #6c3a08;      
padding: 8px;
line-height: 22px;
overflow: auto
}
 
.button {
width: 8em;
border: none;
font-family: Georgia, serif;
font-size: 11px;
text-transform: uppercase;
font-style: normal;
font-weight: bold;
color: #6c3a08;      
padding: 12px;
background: url(/images/searchholderbg.gif) no-repeat top;
}

/* --------------HEADER------------- */
#header {
background: url(/images/header_bg.png) no-repeat top center;
height: 166px;
width: 960px;
margin: 0 auto
}

#header .right {
float: right;
width: 358px;
text-align: right;
margin: 55px 30px 0px 0px;
}

#header h4 {
color: #6b3806;
font-family: Georgia, serif;
font-size: 16px;
font-style: normal;
font-weight: bold;
text-transform: uppercase;
letter-spacing: normal;
padding-bottom: 6px
}

#header p {
color: #6b3806;
font-family: Georgia, serif;
font-size: 14px;
font-style: normal;
font-weight: normal;
text-transform: normal;
letter-spacing: normal;
}


#header .right .search {
background: url(/images/searchholderbg.gif) no-repeat top;
height: 49px;
width: 358px;
margin-top: 10px;
padding-top: 10px;
}


/* --------------SEARCH------------- */
#header .search .holder { padding-left: 16px; background: url(/images/search.gif) no-repeat;}
#header .search .tag { float: left; margin-left: -10px; }
#header .search .cartsearch { height: 26px; font-family: Georgia, serif; font-size: 11px; padding: 4px 4px 4px 6px; color:#e0d0b2; background: url(/images/searchfieldbg.gif) no-repeat; border: none; width: 202px;}


/* --------------LOGO IN HEADER *always use this*------------- */
.logolink, #swap { width: 133px; height: 93px;}
.logolink { background-image: url('/images/logo.gif'); background-repeat: no-repeat; margin: 60px 0px 0px 30px; float: left}
.logolink a { float: left;  }
 
#swap { background-image: url(/images/logo.gif); }
 
.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 */


/* --------------HOLDER------------- */
#holder { background: url(/images/pagebg.png) repeat-y; }


/* --------------TOPNAV------------- */
#topnav, #topnav .bar { height: 47px;}
#topnav .bar { margin: 0 auto; background: url(/images/topnavbg.gif) repeat-x; width: 940px; padding: 18px 0px 0px 0px;}
#topnav .bar a { float: left; margin-right: 35px; margin-left: 16px;  }

#swap01 {background-image: url(/images/nav_home.gif);  width: 48px;  height: 12px; }
#swap02 { background-image: url(/images/nav_news.gif); width: 105px;  height: 12px; }
#swap03 { background-image: url(/images/nav_chart.gif); width: 168px;  height: 12px; }
#swap04 { background-image: url(/images/nav_contact.gif); width: 99px;  height: 12px; }

#topnav .bar .rollover { display: inline;  } /* Allow setting widths and heights */
#topnav .bar .rollover img { height: 100%; border: 0;  } /* only set width and height once */
#topnav .bar .rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
#topnav .bar .rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/
#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
width: 918px;
margin: 0 auto;
margin-top: 20px;

}

#main .content {
padding: 0px;
margin-left: 220px;
margin-right: 0px;
min-height: 170px; /* Height of Background Img */
height: auto;
}

#main h1 {
color: #6c3907;
font-family: Georgia, serif;
font-size: 24px;
font-style: normal;
font-weight: bold;
text-transform: uppercase;
letter-spacing: normal;
padding: 0px 0px 4px 10px;
}

#main h2 {
color: #6c3907;
font-family: Georgia, serif;
font-size: 18px;
font-style: normal;
font-weight: bold;
text-transform: uppercase;
letter-spacing: normal;
padding: 0px 0px 4px 10px;
}

#main b {
color: #6c3907;
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
text-transform: uppercase;
letter-spacing: normal;
}


#main .content p {
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
text-transform: normal;
letter-spacing: normal;
color: #840012;
padding: 0px 0px 25px 10px;
line-height: 22px
}

#main .content a { color: #6b3806; font: 11px Georgia, serif;}

#main .navleft { float:left;  width: 200px; margin: 0px;}

/* --------------MISSION------------- */

#mission {
background: url(/images/mission.jpg) no-repeat;
height: 316px;
width: 690px;
margin-bottom: 20px;
}

#mission .text {
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
text-transform: uppercase;
letter-spacing: normal;
color: #f6eed0;
width: 350px;
padding: 160px 0px 0px 60px;
line-height: 22px
}

/* --------------HEAD GRAPHICS------------- */
.ourpolicy { background: url(/images/head_ourpolicy.gif) no-repeat; height: 54px;}
.featured { background: url(/images/head_featured.gif) no-repeat; height: 54px;}

/* --------------FEATURED THREE BLOCKS----------------*/

#threeblocks {
padding: 11px 10px 0px 0px;
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
text-transform: normal;
letter-spacing: normal;
color: #840012;
line-height: 18px;
height: 168px;
}

#threeblocks .text { width: 190px; padding: 18px 0px 0px 18px}
#threeblocks .price { float: right; width: 110px; margin-top: 2px;  }
#threeblocks .price h1 { font-size: 22px; font-weight: bold; padding-bottom: 11px; }
#threeblocks .text .holder { width: 182px; margin-top: 10px;}
#threeblocks .text .holder img { float: left; border: none}
#threeblocks a { color: #6c3a08; text-decoration: none; font-weight: bold; text-transform: uppercase}
#threeblocks a:hover { text-decoration: none}
#threeblocks p { float: right; padding: 0px 10px 18px 18px; line-height: 20px;}

#threeblocks .block {
float: left;
width: 216px;
background: url(/images/featprod_bg.gif) no-repeat; 
margin-right: 13px;
padding: 0px;
clear:right;
height: 148px;
}

/* --------------LEFT NAV------------- */

#leftnav, #locations {
background: url(/images/leftnavbg.gif) repeat-y;
margin-bottom: 20px;
}

#leftnav .cathead {
background: url(/images/lefthead_cat.gif) no-repeat;
height: 36px;
}


.suckerdiv ul{
margin: 0;
padding: 6px;
list-style-type: none;
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
text-transform: normal;
letter-spacing: normal;
}
	
.suckerdiv ul li{
position: relative;
}
	
/*Sub level menu items */
.suckerdiv ul li ul{
position: absolute;
width: 180px; /*sub menu width*/
top: 0;
visibility: hidden;
background-color: #f4ecc7;
border: none;
padding: 0px;
border-top: 1px solid #840012;
border-left: 1px solid #840012;
border-right: 1px solid #840012;
font-weight: bold;
}


/* Sub level menu links style */
.suckerdiv ul li a {
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: #840012;
text-decoration: none;
padding: 8px 6px 8px 6px;
border-bottom: 1px solid #840012;
}


.suckerdiv ul li a:hover{text-decoration: underline}
	
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */


/* --------------CART----- */

#leftnav .cart { color: #000; text-transform: uppercase; padding: 10px; }
#leftnav .cart img { border: none; padding: 0px; margin: 0px;}
#leftnav .cart font  { color: #6b3806}

/* --------------LOCATIONS----- */

#locations .lochead {
background: url(/images/lefthead_loc.gif) no-repeat;
height: 36px;
}

#locations p {
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
text-transform: normal;
letter-spacing: normal;
line-height: 1.45em;
padding: 10px;
color: #840012;
}

/* --------------NEWS----------------------- */
#news { margin: 0px; padding: 0px;}
#news ul { margin-top: 10px; margin-bottom: 15px; margin-left: 10px}
#news ul li { display: block; padding-bottom: 10px; list-style-type: none}
#news ul li a { color: red; background: url(/images/iconarrow.gif) no-repeat center left; padding-left: 15px;}

.backtotop { padding-left: 10px; border: none}
.heading { margin-bottom: 10px; padding: 0px 0px 4px 10px;}

/* --------------NUTRITIONAL CHART----------------------- */
#nutritional, #nutritional table { width: 100%; margin: 0px; padding: 0px; border: none}
#nutritional td { text-align: center; padding: 0px; }
#nutritional tr { background: url('/images/tableline.gif') no-repeat bottom;}
#nutritional .listing { background-color: #ede5c2; }
#nutritional .top { padding: 0px; margin: 0px; background-color:#93171b; width: 33%; font-weight: bold; color: white }
#nutritional .brand { width: 22%; text-align: center; font-weight: bold; text-align: left}



/* --------------PRIVACY----------------- */

ul.privacy {
margin-left: 20px; padding:0px;
}

ul.privacy li {
background: url(/images/iconarrow.gif) no-repeat top left; padding-left: 15px;
list-style-type: none;
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
text-transform: normal;
letter-spacing: normal;
color: #840012;
line-height: 18px;
margin-bottom: 15px;
}




/* --------------FOOTER------------- */

#footer, .push { 
clear: both;
width: 960px;
height: 1em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
height: auto;
background: url(/images/pagebottom.png) no-repeat top center;
}

#footer .content { 
width: 960px; 
margin: 0 auto; 
position: relative; 
padding-top: 40px;
padding-bottom: 20px
}

/* --------------FOOTER LINKS------------- */

#footer ul { padding: 0px 10px 10px 0px;}
#footer .links ul { margin-top: 0px; padding-top: 0px;}

#footer .links li {
display: inline;
list-style-type: none;
}

#footer .links li a {
font-family: Georgia, serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
text-transform: normal;
letter-spacing: normal;
line-height: 1.45em;
padding: 0px 20px 0px 10px;
color: #f5e8ce;
text-decoration: none
}

#footer .links li a:hover { text-decoration: underline; }

#footer .seo a {
color: #d2c395;
text-decoration: none;
font-family: Georgia, serif;
font-size: 11px;
}

#footer .seo p {
color: #d2c395;
font-weight: normal;
text-decoration: none;
padding: 0px 10px 0px 10px;
font-family: Georgia, serif;
font-size: 11px;
}

#footer .seo a:hover { text-decoration: underline; }

/* --------ASC LINKS--------- */

#footer .asc ul { padding: 0px; padding: 0px;}
#footer .asc li { display: block; list-style-type: none;}
#footer .asc li a { color: #d2c395; text-decoration: none; padding: 0px 10px 0px 10px; font-family: Georgia, serif; font-size: 11px;}




/* ----- 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; }
