/* CSS Document */

/* Impress Design, LLC is the home of graphic designer Jack McDaniel. 720.495.1368 - www.Impress-Design.com */
/* Feel free to use this template as you like. It was developed for use with 
MODx Content Management Framework, but it will work with any site. Just make certain you change it and don't steal my images */

/* Site Colors: Synergy Blue B9C9FC, Teal 6D929B, Brown A19787, Light Green C1DAD6*/

/* Global reset */
/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */

*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h5, h5, h6 { font-size:100% }
q:before, q:after { content:''}

ol, ul, li { list-style:none }

* a { position:relative } /* Gets links displaying over a PNG background */
a { outline:none } /* Gets rid of Firefox's dotted borders */
a img { border:none } /* Gets rid of IE's blue borders */


/* Body Settings and Background */
html,body{margin:0; padding:0; border:0; font-size:14px; font-family: Helvetica, "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, "sans serif"; color:#000;}
html{background:#FFF url(../img/BG.jpg) top left repeat-x}

a {color: #A19787; text-decoration: none;}
a:hover {color: #6D929B; text-decoration: none}

body{width:100%; margin:0 auto;background:#FFF url(../img/BG.jpg) top left repeat-x}
*{margin:0; padding:0}

#maincontainer{
width: 950px; /*Width of main container*/
margin: 0 auto; /*Center container on page*/
}

#header{
height: 130px; /*Height of top section*/
}

#logo {
width: 329px;
float: left;
padding-top: 35px;
}

/********Header Links Section********/
#toplinks {padding-top: 35px;}
.block {font-size: .95em; border-left: 1px dashed #A19787; float: right; width: 200px}
.block ul {margin: 0; list-style-type: none;}
.block ul li {padding: 3px 0 3px 20px; display: block; border-bottom: 1px dashed #A19787; color: #B7AFA3; line-height: 1.5em; text-decoration: none; background: url(../img/arrow2.gif) no-repeat 0px 2px }
.block ul li:hover {padding: 3px 0 3px 20px; display: block; border-bottom: 1px dashed #A19787; color: #6D929B; line-height: 1.5em; text-decoration: none; background: url(../img/arrow1.gif) no-repeat 0px 2px}
.block ul li a:hover {color: #6D929B;}
.block ul a{text-decoration: none; color:#A19787}
.block ul li.active a{color:#6D929B;}

/********Content Info********/
#contentwrapper{
float: left;
width: 100%;
padding-bottom: 1.4em
}

#contentcolumn{
margin-right: 300px; /*Set right margin to RightColumnWidth*/
padding-left: 25px;
color: #666;
padding-bottom: 1.4em; 
padding-top: 25px;
font-size: 1.2em;
line-height:1.5em
}

#contentcolumn p {padding-bottom: 1.2em}
#contentcolumn img {float: left; border: 1px solid #6D929B; margin-right: 10px;}

/******** Rotating Images ********/
#rotatewrapper {overflow: hidden;}
#rotateleft {
float: left;
margin-left: 5px;
width:285px;
height: 218px;
background: url(../img/image1.jpg) top left no-repeat;
}
#rotateleft img {}

#rotatecenter {
float: left;
margin-left: 35px;
width:285px;
height: 218px;
background: url(../img/image4.jpg) top left no-repeat;
}
#rotatecenter img {}

#rotateright {
float: left;
margin-left: 30px;
width:285px;
height: 218px;
background: url(../img/image7.jpg) top left no-repeat;
}
#rotateright img {}

/********About section for Frontpage********/
#about {
float: left;
width: 415px;
margin-left: 20px;
line-height: 1.4em;
}
#about p {padding-bottom: 1.4em; padding-left: 10px; color: #666}

/********Gift Certificate Section for Frontpage and Right Column********/
#giftcert {
float: left;
width: 225px;
margin-left: 1px;
padding-left:20px;
line-height: 1.4em;
}
#giftcert p {padding-bottom: 1.4em; color:#666}

/********Latest News Section for Frontpage********/
#latestnews {
float: left;
width: 225px;
margin-left: 20px;
line-height: 1.4em;
}
#latestnews p {padding-bottom: 1.4em; color: #666}

.learnmore a {padding-left: 15px;background: url(../img/arrow2.gif) no-repeat -5px -3px;}
.learnmore a:hover {padding-left: 15px;background: url(../img/arrow1.gif) no-repeat -5px -3px;}
.learnmore2 a {padding-left: 15px;background: url(../img/arrow2.gif) no-repeat -5px -3px; color: #666;}
.learnmore2 a:hover {padding-left: 15px;background: url(../img/arrow2.gif) no-repeat -5px -3px; color:#6D929B;}

/********Right Column********/
#rightcolumn{
float: left;
width: 300px; /*Width of right column*/
margin-left: -300px; /*Set left margin to -(RightColumnWidth) */
}
.rightinner {
margin: 10px;}

.rightcolwrap {padding: 15px 0 0 35px;}

/********FOOTER********/
#footer{
clear: left;
width: 950px;
color: #6D929B;
padding: 23px 10px;
border-top: 3px dashed #B9C9FC;
border-bottom: 5px solid #B9C9FC;
overflow: hidden;}

#footer a {color: #6D929B}
#footer a:hover {color: #666}

#footerlinks{
float: left;
width: 450px;
font-size: .9em;
}

#footercontact{
float:right;
width: 350px;
text-align: right;
font-size:1.0em;
line-height: 1.3em;
}

#footercontact p{
font-size:.9em;
text-align: right;
color:#666;}

#siteInfo {float: left;padding-top: 25px; padding-bottom: 5px; color: #6f94a5; font-size: .85em;}
#siteInfo a {color: #A19787}
#siteInfo a:hover {color: #B9C9FC}

.innertube{
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
margin-top: 0;
}

.clear {clear: left;}

/********* Accordian **********/
.tower {float: left; width:500px; margin-left: 50px; padding-top: 25px;}
	
    UL.drawers {width: 500px;}
    UL {list-style: none; margin: 0;padding: 5px;}
    LI A {text-decoration: none;color: #666;}
	.drawer ul li{padding-left: 20px; background: #FFF url(../img/arrow4.gif) no-repeat 0px -3px;line-height: 1.3em; font-size: .95em; color:#666;}		
    H2.drawer-handle {font-family: Helvetica, "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, "sans serif"; color: #660000;background-color: #EBEBEB; border-bottom: 1px solid #99CC00; font-size: 1.1em;padding: 9px 0 5px 8px; margin-bottom: 5px;font-weight:100}
    H2.drawer-handle.open {font-family: Helvetica, "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, "sans serif"; color: #FFF;background-color: #99CC00; border-bottom: 1px solid #660000; font-size: 1.1em;padding: 9px 0 5px 8px; margin-bottom: 5px;font-weight: 100}
	.drawers p {;line-height: 1.3em; font-size: .95em; color:#666;}

.portImageCont {float:right; text-align:center;}
.portImage {padding-right: 50px; text-align: center;font-size: .85em}

/********EmailForm ********/
#EmailForm {width: 360px;text-align: left;padding-bottom: 20px;border: none;font-size:.95em;margin-top: -30px;}
#EmailForm.full { width: 100%; }
fieldset {border: none;}
legend {display: none;}
#EmailForm h3 {clear: both;padding: 15px 0 5px;font-size: 14px;font-family: Helvetica, Arial, sans-serif;color: #666;font-weight: bold;}
#EmailForm label,#EmailForm p {display: block;clear: both;width: 310px;font-size: 1em;line-height: 1.5em;padding: 0 0 9px;}
#EmailForm input {display: block;margin-top: 3px;}
#EmailForm select {float: left;display: block;}
#EmailForm label.first,#EmailForm label.city {clear: left;margin-right: 10px;width: 150px;}
#EmailForm label.second,#EmailForm label.state {float: left;clear: none;margin: 0 10px 0 0;width: 150px;}
#EmailForm label.state { width: 60px; }
#EmailForm label.first input,#EmailForm label.city input,#EmailForm label.second input {float: left;width: 150px;padding: 0;}
#EmailForm label.state select {width: 60px;float: left;margin-top: 3px;}
#EmailForm label.zip,#EmailForm label.zip input {float: left;width: 80px;}
#EmailForm label.zip { clear: none; }
#EmailForm label {float: left;clear: left;width: 310px;margin: 0;line-height: 1.5em;}
#EmailForm label input {float: left;width: 310px;padding: 0;}
#EmailForm input.radio,
#EmailForm input#radiobutton_1,
#EmailForm input#radiobutton_2,
#EmailForm input#radiobutton_3,
#EmailForm input#radiobutton_4 {clear: left;float: left;padding: 0;margin: 0;}
#EmailForm label.radio,
#EmailForm label.radioitem {clear: none;margin: 0 0 0 25px;padding: 0 0 15px;}
#EmailForm input.checkbox,
#EmailForm input#checkbox_1,
#EmailForm input#checkbox_2,
#EmailForm input#checkbox_3,
#EmailForm input#checkbox_4 {clear: both;float: left;padding: 0;margin: 0;}
#EmailForm label.checkbox {clear: none;margin: 0 0 0 25px;padding: 0 0 15px;}
/* style the #EmailForm elements to look similar across browsers ... emulates Safari */
#EmailForm label input,
#EmailForm textarea {border: 1px solid #A19787;border-left-color: #666;border-top-color: #666;padding: 2px 2px;height: 22px;line-height: 20px;background: #B9C9FC url(images/input-bg.gif) repeat-x top left;}
#EmailForm input.checkbox,
#EmailForm select {border: 1px solid #A19787;border-left-color: #666;border-top-color: #666;background-color: #B9C9FC;}
#EmailForm textarea {margin-top: 3px;width: 383px;height: auto;display: block;}
#EmailForm label input.calc {text-align: right;width: 100px;clear: left;padding: 0;}
#EmailForm input.button {clear: left;border: 1px solid #A19787;border-left-color: #666;border-top-color: #666;background-color: #B9C9FC}
#cfContact{padding: 3px;color: #666;}

/*********Headers**********/
h1 {font-family: Helvetica, "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, "sans serif"; color: #A19787; font-size: 1.4em; border-bottom: 1px dotted #99CC00;padding-bottom: 5px; margin-bottom: 10px;}
h2 {font-family: Helvetica, "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, "sans serif"; color: #A19787; font-size: 1.2em;padding-bottom: 5px; margin-bottom: 5px;}
h3 {font-family: Helvetica, "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, "sans serif"; color: #6D929B; font-size: 1.1em; margin: 5px 0;border-bottom: 1px dashed #6D929B;}
h4 {font-family: Helvetica, "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, "sans serif"; color: #666; font-size: .9em; margin: 8px 0; border-bottom: 1px dashed #B9C9FC;}
#services2 h1 {height:40px; background: #FFF url(../img/services2_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dotted #99CC00; }
#contact_head h1 {height:25px; background: #FFF url(../img/contact_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dotted #666;margin-bottom: 15px}
#news h1 {height:25px; background: #FFF url(../img/news_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#about_head h1 {height:25px; background: #FFF url(../img/about_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#mani_head h1 {height:25px; background: #FFF url(../img/mani_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#pedi_head h1 {height:25px; background: #FFF url(../img/pedi_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#skincare_head h1 {height:25px; background: #FFF url(../img/skincare_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#color h1 {height:25px; background: #FFF url(../img/color_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#justhim h1 {height:25px; background: #FFF url(../img/justhim_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#packages h1 {height:25px; background: #FFF url(../img/packages_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#detox h1 {height:25px; background: #FFF url(../img/detox_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#massage h1 {height:25px; background: #FFF url(../img/massage_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#waxing h1 {height:25px; background: #FFF url(../img/waxing_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#custom h1 {height:25px; background: #FFF url(../img/custom_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#giftcert2 h1 {height:25px; background: #FFF url(../img/giftcert2_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#synergyservices h1 {height:25px; background: #FFF url(../img/synergyservices_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#products h1 {height:25px; background: #FFF url(../img/prod_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #666;margin-bottom: 15px;}
#latestnews h4 {height:25px; background: #FFF url(../img/latestnews_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #B9C9FC}
#giftcert h4 {height:25px; background: #FFF url(../img/gift_head.jpg) bottom left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #B9C9FC}
#about h4 {height:25px; background: #FFF url(../img/about_head.jpg) bottom left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #B9C9FC}
#newsletter h4 {height:25px; background: #FFF url(../img/newsletter_head.jpg) bottom left no-repeat; text-indent: -9999px; border-bottom: 1px dashed #B9C9FC}

#PDF {width: 200px; text-align: center;padding: 10px;margin: 25px 0 0 25px}

.bodylist ul li{padding-left: 20px; background: #FFF url(../img/arrow2.gif) no-repeat 0px 0px;line-height: 1.3em; font-size: .95em; color:#666;}		
.bodylist ul {margin: -15px 0 10px 0}
.bodylist p {margin-bottom: -20px;}

/*********Services Section**********/
#servicescontain {width: 925px; min-height: 222px; overflow: hidden; background: url(../img/services_BG.jpg) top left no-repeat; margin: 10px 0 0 20px; line-height: 1.5em; color:#666;}
#servicescontain h4 {height:70px; text-indent: -9999px; border-bottom: none;}
.services {float: left;margin: -50px 0 0 20px;width:270px;max-height: 200px; overflow: hidden;}
.services ul {margin: 0; list-style-type: none;}
.services ul li {padding: 7px 0 5px 20px; display: block; border-bottom: 1px dashed #6D929B; color: #666; line-height: 1.5em; text-decoration: none; background: url(../img/arrow2.gif) no-repeat 0px 6px }
.services ul li:hover {padding: 7px 0 5px 20px; display: block; border-bottom: 1px dashed #6D929B; color: #6D929B; line-height: 1.5em; text-decoration: none; background: url(../img/arrow2.gif) no-repeat 0px 6px}
.services ul li a:hover {color: #6D929B;}
.services ul a{text-decoration: none; color:#666}

/********Newsletter Sign-up Right Column Link********/
.leftForm { color: #666; font-size: .9em;}
.rightForm {color:#666; font-size: .9em;}

/********Newsletter Form********/
.leftForm {float: left;width: 200px;text-align: right;}
.rightForm {float: left;margin-left: 15px;text-align: left;width: 250px;}

/********Ditto Info********/
.dittowrap {width: 570px;}
.ditto_summaryPost {float: left; width: 250px; font-size:.9em; line-height: 1.4em; color: #666; margin: 0 0 5px 20px;}
.ditto_info {font-size: .85em; color: #666; font-style: italic; padding: 5px 0 0px 10px}
.ditto_link {margin-top: -10px;}
.ditto_link a {padding-left: 15px;background: url(../img/arrow2.gif) no-repeat -5px -3px;}
.ditto_link a:hover {padding-left: 15px;background: url(../img/arrow1.gif) no-repeat -5px -3px;}

.ditto_summaryPost2 {float: left; line-height: 1.4em; color: #666; padding-bottom: 15px;margin: 10px 0 15px 0;}
.ditto_summaryPost2 h3 {font-family: Helvetica, "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, "sans serif"; color: #6D929B; font-size: 1.1em; margin: -15px 0 5px 0;border-bottom: none;}
.ditto_link2 {}
.ditto_link2 a {padding-left: 15px;background: url(../img/arrow2.gif) no-repeat -5px -3px;}
.ditto_link2 a:hover {padding-left: 15px;background: url(../img/arrow1.gif) no-repeat -5px -3px;}

/**********More Ditto***********/
#ditto_currentpage {color:#666;padding:4px; background: url(../img/gradient.jpg) top left repeat-x; border: 1px solid #6D929B;}
.ditto_page {padding: 4px;}
.ditto_page:hover {background: url(../img/gradient.jpg) top left repeat-x;border: 1px solid #6D929B;padding: 4px;}
#pagination {margin-top: 10px;}

/*********Right Links**********/
#rightlinks {width: 275px; margin: 10px 0 0 30px; background: url(../img/menu_bg.jpg) top left repeat-y;}
#rightlinks h4 {height:72px; background: url(../img/menu_head.jpg) top left no-repeat; text-indent: -9999px; border-bottom: none;}
.rightlinks {width: 225px; margin-top: -20px}
.rightlinks ul {margin-left: 10px; list-style-type: none;}
.rightlinks ul li {padding: 7px 25px 5px 20px; display: block; border-bottom: 1px dashed #b9c9fc; color: #666; line-height: 1.3em; text-decoration: none; background: url(../img/arrow2.gif) no-repeat 0px 5px }
.rightlinks ul li:hover {padding: 7px 25px 5px 20px; display: block; border-bottom: 1px dashed #b9c9fc; color: #6D929B; line-height: 1.3em; text-decoration: none; background: url(../img/arrow1.gif) no-repeat 0px 5px}
.rightlinks ul li a:hover {color: #666;}
.rightlinks ul a{text-decoration: none; color:#A19787}
.rightlinks_bottom {height: 220px; background: url(../img/menu_bottom.jpg) bottom left no-repeat;}

/********Newsletter Section Right Column********/
#newsletter {float: left;width: 225px;margin: 0 0 20px 20px;line-height: 1.4em;}
.price { float: right; padding-left: 40px; font-style: italic; color: #6D929B; text-decoration: none;}

