/*
Site:           irishbeerfinder.com
File:           irishbeermain.css
Created:        October 2009 
==================================================================
Original Interface designed by Design Wall http://www.designwall.co.uk
Css and Site Development by Allison Baxter Design http://www.allisonbaxter.com 
 
===Reset Styles ==================================================================*/

/* =Reset Styles ///////////////////////////////////////////////////////////////////*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	vertical-align: baseline;
}

body {
	color: black;
	background: white;	
}

ul{
	list-style-type: none;
}

.centreimage { vertical-align: middle;
	margin: 10px 0;
	text-align: center;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}

blockquote, q {
	quotes: "" "";
}

/* End Reset ==================================================================*/

/* Main Site styles ///////////////////////////////////////////////////////////////////*/

html { overflow: -moz-scrollbars-vertical;}
html { overflow-x: auto; }

	/* fixes MSIE scrollbar bug DO NOT REMOVE, has no effect in Mozilla, or Opera */
html, body { height:101% }
body {  margin: 0;  padding:0;  background: #d1d3d4; font: 13px/17px "Myriad Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;}
body > #wrap {height: auto; min-height: 100%;}
	
#wrap {
	width: 960px;
	background-color: #ffffff;
	color: #353535;
	margin: 0 auto;
	

}

img{border:none; text-decoration: none;}


img, div, a, input { behavior: url(../js/iepngfix.htc) }

	/* =HEADER styles
=========================================================== */
#header {
	width: 865px;
	height: 158px;
	position: relative;
	z-index: 300;
	background: #ffffff url(../images/permanent/logo.jpg) no-repeat left bottom;
	margin: 0 55px 0 40px;
}

.rightbottles{
	height: 110px;
	margin-top: 48px;
	float: right;
}


#greenheader {
	margin: 0 55px 0 40px;
	width: 880px;
	height: 104px;
	position: relative;
	z-index: 300;
	background: #ffffff;
}

#greenheader p {
	position: absolute;
	top: 0px;
	color:  #098346;
	font: bold 14px/18px Georgia, Times, Times New Roman, serif;
	margin-top: 20px;
	margin-left: 0;
	margin-bottom: 15px;
	width: 415px;
}

#greenheader p a {
	width: 198px;
	height: 47px;
	margin-top: -12px;
	display: block;
	text-indent: -9999px;
	text-decoration: none;
	float: left;
	text-align: left;
	}
	
#greenheader p a:hover {
	background-position: 0 -47px;
}

.bottalign{
	padding: 0;
	margin: 0;
	vertical-align: bottom;
	float:right;
}

/* Search Box
----------------------------------------------------------- */
.searchBox {
	padding: 0px 0px 0px 14px;
	background: url(../images/permanent/bgsearch2.gif) no-repeat 0 0;
	width: 422px;
	height: 140px;
	position: absolute;
	top: 0px;
	right:  0px;
	z-index: 500;
	}
	
	.geofind {
	color:  #fff;
	right: 0px;
	width: 400px;
	margin-right: 0;
	margin-left: 0;
	margin-top: 40px;
	line-height: 25px;
	font-style: normal;
	font-size: 14px;
}

.find{
	float: left;
	width: 260px;
}

.radius{
	float: right;
	width: 100px;
	padding-right: 5px;
}

.searchBox form {float: left;}

.searchBox form input {
	padding: 2px 4px;
	height: 18px;
	width: 160px;
	background: #ecefe0;
	border: 0;
	line-height: 18px;
	}

.searchBox form input:hover,
.searchBox form input:focus 
	{background: #ffffff;}


.searchBox form #searchButton {
	background: url(../images/permanent/searchbutton.png) no-repeat 0 0;
	padding: 0;
	width: 71px;
	height: 21px;
	color: #fff;
	display: block;
	text-align: center;
	cursor: pointer;
	font-size: 12px;
	font-weight: bold;
	text-indent: -9999px;
	border: none;
	position: absolute;
	margin-top: 10px;
}

.searchBox form #searchButton:hover {background-position: 0 -21px;}

/* Login Box (Initially hidden)
----------------------------------------------------------- */


/* the whole bar going across the top */
#loginBox {
	height: 36px;
	margin-top: -32px;
	padding-top: 0px;
		position: absolute;
	width: 400px;
	z-index: 1000;
	-webkit-transition: background 0.5s linear;
	margin-left: 480px;
}

#loginWrapper {
	width: 400px;
	height: 36px;
	margin-top: -2px;
	margin-right: auto;
	margin-bottom: 0;
}


.loginForm ul {padding: 6px 6px 6px 0; margin-top: 2px; height: 22px;
	font-size: 12px;
	}
	
.loginForm li {margin-right: 0px;display: inline;}
.loginForm li input {margin-right: 5px;width: 86px;border: 2px solid #006738;color: #353535;float: left;
	background-color: #ecefe0
	;
}
.loginForm li a {color: #353535;line-height:2; margin-left: 0px;}
.loginForm li#loginSubmit, 
.loginForm li#loginSubmit button {
	display: block;
	width: 71px;
	height: 21px;
	float: left;
	background: url(../images/permanent/loginbutton.png) no-repeat left 0;
	text-indent: -9999px;
	margin-right: 6px;
}
	
.loginForm li#loginSubmit button {border: none;cursor: pointer;
}
.loginForm li#loginSubmit button:hover {background-position: 0 -21px}
#closeLogin {
	padding-left: 5px;
	margin-left: 2px;
	border-left: 1px solid #fff;
}



/* Main Navigation (Superfish)
----------------------------------------------------------- */
#navbar{
	height: 48px;
	background-color: #006738;
	width: 880px;
	margin-right: auto;
	margin-left: auto;
}

#navlinks{
	margin-bottom: 3px;
	margin-top: 8px;
	margin-left: 15px;
	width: 480px;
}



/* =========================================================== */
	#maincontent {
		margin: 0 auto; padding:0;
		width: 880px;
		background: #eff5c7 url(../images/permanent/bgstripe.jpg) repeat;
		height: 100%;
		}
		
			#whitecontent {
		margin: 0; padding: 30px;
		width: 880px;
		background: #ffffff;
		height: 100%;
		}
		
	#contentwrap{
	float: left;
width: 100%;
}
		
	#left, #right{
	width:156px; 
	padding: 0 15px;
	color: #353535;
	font: 9px/10px "Myriad Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	margin: 15px 0;
}
	#left {
		float:left;}
				
	#right, #barright, .barwebsite, .barrating {
		float:right;}

#middle {
height: 100%;
margin: 15px 184px 15px 190px;
text-align: center;
}

.middlecontent {
margin: auto 0 30px auto;
background-color:#ffffff;
border-bottom: 4px solid #8cc541;
padding: 15px;
float: left;
width: 468px;
	text-align: left;
}

#barleft {
	padding: 0;
	margin: 15px 310px 15px 15px;/*Set right margin to RightColumnWidth*/
	color: #353535;
	width: 500px;
	float: left;
	
}

#barright{
	width:325px; 
	padding: 0;
	margin: 15px 15px 15px -340px;
	float: left;
	
}

.baraddress, .barwebsite, .barrating{
	width: 250px;
}

.baraddress{
	float: left;
	clear: right;
}

.barwebsite{
	margin-left: 250px;
	float: right;
}

.barinfo{
	clear: both;
}

.left{
	float: left;
	width: 200px;
	font: 13px/16px Georgia, Times, Times New Roman, serif;
}

.right{
	float: right;
	width: 250px;
	font: 13px/16px Georgia, Times, Times New Roman, serif;
}

.formleft{
	float: left;
	width: 200px;
	font: 13px/16px Georgia, Times, Times New Roman, serif;
}

.formright{
	float: right;
	width: 200px;
	font: 13px/16px Georgia, Times, Times New Roman, serif;

}


.barrating{
	text-align: right;
	font-size: 10px;
}

.cleaner {
		clear:both;
		height:1px;
		font-size:1px;
		border:none;
		margin: 0; padding:0;
		background:transparent;
		}
		
h1,h2,h3,h4 { margin: 5px 0}

	p { margin: 5px 0;
	font-size: 13px;
	line-height: 15px;
}
	
	/* General Links ///////////////////////////////////////////////////////////////////*/

a:link {color: #006738; text-decoration: underline;}
a:visited {color: #006738; text-decoration: none;}
a:hover {color: #006738; text-decoration: underline;}
a:active {color: #006738; text-decoration: underline;}

img, div { behavior: url(../js/iepngfix.htc) }

	
	.copy { text-align:center; font-size:80% }
	
	p.italic{
	font-style: italic;
	font-size: 11px;
}


.quote{
font: 12px/15px "Myriad Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

.resulttitle, .distance{
	font-size: 14px;
	font-weight: bold;
	vertical-align: middle;
}

.resultimage{
	vertical-align: middle;
}


h1{
	color: #007a37;
	font: bold 22px/22px Georgia, Times, Times New Roman, serif;
}

h1 a:link {color: #007a37; text-decoration: none;}
h1 a:visited {color: #007a37; text-decoration: none;}
h1 a:hover {color: #007a37; text-decoration: underline;}
h1 a:active {color: #007a37; text-decoration: underline;}


h2{
	color: #353535;
	font: bold 14px/15px Georgia, Times, Times New Roman, serif;
}	

h2 a:link {color: #353535; text-decoration: none;}
h2 a:visited {color: #353535; text-decoration: none;}
h2 a:hover {color: #353535; text-decoration: underline;}
h2 a:active {color: #353535; text-decoration: underline;}

h3{
	color: #007a37;
	font: small-caps bold 14px/15px Georgia, Times, Times;
}

.middletext p {
	color: #353535;
	font: 12px/14px Georgia, Times, Times New Roman, serif;
}

.middletext a:link {color: #353535; text-decoration: underline;}
.middletext a:visited {color: #353535; text-decoration: none;}
.middletext a:hover {color: #006738; text-decoration: underline;}
.middletext a:active {color: #006738; text-decoration: underline;}

.more {
	color: #353535;
	font: 12px/14px Georgia, Times, Times New Roman, serif;
}

.more a:link{
	color: #353535;
	font: 12px/14px Georgia, Times, Times New Roman, serif;
	text-decoration: underline;
}

.more a:hover {
	color: #006738;
	font: 12px/14px Georgia, Times, Times New Roman, serif;
	text-decoration: underline;
}

.box{ display: block;
}

/*horizontal line */
hr {color: #ffffff; 
background-color: #ffffff; 
width: 100%;
	border-top-style: none;
	border-right-style: none;
	border-left-style: none;
	border-bottom: 1px dotted #007a37;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
/* */
	
	/* =FOOTER styles
=========================================================== */
#footerContainer {background: #ffffff;
	height: 60px;
	
}

#footer { margin: 0 auto;
padding-top: 20px;
width: 880px;
	color: #353535;
	font: 10px "Myriad Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

.footerleft{
	float: left;
	width: 420px;
	font: 10px "Myriad Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

.footerright{
	float: right;
	width: 460px;
	text-align: right;
}

#footer a:link {color: #353535; text-decoration: none;}
#footer a:visited {color: #353535; text-decoration: none;}
#footer a:hover {color: #353535; text-decoration: underline;}
#footer a:active {color: #353535; text-decoration: underline;}


/*--------------------------- Float Clearing Styles ---------------------------*/



/* slightly enhanced, universal clearfix hack */
.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */


/* container boxes
=========================================================== */
.containerbox
{
	background-color: #ffffff;
	border-bottom: 4px solid #8cc541;
	margin: 0 auto 10px;
	padding: 15px;
}

.imagecontainer {
	margin: 0 auto 10px;
}

/* image styles */
.rightimage/* right aligns text and image */
    {
    float: right;
	padding: 0px 0px 0 0;
}

.leftimage/* left aligns text and image */
    {
    float: left; 
    padding: 0px 5px 5px 0;
}

.formbackground{
	background: url(../images/permanent/formbg.png) no-repeat center top;
	padding: 15px;
	color: #ffffff;
	font-size: 14px;
	height: 525px;
}

/* Rounded Corner */
.inputwrapper {
	background: url(../images/permanent/rounded.png) no-repeat top left;
	height: 30px;
	width: 180px;
}
.inputwrappera {
	border: 0;
	width:170px;
	margin-top: 4px;
	margin-left: 4px;
}


/*** Superfish ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin: 0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	font: 15px/17px "Myriad Pro", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

.sf-menu a {
	padding: 15px 10px 10px;
	text-decoration:none;
	color: #ffffff;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color: #ffffff;
}
.sf-menu li {
	color: #ffffff;
}
.sf-menu li li {
	color: #ffffff;
	background-color: #006738;
}
.sf-menu li li li {
	background-color: #006738;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	outline:		0;
	color: #eff5c7;
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 17px;
	min-width:		1px;
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			3px;
	top:			5px; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../images/permanent/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			15px;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('../images/permanent/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}

.newmiddlecontent {
margin: 15px 0;
background-color:#ffffff;
border-bottom: 4px solid #8cc541;
padding: 15px;
}

#newbarleft {
	padding: 0;
	margin: 15px 310px 15px 15px;/*Set right margin to RightColumnWidth*/
	color: #353535;
	width: 4px;
	float: left;
	
}

#barright{
	width:325px; 
	padding: 0;
	margin: 15px 15px 15px -340px;
	float: left;
	
}

.baraddress, .barwebsite, .barrating{
	width: 250px;
}

.baraddress{
	float: left;
	clear: right;
}

.barwebsite{
	margin-left: 250px;
	float: right;
}

.barinfo{
	clear: both;
}

.newleft{
	float: left;
	width: 250px;
	font: 13px/16px Georgia, Times, Times New Roman, serif;
	
}

.newright{
	
	width: 180px;
	margin-left: 250px;
	
}

.newtopleft{
	float: left;
	width: 250px;
	font: 13px/16px Georgia, Times, Times New Roman, serif;
	height: 60px;
	
}

.newtopright{
	
	width: 180px;
	margin-left: 250px;
	height: 60px;
	float: left;
	
}



#innerwrap {
		margin:0; padding:0;
		
		}

.barcontainer{
	width:448px;
	display: block;
}		
			#newmiddle {
		margin:0 186px;
		
		}
		
		.newcentreimage { vertical-align: middle;
	margin: 10px 0;
	text-align: center;
}

ol.number li{
	margin-left: 20px;
	list-style-type: decimal;
	padding-bottom: 5px;
}

ol.alpha li{
	margin-left: 20px;
	list-style-type: upper-alpha;
	padding-bottom: 5px;
}

ol.lowalpha li{
	margin-left: 35px;
	list-style-type: lower-alpha;
	padding-bottom: 5px;
}

.barnamesearch{
	width: 156px;
	height: 156px;
	background-image: url(../images/permanent/bgsmallsearch.png);
	margin-bottom: 10px;
}

.barnamesearch form input:hover,
.barnamesearch form input:focus 
	{background: #ffffff;
}
.keyword {
		margin-top: 70px;
		position: absolute;
	padding-left: 6px;
}


.barnamesearch form #searchButton {
	background: url(../images/permanent/searchbutton.png) no-repeat 0 0;
	padding: 0;
	width: 71px;
	height: 21px;
	color: #fff;
	display: block;
	text-align: center;
	cursor: pointer;
	font-size: 12px;
	font-weight: bold;
	text-indent: -9999px;
	border: none;
	position: absolute;
	margin-left: 6px;
	margin-top: 110px;
}

.barnamesearch form #searchButton:hover {background-position: 0 -21px;}

.post-social ul, .post-social li{
	display: inline;
}

.post-social ul, .post-social li a{
	display: inline;
	text-decoration: none;
}

.state{
	font-size: 16px;
	line-height: 20px;
	background: #eff5c7;
	padding: 10px;
	font-weight: bold;
	font-style: italic;
}

ul#leaderboard li .count{

	float:left;
	background-color:#098346;
	color:#fff;
	text-align:center;
	height:30px;
	width:30px;
	padding-top: 3px;
	text-transform:uppercase;
	font: bold 18px Georgia, 'Times New Roman', Times, serif;
	margin-right: 10px;
}
