﻿/* ----- Basic CSS ----- */

*{
    margin:0;
    padding:0;
    font-family:"Trebuchet MS",arial,sans-serif;
}
body, html{
    margin:0;
    padding:0;
    background:#ffffff;
    text-align:center;
    margin-bottom:10px;
}
a{
    color:#2B3076;
    text-decoration:none;
}
a:hover{
    color:#FFC10B;
    text-decoration:none;
}

input
{
    background-color: #FFF;
    color: #999999;
    border: 1px solid #CCC;
    font-size: 11px;
    padding: 3px;
    width:160px;              
}

button
{
    background-color:#EFEFEF;
    line-height:11px;
    color: #000;
    border: 1px solid #CCC;
    font-size: 11px;
    height:20px;
    margin: 0;
    padding: 0 5px;
}

img
{
    border:0;
}

img a
{
    border:0;
    text-decoration:none;
}

img a:hover
{
    border:none;
}

h1
{
    text-indent:-80000px;
    height:35px;
    width:168px;
}

h2
{
    font-size:25px;
    margin:15px 0 20px 0;
    font-weight:normal;
    color:#2B3076;
}

h3
{
    font-size:11px;
    font-weight:bold;
    color:#666;
    margin:5px 0;    
}

p
{
    font-size:11px;
    line-height:13px;
}





/* ----- IDS ----- */
#Outer
{
	background:url('/images/background.gif') repeat-y center 0px;
}

#OuterBottom
{
	background:url('/images/background_bottom.gif') no-repeat center top;
	height:70px;
}

#Wrapper
{
	width:1000px;
	margin:0 auto;
}

#ContentContainer
{
    margin:0 0 0 35px;
    text-align:left;
}


/* ----- HEADER ----- */

#Logo
{
    margin:17px 0 0 0;
    padding:0;
	width:500px;
	float:left;
}

.subContainer
{
	margin:0 0 0 35px;
	width:785px;
}

#ShareLinks
{
	margin:17px 0 0 0;
	float:right;
	width:130px;
	text-align:right;
}

.Icon
{
	cursor:pointer;
	display:block !important;
	height:16px !important;
	line-height:16px !important;
	margin:0 0 15px 10px;
	width:16px;
	float:left;
}

.IconTwitter {background:transparent url('/images/IconTwitter.png') no-repeat;}
.IconYoutube {background:transparent url('/images/IconYoutube.png') no-repeat;}
.IconFlickr {background:transparent url('/images/IconFlickr.png') no-repeat;}
.IconLinkedIn {background:transparent url('/images/IconLinkedIn.png') no-repeat;}
.IconFeed {background:transparent url('/images/IconFeed.png') no-repeat;}


#PageHeader
{
    text-align:left;
    margin:0;
    height:105px;
	background:url('/images/top_header.gif') repeat-x;
	padding-top:20px;
}



/* ----- NAVIGATION ----- */

#Navigation
{
    margin:0 0 0 35px;
    padding:0;
    height:25px;
    list-style:none;
	text-align:center;
	width:785px;
	border-bottom: 1px solid #747fbb;
}

#Navigation li
{
    float:left;
    clear:none;
    list-style:none;
}

#Navigation li a
{
    color:#2B3076;
    display:block;
    text-decoration:none;
    padding:4px 8px 1px 8px;
	margin:0 4px 0 0;
}

#Navigation li a:hover
{
	background:#ffdb00;
	font-style: italic;
}

#Navigation .Active a
{
    background:#ffdb00;
	font-style: italic;
}


/* ----- FOOTER ----- */

#PageFooter
{
    margin:0 auto;
    padding:25px 20px 0 20px;
    clear:both;
    width:960px;
    text-align:left;
    font-size:12px;
    color:#777778;
	background:url('/images/top_footer.gif') repeat-x;
}

#PageFooter ul
{
    list-style:none;    
}

#PageFooter li
{
    list-style:none;
    display:inline;    
}

#PageFooter #Copyright
{
    float:left;
    clear:none;
}

#PageFooter #BreadCrumbs
{
	font-weight:bold;
	float:right;
	clear:none;
}

#PageFooter a
{
    color:#777778;
    text-decoration:none;
}

#PageFooter a:hover
{
    color:#FFC10B;
}


/* ----- CONTENT ----- */

#PrimaryContent
{
    width:785px;
    padding:10px;
    font-size:11px;
    float:left;
    clear:none;
	padding:10px 0 0 0;
	background:#FFFFFF;
}

/*#PrimaryContent img
{
	float:right;
    clear:none;
    margin:10px;
    margin-right:0;
    padding:1px;
    border: 1px solid #E7E7E7;
    max-width:200px;
}*/

#SecondaryContent
{
    width:170px;
    font-size:11px;
    float:right;
    clear:none;
	padding:10px 0 0 0;
}

#SecondaryContent .Spencers
{
	text-align:center;
	padding:0 0 10px 0;
}

#SecondaryContent .Spencers a, #SecondaryContent .BookmarkLinks a { color:#888888; }
#SecondaryContent .Spencers a:hover, #SecondaryContent .BookmarkLinks a:hover { color:#FFC10B; text-decoration:none;}

#SecondaryContent .Spencers img
{
	width:125px;
	border:0 none;
	padding:0 0 5px 0;
}


#SecondaryContent .BookmarkLinks
{
	font-weight:600;
	padding:0 0 20px 30px;
}

#SecondaryContent .BookmarkLinks li
{
	list-style-type:none;
	background:none;
	padding:0;
	margin:0;
}

#SecondaryContent .GoogleAdwords
{
	padding:0 0 0 25px;
}


#SecondaryContent h2
{
    padding:11px 15px;
    color:#fff;
    margin-bottom:0;
    line-height:21px;
    font-size:13px;
    font-weight:normal;
}

#SecondaryContent h3
{
    color:#87b220;
    margin-top:20px;
}


/* ----- COMMENTS ----- 

#comments
{
    margin:15px 0;    
}
#comments #status{
    color:#546d17;
    background:#f8f8f8;
    border:2px solid #ececec;
    padding:10px;
    margin-bottom:15px;    
}
#comments #status dd, #comments #status dt{
    display:inline;
}
#comments a{
    color:#546d17;
    font-weight:bold;
    text-decoration:none; 
}
#comments a:hover{
    color:#666;
    text-decoration:underline; 
}
#comments .comment{
    padding:10px 5px;
    border-top:3px solid #7fa71f;  
}
#comments .comment dt{
    float:left;
    clear:none;
}
#comments .comment dd{
    clear:both;
    color:#656565;
    line-height:20px;
    font-size:10px;
    margin-bottom:10px;
}
#comments .comment .date{
    float:left;
    clear:none;
    margin-left:5px;
    line-height:12px;
    font-size:11px;
    color:#585858;
}
*/



/* ----- CLASSES ----- */

.clear{
    clear:both;
}

/* ----- BIERGEAR PAGE ----- */
#Shoutout
{
	text-align:center;
	padding:0 0 10px 0;
}

#Categories { height:40px; }
#Categories ul { margin:0; }
#Categories li { clear:none; float:right; list-style-image:none; list-style-position:outside; list-style-type:none; background:none; border:2px solid #2B3076; margin:0 5px 0 0; padding:0; }
#Categories li a.Current { color:#FFC10B; }
#Categories li a { display:block; padding:5px 10px; text-align:center; text-decoration:none; font-size:14px; }

#ProductContainer
{
	float:left;
}

#ProductContainer .Gear
{
	float:left;
	clear:none;
	width:248px;
	margin:8px 2px 8px 0;
	padding:4px 4px 0 4px;
}

#ProductContainer .Gear .Body { height: 230px; }
#ProductContainer .Gear .Order { height: 65px; }
#ProductContainer .Gear .Title
{
	font-weight:bold;
	font-size:13px;
}

#ProductContainer .Gear .Image img
{
	border:0 none;
	float:none;
	max-width:200px;
	max-height:165px;
	margin:0;
}

#ProductContainer .Gear .Row
{
	clear:left;
}

#ProductContainer .Gear label
{
	width:65px;
	float:left;
	font-weight:bold;
	text-align:right;
	padding:0 2px 0 0;
}

#ProductContainer .Gear .Value
{
	float:left;
	width:180px;
}

#ProductContainer .Gear .Order
{
	float:left;
}

#ProductContainer .Gear .Order input { border:0; padding:4px 0 0 0; width:auto; }



/* ----- HOME PAGE ----- */

#BierBuzz
{
	float:left;
	width:314px;
	background:#fff;
	margin:30px 0 20px 20px;
}

#BierBuzzLoading
{
	position:relative;
	z-index:999;
	left:150px;
	top:300px;
	height:40px;
	width:40px;
	background:#444444;
}

#BierBuzz .Header
{
	height:73px;
	background:url("/images/bierbuzz.gif") no-repeat;
}

#BierBuzz #BierBuzzArticles
{
	height:559px;
	border-left:1px solid #263895;
	border-bottom:1px solid #263895;
	border-right:1px solid #263895;
	overflow-x:hidden;
	overflow-y:scroll;
}

.BuzzPost
{
	margin:5px 0 10px 10px;
}

.BuzzPost .Title
{
	font-size:14px;
	font-weight:bold;
}

.BuzzPost .Title a { text-decoration:underline; }

.BuzzPost .BuzzDetails
{
	color:#999999;
	padding:3px 0 5px 0;
}

.BuzzPost .Excerpt
{
}

.BuzzPost .Comments
{
	padding:5px 0 0 0;
	font-weight:bold;
}

#FeaturedHeader
{
	color:#1f3192;
	background:url('/images/featured_header.gif') no-repeat;
	height:20px;
	padding:8px 0 0 15px;
	font-size:12px;
	font-weight:bold;
}

#FeaturedBierstick, #FeaturedProducts
{
	float:left;
	width:363px;
	background:#fff;
	margin:30px 0 0 40px;
}

#FeaturedBierstick .Content
{
	height:300px;
	border-left:1px solid #e4e2e2;
	border-bottom:1px solid #e4e2e2;
	border-right:1px solid #e4e2e2;
}

#FeaturedBierstick img
{
	max-width:none;
	border:0;
	margin:10px 15px;
}

#FeaturedBierstick p
{
	margin:0 15px;
}

#FeaturedBierstick p.Price
{
	text-align:right;
	font-weight:bold;
}

#FeaturedBierstick .OrderNow input
{
	float:right;
	width:120px;
	height:30px;
	margin:10px;
}

#FeaturedProducts .Content
{
	height:245px;
	border-left:1px solid #e4e2e2;
	border-bottom:1px solid #e4e2e2;
	border-right:1px solid #e4e2e2;
}

#FeaturedProducts .FeaturedProduct
{
	width:120px;
	height:245px;
	float:left;
}

.FeaturedProduct .FeaturedTitle
{
	margin:5px;
	height:30px;
	font-weight:bold;
}

.FeaturedProduct img
{
	margin:2px;
	width:110px;
	max-height:145px;
}

.FeaturedProduct .OrderNow input
{
	width:110px;
}

.FeaturedProduct .FeaturedImage
{
	height:145px;
}

.FeaturedProduct .Price
{
	font-weight:bold;
	text-align:right;
	margin:0 10px 5px 0;
}


/* ----- CART -----	*/

#progress
{
	position:absolute;
    height:100%;
    width:100%;
    top: 0px;
    left: 0px;
    background:#fff;
    filter:alpha(opacity=35);
    -moz-opacity:0.35;
    opacity:0.35;
    visibility:hidden;
}

#progress img 
{ 
	position:absolute; 
	top:35%; 
	left:35%; 
}

#cart
{
	margin-top: 50px;
	padding:0;
}

#cart table
{
	min-width: 200px;
	width: 100%;
	border-collapse:collapse;
	border-style: none;
}
#cart .header th { border: solid 1px #ffff; }
#cart td { border: solid 1px #fff; }

#cart .name { width: 70%; text-align:left; white-space:nowrap; }
#cart .name_header 
{ 
	font-weight:bold; 
	text-align:left;
	border-bottom: solid 1px black; 
	border-left: solid 1px #fff;
	border-right: solid 1px #fff;
}
#cart .space { width: 10%; }
#cart .update { width: 10%; white-space:nowrap; }

#cart .price { width: 10%; text-align:right; }
#cart .price_header 
{ 
	font-weight:bold; 
	border-bottom: solid 1px black; 
	border-left: solid 1px #fff;
	border-right: solid 1px #fff;
}
#cart .price_footer { font-weight:bolder; text-align: right; white-space:nowrap; }

#cart .empty { background-color: #ddd; width:100%; }

#cart .quantity
{
	width: 30px;
	text-align: right;
	white-space: nowrap;
	padding:1px 0 0 0;
}
#cart .quantity_header
{ 
	font-weight:bold; 
	border-bottom: solid 1px black; 
	border-left: solid 1px #fff;
	border-right: solid 1px #fff;
}

#cart a { font-weight: bolder; color: #2B3076; }
#cart .commands { white-space:nowrap; }
#cart .commands a { vertical-align:top;}

/* ----- DISCLAIMER ----- */
#Disclaimer
{
	padding:10px;
}

#Disclaimer p
{
	padding:5px;
}

#Disclaimer ol
{
	padding:10px 0 0 35px;
	list-style-type: upper-roman;
}
#Disclaimer h2 
{
	color: #FFC10B;
}

/* ----- CONTACT ----- */
#Contact
{
	padding:10px;
}

#Contact p
{
	padding:5px;
}

#Contact h2
{
	color: #FFC10B;
}

#Contact a
{
	font-weight: bolder;
	color: #2B3076;
}

#Contact a:hover
{
	font-weight:normal;
}

/* ----- INSTRUCTIONS ----- */
#Instructions {
	height:1100px;
	margin:0 150px;
}

#Instructions h2 {
	color:#FFC10B;
	margin-left:150px;
}

#Instructions .Container {
	float:left;
	height:200px;
	margin:10px 0 10px 0;
	text-align:center;
	width:435px;
}

#Instructions .Order {
	height:100px;
	margin-left:120px;
	margin-top:25px;
}

#Instructions .Text {
	color:#000000;
	float:left;
	height:200px;
	margin:36px 25px 0 0;
	padding:0;
	text-align:left;
	width:200px;
}

#Instructions .Pic {
	height:200px;
	margin:0 0 0 150px;
	padding:0;
	position:relative;
}

.ProductTitle
{
	margin:15px 0 20px 20px;
}
.ProductImage
{
	width:350px;
	height:400px;
	margin:20px 0 0 0;
	vertical-align:middle;
	float:left;
}
.ProductImage img
{
	max-height:400px;
	max-width:350px;
}
.Details
{ 
	margin:20px 0 0 20px;
	float:left;
	width:400px;
}
.Details .Description
{
	padding:0 0 10px 0;
}

.Details .Attributes
{
	float:left;
}
.Details .Row
{
	margin:3px 0 0 0;
}

.Details label
{
	width:150px;
	float:left;
	font-weight:bold;
	text-align:right;
	padding:0 5px 0 0;
}

.Details .Value
{
	float:left;
	width:230px;
	padding:0 0 5px 0;
}