/* 
Title:     styles for screen media
Author:    steve@ratio7.com
Updated:   Septemeber 7th 2009
*/

body {
 margin: 20px 0 0 0;
 padding: 0;
 font-family: Verdana, sans-serif;
 font-size: 80%;
 color: #000;
 background: #EFEFEF url(../images/common/bg.gif) repeat top center; }

a:link, a:visited {
 text-decoration: none; }

a:hover {
 text-decoration: underline; }

/* wrap
---------------------------------------------------------- */

#wrap {
 display: block;
 width: 942px;
 margin: 0 auto;
 padding: 0;
 background: #fff url(../images/common/body.gif) repeat-y top left; }

/* header
---------------------------------------------------------- */

#header {
 display: block;
 width: 922px;
 height: 107px;
 margin: 0;
 padding: 0 10px 10px 10px;
 background: url(../images/common/bg-plain.gif) repeat top left; }

#logo {
 float: left;
 display: block;
 margin: 0;
 padding: 0; }

#address {
 float: right;
 display: block;
 margin: 0 5px 0 0;
 padding: 0;
 text-align: right; }

#address p {
 margin: 0;
 padding: 5px 0 35px 0;
 color: #999;
 line-height: 18px; }

#address strong {
 color: #662D91;
 font-weight: bold; }

/* navigation
---------------------------------------------------------- */

#navigation {
 display: block;
 width: 902px;
 height: 25px;
 margin: 0;
 padding: 26px 20px 0 20px;
 background: url(../images/common/header.jpg) no-repeat top center;
 font-size: 90%;
 text-align: center; }

#navigation li {
 margin: 0 15px 0 15px;
 padding: 0;
 display: inline;
 list-style: none;
 color: #9999CC; }

#navigation .begin {
 margin: 0 14px 0 0;
 padding: 0; }

#navigation .end {
 margin: 0 0 0 14px;
 padding: 0;
 border-right: 0px none; }

#navigation a {
 font-weight: bold;
 margin: 0;
 padding: 0; } 

#navigation a:link, #navigation a:visited {
 color: #eee;
 text-decoration: none; }

#navigation a:hover {
 color: #9999CC;
 text-decoration: underline; }

#home #nil a {
 color: #9999CC;
 text-decoration: underline; }

#thespa #ni2 a {
 color: #9999CC;
 text-decoration: underline; }

#sdays #ni3 a {
 color: #9999CC;
 text-decoration: underline; }

#treatments #ni4 a {
 color: #9999CC;
 text-decoration: underline; }

#shop #ni5 a {
 color: #9999CC;
 text-decoration: underline; }

#offers #ni6 a {
 color: #9999CC;
 text-decoration: underline; }

#contact #ni7 a {
 color: #9999CC;
 text-decoration: underline; }

/* body
---------------------------------------------------------- */

#body-wrap {
 display: block;
 width: 912px;
 margin: 0;
 padding: 15px 15px 10px 15px;
 line-height: 1.4em; }

#home #body-wrap {
 display: block;
 width: 912px;
 margin: 0;
 padding: 0 15px 10px 15px;
 line-height: 1.4em; }

/* sidebar
---------------------------------------------------------- */

#sidebar {
 float: left;
 width: 239px;
 margin: 0 39px 0 0;
 padding: 0; }

#sidebar h1 {
 display: block;
 width: 239px;
 height: 26px;
 margin: 0;
 padding: 0;
 color: #fff;
 font-size: 13px;
 text-align: center;
 line-height: 26px;
 background: #9999CC url(../images/common/feature-title-bg.jpg) no-repeat 0 0; }

#sidebar .feature {
 display: block;
 width: 239px;
 margin: 0 0 20px 0;
 padding: 0 0 3px 0;
 background: url(../images/common/feature-bg.gif) repeat-y 0 0;
 border-bottom: 1px dashed #99CC99; }

#sidebar p {
 margin: 0;
 padding: 5px 10px 5px 10px;
 color: #666; }

#sidebar a:link, #sidebar a:visited {
 color: #ff6600;
 text-decoration: underline; }

#sidebar a:hover {
 color: #ff3300;
 text-decoration: underline; }

#sidebar img {
 padding: 10px; }

/* content
---------------------------------------------------------- */

#content {
 width: 630px;
 margin: 0 0 0 278px;
 padding: 0;
 color: #666; }

#content h1 {
 display: block;
 margin: 10px 0 0 0;
 padding: 0 0 4px 0;
 font-size: 130%;
 color: #373369; }

#content h2, #content-home h2 {
 display: block;
 margin: 0;
 padding: 0;
 font-size: 35px;
 line-height: 3.5em;
 color: #373369; }

#content h3 {
 display: block;
 margin: 0;
 padding: 0;
 font-size: 25px;
 line-height: 2.8em;
 color: #9999cc; }

#content ul, #content-home ul {
 margin: 0 0 10px 0;
 padding: 0; }

#content li, #content-home li {
 margin: 0 2px 2px 0;
 padding: 0 0 0 28px;
 list-style: none;
 background: url(../images/common/bullet.gif) no-repeat 0 50%; }

#content a:link, #content-home a:link, #content a:visited, #content-home a:visited {
 color: #666;
 text-decoration: underline; }

#content a:hover, #content a:hover {
 color: #ff9900;
 text-decoration: underline; }

/* home
---------------------------------------------------------- */

#home #content {
 width: 912px;
 margin: 0;
 padding: 0;
 color: #666; }

#home #content h1 {
 display: block;
 width: 912px;
 height: 158px;
 margin: 0;
 padding: 158px 0 20px 0;
 background: url(../images/home/welcome-title.jpg) no-repeat 0 0;
 color: #fff;
 overflow: hidden;
 height: 0px !important; }

#home #flash-feature {
 float: left;
 width: 325px;
 height: 424px;
 padding: 0 20px 0 0;
 text-align: center; }

#home #features {
 display: block;
 float: left;
 width: 912px;
 padding: 15px 0 0 0; }

#home #feature1 {
 float: left;
 margin: 0 45px 0 0;
 width: 286px; }

#home #feature1 h2 {
 display: block;
 width: 286px;
 height: 176px;
 margin: 0;
 padding: 176px 0 0 0;
 background: url(../images/home/spadays-title.jpg) no-repeat 0 0;
 color: #fff;
 overflow: hidden;
 height: 0px !important; }

#home #feature2 {
 float: left;
 margin: 0 45px 0 0;
 width: 286px; }

#home #feature2 h2 {
 display: block;
 width: 286px;
 height: 176px;
 margin: 0;
 padding: 176px 0 0 0;
 background: url(../images/home/treatments-title.jpg) no-repeat 0 0;
 color: #fff;
 overflow: hidden;
 height: 0px !important; }

#home #feature3 {
 float: left;
 width: 250px; }

#home #feature3 h2 {
 display: block;
 width: 250px;
 height: 176px;
 margin: 0;
 padding: 176px 0 0 0;
 background: url(../images/home/beach-title.jpg) no-repeat 0 0;
 color: #fff;
 overflow: hidden;
 height: 0px !important; }

/* spadays
---------------------------------------------------------- */

#spadays .gap {
 width: 36px; }

#spadays .tick {
 width: 26px;
 background: url(../images/common/tick.gif) no-repeat top center; }

#spadays .details {
 width: 231px;
 margin: 0; }

#spadays .button {
 padding: 0 0 15px 0;
 text-align: center;
 border-bottom: 1px solid #373369; }

#spadays h3 {
 display: block;
 margin: 0;
 padding: 5px 0 5px 0;
 font-size: 15px;
 color: #373369; }

#spadays p {
 margin: 0;
 padding: 0 0 2px 0; }

#spadays .rowspacer {
 height: 15px; }

/* form styles
---------------------------------------------------------- */

fieldset {
 margin: 0;
 padding: 0;
 border: 0; }

label {
 font-weight: bold; }

input {
 padding: 2px;
 margin: 4px 0 4px 0;
 font-size: 12px;
 background: #fff;
 font-family: Verdana, sans-serif;
 border: 1px solid #999; }

select {
 padding: 2px;
 margin: 4px 0 4px 0;
 height: 20px;
 font-size: 12px;
 background: #fff;
 font-family: Verdana, sans-serif;
 border: 1px solid #999; }

textarea {
 padding: 2px;
 margin: 4px 0 4px 0;
 width: 300px;
 height: 100px;
 font-size: 12px;
 background: #fff;
 font-family: Verdana, sans-serif;
 border: 1px solid #999; }

.error {
 margin: 0 0 10px 0;
 padding: 0;
 color: red; }

.shopTable { width: 100%; border: 0 none; }
.shopTable th { background: #EBF5EB; height: 25px; border-bottom: 1px solid #99CC99; border-right: 1px solid #99CC99; }
.shopTable td { padding: 5px; border-bottom: 1px solid #99CC99; border-right: 1px solid #99CC99; }
.shopTable .multiplePrices { font-size: smaller; }
.shopTable label { white-space: nowrap; float: right; clear: right; margin: 0.5em; }
.shopButton { display: inline-block; background-position: 0px 0px; }
* > .shopButton { display: table-cell; }
.shopButton span { display: none; }
.shopTableInner td { padding: 5px; border-bottom: 0px none; border-right: 0px none; }

/* products
---------------------------------------------------------- */

#products {
 margin: 8px 0 0 0; }

#content h3 {
 display: block;
 margin: 0;
 padding: 0;
 font-size: 21px;
 line-height: 2.5em;
 color: #9999cc; }

#product_sorting {
 display: block;
 width: 530px;
 height: 30px;
 padding: 0 0 10px 0;
 line-height: 18px; }

#product_sorting form, #product_sorting select {
display: inline; }

#products .category { 
 float: left;
 width: 610px;
 padding: 10px;
 border-bottom: 1px solid #373369; }

#products .category_image {
 float: left;
 width: 140px;
 padding: 13px 0 0 0; }

#products .category_details {
 float: left;
 width: 390px; }

#products .product-light { 
 float: left;
 width: 530px;
 padding: 10px;
 background: #EBF5EB;
 border-bottom: 1px solid #99CC99; }

#products .product-dark { 
 float: left;
 width: 530px;
 padding: 10px;
 background: #E0F0E0;
 border-bottom: 1px solid #99CC99; }

#products .product_image {
 float: left;
 width: 140px; }

#products .product_details {
 float: left;
 width: 390px; }

#products p {
 margin: 0 0 10px 0;
 padding: 0; }

#products strong {
 color: #333; }

#products .shopButton {
 float: left;
 margin: 0 10px 0 0; }

#products .paging_links {
 clear: left;
 margin: 0;
 padding: 10px 0 0 0; }

/* offers
---------------------------------------------------------- */

#offers .gap {
 width: 36px; }

#offers .tick {
 width: 26px;
 background: url(../images/common/tick.gif) no-repeat top center; }

#offers .details {
 width: 231px;
 margin: 0; }

#offers .button {
 padding: 0 0 15px 0;
 text-align: center;
 border-bottom: 1px solid #373369; }

#offers h3 {
 display: block;
 margin: 0;
 padding: 5px 0 5px 0;
 font-size: 15px;
 color: #373369; }

#offers table p {
 margin: 0;
 padding: 0 0 2px 0; }

#offers .rowspacer {
 height: 15px; }

/* footer
---------------------------------------------------------- */

#footer {
 clear: both;
 display: block;
 width: 922px;
 height: 20px;
 margin: 0;
 padding: 15px 10px 20px 10px;
 background: url(../images/common/footer.gif) no-repeat top center;
 font-size: 10px;
 color: #AAA;
 line-height: 23px; }

#footer p {
 margin: 0;
 padding: 0; }

#footer a:link, #footer a:visited {
 color: #999;
 text-decoration: underline; }

#footer a:hover {
 color: #339966;
 text-decoration: underline; }

#copyright {
 float: left; }

#credits {
 float: right; }

 /* misc
---------------------------------------------------------- */

hr, .hide {
 display: none; }

a img {
 border: none; }

form {
 margin: 0;
 padding: 0; }

.button {
 padding: 2px 4px 2px 4px;
 font-weight: bold;
 color: #333;
 border: none 0px; }

.doc {
 padding: 0 0 0 24px;
 background: url(../images/common/doc-icon.gif) no-repeat 0 50%; }

.pdf {
 padding: 0 0 0 24px; 
 background: url(../images/common/pdf-icon.gif) no-repeat 0 50%; }