/* ==================================================
<style type="text/css">
  @import url(/main.css);
</style>
================================================== */

/* ===== General ===== */

body * { margin: 0px; padding: 0px; }

body {
  background-image: url(/img/bdBg.gif);
  background-repeat: repeat-y;
}

img, table, td { border: 0px solid #fff; }

a       { text-decoration: underline; color: #00f; }
a:hover { text-decoration: none; }

b, strong { font-weight: bold; color: #333; }

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

#hdLg { /* Logo <img> */
  position: absolute;
  left: 0px;
  top: 0px;
  width: 1003px;
  height: 159px;
}

#hdLgTwo { /* Logo Part Two <img> */
  position: absolute;
  left: 913px;
  top: 159px;
  width: 54px;
  height: 200px;
}

#hdIl { /* Illustration <img> */
  position: absolute;
  left: 0px;
  top: 159px;
  width: 313px;
  height: 494px;
}

/* ===== Main navigation ===== */

#nv { /* <div> */
  position: absolute;
  left: 337px; /* 313px + 2px + 22px */
  top: 162px;
  width: 570px;
  height: 59px;
  border-bottom: 2px solid #610000;
}

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

#lt {
  position: absolute;
  left: 73px;
  top: 596px;
  width: 208px; /* 313px - 73px - (2 * 16px) */

  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  color: #666;
}

#lt a { color: #610000; }

#lt p { padding-bottom: 14px; } /* font-size + 1px */

#lt ul {
  list-style-type: none;
  padding-bottom: 14px; /* font-size + 1px */
}

#lt li {
  padding: 0px 0px 5px 16px;
  background-image: url(/img/starS.gif);
  background-repeat: no-repeat;
}

#lt li a,
#lt li strong {
  font-weight: bold;
  padding: 1px 3px 1px 3px;
}

#lt li a:hover {
  background-color: #f93;
  color: #fff;
}

#lt li strong {
  background-color: #f30;
  color: #fff;
}

#lt #buy { /* <p> */
  padding-top: 23px; /* font-size + 1px */
  padding-bottom: 23px;
  font-size: 22px;
  font-weight: bold;
  color: #f30;
}

#lt #buy img {
  margin-top: 11px;
  margin-left: 20px;
}

/* ===== Main content ===== */

#mn {
  position: absolute;
  left: 359px; /* 313px + 2px + 22px + 22px */
  top: 250px;
  width: 526px; /* 570px - 22px - 22px */

  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
}

#mn img.floatRight {
  margin: 0px 0px 11px 11px;
  float: right;
}

#mn h1 {
  padding-top: 11px;
  padding-bottom: 5px;
  line-height: 110%;
  letter-spacing: -1px;
  font-size: 33px; /* 22px = same height as main navi (imgs) */
  font-weight: bold;
  color: #f30;
}

#mn h1 span { font-weight: normal; color: #999; }
#mn h1 span i { padding-right: 3px; }

#mn h2 {
  padding-bottom: 5px;
  font-size: 18px;
  font-weight: normal;
  color: #333;
}

#mn h3 {
  padding-bottom: 5px;
  line-height: 110%;
  letter-spacing: -1px;
  font-size: 27px;
  font-weight: normal;
  color: #333;
}

#mn h4 {
  padding-bottom: 5px;
  line-height: 110%;
  font-size: 18px;
  font-weight: normal;
  color: #333;
}

#mn p { padding-bottom: 16px; } /* font-size + 1px */

#mn ul {
  list-style-type: none;
  padding-bottom: 16px; /* font-size + 1px */
}

#mn li {
  padding: 1px 0px 5px 24px;
  background-image: url(/img/starM.gif);
  background-repeat: no-repeat;
}

#mn li span { font-weight: bold; color: #f30; }

#mn li img {
  vertical-align: bottom;
  margin-bottom: 1px;
  margin-left: 3px;
}

/* ===== Quotes ===== */

#mn div.qtDiv img { /* quote <IMG> */
  float: left;
  position: relative;
  left: 22px;
  top: 2px;
}

#mn div.qtDiv p,   /* quote <P> */
#mn div.qtDiv h4,
#mn div.qtDiv ul {
  margin-left: 61px;
  margin-right: 177px;
  border-left: 3px solid #ccc;
  padding-left: 11px;
}
#mn div.qtDiv p span { color: #f30; font-weight: bold; }

/* Quotes navigation */

#mn p.qtNaviOne { /* "Read all comments | Post yours";
                     Used on individual product pages;
                     It's a <P> and it's outside .qtDiv <DIV> */
  float: right;
  margin-top: -2px;  /* up a bit because line-height will have moved it down */
  margin-right: 5px;
  line-height: 22px;
  text-align: right;
  font-weight: bold;
  color: #f30;
}
#mn p.qtNaviOne a { font-weight: normal; }

#mn p.qtNaviTwo { /* "What's this? | Add your comment";
                     Used on the 'show all' comments page */
  text-align: center;
  font-weight: bold;
  color: #f30;
}
#mn p.qtNaviTwo a { font-weight: normal; }
#mn p.qtNaviTwo a img { /* "Tell me more" icon;
                           Similar to #mn li img */
  vertical-align: bottom;
  margin-bottom: 0px;
  margin-left: 3px;
}

#mn p.qtTags { /* Used on the 'show all' and 'show tagged' comments pages */
  padding-left: 7px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  color: #666;
}
#mn p.qtTags a { color: #666; }
#mn p.qtTags a:hover { color: #00f; text-decoration: underline; }
#mn p.qtTags strong { color: #f30; } /* active tag */

/* H el lo  t he re */
#mn h1 span em, #mn p.qtNaviOne em, #mn p.qtNaviTwo em, #mn p.qtTags em,
#mn h1 em, #mn h3 em,
#mn p em {
  position: absolute;
  font-size: 15px;
  text-decoration: none;
}

/* Important! Smileys */
#mn div.qtDiv img.fSm {
  float: none;
  position: relative;
  top: 4px;
  left: 0px;
}

/* ===== Products ===== */

#mn img.pdImg {
  float: left;
  border: 4px solid #ccc;
}

#mn div.pdPrice {
  float: right;
  margin-left: 11px;
  margin-bottom: 11px;
  padding: 11px;
  border: 1px dotted #ccc;
  font-weight: bold;
  color: #333;
}

#mn div.pdPrice img { position: relative; top: 1px; }

#mn div.pdDesc { margin-left: 139px; } /* 120px + 8px + 11px */

#mn div.pdDesc h2 { padding-top: 5px;  }
#mn div.pdDesc h2 span { font-size: 15px; }
#mn div.pdDesc p span { font-weight: bold; color: #f30; }
#lnkBuyOne img { vertical-align: middle; margin-right: 11px; } /* Buy Now button */

#mn div.pdDesc select {
  vertical-align: middle;
  width: 52px;
  font-size: 18px; /* same as H2 */
  color: #333;
}

#mn div.pdDesc select option { padding-left: 5px; }

/* ===== Tables (basket page) ===== */

#mn table { width: 526px; } /* same width as #mn <DIV> */

#mn td {
  padding: 1px 5px 1px 5px;
  text-align: right;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 13px;
}

#mn td.alignLeft { text-align: left; }

#mn #bskHead td { /* #bskHead is <tr> */
  border-top: 2px solid #610000;
  background-color: #f30;
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 18px;
}

#mn #bskSubtotal td,
#mn #bskTotal td {  /* #bskSubtotal and #bskTotal are <tr> */
  background-color: #ddd;
}

#mn #bskTotal td {
  padding-top: 2px;
  padding-bottom: 2px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 18px;
}

/* ===== Tables (input) ===== */

#mn table.inp { width: 526px; } /* same width as #mn <DIV> */

#mn table.inp td {
  padding: 11px 5px 11px 5px;
  border-top: 1px dotted #ccc;
  text-align: left;
  vertical-align: top;
  color: #666;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 10px;
}

#mn table.inp td span {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: normal;
  color: #666;
}

#mn table.inp td input,
#mn table.inp td textarea {
  width: 340px; /* 526*2/3=350px less 10px (cell padding) = 340px */
  margin-bottom: 5px;
  padding: 2px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 13px;
}
#mn table.inp td textarea { height: 160px; }

#mn table.inp td b {
  position: relative;
  left: 2px;
  font-weight: normal;
}

#mn table.inp td.inpHelp { padding-top: 31px; }

/* ===== Table (smileys help) ===== */

#mn table.sml {
  width: 114px; /* 1+11+30+30+30+11+1 = 114px */
  border: 1px solid #999;
  padding: 11px;
  margin: 0px 0px 33px 33px;
}

#mn table.sml td {
  width: 30px;
  height: 30px;
  text-align: center;
  vertical-align: middle;
}

#mn table.sml td b {
    font-family: "Times New Roman", Times, serif;
    font-size: 20px;
}

/* ===== Coupon <div> ===== */

#mn #cpn { /* "cpn" = Coupon <div> */
  float: right;
  width: 415px;
  background: url(/img/cpnBg.gif);
  text-align: right;
}

#mn #cpn h2 { margin-right: 51px; color: #666; } /* no reason for 51px, except it seems OK this way, on IE anyway */

#mn #cpn p {
  margin-right: 56px; /* <H2> margin-right + 5px */
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  color: #333;
}

#mn #cpn p input { vertical-align: middle; }

#mn #cpn #cpnCode {
  width: 144px; /* no reason, it just looks best that way */
  height: 26px;
  /* border: 1px solid #b4b4b4; */
  padding-left: 3px;
  font-size: 18px;
  text-transform: uppercase;
}

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

#mn #ft { /* <p> */
  border-top: 1px dotted #ccc;
  margin-top: 55px; /* <--should be 22px if no girls */
  padding-top: 11px;
  padding-left: 5px;
  line-height: 140%;

  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  color: #666;
}

#mn #ft img { /* girls */
  position: absolute;
  margin-top: -72px;
  margin-left: 383px;
}

#mn #ft a { color: #666; }

