/* ----- Master Style Sheet for De Beautique ----- */
/* ----- Author: Mang Creative - 0845 33 12 987  ----- */
/* ----- Year : 2008 ----------------- */
/* ----- CSS Document -----*/

body { background: #fff; font: 70%/140% Arial, Helvetica, Verdana, Tahoma, sans-serif; margin: 0px auto; text-align: center; }
#wrapper { position: relative; margin-right: auto; margin-left: auto; margin-top: 30px; width: 980px; text-align: left; }
#container { position:relative; margin-bottom: 1.5em; height: auto; }
img { border: 0; }

#topright { position: absolute; right: 0; top: 0; display: block; height: 150px; width: 150px; background: url(../images/misc/banner.gif) no-repeat; text-indent: -999em; text-decoration: none;} 

/************** header styles *****************/

#header { width: 100%; height: 85px; }
.header-left { width: 60%; float: left; margin: 20px 0 0 0; }
.header-right { width: 20%; float: right; text-align: right; margin: -35px 15px 0 0;  }
a.header { padding: 0 auto; margin: -5px 0 0 -2px; }
.header a { margin: 0 auto; padding: 0 auto; }
.subscribe { background: url(../images/icons/header/subscribe-us-drop.gif) top no-repeat; }
.subscribe-table { padding: 10px 0; }

/************** menus *****************/

a.menu-call { margin: 0 auto; float: left; display: block; width: 75px; height: 25px; background: url("../images/icons/header/call-us.jpg") 0 0 no-repeat; text-decoration: none; overflow: hidden; }
a:hover.menu-call { background-position: -80px 0; }
a.menu-email { margin: 0 auto; float: left; display: block; width: 85px; height: 25px; background: url("../images/icons/header/email-us.jpg") 0 0 no-repeat; text-decoration: none; overflow: hidden; }
a:hover.menu-email { background-position: -90px 0; }
a.menu-visit { margin: 0 auto; float: left; display: block; width: 85px; height: 25px; background: url("../images/icons/header/visit-us.jpg") 0 0 no-repeat; text-decoration: none; overflow: hidden; }
a:hover.menu-visit { background-position: -90px 0; }
a.menu-subscribe { margin: 0 auto; float: left; display: block; width: 120px; height: 25px; background: url("../images/icons/header/subscribe-us.jpg") 0 0 no-repeat; text-decoration: none; overflow: hidden; }
a:hover.menu-subscribe { background-position: -120px 0; }

.menu5 { text-align:left; font-family: verdana, sans-serif; position:relative; font-size:0.9em; margin:0; padding:0; list-style-type:none; }
.menu5 ul { padding:0; margin:0; list-style-type:none; /* for Firefox */ }
.menu5 li { float:left; position:relative; } 
.menu5 li a, .menu5 li a:visited { display:block; text-decoration:none; color:#000; float:left; margin-right:0.5em; height:3em; line-height:3em; color:#909;  }

.menu5 li ul { visibility:hidden; position:absolute; top:2.5em; left:0; height:0; overflow:hidden; }
.menu5 table { margin:-1px; border-collapse:collapse; font-size:1em; /* font size for IE5.5 */ }

/* fist line style for IE7 and non-IE browsers and the second line for IE5.5 and IE6 */
.menu5 li:hover a, .menu5 li a:hover { text-decoration:underline; border:0; }
.menu5 li:hover ul, .menu5 li a:hover ul { visibility:visible; height:auto; width: 160px; background:#fff; border-left:1px solid #88903B;  border-right:1px solid #88903B;  border-bottom:1px solid #88903B;left:0; top:2.5em; overflow:visible; }
.menu5 li:hover ul li a, .menu5 li a:hover ul li a { display:block; font-weight:normal; background:transparent; text-decoration:none; height:auto; line-height:1.5em; padding:0.5em; width: 150px; }

* html .menu5 li a:hover ul li a { width:10em; w\idth:100px; /* hack for IE5.5 */ }

.menu5 li:hover ul li a.drop, .menu5 li a:hover ul li a.drop { font-weight:bold; padding: 0 auto; margin: 0 auto; }
.menu5 li:hover ul li ul, .menu5 li a:hover ul li a ul { visibility:hidden; position:absolute; top:0; left:9.5em; height:0; overflow:hidden; }
.menu5 li:hover ul li a:hover, .menu5 li a:hover ul li a:hover { text-decoration:underline; }
.menu5 li:hover ul li:hover ul, .menu5 li a:hover ul li a:hover ul { visibility:visible; color:#000; border:1px solid #ddd; height:auto; background:#fff; width:9.5em; } 
.menu5 li:hover ul li:hover ul.left, .menu5 li a:hover ul li a:hover ul.left { left:-9.3em; } 
.menu5 li:hover ul li:hover ul li a, .menu5 li a:hover ul li a:hover ul li a { display:block; height:auto; }
.menu5 li:hover ul li:hover ul li:hover a, .menu5 li a:hover ul li a:hover ul li a:hover { text-decoration:underline; }

#navcontainer { width: 100%; height: 25px; }
#navcontainer ul { border: 0; margin: 0; padding: 0; list-style-type: none; text-align: center; }
#navcontainer ul li { display: block; float: left; text-align: center; padding: 0; margin: 0; }
#navcontainer ul li a { background: #88903B; width: 161px; height: 18px; border-top: 1px solid #88903B; border-left: 1px solid #88903B; border-bottom: 1px solid #88903B; border-right: 1px solid #fff; padding: 2px 0 0 0; margin: 0; color: #fff; text-decoration: none; display: block; text-align: center; font: bold 95% "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif; }
#navcontainer ul li a:hover { color: #88903B; background: #fff; border-left: 1px solid #fff; } 

#treatments-container { width: 260px; }
#treatments-list { padding-left: 0; margin-left: 0; border-bottom: 1px solid #fff; width: 100%; text-align: right; }
#treatments-list li { list-style: none; margin: 0; padding: 0.25em; border-top: 1px solid #fff; color: #999; }
#treatments-list li:hover { background: #88903B; color: #fff; }
#treatments-list li a { font-weight: bold; text-decoration: none; color: #999; }
#treatments-list li a:hover { background: #88903B; color: #fff; }

#breadcrumb-container { margin-bottom: 1em; overflow: hidden; width: 460px; }
#breadcrumb-list { list-style-type: none; margin: 0;  padding: 0; }
#breadcrumb-list li { border-left: 1px solid #cecece; float: left; line-height: 1.1em; margin: 0 .75em 0 -.75em; padding: 0 .75em 0 .75em; }
#breadcrumb-list li a { font-size: 90%; color: #88903B;text-decoration: none;  }

/************** content *****************/

#content-holder { background: url(../images/background/header-menu.jpg) top repeat-x; width: 100%; line-height: 1.6em; border-left: 2px #ececec solid; border-right: 2px #ececec solid; padding-top: 30px;}

#cols { width: 100%; line-height: 1.6em; }
#left { width: 627px; float: left; margin: 0 10px 0 0 ;  }
#right { width: 350px; float: right; margin: 0 5px 0 0;  }
#right-content { width: 325px; float: right; margin: 0 5px 0 0;  }

.hr { color: #cecece; }

/************** homepage *****************/

#home-left { width: 612px; float: left; margin: 0 10px 0 0 ;  background: url(../images/features/homepage.jpg) left top no-repeat; text-align: right; }
a.feature:hover { filter:alpha(opacity=50); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; }

#news { width: 100%; border-top: 1px solid #88903B; height: 50px; background: url(../images/misc/home-news.gif) left top no-repeat; }
.news { margin: 15px 0 0 105px; font-size: 100%; color: #333; float: left; }

/************** forms *****************/

.form { margin: 0; padding: 0; }
.text-field { width: 180px; }
.text-area { width: 180px; height: 85px; }
.form-error { color: #FF0000; }

/************** text *****************/

h1 { font-size: 10%; color: #FFF; font-weight: normal; margin: 0; padding: 0; }
h2 { font-size: 140%; color: #88903B; font-weight: bold; line-height: 1.75em; margin: 0; padding: 0; }
h3 { font-size: 100%; color: #666; font-weight: normal; line-height: 1.75em; }

.content { font-size: 110%; color: #333; line-height: 1.75em; padding: 10px;}
.content-right { color: #333; line-height: 1.75em; padding: 10px; border: 1px solid #e4e4e4; background: #eee;}
.title { font : italic bold 2.5em Times New Roman; color: #999; }

a.link { color: #88903B; text-decoration: none; }
a.link:hover { text-decoration: underline; }

.green { color: #88903B; font-weight: bold; font-size: 110%;}
.grey { color: #333; font-weight: bold; font-size: 110%;}
.clear { clear: both; }
.sale { color: #D2232A; font-weight: bold; font-size: 120%; }
.sale-small { color: #D2232A; font-weight: bold; font-size: 100%; }

/************** products / treatments *****************/

.tr { border-bottom: 1px solid #e4e4e4; padding-bottom: 10px; }
a.book { background: #fff; border-bottom: 1px solid #88903B; color: #88903B; text-decoration: none; padding: 2px 5px 2px 5px;}
#products { width: 966px; margin: 0 7px 0 7px; border-top: 1px solid #ccc;  }

/************** table *****************/

.main-table { width: 100%; border: 0; padding: 0; margin: 0; font-size: 100%; line-height: 1.75em; }
.main-table .td { height: 30px; width: 100px; }

.book-table { width: 100%; border: 0; padding: 0; margin: 0; font-size: 100%; line-height: 1.75em; }
.book-table .td { height: 30px; width: 70px; }

/************** footer *****************/

#keywords { display:block; position:absolute; z-index:3; top:540px; bottom:52px; background:#fff; margin-bottom: 5px; width: 100%; }
.keywords { font-size: 0.7em; color: #fff; line-height: 1.7em; }

#footer { width: 970px; border-top: 1px solid #88903B; height: 25px; padding: 5px; margin: 0 0 10px 0; background: url(../images/background/footer.gif) bottom repeat-x;}
.footer { font-size: 90%; color: #666;  }
#footer-left { width: 50%; float: left; }
#footer-right { width: 48%; float: right; text-align: right; }
.footer a { color: #666; text-decoration: none;  }
.footer a:hover { text-decoration: underline; color: #88903B; }