/* ==== The Spa Leamington 2010 - Constructed by JB and G Web Design (www.jbandg.co.uk)==== */

/* ==== Common ==== */

body, html {
margin: 0; 
padding: 0; 
font-family: Tahoma, Arial, Helvetica, sans-serif;
color: #434343;
font-size: 11px;
line-height: 23px;
background: url(/images/backgrounds/html.gif) top left repeat #403f3f;}
#pages {
width: 940px;
margin: 25px auto 0;
padding: 0;
background-color:#fff;
padding: 0 20px;}
.clear {
clear: both;}
.break {
margin:10px 0 10px 0;}

.notes {
font-size:10px;
line-height:18px;
color:#4f4f4f;}

.left-banner, .right-banner {margin-bottom:10px;}




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

#header {
width: 940px;
height: 169px;
margin: 0;
padding: 0;
/*background: url(/images/backgrounds/header-spa-1.jpg) top left no-repeat #fff;*/
background-position: top;
background-position:left;
background:no-repeat;
background-repeat:no-repeat;
font: normal 11px "Georgia", "Times New Roman", Times, serif; color: #c6c6c6;
border-bottom:solid 1px #85746a;}

.headerleft {
float: left;
width: 240px;}

.headerright {
float: right;
width: 594px;
text-align:right;}

#headertopnav {
margin: 0;
padding: 20px 0 20px 0;}

#headertopnav a:link, #headertopnav a:visited, #headertopnav a:active {
color: #333333;
text-decoration:none;} 

#headertopnav a:hover {
text-decoration:underline;}

#headercall {
font-size: 23px;
line-height:1;
color:#3c2415;
margin:3px 0 10px 0;}

#headernumber {
font-size: 37px;
color:#3c2415;
margin:0;}

#headeraddr {
font-size:11px;
color:#3c2415;
margin:5px 0 0 0;}



/* ==== Navigation ==== */	



/* ====== FURTHER PHP BROWSER DEPENDANT STYLES LOCATED IN MENU INCLUDE FILE ====== */

#nav-wrapper {
width: 940px;
height: 74px;
margin: 0;
padding: 0;
font-size: 13px;
background: url(/images/backgrounds/nav.jpg) top left repeat-x #1a1816;
border-top: solid 1px #FFFFFF;
border-bottom: solid 1px #FFFFFF;}
#nav {
width: 940px;

padding: 0;
float: left;
list-style: none;
margin: 0 auto;
padding: 0;}
#nav ul {
list-style: none;
margin: 0 auto;
padding: 0;	}
#nav li {
float: left;	
margin: 0;
background: url(/images/backgrounds/nav-divide.jpg) top right no-repeat;}



ul#nav li a, ul#nav li a:link, ul#nav li a:active, ul#nav li a:visited, ul#nav li a:hover {
height:51px;
overflow:hidden;}

ul#nav li ul li a, ul#nav li ul li a:link, ul#nav li ul li a:active, ul#nav li ul li a:visited, ul#nav li ul li a:hover {
height:16px;
overflow:hidden;}






#nav li.last {
background: none;}

#nav a {
	
text-decoration: none;
display: block;
margin: 0;
padding: 10px 10px 13px 10px; 
/*padding: 10px 11px 13px 10px; */
color: #908681;
font: normal 13px Tahoma Arial, Helvetica, sans-serif;

}

#nav a.contact {
padding-right: 16px;}

#nav a:link .title, #nav a:active .title, #nav a:visited .title {
color: #dfdfdf;
font: normal 16px "Georgia", "Times New Roman", Times, serif;}

#nav a:hover .title {
color: #f6f6f6;
font: normal 16px "Georgia", "Times New Roman", Times, serif;}

#nav a .navbreak {
height: 5px;
display:block;}

#nav a .caption {
font-weight:normal;
font: 11px "Georgia", "Times New Roman", Times, serif;
font-style:italic;}

#nav a:hover {
color: #b8b8b8;}



#nav li a:hover {
color: #fff;
text-decoration: none;
background: url(/images/backgrounds/nav-hover.jpg) top left repeat-x #4592a0;}







ul.dropdown li:hover > ul {
	visibility: visible;
}
/* top level navigation link styling */
ul.dropdown,
ul.dropdown li {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 597;
	float: left;
	vertical-align: middle;
}
ul.dropdown a,
ul.dropdown a:link,
ul.dropdown a:visited {
	
	
	margin: 0;
	display: block;
	padding: 0;
	text-decoration: none;
}
ul.dropdown a:hover {
	margin: 0;
	display: block;
	padding: 0;
	text-decoration: none;
}




/*drop-down navigation block link styling */
ul.dropdown ul {
	float: left;
	width: 190px;
	
	margin: 0;
	padding: 0;
	visibility: hidden;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 598;
}
ul.dropdown ul a:link,
ul.dropdown ul a:visited {
	
	
	width: 190px;
	display: block;
	border-top: solid 1px #5d4d3e;
	margin: 0;
	padding: 5px 0 0 6px;
	color: #a79d98;
	background: #4a3c30;
}
ul.dropdown ul a:hover {
	width: 190px;
	display: block;
	margin: 0;
	border-top: solid 1px #5d4d3e;
	padding: 5px 0 0 6px;
	color: #fff;
}
/* drop out navigation block link styling */
ul.dropdown ul li ul {
	float: left;
	width: 190px;
	margin: 0;
	padding: 0;
	top: 0px;
	left: 100%;
	display: block;
}
ul.dropdown ul li ul a:link,
ul.dropdown ul li ul a:visited {
	width: 190px;
	display: block;
	margin: 0;
	padding: 5px 0 0 6px;
	border-top: solid 1px #5d4d3e;
	color: #fff;	
	background: #4a3c30;
}
ul.dropdown ul li ul li a:hover {
	width: 190px;
	display: block;
	margin: 0;
	padding: 5px 0 0 6px;
	border-top: solid 1px #5d4d3e;
	color: #fff;
}



/* ======= Quick Navigation ======= */


#quicknav {
background: url(/images/backgrounds/quicknav.jpg) top left no-repeat;
width: 196px;
padding: 28px 0 0 32px;}

#quicknav p {
line-height:normal;}

#quicknav .quicknavtitle {
font-size: 16px;
margin:3px 0 20px 40px;}

#quicknav ul.menu, ul.menu ul {
  list-style-type:none;
  margin: 0;
  padding: 0;
  width: 160px;
}

#quicknav ul.menu a {
  display: block;
  text-decoration: none;	
}

#quicknav ul.menu li {
  margin-top: 1px;
background: url(/images/quicknav/arrow.jpg) top left no-repeat;
padding: 0 0 0 18px;
}

#quicknav ul.menu li a {
  /*background: #333;*/
  color: #545454;	
  padding: 0 0 0 4px;
  height:23px;
}

#quicknav ul.menu li a {
  /*background: #ffe667;*/
  color: #545454;	
  padding: 0 0 0 4px;
}


#quicknav ul.menu li a:link, #quicknav ul.menu li a:visited {
  /*background: #ffe667;*/
  color: #545454;	
  padding: 0 0 0 4px;
  text-decoration:none;
}

#quicknav ul.menu li a:hover {
  background: #dbdbdb;
  text-decoration:none;
  padding: 0 0 0 4px;
}

#quicknav ul.menu li ul li a:link, #quicknav ul.menu li ul li a:visited {
  color: #545454;
  padding-left: 6px;
  width: 118px;
  text-decoration:none;
}

#quicknav ul.menu li ul li a:hover {
  background: #dbdbdb;
  text-decoration:none;
  padding-left: 6px;
}

.clickeditem {
background-color:#000000;}



.dayspa-left, .aesthetics-left, .hair-left, .beauty-left {
padding: 0; 
margin: 0;}

.quicknav-bottom {
background: url(/images/backgrounds/quicknav-bottom.jpg) top left no-repeat;
width: 228px;
height: 60px;}



/* ===== Generic Headings ===== */

h1 {
margin: 3px 0 10px 0;
padding: 0;
font: normal 21px Tahoma, Verdana, Arial; color: #3d2f26;}

h2 {
margin: 15px 0 10px 0;
padding: 0 0 0 0; 
font: normal 16px Tahoma, Verdana, Arial; color: #3d2f26;
}

h3 {
margin: 0 0 10px 0;
padding: 0 0 0 0; 
font: normal 16px Tahoma, Verdana, Arial; color: #3d2f26;
}


/* ===== Content Layout  ===== */ 

#content {
width: 940px;
margin: 0 0 0 0;
padding: 0;
background:#fff;}
.main-rotating-images {
margin: 0 0 22px 0;
padding: 0;
display: block;}
#content p {
margin: 0 0 10px 0;
padding: 0;	}	
#content a, #content a:link, #content a:visited {
color: #4797a5;
padding: 0;
text-decoration: none;}	
#content a:hover {
color: #4797a5;
padding: 0;
text-decoration: underline;}



#main { /* left and middle column */
width: 760px;
float: left;
margin: 0;
padding: 15px 0 0 0;}
#main-left { /*  far left column */
width: 228px;
float: left;
margin: 0;
padding: 0;}
#main-left p{ 
margin-bottom: 18px;}
#main-right { /*  middle column */
width: 520px;
float: right;
margin: 0;
padding: 5px 0 0 0;}

#main-right ul {
margin: 0 0 10px 20px;
list-style-type:disc;
padding: 0;	}
#main-right ul li {
padding: 0 0 5px 0;
margin: 0 0 0 5px;}
#main-right ul li ul {
margin:0 0 2px 20px;
padding:0;}



#right { /* far right column */
float: right;
margin: 0 0 20px 0;
width: 160px;
padding: 15px 0 0 0;}
#right p {
margin:0 0 10px 0;
padding:0;
line-height:16px;
color:#434343;}


#right a, #right a:link, #right a:visited {
color: #ffffff;
padding: 0;
text-decoration: none;
font-weight:bold;}	
#right a:hover {
color: #ffffff;
padding: 0;
text-decoration: underline;
font-weight: bold;}

#breadcrumbs {
border-bottom: solid 1px #e1e1df;
margin: -5px 0 10px 0;}

#breadcrumbs p {
margin-bottom: 5px;}




/* ===== Homepage Slider ===== */

#homeslide, #homeslide img {
margin: 0 0 0 0;
z-index:99;}

#home-slider {
margin:0; 
padding:0;
} 

#home-slider, #home-slider ul, #home-slider ul li {
list-style:none;
float:left;}

.stripViewer .panelContainer .panel ul {
 float: left;
 text-align: left;
 margin: 0;
   height:357px;
 overflow:hidden;
}
		
.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
 margin: 0;
 position: relative;
 width: 940px;
   height:357px;
 overflow:hidden;

}

/* These 2 lines specify style applied while slider is loading */
.csw {
 width: 940px;
 height: 30px;
 overflow:auto;
  height:357px;
 overflow:hidden;
}

.csw .loading {
 margin: 0;
 text-align: center;
 background: url('/images/home/loader.gif') no-repeat 200px 4px;
 height:30px;
}

.stripViewer { /* This is the viewing window */
 position: relative;
 border: 0; /* this is the border. should have the same value for the links */
 margin: 0;
 width: 940px; /* Also specified in  .stripViewer .panelContainer .panel  below */
 clear: both;
 
   height:357px;
 overflow:hidden;
}


.main-feature-image {
 padding: 0;
 margin: 0;
 float: left;
/* clear: both;*/
}

.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
 position: relative;
 left: 0;
 top: 0;
 width: 940px;
 list-style-type: none;
/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */}

.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
 float:left;
 height: 100%;
 position: relative;
 width: 940px; /* Also specified in  .stripViewer  above */}
		
.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
 float:left;
 margin:0;
 padding: 0;
 
 height:357px;
 overflow:hidden;}
		
.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
 margin: 0 0 0 830px;
 padding: 0;
 float:left;
 position: absolute;
 top: 602px;
 width: 200px;
 display:none;
}
		
.stripNav ul { /* The auto-generated set of links */
 list-style: none;
}
		
.stripNav ul li {
 float: left;
 margin-right: 2px; /* If you change this, be sure to adjust the initial value of navWidth in coda-slider.1.1.1.js */
}
		
#home-slider .stripNav a { /* The nav links */
 font-size: 10px;
 font-weight: bold;
 text-align: center;
 line-height: 18px;
 margin-right:3px;
 background: #c6e3ff;
 color: #484848;
 text-decoration: none;
 display: block;
 padding: 0 7px;
}
		
#home-slider .stripNav li.tab1 a,
#home-slider .stripNav li.tab2 a,
#home-slider .stripNav li.tab3 a,
#home-slider .stripNav li.tab4 a,
#home-slider .stripNav li.tab5 a {
 background: #b3b3b3;
}

#home-slider .stripNav li a:hover {
 background: #ebebeb;
}
		
#home-slider .stripNav li a.current {
 background: #d7d7d7;
 color: #484848;
}
		
.stripNavL, .stripNavR { 
 display: none;
}


/* home banners */

.home-banners {margin-bottom:10px; display:block; }

/* ===== Price Tables ===== */

#pricetable {

	border: 1px solid #e1e1df;
	border-collapse: collapse;
	margin: 0;
	padding: 0;
	background-color: #f4f4f4;
	margin: 0 0 13px 0;  }
#pricetable p {
	margin: 0;
	padding: 0; }
#pricetable td {
	border: 1px solid #e1e1df;
	padding: 2px 6px;
	margin: 0 }
#pricetable td.subheader {
	background-color: #ccd8ba; }
#pricetable th {
	border-left: 1px solid #e1e1df;
	border-right: 1px solid #e1e1df;
	border-bottom: 1px solid #e1e1df;
	background-color: #ededed;
	font-weight: bold;
	padding: 2px 6px;
	margin: 0;
	text-align: left; }
#pricetable tr.stripe {
background-color:#f6f6f6;}

.bookarrow {
float: left;
margin: 5px 15px 5px 0;}

.treatment-th {
background-color:#dfdfdf;
font-weight:bold;}





/* ====  Offers ==== */	

.promotion { margin-bottom: 15px; }




/* ==== Polaroid Styles ==== */	

.polaroid {
float:right;
margin: 0 5px 15px 15px;}

.polaroid-title {
width: 355px;}


/* ==== Split Table Styles ==== */	

.splittd-left {
border-right: solid 1px #e1e1df;}

.splittd-right {
padding-left: 15px;}

.splittd-break {
margin: 5px 0 8px 0;}

/* ====== Main Contact Form =====  */

#contact  {
width:430px;
margin:0 0 0 0;
padding:15px;
background:url(../images/contact-form-bg.gif) top left no-repeat #ff9702;
color:#662f07;
}
.formtextfield { 
width:215px;
margin:0 0 12px 0;
padding:4px 0 4px 3px;
/*height:17px;*/
font: bold 10px Tahoma, Arial, Helvetica, sans-serif; color: #aaaaaa;
color: #6c6c6c;
}
.formdropdownfield { 
width:220px;
margin:0 0 12px 0;
padding:4px 0 4px 3px;
/*height:17px;*/
font: bold 10px Tahoma, Arial, Helvetica, sans-serif; color: #aaaaaa;
color: #6c6c6c;
}
.formtextarea {
width:210px;
height:120px;
padding:4px;
font: bold 10px Tahoma, Arial, Helvetica, sans-serif; color: #aaaaaa;
color: #6c6c6c;
}
.basicsubmitbutton {
width: 220px;
height: 38px;
margin: 10px 0 0 0;
padding: 0;
border:none;
background:url(/images/main-contact-button.gif) top left no-repeat;
cursor:pointer;}



/* ==== footer ==== */

#footer {
width: 900px;
margin: 20px 0 0 0;
padding: 0 20px;
color: #464646;
font-size: 11px;
background:url(/images/backgrounds/footer.jpg) top left repeat-x #e3e2e2;}

#footer p {
margin: 0 0 12px 0;
padding: 0;	}
	
#footer a, #footer a:link, #footer a:visited {
color: #464646;
text-decoration: none;
font-weight:normal;	}
	
#footer a:hover {
color: #1b1b1b;
text-decoration: underline;
font-weight:normal;		}

.footertitle {
font-size:17px;
color:#464646;}

.footericoncell {
width: 51px;}

.footertitlecell {
padding-top:19px;}

.footericon {
margin: 0 10px 0 0;}

.footerleft {
width: 550px;
float:left;
background:url(/images/backgrounds/footer-divide.jpg) top right no-repeat;
padding: 20px 20px 0 0;}

.footerright {
width: 305px;
float: right;
padding: 20px 0 0 0;}



/* ======= Paypal Form for Gift Vouchers ========== */


#giftvouchers {
width: 498px;
background:url(/images/backgrounds/paypal-form.jpg) bottom left no-repeat #efefef;
font-size:11px;
padding: 10px;
border:solid 1px #dadada;}

#giftvouchers .fieldstyle {
width: 180px;
font-size: 11px;
color:#413121;
padding: 4px 2px;
border:solid 1px #dadada;}

#giftvouchers .dropstyle {
width: 185px;
font-size: 11px;
color:#413121;
padding: 4px 2px;
border:solid 1px #dadada;}

#giftvouchers .ordernow {
margin: 6px 0 0 0;}






/* ====== Quick Contact Form =====  */

#quickcontact  {
width: 305px;
margin: 0;
padding: 0 0 15px 0;}
#quickcontact input { 
font: normal 10px Tahoma, Arial, Helvetica, sans-serif; color: #8e8e8e;
width: 235px;
margin: 0 0 8px 0;
padding: 4px 0 4px 2px;
/*border: solid 1px #fff;
background-color:#f1f1f1;*/}
#quickcontact textarea {
font: normal 10px Tahoma, Arial, Helvetica, sans-serif; color: #8e8e8e;
width: 235px;
height:40px;
margin: 0 0 8px 0;
padding: 4px 0 4px 2px;}
#quickcontact input.submit {
font: bold 11px Tahoma, Arial, Helvetica, sans-serif; color: #fff;
width: 116px;
height: 29px;
margin: 5px 0 0 0;
padding: 0;
border:none;
background:url(/images/footer/quick-contact-submit.jpg) top left no-repeat;
cursor:pointer;}

#quickcontact input.required.error, #quickcontact select.required.error, #quickcontact textarea.required.error{
	border: 1px solid #ce1d1d;
	background-color: #f1f1f1;
margin: 0 0 8px 0;
}

#quickcontact input.required, #quickcontact select.required, #quickcontact textarea.required, #quickcontact input.notrequired, #quickcontact select.notrequired, #quickcontact textarea.notrequired{
	border: 1px solid #fff;
	background-color: #f1f1f1;
margin: 0 0 8px 0;
}

div.error {
	color: #ce1d1d;
}




.cmxform fieldset p.error label { color: #fff; }
div.container {
	margin: 0 0 12px 0;
	color:#ffffff;
	background: url(/images/backgrounds/quick-validation.jpg) top left no-repeat;
width: 213px;
	height:88px;
	padding: 7px 0 0 92px;
	line-height:19px;
}
div.container ol li {
	list-style-type: disc;
	margin-left: 20px;
}
div.container { display: none }



/* ====== Main Contact Form =====  */


#maincontact input.required.error, #maincontact select.required.error, #maincontact textarea.required.error{
	border: 1px solid #ce1d1d;
	background-color: #f1f1f1;
margin: 0 0 8px 0;
}

#maincontact input.required, #maincontact select.required, #maincontact textarea.required, #maincontact input.notrequired, #maincontact select.notrequired, #maincontact textarea.notrequired{
width: 180px;
font-size: 11px;
color:#413121;
padding: 4px 2px;
border:solid 1px #dadada;
}


#maincontact textarea {
font: normal 11px Tahoma, Arial, Helvetica, sans-serif; color: #8e8e8e;
width: 235px;
height:40px;
margin: 0 0 8px 0;
padding: 4px 0 4px 2px;}


div.maincontainer {
background-color:#f8f8f8;
border:solid 1px #919193;
	margin: 0 0 12px 0;
	color:#ce1d1d;
width: 485px;
	height:88px;
	padding: 7px 0 0 10px;
	line-height:19px;
}
div.maincontainer ol li {
	list-style-type: disc;
	margin-left: 20px;
}


div.maincontainer { display: none }


#maincontact input.submit {
font: bold 11px Tahoma, Arial, Helvetica, sans-serif; color: #fff;
width: 140px;
height: 30px;
margin: 5px 0 0 0;
padding: 0;
border:none;
background:url(/images/send-enquiry.jpg) top left no-repeat;
cursor:pointer;}