/* ====================================================CSS for The Wine Circle */
/* ==========================Tiger Two Ltd in collaboration with Websushi Ltd */
/* ==========================info@tigertwo.co.uk */
/* DarkGreen: #013819 - YellowCream: #fffec5 */

/* ====================================================Preamble */

* {
margin: 0;
padding: 0;
border: 0;
}

body {
font-family: "Garamond", Georgia, "Times New Roman", Times, serif;
font-size:1.0em;
background-color: #013819;
color: #FFFFFF;
}

.right, .price { text-align:right;}
.left {text-align:left;}
.centre {text-align:center;}
.green { color:#c4df9c;}

/*===================================================Layout*/
#header {
width: 900px;
position: relative;
height: 110px;
}

#container {
width: 900px;
position: relative;
height: 520px;
}

html>body #container {
min-height: 520px;
height: auto;
margin-top: 0px;
padding-top: 0px;
}

#side {
width: 160px;
position:absolute;
left: 20px;
font-size: 95%;
}

html>body #side {
left: 20px;
}

#main {
width: 720px;
margin-left: 200px;
}

html>body #main {
margin-left: 200px;
}

#footer {
width: 898px;
position: relative;
margin: 0 auto 0 auto;
height: 45px;
margin-bottom: 20px;
}

#price {
width: 150px;
height: 60px;
border: 1px solid #fffec5;
float: right;
margin-right: 15px;
font-weight:bold;
}

/*==========================================Blocks */
div.tripleblock {
width: 595px;
margin-left: 220px;
height: 255px;
margin-bottom: 10px;
}

html>body div.tripleblock {
margin-left: 220px;
}

div.blox {
width: 187px;
height: 255px;
text-align:center;
margin-left: 4px;
margin-right: 4px;
float: left;
margin-bottom: 10px;
}

/*================================================Navigation */

ul.top {
text-align: center;
padding-top: 66px;
margin-left: 160px;
font-size: 100%;
}

ul.top li {
display: inline;
list-style-type: none;
font-weight:bold;
padding-left: 5px;
padding-right: 5px;
}

/*===================================================Links */

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

#header a:link, #side a:link {color: #fffec5; text-decoration: none; }
#header a:visited, #side a:visited {color: #fffec5; text-decoration: none; }
#header a:hover, #side a:hover {color: #fffec5; text-decoration: underline; }
#header a:active, #side a:active {color: #fffec5; text-decoration: none; }

div.blox a.bl:link, a.add:link {color: #FFFFFF; text-decoration: none; }
div.blox a.bl:visited, a.add:visited {color: #FFFFFF; text-decoration: none; }
div.blox a.bl:hover, a.add:hover  {color: #fffec5; text-decoration: none; }
div.blox a.bl:active, a.add:active {color: #FFFFFF; text-decoration: none; }

a.add {
margin-top: 30px;
border: 1px solid #FFFFFF;
font-weight:bold;
padding: 2px 6px 2px 6px;
line-height: 22px;
}

/*=================================================sidebar */

ul.side {
padding-top: 20px;
padding-bottom: 10px;
}

ul.side li {
list-style-type: none;
width: 145px;
margin-bottom: 8px;
font-weight:bold;
}

/*================================================Images */

#main img.key {
margin-bottom: 10px;
display: block;
float: right;
}

#main img.home {
float: left;
margin-left: 55px;
}

#main img.small {
padding-left: 10px;
padding-bottom: 10px;
}

div.blox img {
padding-top: 15px;
}

.logo {float:left;}

/*=============================================Horizontal rules */

hr {
margin-right: 40px;
border-bottom: 1px solid #fffec5;
margin-bottom: 10px;
}

/*==============================================Headings */

#main h1 {
font-size: 130%;
font-weight: bold;
padding-top: 48px;
margin-bottom: 10px;
height: 28px;
}

#main h1.front {
text-indent: -5000px;
background: url(../images/title.jpg) no-repeat bottom center;
}

html>body h2 {
margin-top: 10px;
}

html>body h2 {
margin-top: 0px;
}

h2.gen {
margin-right: 20px;
margin-left: 280px;
font-size: 130%;
padding-top: 15px;
padding-bottom: 15px;
}

h2.basket {
font-size: 110%;
text-indent: -5000px;
background: url(../images/yourbasket.gif) no-repeat;
margin-left: 20px;
}

h2.payment {
font-size: 110%;
text-indent: -5000px;
background: url(../images/paymenttypes.gif) no-repeat;
margin-left: 20px;
}

h2.products, h2.sellers, h2.interested {
font-size: 130%;
text-indent: -5000px;
margin-left: 230px;
margin-top: 20px;
padding-bottom: 20px;
}

h2.products {
background: url(../images/latestproducts.gif) no-repeat;
}
h2.sellers {
background: url(../images/bestsellers.gif) no-repeat;
}

h2.interested {
background: url(../images/interested.gif) no-repeat;
}

h3 {
font-size: 100%;
font-weight: bold;
text-align: left;
margin-left: 10px;
margin-right: 10px;
}

/*===============================================Paragraphs */

#price p {
margin-left: 5px;
line-height: 19px;
}

p.old_image {
margin-right: 20px;
margin-left: 290px;
padding-bottom: 15px;
}

p.old {
margin-right: 20px;
font-size: 100%;
padding-bottom: 15px;
text-align:center;
}

p.navfooter {
margin-right: 20px;
margin-left: 280px;
font-size: 85%;
padding-bottom: 15px;
}

p.laterp {
margin-left: 50px;
margin-right: 10px;
display: block;
padding-bottom: 10px;
}

#main yousave {
font-color: #42BCE5;
}

p.error {
margin-left: 50px;
margin-right: 10px;
clear:both;
padding-bottom: 10px;
color: red;
}

.blox p {
text-align: left;
font-size: 85%;
margin-left: 10px;
margin-right: 10px;
}

.blox p.link {
text-align: right;
margin-right: 10px;
}

p.footerlink {
text-transform:uppercase;
margin-left: 37px;
color: #fffec5;
font-size: 80%;
padding-top: 15px;
}

p.credit {
color: #42BCE5;
font-size: 80%;
margin-right: 20px;
margin-left: 54px;
margin-top: 20px;
font-size: 85%;
padding-bottom: 15px;
text-align: right;
text-transform: lowercase;
}

#main p.price {
float: right;
font-size: 130%;
font-weight: bold;
margin-top: -27px;
padding-right: 20px;
}


/*===============================================Lists */

ul.error {
padding-bottom: 10px;
}

ul.error li {
margin-left: 67px;
margin-right: 10px;
list-style-type: square;
color: red;
}

/*============================================Tables */
table.mini {
width: 154px;
margin-left: 20px;
font-size: 80%;
}

td.tar { text-align: right;}

td.flower {
background: url(../images/flowersm.gif) no-repeat left top;
padding-top: 17px;
padding-bottom: 13px;
font-weight:bold;
text-indent: 20px;
}

td {
padding-top: 5px;
padding-bottom: 5px;
}

table {
width: 560px;
margin-left: 50px;
border-collapse:collapse;
}

th {
text-align:left;
border-bottom: 2px solid #fffec5;
padding-bottom: 5px;
}


td.lastrow {
border-top: 1px solid #fffec5;
border-bottom: 2px solid #fffec5;
font-weight:bold;
}

td.lastrow_right {
font-weight:bold;
text-align: right;
}

/*============================================Forms */

form.main {
width: 560px;
margin-left: 50px;
}

label.lftlbl {
display: block;
font-size: 90%;
line-height: 1.4em;
vertical-align: middle;
text-align:right;
width: 120px;
float:left;
margin-right:10px;
}

label.no-display {
display: none;
}

input, select, textarea {
width: 220px;
border: 1px solid #FFFFFF;
font-size: 100%;
margin-bottom: 10px;
background-color: #013819;
color: #FFFFFF;
}

input.ch {
width: 15px;
border: 0;
}

input.basket {
width: 30px;
border: 1px solid #FFFFFF;
}

input.button {
width: 100px;
margin-left: 130px;
margin-right:auto;
margin-top:10px;
border: 1px solid #FFFFFF;
font-weight: bold;
}

#formbottom {
width: 626px;
height: 8px;
margin-left: 230px;
}

html>body #formbottom {
margin-left: 240px;
}

.formButton {
padding-left: 50px;
}