﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.physiciansskincare.com/
   TEMPLATE NAME:  Physicians Skin Care
   DATE:           June-20th-2008
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #fff url(/images/bg.gif) repeat-x;
} 

table div {
text-align: left;
}

blockquote  {
padding-left: 20px;
list-style-type: none;
}

blockquote li {
list-style-type: none;
}


#table1 a {
color: #030371;
font-size: 10pt;
}

#table1 {
background-color: white;
}

font B a {
color: red
}


.none {
background: none;
}

/* ----------Cart-------------------- */

font, table, tr, td {
font-family: 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
}

table, td, tr {
border: none;
}

table b {
color: #000;
}

table a {
color: #ef1e31
}

td table tr td font a {
font: 8pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
color: blue
}

table hr {
border: none;
border-bottom: 1px solid #b5b5b5;
height: 0px;
}

/* ----------Centered Container Or the Layout--------------------- */

#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 960px;
background-color: #FFF;
} 


/* --------------LABELS BUTTONS & FORMS-----------*/
 
label {
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #777;
}
 
.form, textarea, #name {
width: 20em;
border: 1px solid #777;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
padding: 2px;
margin-bottom: 20px;
}
 
.button {
width: 6em;
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #fff;     
background: #030371;
padding: 4px 5px;
border: 1px solid #030371;
}

/* --------------HEADER------------- */

#tophead {
font: bold 14pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
text-transform: uppercase;
color: #FFF;
height: 48px;
background: url('/images/tophead_bg.gif') no-repeat;
}

#tophead .right {
float: right;
padding-top: 11px;
}

#tophead a {
color: #FFF;
}

#tophead .left {
float: left;
padding-top: 12px;
}


#header {
background-color: red;
height: 110px;
background: url('/images/header_bg.gif') no-repeat;
}

/* --------------LOGO IN HEADER *always use this*------------- */

.logolink {
background-image: url('/images/logo.gif');
background-repeat: no-repeat;
height: 110px;
width: 619px;
float:left
}
 
.logolink a { float: left;  }
 
#swap {background-image: url(/images/logo.gif);  width: 619px;  height: 110px;  }
 
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


/* --------------CART & SEARCH------------- */

#holiday {
float: left;
width:140px;
}


#cartsearch {
float: right;
margin-top: 10px;
margin-right: 10px;
width:140px;
font: 8pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
text-transform: uppercase;
}

#cartsearch td {
text-align: right;
}

#cartsearch font {
font: 8pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
color: #030371;
}

#cartsearch img{
float: left;
}

#cartsearch b {
float: left;
background: url(/images/icon_shopbag.gif) no-repeat;
width: 45px;
height: 32px;
}

#cartsearch div {
float: right;
text-align: right;
}

#cartsearch a {
color: #030371;
}

.clear {
clear: both;
}

#cartsearch .search {
padding: 10px 0px 0px 0px;
}

 
#cartsearch input {
border: 1px solid #d1d1d1;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
padding: 2px;
}

#cartsearch .cartbutton {
border: none;
height: 11px;
width: 33px;
}


/* --------------TOPNAV------------- */

.images {
background: url('/images/navbg.gif') repeat-x;
height: 46px;
width: 100%;
}

.images a { float: left; }

#swap01 {background-image: url(/images/nav_home.gif);  width: 68px;  height: 46px; }
#swap02 { background-image: url(/images/nav_products.gif); width: 125px;  height: 46px; }
#swap03 { background-image: url(/images/nav_skintype.gif); width: 86px;  height: 46px; }
#swap04 {background-image: url(/images/nav_producttype.gif);  width: 131px;  height: 46px; }
#swap05 { background-image: url(/images/nav_skinconditions.gif); width: 147px;  height: 46px; }
#swap06 { background-image: url(/images/nav_kit.gif); width: 48px;  height: 46px; }
#swap07 { background-image: url(/images/nav_allbiomedic.gif); width: 120px;  height: 46px; }
#swap08 { background-image: url(/images/nav_laroche.gif); width: 175px;  height: 46px; }
#swap09 { background-image: url(/images/nav_blog.gif); width: 60px;  height: 46px; }


.rollover { display: inline; } /* Allow setting widths and heights */
.rollover img { height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


.catalog{
background: url('/images/navbg.gif') repeat-x;
height: 46px;
width: 100%;
}

.catalog a { float: left; }

/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
background: #FFF url(/images/mainbg.gif) repeat-x; /* Main DIV Background Img */
}

#main .content, ul {
padding: 0px;
margin: 16px;
margin-left: 10px;
margin-right: 312px;
}

#main .subcontent {
margin: 16px;
min-height: 170px; /* Height of Background Img */
}

/* --------------MAIN LINKS----------------*/

#main .links {
padding: 0px;
margin: 0px;
}

#main .links ul{
padding: 0px 0px 10px 0px;
margin: 0px;
}

#main .links li {
display: inline;
}

#main .links li a {
color: #030371;
text-decoration: none;
padding: 0px 10px 0px 0px;
font: 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
text-transform:uppercase;
}

#main .links li a:hover {
text-decoration: underline
}
/* --------------MAIN LINKS----------------*/


#main h1 {
font: 18pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
color: #030371;
text-transform: uppercase;
letter-spacing: 1px;
}

#main a {
color: #030371;
font: 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
}

#main p, ul {
font: 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
color: #5d6161;
}

#main .navright {
float:right; 
width: 280px;
margin: 16px;
padding: 0px;
}

#main .navright .featured {
background: #fff url(/images/featuredbg.gif) repeat-x;
padding: 12px;
height: auto;
}

#main .navright div{
margin-top: 8px;
}


#main .navright .featured h3 {
background: url(/images/featuredhead.gif) no-repeat;
height: 70px;
}

#main .navright .featured img {
float: left;
margin-right: 15px;
}

#main .navright .featured p {
font: bold 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
text-transform:uppercase;
color: #030371;
margin-top: 35px;
}

#main .navright .featured a {
font: 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
color: #5d6161;
text-transform:uppercase
}

#main .navright .newproduct {
background: #fff url(/images/featuredbg.gif) repeat-x;
padding: 6px 0px 0px 6px;
height: auto;
margin-top: 20px;
width: 265px;
}

#main .navright .newproduct img {
float: none;
margin-bottom: 8px;
}


#main .navright .newproduct h2 {
font: bold 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
text-transform:uppercase;
color: #030371;
}


#main .navright .newproduct p {
font: 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
color: #5d6161;
text-transform:none;
margin: 0px;
}



#main .navright .newproduct h3 {
background: url(/images/newproducthead.gif) no-repeat;
height: 72px;
}

.center {
text-align: center;
}


.clear {
clear:both
}


/* --------------LEFTNAVBAR-------------------------- */

#leftnav {
margin-top: 10px;
}

#leftnav ul {
margin: 0px;
padding: 0px;
}

#leftnav li {
padding-bottom: 10px;
}

#leftnav a {
font-weight: bold;
}

#leftnav a:hover {
color: #70c4d1;
}


/* --------------IMG ROTATOR------------- */

#imgrtr {
background-color: white;
width: 635px;
height: 309px;
border: 1px solid #e2e2e2;
}

/* --------------HOME DESCRIPTION------------ */

#homedescription {
background: #FFF url('images/aquabg.gif') repeat-x;
margin-top: 12px;
height: 200px;
height: auto;
font: 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
color: #5d6161;
padding: 12px;
}

#homedescription h2 {
background: url('images/head_laroche.gif') no-repeat;
height: 62px;
}

#homedescription h3 {
background: url('images/head_about.gif') no-repeat;
height: 62px;
}


/* --------------FOOTER------------- */

.clear {
clear: both;
}

#footer, .push { 
clear: both;
width: 960px;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background: url('/images/footerbg.gif') repeat-x;
height: auto;
}

#footer .content { 
width: 960px; 
margin: 0 auto; 
position: relative; 
height: 182px;
}


#footer .holder {
font: 10pt 'Trebuchet MS', Arial, Verdana, Tahoma, Sans-serif;
padding: 15px;
color: #5d6161;
}


/* --------------FOOTER LINKS------------- */

#footer ul, #catalogfooter ul {
padding: 75px 10px 10px 10px;
}

#footer .links ul, #catalogfooter .links ul {
padding: 0px;
}

#footer .links li, #catalogfooter .links li  {
display: inline;
list-style-type: none;
}

#footer .links li a, #catalogfooter .links li a  {
color: #FFF;
text-decoration: none;
border-right: 1px solid;
padding: 0px 10px 0px 10px;
font: 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
}

#footer .links li a:hover, #catalogfooter .links li a:hover  {
text-decoration: underline;
}


/* --------------FOOTER KEYLINKS-------------------------- */

.keylinks { margin-top: 10px; color: #A6A6A6; font: 8pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif; }
.keylinks a { text-decoration:underline; color: #A6A6A6; font: 8pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif; }

/* --------------CATALOG FOOTER-------------------------- */

#catalog a {
text-decoration:underline;
color: #030371;
font: 10pt 'Trebuchet MS', Tahoma, Verdana, Arial, Sans-serif;
}


#catalogfooter, .push { 
clear: both;
width: 100%;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#catalogfooter {
background: url('/images/footerbg.gif') repeat-x;
height: auto;
}

#catalogfooter .content { 
width: 100%; 
margin: 0 auto; 
position: relative; 
height: 182px;
}


/* ----- Customer Cart TABLES ---------- */
#awscustomertables table{margin: 1em; border-collapse: collapse;}
#awscustomertables td{ padding: .3em; border: 1px #F2F2F2 solid; }
#awscustomertables th{ padding: .3em; border: 1px #F2F2F2 solid; background: #F2F2F2; }
