/* 
css document
Default styles for site 
Designer: Matt Bentley
Email: mattyb1973@yahoo.com
*/

/* Palette
===========================================================================================================================
=========================================================================================================================== */

/* From dark to light shades:
#b6b6b6 text
#555553 headers
#9a9933 alt header
#e73c0e left bar's
#84caca sign up bg
  */

	
/* Base Typography
===========================================================================================================================
===========================================================================================================================*/

body {
	font-size: 62.5%;
	font-family: ariel, helvetica, sans-serif;
	background: url(../images/css-images/background.jpg) no-repeat top center;
	color: #6c6c6c
}

h1, h2, h3, h4, h5, h6 {	
	font-family: times, sans-serif;
	font-weight: normal;
	color: #555553;
}
	
p {
	font-size: 1.2em;
	margin: 0.5em 0 1.5em 0;
}

h1 {
	font-size: 3.6em;
	letter-spacing: -0.05em;
	line-height: 1em;
	xxmargin-bottom: 0.15em;
}

#home h1 {
	font-size: 2.6em;
	letter-spacing: -0.05em;
	line-height: 1em;
	xxmargin-bottom: 0.15em;
}

h2 {
	font-size: 1.6em;
	margin-bottom: 0.15em;
	color: #6c6c6c;
	letter-spacing: -0.01em;
}

h3 {
	font-size: 1.4em;
}

h4 {
	font-size: 1.3em;
}

a { 
	color: #000;
}
	
a:hover, a:active { 
	color: #000; 
	text-decoration: none;
}
	
a:visited { 
	color: #000;
}

.header2 {
	color: #9a9933;
}

/* Copy the style below for different left nav color changes */
.left-nav-news {
	font-size: 2em;
	font-weight: normal;
	color: #9c9a22; /* change this hex color */
}
.left-nav-directory {
	font-size: 2em;
	font-weight: normal;
	color: #ab6800; /* change this hex color */
}
.left-nav-features {
	font-size: 2em;
	font-weight: normal;
	color: #cd1013; /* change this hex color */
}
.left-nav-recipes {
	font-size: 2em;
	font-weight: normal;
	color: #83caca; /* change this hex color */
}
.left-nav-products {
	font-size: 2em;
	font-weight: normal;
	color: #e93280; /* change this hex color */
}

/* Useful
===========================================================================================================================
===========================================================================================================================*/

.clear-both {
	clear: both;
}	

.clear-left {
	clear: left;
}
	
.clear-right {
	clear: right;
}

.float-left {
	float: left;
}
	
.float-right {
	float: right;
}
	
.hr hr,
.hr2 hr,
.hr3 hr,
.hr4 hr,
.hr5 hr,
.hr6 hr,
.hr7 hr {
	display: none;
}
	
.hr { 
	clear: both;
	height: 4px;
	border-bottom: 8px solid #9c9a22;
	margin-bottom: 10px;
}
/* copy the below style for different left nav styles called .hr2 , .hr3 , .hr4 , hr5 , .hr6 , .hr7 */
.hr2 { 
	clear: both;
	height: 4px;
	border-bottom: 8px solid #ab6800; /* change this hex color */
	margin-bottom: 10px;
}
.hr2 { 
	clear: both;
	height: 4px;
	border-bottom: 8px solid #cd1013; /* change this hex color */
	margin-bottom: 10px;
}
.hr5 { 
	clear: both;
	height: 4px;
	border-bottom: 8px solid #83caca; /* change this hex color */
	margin-bottom: 10px;
}
.hr6 { 
	clear: both;
	height: 4px;
	border-bottom: 8px solid #e93280; /* change this hex color */
	margin-bottom: 10px;
}


.bold {
	font-weight: bold;
}

.block-margin-top {
	margin-top: 10px;
}

.block-margin-bottom {
	margin-bottom: 10px;
}

#content #left-nav ul li {
     margin-bottom: 10px;
     width: 115px;
}

.content-hr hr {
	display: none;
}

.content-hr { 
	clear: both;
	height: 5px;
	border-bottom: 1px dotted #6c6c6c; 
	margin-bottom: 15px;
}


/* Structural Element/s
===========================================================================================================================
===========================================================================================================================*/

#container {
	margin:0 auto;
	position:relative;
	width: 850px;
	padding: 0px 25px;
	overflow: auto;
	background: url(../images/css-images/background.jpg) top center;
}
	
#header {
	min-height: 115px; /* ie6 fix */
	background: url(../images/css-images/header/header-bg.gif) no-repeat 290px -20px;
}

#content-wrapper {
	float: left;
	width: 730px;
}

#nav {
	float: left;
	width: 850px; /* 713 */
	margin-bottom: 10px;
}

#content {
	float: left;
	width: 730px;
	min-height: 670px; /* ie6 fix */
	overflow: hidden; 
	position: relative; 
}

#footer {
	float: left;
	width: 730px;
	min-height: 155px; /* ie6 fix */
	padding-top: 10px;
	margin-top: 10px;
	
	border-top: 1px dotted #000;
}

#banners {
	width: 110px;
	float: right;
	margin-top: 45px; /* 10px */
}

#web-design {
	width: 980px;
	height: 35px;
	text-align: right;
}

#web-design a {
	color: #666;
	text-decoration: none;
	font-size: 1.1em;
}

/* Header
===========================================================================================================================
===========================================================================================================================*/

#header .logo {
	display: block;
	float: left;
	text-indent: -5000px;
	width: 225px;
	height: 110px;
	xxmargin-right: 224px;
	background: url(../images/css-images/header/logo.gif) no-repeat top left;
}

#header .content-link {
	display: none;
}

#header .head-banner {
	display: block;
	float: right;
	width: 442px;
	height: 74px;
	margin-top: 15px;
}

/* Content Area
===========================================================================================================================
==========================================================================================================================*/

#content #article {
	float: left;
	position: relative;
	left: 138px;
	width: 376px;
	min-height: 737px; /* ie 6 fix */
	padding: 10px;
	background-color: #fff;
	line-height:15px;
	margin-bottom: -32766px;
   	padding-bottom: 32766px;
}	

#content #article .date {
	line-height: 2.8em;
}

#content #article .links a {
	font-size: 1.4em;
	font-weight: bold;
	text-decoration: none;
	color: #555553;
}

#content #article .links a:hover {
	text-decoration: underline;
}

#content #article .standfirst {
	color: #555553;
	font-weight: bold;
	font-size: 1.4em;
}

#content #article ul li {

}

#content #article .scrolling {
	height: 339px;
	margin-top: 5px;
	overflow: auto;
}
#content #article .scrolling_directory {
	height: 609px;
	margin-top: 5px;
	overflow: auto;
}
	
#content #aside-holder {
	float: right;
	width: 182px;
	min-height: 570px; 
	padding-bottom: 32766px;
	margin-bottom: -32766px;
	background: url(../images/css-images/content-bg.gif) repeat-y left top;
}
	
#content #aside {
	padding-left: 10px;
	padding-bottom: 32766px;
	margin-bottom: -32766px;
	background: url(../images/css-images/content-bg.gif) repeat-y right top;
}

#content #aside a img {
	margin-bottom: 10px;
}

#content #aside #sign-up {
	width: 152px;
	padding: 71px 0px 5px 10px;
	margin-bottom: 10px;
	background: #84caca url(../images/css-images/signup-bg.jpg) no-repeat top left;
}

#content #aside #sign-up legend {
	display: none;
}

#content #aside #sign-up input {
	width: 135px;
}

#content #aside #sign-up .submit {
	width: 76px;
	margin: 5px 0px;
}

#content #aside #sign-up label {
	font-size: 1.4em;
	color: #555553;
}

#content #aside #sign-up span {
	color: #555553;
}

#competition-form legend { 
	display: none; 
}

#competition-form label {
    width: 80px; 
	display: block; 
	float: left; 
	line-height: 20px; 
	font-size:1.2em;
}

#competition-form label.newsletter {
   width: 155px;
}
#competition-form label.newsletter-bathales {
   width: 356px;
   display:inline;
   float: none;
   line-height: 19px;
}

#competition-form input.newsletter-bathales {
   margin-top: 0px
}

#competition-form li { 
	list-style: none; 
	margin-bottom: 10px; 
}

#subscribe #article h1 {
	margin-bottom: 20px;
}

#subscribe #article h2 {
	font-family: ariel, helvetica, sans-serif;
	font-weight: bold;
	margin-bottom: 0px;
}

#subscribe #article img {
	margin-right: 15px;
}

#subscribe #article .price {
	margin-top: 60px;
}

#subscribe #article .price a {
	margin-left: 20px;
}

#subscribe-form label { 
	font-size:1.2em;
}

#article a {
	color: #6c6c6c;
}

#home #article a {
	text-decoration: none;
}
#home #article a:hover {
	text-decoration: underline;
}

/* Footer
===========================================================================================================================
===========================================================================================================================*/

#footer .comfort-links li {
	float: left;
	padding-left: 15px;
	padding-top: 2px;
	margin-right: 3px;
	margin-bottom: 10px;
	background: url(../images/css-images/footer/footer-icon.jpg) no-repeat left 2px;
}

#footer .comfort-links li a{
	font-size: 1.3em;
	font-weight: bold;
	text-decoration: none;
}

#footer .copyright {
	font-size: 0.8em;
	font-weight: bold;
	text-decoration: none;
	color: #000;
	float: right;
	margin-top: 6px;
}

#footer h2 {
	/* padding-left: 20px; */
	font-size: 2.2em;
	clear: both;
	/* background: url(../images/css-images/footer/footer-icon.jpg) no-repeat left 8px; */
}

#footer .stockists {
	width: 742px;
}

#footer .stockists li {
	float: left;
	color: #555553;
}

#footer .stockists li a {
	color: #555553;
}

#abergavenny #article ul {
	list-style-position:outside;
	list-style-type:square;
}

/* Banners
===========================================================================================================================
===========================================================================================================================*/

#banners a {
	display: block;
	margin-bottom: 10px;
}
#fade_bg
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: #000;
	filter:alpha(opacity=80);
	opacity: 0.8;
	-moz-opacity:0.8;
	display: none;
	z-index: 990;
}

#survey_popup {
	background-color:#FFF;
	padding:20px;
	position:absolute;
	z-index: 999;
	top: 50px;
	left:230px;
	width:388px;
}

#survey_popup .close, #survey_popup .a {
	text-align:right;
	text-decoration:none;
}
#content #aside #sign-up #security {
	width:80px;
	float: right;
	margin-right: 14px;
}
#content #aside #sign-up .security-code {
	margin-top:5px;
	font-size: 1.4em;
	float:left;
}
