/*
* Wild about webstore
* Copyright Wild About http://www.wild-about.com/
* Written by Indigo 2 http://www.indigo-2.com/
*
* This file uses reset.css
* Font sizes are calculated from a base of 16px and written in ems
* Divide the desired pixel size by 16 to get the value in ems
*/

@import url(reset.css);

body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: white;
	background: black url('../images/background.jpg') center 101px no-repeat;
}
a {
	color: #f09;
	text-decoration: none;
}
h1 {
	margin: 6px 0;
	font-size: 22px;
	font-weight: bold;
}
p {
    margin: .6em 0;
}

/* @group Main layout */
div.masthead p, div#content3, div.footer-contain {
    clear: both;
	width: 940px;
	padding: 0;
	margin: 0 auto;
}
.hide, div#accessibility {display: none;}
.right {text-align: right;}
.override-bg tr {background-color: transparent !important;}
/* @end */

/* @group Header */
div.masthead {
    height: 100px;
    border-bottom: 1px solid #454d51;
    margin-bottom: 1.875em;
    font-size: 0.8125em;
    background: transparent url('../images/wild-about.jpg') top center no-repeat;
}
div.masthead p {
    position: relative;
	padding-top: 79px;
	text-align: right;
}
span.nav {
    position: absolute;
    left: 0;
}
/* @end */

/* @group Home */
body#homepage {
    text-align: center;
}
body#homepage {
    text-align: center;
}
ul#interflora li {display: inline;}
ul#interflora li a {
    padding: 0 6px;
    border: 2px solid #f00;
	font-size: 1.11em;
	font-weight: bold;
	color: black;
    background: transparent url('../images/postcode-background.png');
}
ul#areas {
    position: relative;
	width: 431px;
	height: 343px;
	margin: 75px auto;
	margin-bottom: 90px;
	list-style: none;
	text-align: left;
	background: transparent url('../images/london.png') top left no-repeat;
}
ul#areas li a {
    display: block;
    font-size: 1.125em;
	font-weight: bold;
	color: black;
}
ul#areas li a span.postcodes, li.everywhere a span.location {
	display: block;
	padding: 0 6px;
	font-size: 1.11em;
	background: transparent url('../images/postcode-background.png');
}
ul#areas a span.postcodes em, li.everywhere a span.location em {
    display: block;
    padding-right: 24px;
    background: transparent url('../images/arrow.gif') right center no-repeat;
}
li.westminster {
    position: absolute;
    top: -60px;
    left: -55px;
	width: 258px;
	height: 229px;
	background: transparent url('../images/westminster.png') top left no-repeat;
}
li.westminster a {
	width: 258px;
	height: 229px;
}
li.westminster a span.location {
	position: absolute;
	top: 70px;
	left: 70px;
}
li.westminster a span.postcodes {
    position: relative;
    top: 20px;
    left: 90px;
	width: 2.75em;
	border: 2px solid #f00;
}
li.city {
    position: absolute;
    top: 15px;
    right: -20px;
	width: 241px;
	height: 162px;
	background: transparent url('../images/city.png') top left no-repeat;
}
li.city a {
	width: 241px;
	height: 162px;    
}
li.city span {
	position: absolute;
	top: 50px;
	left: 70px;
}
li.city a span.postcodes {
    position: relative;
    top: -48px;
    left: 90px;
	width: 8.5em;
	border: 2px solid #f00;
}
li.richmond {
    position: absolute;
    bottom: -30px;
    left: -140px;
	width: 237px;
	height: 228px;
	background: transparent url('../images/richmond.png') top left no-repeat;
}
li.richmond a {
    width: 237px;
	height: 228px;
}
li.richmond span {
	position: absolute;
	top: 90px;
	left: 60px;
}
li.richmond a span.postcodes {
    position: relative;
    top: 30px;
    left: -100px;
	width: 10em;
	border: 2px solid #f00;
}
li.kingston {
    position: absolute;
    bottom: -100px;
    right: 150px;
	width: 142px;
	height: 241px;
	background: transparent url('../images/kingston.png') top left no-repeat;
}
li.kingston a {
	width: 142px;
	height: 241px;
}
li.kingston span {
	position: absolute;
	top: 76px;
	left: 33px;
}
li.kingston a span.postcodes {
    position: relative;
    top: 20px;
    left: 10px;
	width: 5.5em;
	border: 2px solid #f00;
}
li.everywhere a {
    position: absolute;
    right: -220px;
    bottom: 10px;
    width: 283px;
    height: 121px;
    background: transparent url('../images/world.png') top left no-repeat;
}
li.everywhere a span.location {
    position: absolute;
    top: 45px;
    right: -10px;
    width: 186px;
    border: 2px solid #f09;
}

/* @end */

/* @group Footer */

div.footer-contain {
	margin: 1.25em auto;
	font-size: 0.8125em;
	text-align: center;
}
/* @end */

/* @group Categories */

/* @end */

/* @group Product */
li.product {
	float: left;
	width: 418px;
	padding: 18px;
	border: 3px solid white;
	margin: 0 10px 10px 0;
	background-color: #b3b3b3;
}
ul.catlist-home {
	list-style-type: none;
}
li.product h2 {
	margin: 0;
	margin-bottom: .3em;
	color: #ff0099;
	font-size: 1.125em;
	font-weight: bold;
}
li.product img {
	float:  left;
	border: 6px solid white;
	margin:  0 10px 10px 0;
}
li.product p {
    height: 140px;
    margin: 0;
    overflow: auto;
	color: #333;
	font-size: 0.875em;
}
li.product h2 em.price {
	color: #333;
}
li.product h2 span.value {
	color: black;
}
li.product form {
	clear: left;
}
li.product form p {
	display: inline;
	margin-right: 10px;
}
/* @end */

/* @group Cart and User area */
td {padding: .3em;}
th {border-bottom: 1px dotted #666;}
tr.row td {border-bottom: 1px dotted #666;}

form.customer p {margin-bottom: .8em;}
form.customer label {
    float: left;
    display: block;
    width: 7em;
}
/* @end */

div.TwoColSidebar {
	clear: left;
}
