/* CSS Document */

/* Put styles in here that will be used specifically in the main site */

/*
	######## Website Main Stylesheet
	John McGettrick

	COLOUR INDEX KEY
	------------------------------
	White = #FFFFFF
	Black = #000000
	Light Grey = #E6E3DF
	Brown = #564527
	Cream = #DFCEAF
	Light Cream = #ECE2CF
	Light Cream = #F5F0E7
	Red/Brown = #A62D06
*/

/* General Styles */

select {
	border: 1px solid #564527;
	background: #FFFFFF;
}

img.arrows {
	border:0;
}

/* Header */

#header {
	background:url(../images/header.gif) no-repeat;
	height:130px;
}

#headerImg {
	margin:8px 0px 0px 35px;
	float:left;
	border:0;
}

ul#headerMenu {
	 width: 430px;
	 text-align:right;
	 float:right;
	 margin:70px 0px 0px 0px;
}

ul#headerMenu li {
	display:inline;
}

/* Left Side */

#leftSide {
	float:left;
	padding:0px 0px 8px 29px;
	margin:0px 18px 0px 0px;
	width:167px;
}

#search {
	float:left;
	padding:14px 0px 10px 15px;
	margin:0px 0px 10px 0px;
}

.searchField {
	float:left;
}

.searchField input {
	background:#ECE2CF;
	width:115px;
	height:18px;
	color:#564527;
	border-width:1px;
	padding:0px;
	text-align:left;
}

.searchGo {
	padding-left:6px;
	float:left;
	height:20px;
	line-height:20px;
}

.searchGo a {
	text-decoration:none;
	font-weight:bold;
	font-size:13px;
}

/* NavMenu */

#navMenu {
	margin:0px 0px 0px;
	width:167px;
	background:url(../images/leftMenuFooter.gif) bottom no-repeat #DFCEAF;
	min-height:324px;
}

/* Top Level */

ul#menu {
	margin:0px 0px 0px 14px;
	padding:0px 0px 18px 0px;
	list-style:none;
}

ul#menu li {
	background:url(../images/bullet.gif) left no-repeat;
	padding:0px 0px 0px 10px;
	margin:12px 0px 12px 10px;
}

ul#menu li a {
	text-decoration:none;
}

ul#menu li a:hover {
	text-decoration:underline;
}

ol#topSellersList {
	padding-left: 1em;
	margin-left: 1em;
}

ol#topSellersList li{
	padding-bottom: 0.5em;
}

/* Sub Level */

ul#menu li.current {
	 background:#FFFFFF;
	 list-style:none;
	 padding: 0px 0px 0px 0px;
	 margin:3px 0px 3px 0px;
	 font-weight:bold;
}

ul#menu li.current a {
	margin:0px 0px 0px 10px;
	padding:0;
}

ul#menu li.current div.top {
	background:url(../images/subMenuTop.gif) top left no-repeat;
	padding-top:6px;
	line-height:1px;
}

ul#menu li.current div.bottom {
	background:url(../images/subMenuBottom.gif) bottom left no-repeat;
	line-height:1px;
	height:6px;
	max-height:6px;
	padding:0;
}

ul#menu li.current ul#subMenu {
	list-style:none;
	background:#FFFFFF;
	margin:0px;
	padding:0px 0px 0px 16px;
	font-size:0.95em;
}

ul#menu li.current ul#subMenu li {
	background:#FFFFFF;
	margin:7px 0px 7px 10px;
	padding:0px;
}

ul#menu li.current ul#subMenu li.subCurrent {
	background:url(../images/subCurrent.gif) left 4px no-repeat;
	margin-left:0px;
	padding-left:10px;
	color:#A62D06;
}

ul#menu li.current ul#subMenu li a {
	margin:0px;
}

ul#menu li.current ul#subMenu li.subCurrent a {
	color:#A62D06;
}

/* Third Level */

ul#menu li.current ul#subMenu li ul.subSubMenu, ul.subSubMenu {
	list-style:none;
	padding:0px 0px 0px 10px;
	margin:0px;
	font-size:0.9em;
	font-weight:normal;
}

ul.subSubMenu li {
	color:#A62D06;
}

ul#subMenu li.subCurrent a {
	color:#A62D06;
}

ul#menu li.current ul#subMenu li ul.subSubMenu li a, ul.subSubMenu li a {
	text-decoration:underline;
	color:#564527;
}

ul#menu li.current ul#subMenu li ul.subSubMenu li a:hover, ul.subSubMenu li a:hover {
	color:#A62D06;
}

/* Most Popular */

#homeTopSellersContainer {
	float:left;
	margin:16px 0px 0px;
	width:167px;
}

#homeTopSellers {
	background:url(../images/leftMostPopular.gif) top no-repeat #f5f0e7;
	padding:50px 0px 10px 12px;
	font-size:0.95em;
}

#homeTopSellers h1 {position:absolute;width:1px;padding-left:10px;overflow:hidden;}

#homeTopSellers p.title {
	padding:0px;
	margin:4px 0px 0px;
}

#homeTopSellers p.price {
	text-align:right;
	font-weight:bold;
	padding:0px 10px 0px 0px;
	margin:0px 0px 4px;
}

#homeTopSellersFooter {
	background:url(../images/leftMostPopularFooter.gif) bottom no-repeat;
	height:8px;
}

/* Middle Container */

#middleContainer {
	float:right;
	width:616px;
}

/* Home Page */

#homeWelcome {
	 float:left;
	 width:432px;
	 padding:0px 10px 0px 0px;
}

#homeWelcome h1 {margin:0;}
#homeWelcome h2 {
	font-size:150%;
	font-weight:normal;
	margin:0px 0px 10px;
}

#homeCaskBox {
	float:right;
	width:162px;
	padding-top:20px;
}

#featuredContainer {
	width:432px;
	float:left;
	min-width:0;
}

#featuredHeader {
	background:url(../images/featuredTop.gif) top no-repeat;
	height:9px;
	min-width:0;
}

#featuredBeers {
	 border-left:1px solid #BBB5A9;
	 border-right:1px solid #BBB5A9;
	 padding:0px 11px 2px 11px;
	 min-width:0;
}

.featuredBeerContainer {
	float:left;
	width:120px;
	margin:0px 8px;
	text-align:center;
	min-width:0;
}

.featuredLogo img {
	border:0;
}

.featName {
	margin-bottom:2px;
}

.featBrewer {
	font-size:0.95em;
	margin-bottom:2px;
}

.featBrewer a {
	text-decoration:none;
}

.featPrice {
	font-weight:bold;
}

#featuredFooter {
	background:url(../images/featuredBottom.gif) bottom no-repeat;
	height:8px;
	min-width:0;
}

/* News Section */

#newsArticle {
	width:442px;
	padding-right:12px;
	float:left;
}

img.articleImage {
	border:1px solid #564527;
}

#newsContainer {
	width:162px;
	float:right;
}

#newsListHeader {
	background:url(../images/latestNewsHeader.gif) top no-repeat;
	height:37px;
}

#newsList {
	 border-left:1px solid #BBB5A9;
	 border-right:1px solid #BBB5A9;
	 padding:10px 4px 2px 9px;
}

#newsList h1 {position:absolute;width:1px;padding-left:10px;overflow:hidden;}
#newsList h2.newsTitle {font-weight:normal;font-size:1em;margin:0 0 8px 0;}

p.rightLink {
	text-align:right;
	font-weight:bold;
}

#newsListFooter {
	background:url(../images/latestNewsFooter.gif) bottom no-repeat;
	height:10px;
}

/* Paypal Logo Container on Home page */

#paypalLogo {
	width:162px;
	float:right;
	text-align:center;
	padding:10px 0px 0px;
}

#paypalLogo p {
	margin:0 0 4px;
	padding:0;
}

/* Beers Page */

.beerThumb {
	width: 100px;
	height: 100px;
	text-align:center;
	float:left;
}

.smlColourIcon {
	margin:36px 0px 0px 62px;
	border:0;
}

.beerShortInfo {
	 width: 304px;
	 padding-left:6px;
	 float:left;
}

.beerShortInfo .infoTitle {
	 background-color:#E6E3DF;
	 height:40px;
	 line-height:40px;
	 padding-left:6px;
	 font-weight:bold;
}

.beerShortInfo .infoTitle h2 {margin:0;padding:0;font-size:1.2em;}

.beerShortInfo .infoText {
	margin-top:4px;
	padding:0px 6px;
	color:#888888;
	font-size:0.9em;

}

.beerShortInfo .infoText p {margin:0;padding:0;line-height:1.6em;}

.beerBuyNow {
	width: 182px;
	height: 100px;
	padding-left:24px;
	float:left;
	background:url(../images/smlGreyOnCreamArrow.gif) top left no-repeat #F5F0E7;
}

.basketBuyNow {
	margin-top:14px;
	font-size:1.2em;
	font-weight:bold;
}

.beersTotalPrice {
	float:left;
	font-weight:bold;
	margin-top:12px;
	font-size:0.95em;
}

.beersTotalPrice span {
	font-weight:normal;
}

.beersAdd {
	float:right;
	margin:12px 0px 0px;
	padding-right:8px;
	padding-bottom:10px;
	font-weight:bold;
	font-size:0.95em;
}

.beersAdd a {
	text-decoration:underline;
}

/* Beer Details Page */

p.brewedBy {
	margin:0px 0px 10px;
}

.beerLogo {
	float:left;
	width:140px;
	height:140px;
	margin-right:10px;
}

.lrgColourIcon {
	margin:64px 0px 0px 80px;
}

.pricesContainer {
	float:left;
	height:122px;
	width:200px;
	background:#E6E3DF;
	padding:8px 0px 0px 8px;
}

p.beerBoxSubHead {
	 font-size:1.2em;
	 font-weight:bold;
}

table.beerSizes {
	border:0;
	margin:0px;
	padding:0;
}

table.beerSizes td {
	padding:2px 8px 2px 0px;
	font-size:1.1em;
}

table.beerSizes td.size {
	font-weight:bold;
}

.beerAddContainer {
	 float:left;
	 height:122px;
	 width:218px;
	 background:url(../images/lrgGreyOnCreamArrow.gif) left no-repeat #F5F0E7;
	 padding:8px 0px 0px 40px
}

.beerAddContainer form {
	margin:0px;
	padding:10px 0px 0px;
}

p.beerTotalPrice {
	margin-top:10px;
	font-size:16px;
}

p.beerTotalPrice span {
	font-weight:bold;
}

p.beerAdd {
	text-align:right;
	padding-right:20px;
	font-weight:bold;
}

#detailsContainer {
	float:left;
	margin-top:12px;
	width:430px;
}

table.beerDetails {
	padding:0;
	margin:0px 0px 10px 0px;
}

table.beerDetails td.header {
	vertical-align:top;
	font-weight:bold;
	padding: 0px 10px 4px 0px;
}

table.beerDetails td.value {
	padding: 0px 0px 4px 10px;
}

.beerRightImgs {
	float:right;
}

.saveContainer {
	background:url(../images/save.gif) top no-repeat;
	height: 105px;
	width:141px;
	text-align:center;
	margin-bottom:8px;
}

.saveContainer p {
	 padding:42px 0px 0px 8px;
	 font-weight:bold;
	 font-size:1.1em
}

/* Breweries Page */
.brewerThumb {
	width: 140px;
	height:130px;
	line-height:130px;
	text-align:center;
	float:left;
}

.brewerThumb img {
	border:0;
	vertical-align:middle;
}

.brewerInfo {
	 width: 472px;
	 float:left;
}

.brewerInfo h2 {
	 background-color:#E6E3DF;
	 height:40px;
	 line-height:40px;
	 padding-left:6px;
	 font-size:1.2em;
	 font-weight:bold;
}

/* Input Details Form */

.formrow {
	clear: left;
	margin-bottom:6px;
}

.formrow input, .formrow textarea {
	border: 1px solid #564527;
}

fieldset {
	border:0px;
	text-align:left;
	padding:0px;
	margin:0px;
}

fieldset label, .formrow label {
	float: left;
	width: 120px;
}

/* Sitemap */

ul.siteMap {
	list-style:none;
	margin:0px 0px 4px 0px;
	padding:0;
}

ul.siteMap li {
	margin:0px 0px 6px 0px;
}

ul.siteMap li a:hover {
	color:#A62D06;
}

ul.siteMapSub {
	list-style:none;
	margin:6px 0px 12px 20px;
	padding:0;
}

ul.siteMapSubSub {
	list-style:none;
	margin:6px 0px 12px 40px;
	padding:0;
}

/* Footer */

/* Brewers Logos */

#BrewersContainer {
	margin:6px auto 6px auto;
	padding-left:29px;
	text-align:center;
}

#brewerContainer h2 {font-size:1.5em;}

#BrewersContainer h1,#brewerContainer h4 {font-weight:normal;font-size:1em;color:#555555;margin:0 0 8px 0;padding:0;}
#brewerContainer h3 {font-weight:bold;font-size:1.2em;}

ul.brewerThumbs {
	list-style:none;
	margin:0;
	padding:0px 0px 6px;
}

ul.brewerThumbs li.brewerThumbContainer {
	 height:70px;
	 width:70px;
	 text-align:center;
	 line-height:70px;
	 display:inline;
	 padding:0px 5px;
	 margin:0;
}

ul.brewerThumbs li.brewerThumbContainer img {
	border:0;
	vertical-align:middle;
}

#footer {
	padding:6px 0px 0px;
	text-align:right;
}

ul#footerMenu {
	 text-align:center;
	 margin:0px 0px 0px 0px;
}

ul#footerMenu li {
	display:inline;
}

.total {
	font-size: 1em;
	color:#564527;
}