/* File Content
-----------------------------------------------
 1/ Global Structure
 2/ Leftbar Structure
 3/ Rightbar Structure
 4/ Headings
 5/ Navigation + Links
 6/ Header
 7/ Footer
 8/ Tables
 9/ Lists
 10/ Forms
 11/ Misc
 12/ End
----------------------------------------------- */
 

/* =Global Structure
----------------------------------------------- */
body {
margin: 0;
background: #ccc;
color: #aaa;
font: 12px/1.5em helvetica, arial, sans-serif;
}
img {
padding: 0;
margin: 0;
border: 0;
}
/* 'horizon' gives indication of vertical center, achieves centering 
   by holding 'container' block with negative margins of half 
   height/width 
*/
#horizon {
display: block;
width: 100%;
height: 1px;
background: transparent;
text-align: center;
position: absolute;
left: 0px;
top: 50%;
overflow: visible;
visibility: visible;
}
#container {
/* half of width */
margin-left: -342px;
width: 683px;
height: 454px;
position: absolute;
/* half of height */
top: -227px;
left: 50%;
visibility: visible;
}
/* =Leftbar Structure
----------------------------------------------- */
div#content {
background: #f2eadd;
margin: 0;
padding: 11px 13px;
border: 10px solid #fff;
height: 338px;
}
body#home div#content {
background: transparent url(../../images/cover_bg3.jpg) 0 0 no-repeat;
}

div#content1 {
background: #f2eadd;
margin-top: -10px;
margin-left: 0px;
height: 338px;
}
div#content1 {
background: transparent url(../../images/cover_bg.jpg) 0 0 no-repeat;
}









div#box {
height: 336px;
overflow: auto;
background: #fff;
text-align: left;
color: #19236E;
font: 9px/1.6em verdana;
}
div#box.category {
height: 360px;
overflow: auto;
background: transparent url(../images/bg_category.jpg) 100% 0 no-repeat;
position: relative;
top: -11px;
right: -12px;
}
body#home div#box {
background: transparent;
width: 10px;
border: 1px solid red;
}
body#menu6 div#box {
font: 12px/1.5em helvetica, arial, sans-serif;
}
div#box p {
padding: 0 20px;
clear: both;
}
div#box ul.std_list {
list-style-position: inside;
padding: 10px 20px 0 20px;
}
div#box ul.std_list li {
margin-bottom: 10px;
}
body#menu1 img {
float: right;
margin: 20px 20px 0 10px;
}
body#menu1 img#2 {
float: left;
margin: 12px 20px 0 20px;
}
p.top {
margin-top: 20px;
}
div#home_blurb {
position: relative; 
top: 25px; 
left: 0; 
width: 270px;
color: #17267d;
}
div#home_blurb p {
font: 11px/1.7em verdana, sans-serif; 
color: #fff; 
float: left; 
text-align: left; 
margin: 5px 0;
color: #17267d;
}
/* blurbs */
  div#box p.blurb {
   font: bold 9px/1.7em verdana;
   color: #8F8F8F;
   border-top: 1px solid #CCC;
   width: 185px;
   margin: 0 0;
   padding: 4px 6px;
   position: absolute;
   top: 114px;
   display: none;
  }

/* product text */
div.description {
 width: 470px;
 margin: 0;
 padding: 0;
 position: absolute;
 display: none;
 top: 275px;
}
 div.description.two-line {
  top: 295px;
 }
div.description h5 {
 float: left;
 margin: 0 0 5px 20px;
 font: bold 10px/1.3em verdana;
}
div.description p {
 line-height: 1.4em;
 margin: 0 0 6px;
 position: relative;
 z-index: 100;
}
div.description img {
 position: absolute;
 top: 70px;
 left: 12px;
 z-index: 0;
}

/* =Headings
----------------------------------------------- */
h1 { 
margin: 0;
}
h1 a {
display: block; 
width: 134px; 
height: 49px; 
background: transparent url(../images/pola.gif) 0 0 no-repeat;
text-indent: -9999px;
float: left;
padding-right: 25px;
}
body#home h1 a {
background: transparent url(../../images/title_blue.gif) -16px 0 no-repeat;
}
h2 {
margin: 0;
font: 18px/1em helvetica, arial, sans-serif;
color: #bbb;
border-bottom: 1px solid #ccc;
padding: 24px 0 24px 20px;
}
 .products h2 {
  border-bottom: 0;
  padding-bottom: 8px;
 }
  .products1 h2 {
  border-bottom: 0;
  padding-bottom: 20px;
 }
 body#home h2 {
 margin: 5px 0;
 float: left;
 text-align: left;
 font: bold 10px/1em verdana, helvetica, arial, sans-serif;
 color: #fff;
 color: #17267d;
 border-bottom: 0;
 padding: 0;
 }
/* about heading */
body#menu1 h2,
body#menu2 h2,
body#menu3 h2,
body#menu4 h2,
body#menu5 h2,
body#thanks h2 {
background: #fff url(../images/bg_about.jpg) right top no-repeat;
}
/* stockist heading */
body#menu6 h2 {
padding: 20px 0 35px 20px;
}
h3 {
position: relative;
top: -10px;
display: block;
margin: 0 20px 30px;
width: 300px;
clear: both;
font: normal 16px/1em helvetica, arial, sans-serif;
}

/* =Navigation + =Links
----------------------------------------------- */

    /* =Navigation
    ----------------------------------------------- */
    ul.nav { 
    width: 683px;
    height: 37px;
    margin: 0; 
    padding: 0;
    }
    ul.nav li { 
    margin: 0; 
    padding: 0; 
    list-style: none; 
    float: left;
    } 
    ul.nav li, ul.nav a { 
    height: 37px; 
    display: block; 
    } 
    /* Hide Text For CSS */
    ul.nav li a { 
    text-indent: -9999px; 
    text-decoration: none;
    } 
    
    /* =Primary Nav
    ----------------------------------------------- */
    ul.nav#top {
    background: transparent url(../images/nav.gif) 0 0 no-repeat; 
    }
    /* Image Placement */
    .menu1 {left: 0; width: 112px;}
    .menu2 {left: 112px; width: 115px;}
    .menu3 {left: 227px; width: 138px;}
    .menu4 {left: 365px; width: 86px;}
    .menu5 {left: 451px; width: 101px;}
    .menu6 {left: 552px; width: 131px;}
    /* Mouse Overs */
    .menu1 a:hover {background: transparent url(../images/navo.gif) -0 0 no-repeat;}
    .menu2 a:hover {background: transparent url(../images/navo.gif) -112px 0 no-repeat;}
    .menu3 a:hover {background: transparent url(../images/navo.gif) -227px 0 no-repeat;}
    .menu4 a:hover {background: transparent url(../images/navo.gif) -365px 0 no-repeat;}
    .menu5 a:hover {background: transparent url(../images/navo.gif) -451px 0 no-repeat;}
    .menu6 a:hover {background: transparent url(../images/navo.gif) -552px 0 no-repeat;}
    /* You are here */
    body#menu1 .menu1 {background: transparent url(../images/nava.gif) -0 0 no-repeat;}
    body#menu2 .menu2 {background: transparent url(../images/nava.gif) -112px 0 no-repeat;}
    body#menu3 .menu3 {background: transparent url(../images/nava.gif) -227px 0 no-repeat;}
    body#menu4 .menu4 {background: transparent url(../images/nava.gif) -365px 0 no-repeat;}
    body#menu5 .menu5 {background: transparent url(../images/nava.gif) -451px 0 no-repeat;}
    body#menu6 .menu6 {background: transparent url(../images/nava.gif) -552px 0 no-repeat;}

    /* =Secondary Nav
    ----------------------------------------------- */
    ul.nav#bottom {
    background: transparent url(../images/nav_bot.gif) 0 0 no-repeat; 
    }
    /* Image Placement */
    .botmenu1 {left: 0; width: 114px;}
    .botmenu2 {left: 114px; width: 114px;}
    .botmenu3 {left: 228px; width: 114px;}
    .botmenu4 {left: 342px; width: 114px;}
    .botmenu5 {left: 456px; width: 114px;}
    .botmenu6 {left: 570px; width: 110px;}
    /* Mouse Overs */
    .botmenu1 a:hover {background: transparent url(../images/navo_bot.gif) -0 0 no-repeat;}
    .botmenu2 a:hover {background: transparent url(../images/navo_bot.gif) -114px 0 no-repeat;}
    .botmenu3 a:hover {background: transparent url(../images/navo_bot.gif) -228px 0 no-repeat;}
    .botmenu4 a:hover {background: transparent url(../images/navo_bot.gif) -342px 0 no-repeat;}
    .botmenu5 a:hover {background: transparent url(../images/navo_bot.gif) -456px 0 no-repeat;}
    .botmenu6 a:hover {background: transparent url(../images/navo_bot.gif) -570px 0 no-repeat;}
    /* You are here */
    body#botmenu1 .botmenu1 {background: transparent url(../images/nava_bot.gif) -0 0 no-repeat;}
    body#botmenu2 .botmenu2 {background: transparent url(../images/nava_bot.gif) -114px 0 no-repeat;}
    body#botmenu3 .botmenu3 {background: transparent url(../images/nava_bot.gif) -228px 0 no-repeat;}
    body#botmenu4 .botmenu4 {background: transparent url(../images/nava_bot.gif) -342px 0 no-repeat;}
    body#botmenu5 .botmenu5 {background: transparent url(../images/nava_bot.gif) -456px 0 no-repeat;}
    body#botmenu6 .botmenu6 {background: transparent url(../images/nava_bot.gif) -570px 0 no-repeat;}

    /* =Section Nav
    ----------------------------------------------- */
    ul.nav#section {
    background: transparent url(../images/nav_sect.gif) 0 0 no-repeat; 
    width: 320px;
    float: left;
    position: relative;
    top: -22px;
    left: 20px;
    }
    /* Image Placement */
    .sectmenu1 {left: 0; width: 51px;}
    .sectmenu2 {left: 51px; width: 107px;}
    .sectmenu3 {left: 158px; width: 161px;}
    /* Mouse Overs */
    .sectmenu1 a:hover {background: transparent url(../images/nav_secto.gif) -0 0 no-repeat;}
    .sectmenu2 a:hover {background: transparent url(../images/nav_secto.gif) -51px 0 no-repeat;}
    .sectmenu3 a:hover {background: transparent url(../images/nav_secto.gif) -158px 0 no-repeat;}
    /* You are here */
    .sectmenu1 a.selected {background: transparent url(../images/nav_secta.gif) -0 0 no-repeat;}
    .sectmenu2 a.selected {background: transparent url(../images/nav_secta.gif) -51px 0 no-repeat;}
    .sectmenu3 a.selected {background: transparent url(../images/nav_secta.gif) -158px 0 no-repeat;}

    /* =State Nav
    ----------------------------------------------- */
    ul#states {
    margin: -30px 20px 0;
    padding: 0;
    list-style: none;
    float: left;
    border-bottom: 1px solid #eee;
    width: 420px;
    }
    ul#states li {
    float: left;
    color: #efefef;
    margin: 0;
    }
    ul#states li em {
    font-style: normal;
    color: #8c8c8c;
    }
    ul#states li a {
    margin: 0;
    padding: 3px 10px;
    color: #19236E;
    text-decoration: none;
    border-right: 1px solid #eee;
    }
    ul#states li.last a {
    border-right: 0;
    }
    ul#states li#selected a {
    background: #eee;
    }
    ul#states li a:hover {
    background: #F2F0E6;
    }
    
    /* =Side Nav
    ----------------------------------------------- */
    ul#sidenav {
     margin: 0;
     padding: 0;
     width: 135px;
     text-align: left;
     list-style-type: none;
     float: left;
     clear: left;
     top: 108px;
     position: absolute;
    }
      ul#sidenav ul {
       top: 0;
       position: relative;
       list-style-type: none;
       left: 0;
       float: left;
       clear: both;
       margin: 0;
       padding: 0;
      }
    ul#sidenav li  {
     float: left;
     clear: both;
     width: 135px;
    }
    ul#sidenav h4 {
     padding: 0;
     margin: 0;
     width: 134px;
     height: 55px;
     border-bottom: 1px solid #ccc;
     text-indent: -9999px;
     background: transparent url(../images/title_mid_cosmetics.gif) 0 0 no-repeat;
    }
    ul#sidenav h4#skincare-title {
     background: transparent url(../../images/title_mid_skincare.gif) 0 0 no-repeat;
    }
    ul#sidenav li a {
     margin: 0;
     padding: 3px 7px;
     display: block;
     font: bold 10px/1.2em verdana, arial;
     text-decoration: none;
     color: #19236E;
     border-bottom: 1px solid #ccc;
    }
      ul#sidenav ul li a {
       font-weight: normal;
       border: 0;
       font: 9px verdana;
       padding: 2px 7px;
      }
    ul#sidenav li a:hover {
     text-decoration: underline;
    }
    ul#sidenav li.selected a {
     color: #CC0000;
    }

    /* =Prod List
    ----------------------------------------------- */
    ul#prodlist {
     margin: 0;
     padding: 0 0 0 20px;
     list-style-type: none;
     float: left;
     border-bottom: 1px solid #ccc;
     width: 458px;
    }
    ul#prodlist li {
     float: left;
     margin-right: 18px;
    }
    ul#prodlist li.last {
     margin-right: 0;
    }
    /* =Prod Pagination
    ----------------------------------------------- */
    ul#pagination {
     margin: 0 0 0;
     padding: 0;
     list-style-type: none;
     float: right;
     position: relative;
     z-index: 999;
    }
    ul#pagination li {
     float: left;
     margin-right: 4px;
     color: #ccc;
     font: 10px/1em verdana;
    }
    ul#pagination li a {
     color: #8F8F8F;
     font-weight: bold;
     padding: 4px;
     line-height: 2em;
    }
    ul#pagination li.selected a {
     color: #CC0000;
     text-decoration: none;
    }
 

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

/* =Footer
----------------------------------------------- */
/* =Tables
----------------------------------------------- */
table#stockist_list {
clear: both;
border-collapse: collapse;
margin: 0 20px;
width: 420px;
font-size: 11px;
color: #999;
}
table#stockist_list td {
border-bottom: 1px solid #eee;
padding: 5px 0 5px 5px;
vertical-align: top;
background: #f6f6f6;
line-height: 1.3em;
}
table#stockist_list td.phone {
white-space: nowrap;
padding-right: 10px;
width: 70px;
}
table#stockist_list td.name {
white-space: nowrap;
width: 180px;
}
table#stockist_list th {
padding-left: 5px;
text-align: left;
color: #19236E;
font-size: 12px;
}
table#stockist_list tr#header_row td {
height: 0;
border: 0;
background: #fff;
padding-top: 0;
padding-bottom: 0;
}
table td.form_title {
white-space: nowrap;
width: 100px;
}
/* =Lists
----------------------------------------------- */
/* =Forms
----------------------------------------------- */
table#form {
margin: 30px 20px 20px;
text-align: right;
}
table#form td {
padding: 0 10px 10px 0;
vertical-align: top;
}
form input.text, textarea {
background: #f2eadd;
width: 280px;
}
textarea {
height: 90px;
}
/* =Misc and =Redundant
----------------------------------------------- */
/* =End
----------------------------------------------- */

