/* Copyright (c) 2006 Tempttress Suppliers Ltd */

/******************************************************************************/
/* Generic base values. */

/* Do not print out... */

@media print
{
  .no_print, noscript
  {
    display: none;
  }
}

a, body, input, select
{
  color: #660033;
  font-family: verdana, arial, helvetica, sans-serif;
}

a
{
  text-decoration: none;
}

a:hover
{
  text-decoration: underline;
}

form
{
  margin: 0px;
}

img
{
  border: none;
}

th, .theading
{
  background-color: #E6B0FF;
  font-weight: bold;
  padding: 5px;
  text-align: center;
}

.clear
{
  clear: both;
}

.disabled_colour
{
  color: #AAAAAA;
}

.float_nest
{
  float: left;
  overflow-x: hidden;
  width: 100%;
}

/* Text sizes */

.item_header
{
  font-size: larger;
  font-weight: bold;
}

.item_normal
{
}

.item_footnote
{
  font-size: smaller;
}

/* Report errors */

.errormsg
{
  background-color: #660033;
  color: #F0D5FF;
  font-size: larger;
  font-weight: bold;
  padding: 2px;
}

.errormsgnorm
{
  background-color: #660033;
  color: #F0D5FF;
  padding: 2px;
}

.errormsgsmall
{
  background-color: #660033;
  color: #F0D5FF;
  font-size: smaller;
  padding: 2px;
}

/* Report success */

.successmsg
{
  background-color: #F0D5FF;
  color: #660033;
  font-size: larger;
  font-weight: bold;
  padding: 2px;
}

.successmsgnorm
{
  background-color: #F0D5FF;
  color: #660033;
  padding: 2px;
}

/* IE padding does not work on hr so fake one as a div... */

.hr
{
  border-top: 1px solid #660033;
  height: 0px;
  margin: 0px;
  width: 100%;
}

/******************************************************************************/

/*
 * The menu bar.
 *
 * <div class="menu">
 * <table cellspacing="0"><tr><td>
 * <ul>
 *
 * For simple menu entries have:
 *
 *   <li><a href="...">text</a></li>
 *
 * otherwise, for menu entries a drop down button is:
 *
 *   <li><a href="...">text
 *     <!--[if gt IE 6]><!--></a><!--<![endif]-->
 *     <table cellspacing="0"><tr><td><ul>
 *       <li><a href="...">text</a></li> ...
 *     </ul></td></tr></table>
 *     <!--[if lte IE 6]></a><![endif]-->
 *   </li>
 *
 * </ul>
 * </td></tr></table>
 * </div>
 *
 * Outer table is needed as for centering as IE6/7 does not support display: table.
 * Inner table is needed as IE6/7 looses track of the drop down.
 * Similarly callspacing is needed as IE6/7 does not support border-collapse.
 * IE6/7 also gets confused about z-index, thus if the menu can wrap around
 * set z-index in decreasing order on the relative position object.
 */

.menu
{
  font-size: 75%;
}

.menu table
{
  margin: 0px auto;
}

.menu ul
{
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.menu li
{
  background-color: #CC33CC;
  float: left;
  position: relative;
}

.menu a
{
  border: 1px outset #660033;
  display: block;
  padding: 2px 4px;
  text-decoration: none;
  white-space: nowrap;
}

.menu_disabled, .menu a.menu_disabled:hover
{
  background-color: #FFDDFF;
}

.menu_selected
{
  background-color: #993399;
}

.menu a:hover, .menu li:hover
{
  background-color: #CC99CC;
  text-decoration: none;
}

.menu ul table
{
  border: 1px outset #660033;
  height: 0px;
  left: 0px;
  position: absolute;
  top: 100%;
  visibility: hidden;
}

.menu td
{
  padding: 0px;
}

.menu ul ul
{
  display: block;
}

.menu ul ul li
{
  background-color: #CCCCCC;
  float: none;
}

.menu ul ul a
{
  border: none;
}

.menu ul :hover table
{
  visibility: visible;
}

/******************************************************************************/

.search
{
  padding: 5px 0px 5px 0px;
  background-color: #E6B0FF;
}

.search div
{
  text-align: center;
}

.search .search_heading
{
  font-weight: bolder;
}

.search input.text
{
  margin: 0px 5px 0px 5px;
  width: 50%;
}

/******************************************************************************/

/* Automatic wrap to content width.  Expects the form:

   <ul class="image_wrapper">
   <li>
     <a ...>
       <span class="image_filler">
         <img />
         <br />
         <span class="image_hover">text</span>
       </span>
     </a>
   </li>

   The image_filler span needs to be the correct width for Mozilla.
   Unfortunately if this value is put directly into the code IE does not allow
   the picture to be used to follow the link. Instead ensure the <a> has the
   correct size and inherit the size. The image_hover is defined as Mozilla
   fails to underline the text when hovering!
*/

.image_wrapper
{
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.image_wrapper li
{
  display: inline;
  font-size: smaller;
  padding: 2px;
  vertical-align: top;
}

.image_wrapper a
{
  display: -moz-inline-box;
  display: inline-block;
  vertical-align: top;
  text-align: center;
}

.image_wrapper span.image_filler
{
  display: block;
  width: inherit;
}

.image_wrapper a:hover span.image_hover
{
  text-decoration: underline;
}

/* Handling for showing image overlay.
   The :hover is required to get IE6 to work. */

.image_wrapper .hidden, .image_wrapper :visited .hidden
{
  display: none;
}

.image_wrapper :hover
{
  text-indent: 0px;
}

.image_wrapper :hover .hidden
{
  background-color: window;
  display: block;
  left: 0px;
  position: absolute;
  top: 0px;
}

/******************************************************************************/
/* Bring together the quick search menu and main content. */

/* Quick bar to appear on left. */

.main_quick_bar
{
  float: left;
}

/* Main content of the page. */

.main_content
{
  margin-left: 258px;
}

@media print
{
  .main_content
  {
    margin-left: 0px;
  }
}

/******************************************************************************/
/* Quick search bar/recently seen items. */

.qs_menu, #rs_menu_id
{
  background-color: #F0D5FF;
  border: 1px solid #660033;
  max-width: 250px;
  padding: 0px 3px 3px 3px;
  width: 250px;
}

#rs_menu_id
{
  margin-top: 3ex;
}

.qs_menu div.qs_heading, #rs_menu_id div.rs_heading
{
  font-weight: bolder;
  padding: 3px 0px 0px 0px;
}

.qs_menu select
{
  padding: 3px 0px 0px 0px;
  width: 100%;
}

.qs_menu div.qs_checkbox
{
  font-size: smaller;
  font-weight: bolder;
  padding: 3px 0px 0px 0px;
}

.qs_menu div.qs_submit
{
  padding: 3px 0px 0px 0px;
  text-align: center;
}

#rs_menu_id ol
{
  font-size: smaller;
  margin: 0px 0px 0px 4ex;
  padding: 0px;
}

/*
 * These are the styles for the type menu.
 *
 * qs_type                     - bottom level, non-selected, has no children
 * qs_type_active              - bottom level, selected, has no children
 * qs_type_child               - bottom level, non-selected, has children

 * qs_type_parent              - upper level, selected, has child (child expanded and selected)
 * qs_type_parent_active_child - upper level, selected, has child (child expanded but not selected)
 */

.qs_menu div#qs_type_background_id
{
  background-color: #E6B0FF;
  font-size: smaller;
  height: 55ex;
  margin-top: 3px;
  position: relative;
}

.qs_menu div#qs_type_background_id div.qs_type_active
{
  background-color: #C86AFF;
  font-weight: bolder;
}

.qs_menu div#qs_type_background_id div.qs_type_parent_active_child
{
  background-color: #C86AFF;
  font-weight: bolder;
}

.qs_menu div#qs_type_background_id div.qs_type_parent
{
  background-color: #DC92FF;
  font-weight: bolder;
}

/******************************************************************************/
/* Multiple item/page list. */

.multilist
{
  background-color: #F0D5FF;
  border-bottom: 1px solid #660033;
  border-top: 1px solid #660033;
  font-size: smaller;
}

.multilist div.multilist_list
{
  float: left;
  margin: 5px 0px 5px 3px;
}

.multilist div.multilist_count
{
  float: right;
  margin: 5px 3px 5px 0px;
}

/******************************************************************************/
/* The banner for a brand. */

.banner
{
  font-size: larger;
  font-weight: bold;
  padding: 5px;
  text-align: center;
}

.banner a:hover
{
  text-decoration: none;
}

/******************************************************************************/
/* Item list display. */

#il_sortform_id
{
  text-align: center;
  width: 100%;
}

/* An item entry in the table. */

.il_item
{
  padding: 5px;
  text-align: center;
  width: 150px;
}

/* No items in the item list. */

#il_empty_id
{
  font-size: larger;
  text-align: center;
}

/******************************************************************************/
/* Item display. */

#id_picturecolumn_id
{
  float: left;
  position: relative;
}

#id_picturecolumn_id div
{
  text-align: center;
}

#id_picturecolumn_id div a
{
  display: inline-block;
}

#id_picturecolumn_id div a:hover
{
  cursor: pointer;
}

#id_picturecolumn_id div a span
{
  display: block;
}

#id_detailscolumn_id #id_position_id
{
  float: left;
  position: relative;
}

#id_detailscolumn_id ul.bullet_list
{
  font-size: smaller;
  margin-bottom: 0px;
  margin-top: 0px;
}


.colour_swabs
{
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.colour_swabs li
{
  display: inline;
  float: left;
}

.colour_swabs span.swab
{
  display: block;
  margin: 5px;
}

.colour_swabs span.swab img.swab
{
  border: 1px solid #000000;
  height: 20px;
  width: 20px;
}

/* Handling for showing image overlay.
   The :hover is required to get IE6 to work. */

.colour_swabs span.hidden
{
  display: none;
}

.colour_swabs :hover
{
  text-indent: 0px;
}

.colour_swabs :hover span.hidden
{
  display: block;
  position: absolute;
  top: 0px;
}

.id_related_item
{
  width: 120px;
}

/* Columns within the table. */

.id_linkedcolumn
{
  vertical-align: middle;
}

/* Old price together price. */

.id_linkedoldprice
{
  text-decoration: line-through;
}

/******************************************************************************/
/* Small basket. */

.sb
{
  text-align: center;
}

.sb div.buttons
{
  padding: 5px 0px 5px 0px;
}

.sb a.button
{
  background-color: #CC33CC;
  border: 1px outset #660033;
  padding: 2px 4px;
  text-decoration: none;
  white-space: nowrap;
}

.sb a.button:hover
{
  background-color: #CC99CC;
}

.sb .footnote
{
  font-size: smaller;
}

/******************************************************************************/
/* Large basket display. */

/* Table containing packages. */

.lb_packages
{
  border: solid 1px #660033;
  width: 100%;
}

/* Individual package. */

.lb_package
{
  border-bottom: solid 1px #660033;
  width: 100%;
}

/* Header of package info. */

.lb_headpackage
{
  text-align: left;
}

/* Flag the default package. */

.lb_headdefault
{
  font-size: smaller;
  text-align: right;
}

/* lb_row_odd - odd rows. */

/* Even rows. */

.lb_row_even
{
  background-color: #F9ECFF;
}

/* Heading in package table - left and right aligned. */

.lb_heading_center
{
  text-align: center;
  font-size: smaller;
}

.lb_heading_left
{
  text-align: left;
  font-size: smaller;
}

.lb_heading_right
{
  text-align: right;
  font-size: smaller;
}

/* Linked to other package. */

.lb_linkedtoother
{
  font-size: smaller;
}

/* Remove column */

.lb_remove
{
  text-align: center;
}

/* Item information - size and colour. */

.lb_item_detail
{
  font-size: smaller;
}

/* Quantity. */

.lb_quantity
{
  padding-right: 3ex;
  text-align: right;
}

/* VAT code. */

.lb_vatcode
{
  padding-right: 3ex;
  text-align: right;
}

/* Price. */

.lb_price
{
  padding-right: 2px;
  text-align: right;
}

/* Status. */

.lb_status
{
  padding-right: 2px;
  text-align: right;
}

/* Subtotal line and voucher discount. */

.lb_subtotalprice, .lb_voucher
{
  background-color: #E6B0FF;
}

/* Total line. */

.lb_totalprice
{
  background-color: #C86AFF;
}

/* Summary information. */

.lb_summary
{
  padding-left: 2px;
  text-align: left;
}

/* Checkout. */

.lb_checkout
{
  float: right;
  text-align: center;
}

.lb_or_method
{
  font-size: smaller;
  padding: 5px 0px 5px 0px;
}

/******************************************************************************/
/* Checkout disabled. */

.cd_disabled
{
  font-size: larger;
}

/******************************************************************************/
/* Billing display. */

.co_heading
{
  background-color: #E6B0FF;
  font-weight: bold;
  padding: 5px;
}

.co_billing
{
  font-size: smaller;
  width: 100%;
}

.co_left
{
  text-align: right;
  width: 30%;
}

.co_link
{
  color: #0000FF;
  text-decoration: underline;
}

.co_link :hover, .co_link :visited
{
  color: #0000FF;
}

.co_continue
{
  text-align: right;
}

/******************************************************************************/
/* Purchase completed successfully. */

.cs_completed
{
  font-size: larger;
  text-align: center;
}

.cs_details
{
  text-align: center;
}

.cs_continue
{
  text-align: center;
}

/******************************************************************************/
/* Purchase authentication. */

.ca_redirect
{
  font-size: larger;
  text-align: center;
}

.ca_noscript
{
  text-align: center;
}

/******************************************************************************/
/* Header style. */

/* Header logo. */

.header_logo
{
  float: left;
  text-decoration: none;
}

/* The small basket. */

.header_basket
{
  float: right;
}

/* Buttons in header. */

.header_buttons
{
  float: left;
  font-size: smaller;
}

.header_buttons a
{
  font-variant: small-caps;
  padding: 2px 4px;
  white-space: nowrap;
}

.header_buttons .border_left
{
  border-left: 1px solid #660033;
}

/******************************************************************************/
/* Footer style. */

#footer_id
{
  clear: both;
  font-size: smaller;
  text-align: center;
}

/******************************************************************************/
/* Authentication styles. */

/* Authentication table. */

#au_auth_id
{
  table-layout: fixed;
  width: 100%;
}

/* Group the authentication entry. */

#au_groupauth_id
{
  border-right: 1px solid #660033;
  vertical-align: top;
}

/* Group the registration entry. */

#au_groupreg_id
{
  vertical-align: top;
}

/* Give divs a margin to space them out. */

#au_auth_id div
{
  margin: 10px;
}

/* Description less prominent. */

#au_auth_id .description
{
  font-size: smaller;
}

/******************************************************************************/
/* Lost password styles. */

/* Give divs a margin to space them out. */

#lp_request_id div
{
  margin: 10px;
}

/* Description less prominent. */

#lp_request_id .description
{
  font-size: smaller;
}

/******************************************************************************/
/* Account styles. */

#ua_account_id table
{
  margin: 0px auto;
}

#ua_tabs_id
{
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

#ua_tabs_id li
{
  border: inset 1px #660033;
  float: left;
  text-align: center;
}

/* Current active tab. */

.ua_tab_current
{
  background-color: #993399;
  font-weight: bold;
  padding: 5px;
}

/* Selectable active tab. */

.ua_tab_active
{
  background-color: #CC33CC;
  font-weight: bold;
}

/* Unselectable inactive tab. */

.ua_tab_inactive
{
  background-color: #FFDDFF;
  color: #AAAAAA;
  padding: 5px;
}

/* Link to active tabs. */

#ua_tabs_id a
{
  display: block;
  padding: 5px;
  white-space: nowrap;
}

#ua_tabs_id a:hover
{
  background-color: #CC99CC;
  text-decoration: none;
}

/* The page holding the information. */

#ua_page_id
{
  text-align: center;
}

/* Tab table. */

.ut_table
{
  border: 1px solid #660033;
  min-width: 400px;
  width: 75%;
}

/* The description of the table. */

.ut_describe
{
  font-size: smaller;
  font-weight: normal;
}

/* ut_row_odd - odd rows. */

/* Even rows. */

.ut_row_even
{
  background-color: #F9ECFF;
}

/* left column on row. */

.ut_left
{
  text-align: right;
}

/* right column on row. */

.ut_right
{
  text-align: left;
}

/* centre in column on row. */

.ut_center
{
  text-align: center;
}

/******************************************************************************/
/* Enlarged image display. */

/* Everything is centered. */

#ie_enlarge_id
{
  text-align: center;
}

#ie_enlarge_id #title_id
{
  font-size: larger;
  font-weight: bolder;
}

#ie_enlarge_id #images_id
{
  margin: 0px auto;
  position: relative;
}

#ie_enlarge_id .hidden, .ie_enlarge_id :visited .hidden
{
  display: none;
}

#ie_enlarge_id a
{
  white-space: nowrap;
}

#ie_enlarge_id :hover
{
  text-indent: 0px;
}

#ie_enlarge_id a:hover .hidden
{
  background-color: window;
  display: block;
  left: 0px;
  position: absolute;
  top: 0px;
}

#ie_enlarge_id .separator
{
  color: #AAAAAA;
  margin: 0px 5px;
}

#ie_enlarge_id span.swab
{
  display: -moz-inline-box;
  display: inline-block;
  margin: 5px;
}

#ie_enlarge_id span.swab img.swab
{
  border: 1px solid #000000;
  height: 20px;
  width: 20px;
}

/******************************************************************************/
/* Style for size table. */

.size_table_female
{
  border: 1px solid #660033;
  text-align: center;
}

.size_table_female thead
{
  background-color: #E6B0FF;
  font-weight: bolder;
}

.size_table_female tbody tr.even
{
  background-color: #F9ECFF;
}

.size_table_female tbody tr.odd
{
}

.size_table_female td
{
  padding: 1px 2px 1px 2px;
}

.size_table_male
{
  border: 1px solid #660033;
  text-align: center;
}

.size_table_male thead
{
  background-color: #66B0FF;
  font-weight: bolder;
}

.size_table_male tbody tr.even
{
  background-color: #ECF9FF;
}

.size_table_male tbody tr.odd
{
}

.size_table_male td
{
  padding: 1px 2px 1px 2px;
}