/* Master ***************************************/

body {
  background-color: #E6EAEF;
  background-image: url(/images/body-bg.gif);
  background-repeat: repeat-x;
  background-position: left 124px;
  margin: 0px;
  font-size: 0.69em;
  font-family: Arial, sans-serif;
}

#help-strip {
  background-color: #FFFFFF;
  height: 25px;
  text-align: right;
}

#header {
  background-color: #FFFFFF;
  height: 65px;
}

#navigation {
  background-image: url(/images/navigation-bg.gif);
  background-repeat: repeat-x;
  height: 34px;
}

#container {
  padding: 11px 0px 30px 0px;
}

#footer {
  background-color: #FFFFFF;
  height: 138px;
  font-size: 109%;
}

.interior {
  width: 987px;
  margin: 0px auto 0px auto;
}

#navigation .interior {
  width: 995px;
}

a img {
  border: 0px;
}

/* Header ***************************************/

#help-strip p {
  margin: 0px 0px 0px 0px;
  padding: 5px 3px 0px 0px;
  font-size: 109%;
}

#help-strip a {
  color: #000000;
  text-decoration: none;
  background-image: url(/images/icon-info.gif);
  background-repeat: no-repeat;
  background-position: left 1px;
  padding-left: 18px;
}

#logo {
  float: left;
}

#search {
  float: right;
  margin: 0px 0px 0px 0px;
  padding: 22px 2px 0px 0px;
  position: relative;
}

#search input.field {
  background-image: url(/images/field-search.gif);
  background-repeat: no-repeat;
  border: 0px;
  width: 168px;
  height: 20px;
  font-size: 11px;
  font-family: Arial, sans-serif;
  margin: 0px 0px 0px 0px;
  padding: 7px 25px 0px 11px;
}

#search input.submit {
  position: absolute;
  bottom: 0px;
  right: 2px;
  padding: 7px 8px 6px 4px;
}

#navigation ul {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 2px;
  height: 34px;
  font-size: 118%;
  line-height: 120%;
  background-image: url(/images/navigation-divide.gif);
  background-repeat: no-repeat;
  background-position: left;
}

#navigation ul li {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  display: inline;
}

#navigation ul li a {
  float: left;
  color: #FFFFFF;
  text-decoration: none;
  background-image: url(/images/navigation-divide.gif);
  background-repeat: no-repeat;
  background-position: right;
  padding: 8px 13px 10px 11px;
}

/* Middle ***************************************/

.heading {
  width: 100%;
  clear: both;
  color: #FFFFFF;
  margin: 0px 0px 0px 0px;
  font-size: 127%;
  font-weight: bold;
  padding: 0px;
}

.heading span {
  float: left;
  padding: 8px 15px 6px 10px;
  background-image: url(/images/heading-bg.gif);
  background-repeat: no-repeat;
  background-position: top right;
}

.heading span.h-dblue {
  background-color: #005790;
}

.heading span.h-blue {
  background-color: #4269C0;
}

.heading span.h-red {
  background-color: #F50000;
}

#leftcol {
  width: 219px;
  float: left;
}

#leftcol .block {
  clear: both;
  background-color: #FFFFFF;
  border-right: solid 1px #9CA5AE;
  border-bottom: solid 1px #9CA5AE;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 9px 0px;
}

#leftcol .basket {
  padding: 6px;
}

#leftcol .basket p {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 3px;
}

#leftcol .basket p.total {
  font-size: 145%;
  margin: 0px 0px 0px 0px;
  padding: 2px 0px 11px 3px;
}

#leftcol .basket p.total span {
  color: #F50000;
}

#leftcol .basket p a {
  font-size: 118%;
  text-decoration: none;
  color: #000000;
}

#leftcol .basket .icon-checkout {
  background-image: url(/images/icon-checkout.gif);
  background-repeat: no-repeat;
  background-position: left;
  padding-left: 21px;
  padding-right: 11px;
}

#leftcol .basket .icon-empty {
  background-image: url(/images/icon-empty.gif);
  background-repeat: no-repeat;
  background-position: left;
  padding-left: 22px;
}

#leftcol .basket .quote {
  background-color: #0097FB;
  display: block;
  margin: 7px 0px 0px 0px;
  padding: 3px 2px 7px 30px;
  color: #FFFFFF;
  text-decoration: none;
  font-size: 118%;
  line-height: 160%;
  background-image: url(/images/icon-quote.gif);
  background-repeat: no-repeat;
  background-position: 7px 5px;
}

#leftcol .basket .quote span {
  font-size: 77%;
  line-height: 100%;
  display: block;
}

#categories {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  list-style: none;
  font-size: 118%;
}

#categories li {
  display: inline;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

#categories li a {
  display: block;
  text-decoration: none;
  color: #000000;
  padding: 8px 10px 7px 26px;
  margin: 0px 0px 0px 0px;
  line-height: 126%;
  background-repeat: no-repeat;
  background-position: 11px 11px;
}

#categories li a:hover {
  background-color: #E2E2E2;
}

#categories li ul {
  font-size: 100%;
  padding: 6px 0px 12px 0px;
  margin: 0px;
}

#categories li ul li a {
  padding: 4px 0px 4px 26px;
}

#categories li.selected a {
  color: #FFFFFF;
}

#cat-orange a {
  background-image: url(/images/colours/arrow-orange.gif);
}
#cat-orange a:hover {
  background-image: url(/images/colours/arrow-orange-hover.gif);
}
#cat-orange.selected a,
#cat-orange.selected a:hover {
  background-image: url(/images/colours/arrow-orange-selected.gif);
  background-color: #ED6824;
}
#cat-orange ul.subnav {
  background-color: #F9D9B6;
}
#content.orange .heading span.h-catcol {
  background-color: #ED6824;
}

#cat-blue a {
  background-image: url(/images/colours/arrow-blue.gif);
}
#cat-blue a:hover {
  background-image: url(/images/colours/arrow-blue-hover.gif);
}
#cat-blue.selected a,
#cat-blue.selected a:hover {
  background-image: url(/images/colours/arrow-blue-selected.gif);
  background-color: #4269C0;
}
#cat-blue ul.subnav {
  background-color: #D8E1F1;
}
#content.blue .heading span.h-catcol {
  background-color: #4269C0;
}

#cat-maroon a {
  background-image: url(/images/colours/arrow-maroon.gif);
}
#cat-maroon a:hover {
  background-image: url(/images/colours/arrow-maroon-hover.gif);
}
#cat-maroon.selected a,
#cat-maroon.selected a:hover {
  background-image: url(/images/colours/arrow-maroon-selected.gif);
  background-color: #990D3A;
}
#cat-maroon ul.subnav {
  background-color: #E5B9C2;
}
#content.maroon .heading span.h-catcol {
  background-color: #990D3A;
}

#cat-lime a {
  background-image: url(/images/colours/arrow-lime.gif);
}
#cat-lime a:hover {
  background-image: url(/images/colours/arrow-lime-hover.gif);
}
#cat-lime.selected a,
#cat-lime.selected a:hover {
  background-image: url(/images/colours/arrow-lime-selected.gif);
  background-color: #8CC044;
}
#cat-lime ul.subnav {
  background-color: #EBF2D9;
}
#content.lime .heading span.h-catcol {
  background-color: #8CC044;
}

#cat-green a {
  background-image: url(/images/colours/arrow-green.gif);
}
#cat-green a:hover {
  background-image: url(/images/colours/arrow-green-hover.gif);
}
#cat-green.selected a,
#cat-green.selected a:hover {
  background-image: url(/images/colours/arrow-green-selected.gif);
  background-color: #0C3810;
}
#cat-green ul.subnav {
  background-color: #C9D7C7;
}
#content.green .heading span.h-catcol {
  background-color: #0C3810;
}

#cat-yellow a {
  background-image: url(/images/colours/arrow-yellow.gif);
}
#cat-yellow a:hover {
  background-image: url(/images/colours/arrow-yellow-hover.gif);
}
#cat-yellow.selected a,
#cat-yellow.selected a:hover {
  background-image: url(/images/colours/arrow-yellow-selected.gif);
  background-color: #FFF63D;
}
#categories li#cat-yellow.selected a {
  color: #000000;
}
#cat-yellow ul.subnav {
  background-color: #FFFBDB;
}
#content.yellow .heading span.h-catcol {
  background-color: #FFF63D;
  color: #000000;
}

#cat-bluelight a {
  background-image: url(/images/colours/arrow-bluelight.gif);
}
#cat-bluelight a:hover {
  background-image: url(/images/colours/arrow-bluelight-hover.gif);
}
#cat-bluelight.selected a,
#cat-bluelight.selected a:hover {
  background-image: url(/images/colours/arrow-bluelight-selected.gif);
  background-color: #2BB1FB;
}
#cat-bluelight ul.subnav {
  background-color: #BCE4F7;
}
#content.bluelight .heading span.h-catcol {
  background-color: #2BB1FB;
}

#cat-bluedark a {
  background-image: url(/images/colours/arrow-bluedark.gif);
}
#cat-bluedark a:hover {
  background-image: url(/images/colours/arrow-bluedark-hover.gif);
}
#cat-bluedark.selected a,
#cat-bluedark.selected a:hover {
  background-image: url(/images/colours/arrow-bluedark-selected.gif);
  background-color: #293692;
}
#cat-bluedark ul.subnav {
  background-color: #DBDFED;
}
#content.bluedark .heading span.h-catcol {
  background-color: #293692;
}

#cat-grey a {
  background-image: url(/images/colours/arrow-grey.gif);
}
#cat-grey a:hover {
  background-image: url(/images/colours/arrow-grey-hover.gif);
}
#cat-grey.selected a,
#cat-grey.selected a:hover {
  background-image: url(/images/colours/arrow-grey-selected.gif);
  background-color: #677186;
}
#cat-grey ul.subnav {
  background-color: #EAEBED;
}
#content.grey .heading span.h-catcol {
  background-color: #677186;
}

#cat-pink a {
  background-image: url(/images/colours/arrow-pink.gif);
}
#cat-pink a:hover {
  background-image: url(/images/colours/arrow-pink-hover.gif);
}
#cat-pink.selected a,
#cat-pink.selected a:hover {
  background-image: url(/images/colours/arrow-pink-selected.gif);
  background-color: #F92688;
}
#cat-pink ul.subnav {
  background-color: #F8D3E3;
}
#content.pink .heading span.h-catcol {
  background-color: #F92688;
}

#cat-purple a {
  background-image: url(/images/colours/arrow-purple.gif);
}
#cat-purple a:hover {
  background-image: url(/images/colours/arrow-purple-hover.gif);
}
#cat-purple.selected a,
#cat-purple.selected a:hover {
  background-image: url(/images/colours/arrow-purple-selected.gif);
  background-color: #631D90;
}
#cat-purple ul.subnav {
  background-color: #D7C7DF;
}
#content.purple .heading span.h-catcol {
  background-color: #631D90;
}

#cat-brown a {
  background-image: url(/images/colours/arrow-brown.gif);
}
#cat-brown a:hover {
  background-image: url(/images/colours/arrow-brown-hover.gif);
}
#cat-brown.selected a,
#cat-brown.selected a:hover {
  background-image: url(/images/colours/arrow-brown-selected.gif);
  background-color: #D6811B;
}
#cat-brown ul.subnav {
  background-color: #F6E0B9;
}
#content.brown .heading span.h-catcol {
  background-color: #D6811B;
}

#cat-red a {
  background-image: url(/images/colours/arrow-red.gif);
}
#cat-red a:hover {
  background-image: url(/images/colours/arrow-red-hover.gif);
}
#cat-red.selected a,
#cat-red.selected a:hover {
  background-image: url(/images/colours/arrow-red-selected.gif);
  background-color: #FF0000;
}
#cat-red ul.subnav {
  background-color: #f46363;
}

#content.red .heading span.h-catcol {
  background-color: #FF0000;
}

#categories ul.subnav li a {
  background-image: none;
  background-color: transparent;
  color: #000000;
}

#categories ul.subnav li a:hover {
  background-image: none;
  background-color: transparent;
}

#categories ul.subnav li a.selected {
  font-weight: bold;
}

#content {
  float: left;
  width: 756px;
  padding-left: 12px;
}

/* Footer ***************************************/

#footer .footer-left {
  float: left;
  width: 505px;
  padding: 0px 0px 0px 10px;
}

#footer .footer-right {
  float: right;
  width: 457px;
  text-align: right;
  padding: 0px 14px 0px 0px;
}

#footer ul {
  margin: 0px 0px 25px 0px;
  padding: 16px 0px 0px 0px;
  font-size: 108%;
}

#footer ul li {
  margin: 0px 0px 0px 0px;
  padding: 0px 15px 0px 0px;
  display: inline;
}

#footer ul li a {
  color: #000000;
  text-decoration: none;
}

#footer strong {
  color: #F50000;
  font-weight: normal;
}

#footer .footer-left img {
  margin-top: 7px;
}

#footer .footer-right .note {
  margin: 0px 0px 0px 0px;
  padding: 16px 0px 0px 0px;
}

#footer .footer-right p {
  margin: 0px 0px 0px 0px;
  padding: 6px 0px 16px 0px;
}
