/* Homepage styles */

#home-content {
  width: 717px;
  padding: 10px 16px 20px 16px;
  clear: both;
  font-size: 100%;
}

#main p {
  padding-top: 0px;
  padding-bottom: 0px;
  margin-top: 8px;
  margin-bottom: 6px;
}

#main h2, #main h1 {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  font-size: 150%;
}

.homeblock h3 {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  font-size: 250%;
}

#saffron-ales {
  width: 331px;
  height: 119px;
  float: left;
  background: url(/images/saffronales.jpg) no-repeat;
  margin: 0px 0px 1px 0px;
  padding: 21px 22px 0 22px;
  color: #FFF;
}

#saffron-ales p {
  margin: 4px 0px 4px 0px;
  padding: 0px;
  width: 250px;
}

#saffron-ales a {
  color: #FFF;
}

#guestbeers {
  width: 329px;
  height: 120px;
  float: left;
  padding: 21px 22px 0 22px;
  background: url(/images/guestbeers.jpg) no-repeat;
  color: #FFF;
}

#guestbeers p {
  margin: 4px 0px 4px 0px;
  padding: 0px;
  width: 190px;
}

#guestbeers a {
  color: #FFF;
}

#mixedcases h3,
#ciders h3, 
#wines h3 {
  font-size: 200%;
  margin-bottom: 8px;
}

#mixedcases {
  width: 203px;
  height: 122px;
  float: left;
  background: url(/images/mixedcases.jpg) no-repeat;
  margin: 0px 3px 0px 0px;
  padding: 18px 22px 0 22px;
  color: #FFF;
}

#mixedcases p {
  margin: 0px 0px 4px 0px;
  padding: 0px;
  width: 180px;
}

#mixedcases a {
  color: #FFF;
}

#ciders {
  width: 203px;
  height: 122px;
  float: left;
  background: url(/images/ciders.jpg) no-repeat;
  margin: 0px 3px 0px 0px;
  padding: 18px 22px 0 22px;
  color: #FFF;
}

#ciders p {
  margin: 0px 0px 4px 0px;
  padding: 0px;
  width: 180px;
}

#ciders a {
  color: #FFF;
}

#wines {
  width: 203px;
  height: 122px;
  float: left;
  background: url(/images/wines.jpg) no-repeat;
  padding: 18px 22px 0 22px;
  color: #FFF;
}

#wines p {
  margin: 0px 0px 4px 0px;
  padding: 0px;
  width: 180px;
}

#wines a {
  color: #FFF;
}

.side1 {
  width: 470px;
  float: left;
  border-right: 1px solid #918a7d;
  margin: 10px 10px 0px 0px;
  padding: 0px 12px 0px 0px;
}

.side2 {
  width: 190px;
  float: right;
  padding: 10px 20px 10px 0px;
}

.side2 a {
  color: #000000;
}

h2.title {
  margin: 5px 0 10px 0;
  font-weight: bold;
  font-size: 150%;
}

p.leftcol {
  color: #474747;
  float: left;
  width: 220px;
  margin-right: 16px;
}

p.rightcol {
  color: #474747;
  float: left;
  width: 209px;
}

/* Listing styles */

#category-header {
  width: 727px;
  height: 94px;
  padding: 14px 0px 0px 20px;
  background-repeat: no-repeat;
  color: #FFFFFF;
}

#category-header h1 {
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  font-size: 200%;
}

#category-header p {
  width: 400px;
}

.product {
  float: left;
  background-image: url(/images/product-frame.gif);
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  width: 359px;
  height: 170px;
  padding: 7px;
  position: relative;
  overflow: hidden;
}

.product .product-image {
  float: right;
}

#main .product h2 {
  padding-top: 12px;
  margin: 0px 0px 0px 14px;
  font-size: 140%;
  font-weight: normal;
}

.product h3 {
  margin: 0px 0px 0px 14px;
  padding: 0px;
  font-size: 110%;
  font-weight: normal;
}

.product p {
  margin: 0px 0px 0px 14px;
  line-height: 110%;
}

.product p.grey {
  color: #818181;
}

.product .button {
  margin: 8px 0px 0px 14px;
}

.product .viewproduct {
  position: absolute;
  bottom: 19px;
}

/* Detail styles */

.divide {
  height: 10px;
  line-height: 10px;
  overflow: hidden;
  background-image: url(/images/divider.gif);
  background-repeat: repeat-x;
  background-position: 5px 5px;
  clear: both;
  width: 100%;
}

#detail-left {
  float: left;
  width: 400px;
  padding: 0px 0px 20px 5px;
  color: #474747;
}

#detail-right {
  float: left;
  width: 328px;
  padding: 0px 0px 20px 15px;
}

#detail-left h1 {
  font-size: 200%;
  padding: 0px 0px 0px 0px;
  margin: 6px 0px 0px 14px;
}

#detail-left h2 {
  margin: 6px 0px 6px 14px;
  font-size: 160%;
}

#detail-left p {
  padding: 0px 0px 0px 0px;
  margin: 6px 0px 6px 14px;
}

.smallinfo {
  padding-top: 18px;
  font-size: 110%;
}

.selection {
  font-size: 125%;
  color: #000000;
}

.selection select {
  font-size: 100%;
  font-family: Arial;
  color: #000000;
  margin: 0px 5px 0px 5px;
}

input.addbasket {
  background-image: url(/images/button-addtobasket.gif);
  background-repeat: no-repeat;
  width: 131px;
  height: 26px;
  border: 0px;
  cursor: pointer;
}

.selection strong {
  font-size: 130%;
  color: #474747;
}

.selection strong a {
  position: absolute;
  margin: 0px 0px 0px 10px;
}

#largepicframe {
  background-image: url(/images/detail-frame-large.gif);
  width: 320px;
  height: 320px;
  padding: 7px 0px 0px 7px;
}

.thumb {
  float: left;
  background-image: url(/images/detail-frame-small.gif);
  padding: 7px;
  margin-right: 2px;
}

.thumb-small {
  float: left;
  background-image: url(/images/detail-frame-tiny.gif);
  padding: 7px;
  margin-right: 2px;
}

.thumb.last {
  margin-right: 0px;
}

.page-controls {
  text-align: right;
  padding: 7px 16px 3px 0px;
  clear: both;
}

.page-controls a, .page-controls span {
  text-decoration: none;
  padding: 0px 2px 0px 2px;
  color: #000000;
}

.page-controls span {
  color: #A6A6A6;
}

/* Basket */

.basket {
  width: 733px;
  margin-left: 8px;
  margin-bottom: 30px;
}

.basket th {
  text-align: right;
  padding: 0px 0px 1px 12px;
}

.basket .left {
  text-align: left;
}

.basket th strong {
  font-size: 140%;
}

.basket td {
  border-top: solid 1px #C7BDAB;
  padding: 3px 0px 2px 8px;
  color: #474747;
  font-size: 125%;
  text-align: right;
}

.basket td .thumb-small {
  margin-right: 8px;
}

.basket td h3 {
  font-size: 100%;
  font-weight: normal;
  margin: 15px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

.basket td h4 {
  font-size: 80%;
  font-weight: normal;
  margin: 2px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

.basket td strong {
  margin-right: 10px;
}

.basket .remove {
  margin-right: 15px;
}

.basket .basket-controls {
  padding: 8px 0px 6px 12px;
  text-align: left;
}

.basket .delivery td {
  padding-top: 10px;
  padding-bottom: 10px;
}

.basket .delivery td strong {
  margin: 16px 0px 0px 0px;
}

.basket .delivery td select {
  font-size: 110%;
  font-family: Arial;
  margin-right: 25px;
  width: 225px;
}

.basket .cards td {
  background-color: #FFFFFF;
  border-bottom: solid 1px #C7BDAB;
  padding: 6px 7px 3px 10px;
}

.basket .cards td strong {
  font-size: 150%;
  margin: 3px 0px 0px 30px;
  float: left;
}

.basket .cards td span {
  font-size: 120%;
  float: left;
  margin: 5px 0px 0px 20px;
}

/* Confirm Order */

.confirm {
  width: 733px;
  margin-left: 8px;
  margin-bottom: 30px;
}

#main .confirm h2 {
  font-size: 130%;
}

.confirm td {
  padding: 3px 0px 2px 11px;
  color: #474747;
  font-size: 125%;
}

.confirm th {
  padding: 0px 0px 1px 12px;
}

.confirm th strong {
  font-size: 140%;
}

.confirm td h3 {
  font-size: 100%;
  font-weight: normal;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

.confirm td h4 {
  font-size: 80%;
  font-weight: normal;
  margin: 2px 0px 1px 0px;
  padding: 0px 0px 0px 0px;
}

.confirm tr.border td {
  border-top: solid 1px #C7BDAB;
}

.confirm .total td {
  background-color: #FFFFFF;
  border-top: solid 1px #C7BDAB;
  border-bottom: solid 1px #C7BDAB;
  padding: 6px 0px 2px 10px;
  font-size: 140%;
}

.confirm .left-pane {
  float: left;
  width: 345px;
  margin: 10px 0px 10px 0px;
}

.confirm .right-pane {
  float: left;
  width: 345px;
  padding: 10px 0px 10px 0px;
}

.confirm .total strong {
  font-size: 130%;
  float: left;
  margin-left: 530px;
}

.confirm .subtotal {
  float: left;
  margin-left: 522px;
}

.confirm .total span {
  float: right;
  padding: 1px 0px 0px 0px;
}

/* Delivery Details */

h3.form {
  border-bottom: solid 1px #C7BDAB;
  margin: 0px 5px 5px 5px;
  font-size: 120%;
  padding: 0px 0px 2px 10px;
}

.details {
  color: #474747;
  font-size: 125%;
  margin: 0px 0px 20px 16px;
}

.details td {
  padding: 3px 0px 3px 10px;
}

.details td.mandatory {
  background-image: url(/images/mandatory.gif);
  background-repeat: no-repeat;
  background-position: left center;
}

.details th {
  font-weight: normal;
  text-align: left;
  width: 130px;
}

.details input {
  width: 220px;
}

.details .age {
  width: auto;
}

.details input.small {
  width: 120px;
}

.proceed {
  width: 738px;
  margin: 0px 5px 0px 5px;
  border-top: solid 1px #C7BDAB;
  border-bottom: solid 1px #C7BDAB;
  padding: 7px 7px 7px 0px;
  background-color: #FFFFFF;
}


/* Misc Content */

#main h1.content {
  font-size: 210%;
	width: 370px;
}

#misc-content {
	font-size: 110%;
	width: 600px;
  padding: 10px 16px 20px 16px;
  clear: both;
}

#misc-content li {
  margin-bottom: 8px;
}

#misc-content table {
  background-color: white;
	background-image: url(/images/glass.jpg);
	background-repeat: no-repeat;
	background-position: 520px bottom;
	margin: 10px 0;
	font-size: 90%;
	width: 700px;
}

#misc-content th  {
	font-size: 130%;
  text-align: left;
	padding: 8px 10px;
	color: white;
	background-color: #a62a0a;
}

#misc-content td {
  text-align: left;
	padding: 7px 14px;
	vertical-align: top;
}