@import url("reset.css");
body{font:62.5%/16px Arial, Helvetica, sans-serif; background-color:#fff; color:#5F604B; text-align:center;/*ie fix*/ background:url("../images/petals.png") no-repeat center -50px; padding-bottom:100px;}

/*=typo*/
	ul,ol,dl,h1,h2,h3,h4,h5,h6,td,th,caption,pre,p,input,textarea{font-size:1.1em; line-height:1.6em;}

	h1,h2{clear:both; margin:0;}
	h1{font-size:2.4em; line-height:30px; margin:0 0 20px 0; font-weight:normal;}
	/* top margin for title for pages without sub navigation */
	#pampers h1, #facials h1, #beauty h1, #microdermabrasion h1, #contact h1, #vouchers h1, #terms h1, #ourtreatments h1, #health h1{margin-top:15px; margin-bottom:10px;}
	#about h1, #gallery h1, #before h1, #media h1, #press_say h1, #guests h1, #picnic h1, #seasonal h1{margin-top:15px;}
	
	.nm{margin:0;}
	h2{font-size:1.1em; line-height:16px; font-weight:bold;}
	em{font-style:italic;}

	p{margin-bottom:1.6em;}
	a{color:#8E8873; outline:none; white-space:nowrap;}
	a:hover{color:#000;}
	
/*=grid*/
	#container{width:760px; margin:0 auto; text-align:left;}
		.content_8, .content_1_1_1_1_1_1_1_1, .content_2_2_2_2, .content_1_7, .content_2_6, .content_3_5, .content_4_4, .content_5_3, .content_6_2, .content_7_1, .content_4_1_1_1_1, .content_4_2_2, .content_2_2_4{clear:both; float:left; display:inline; width:760px; margin-bottom:20px;}
			.col_1, .col_2, .col_3, .col_4, .col_5, .col_6, .col_7, .col_8{position:relative; float:left; display:inline; width:95px; padding-bottom:1px; /*so they don't collapse*/}

	.content_8 .col_1{width:760px;}

	.content_1_1_1_1_1_1_1_1 .col_1, .content_1_1_1_1_1_1_1_1 .col_2, .content_1_1_1_1_1_1_1_1 .col_3, .content_1_1_1_1_1_1_1_1 .col_4, .content_1_1_1_1_1_1_1_1 .col_5, .content_1_1_1_1_1_1_1_1 .col_6, .content_1_1_1_1_1_1_1_1 .col_7, .content_1_1_1_1_1_1_1_1 .col_8{width:95px;}

	.content_2_2_2_2 .col_1, .content_2_2_2_2 .col_2, .content_2_2_2_2 .col_3, .content_2_2_2_2 .col_4{width:170px; margin-right:20px;} 
	.content_2_2_2_2 .col_4{margin-right:0;}

	.content_1_7 .col_1{width:645px; margin-right:20px;}
	.content_1_7 .col_2{width:75px;}

	.content_2_6 .col_1{width:190px; margin-right:20px;}
	.content_2_6 .col_2{width:570px;}

	.content_3_5 .col_1{width:265px; margin-right:20px;}
	.content_3_5 .col_2{width:455px;}

	.content_4_4 .col_1, .content_4_4 .col_2{width:360px; margin-right:20px;}
	.content_4_4 .col_2{margin:0;}

	.content_5_3 .col_1{width:455px; margin-right:20px;}
	.content_5_3 .col_2{width:265px;}

	.content_6_2 .col_1{width:550px; margin-right:20px;}
	#gallery .content_6_2 .col_1{width:570px; margin:0;}
	.content_6_2 .col_2{width:190px;}
	
	.content_7_1 .col_1{width:75px; margin-right:20px;}
	.content_7_1 .col_2{width:645px;}
	
	.content_4_1_1_1_1 .col_1{width:360px; margin-right:20px;}
	.content_4_1_1_1_1 .col_2, .content_4_1_1_1_1 .col_3, .content_4_1_1_1_1 .col_4{width:95px;}
	
	.content_4_2_2 .col_1{width:360px; margin-right:20px;}
	.content_4_2_2 .col_2{width:190px;}
	.content_4_2_2 .col_3{width:190px;}
	
	.content_2_2_4 .col_1{width:190px;}
	.content_2_2_4 .col_2{width:190px;}
	.content_2_2_4 .col_3{width:380px;}
	
	.content_8 .col_1 img,
	.content_4_4 .col_2 img{margin-top:-1px;}	

/*=page components*/
	#header{position:relative; width:760px; height:135px;}
	#header:after{content:"."; display:block; height:0; clear:both; visibility:hidden;} 
		#header #navigation{position:absolute; margin:0; padding:0; bottom:20px; width:550px; height:auto;}
			#header #navigation li{float:left; margin-right:10px;}
				#navigation li a{text-decoration:none; color:#000;}
				#navigation li a:hover{text-decoration:none; color:#878747;}
		#header a#logo{position:absolute; bottom:19px; right:0; width:189px; height:22px;}
		#header a#logo:hover{background:url("../images/logo_on.png") no-repeat left top;}
		#header a#logo:hover img{display:none;}
		
	
	#content{border-top:1px solid #ddd;}
	#content:after{content:"."; display:block; height:0; clear:both; visibility:hidden;}
			
		#subnavigation{float:left; width:350px; margin:-10px 0 15px 0; padding:0;}
			#subnavigation li{float:left; margin-right:10px;}
				#subnavigation li a{color:#000;}

	p#help{font-style:italic; margin:0;}
	
	#footer{display:none;}
	#home #footer{display:block; width:760px;}
		#footer p{margin:0;}

	img{border:0; display:block;}
	
	ul li.selected a{font-weight:bold; color:#5F604B;}
	ul#navigation li.selected a, #subnavigation li.selected a{font-weight:normal; color:#878747;}

	ul.bulleted li{background:url("../images/square.png") no-repeat left 0.5em; padding-left:10px; margin-bottom:10px; width:350px;}
	
	ul.treatment_list.left, ul.treatment_list{width:190px; float:left; margin:0 0 25px 0; }
	ul.treatment_list{width:170px;}
	ul.treatment_list ul{ margin-top:18px; font-size:1em;}
		ul.treatment_list ul h2{font-size:1em; font-weight:normal; font-style:italic;}
		
	ul.prices{width:100%; float:left;}
	ul.prices li{width:190px; float:left;}
	ul.prices li.odd{width:170px;}

	#treatment_description{float:left; width:100%; clear:both;}

	ul.dump li{clear:left; float:left; width:100%; margin-bottom:2em;}
		ul.dump li ul{margin-bottom:0em;}
			ul.dump li ul li{clear:none; margin-bottom:0;}
		ul.dump li h2, ul.dump li p, ul.dump li ul{font-size:1em;}
		ul.dump li p{margin-bottom:0.5em;}
	
	#press_say .offset{margin-top:90px;}
	#guests .offset{margin-top:123px}

/*=page specific*/
	/*=home*/
	p#introduction{font-size:1.4em; line-height:1.5em; margin:-10px 0 0 0;}
	p#introduction1{font-size:1.4em; line-height:1.5em; margin: 0px;}
	p#valentinestext{font-size:1.6em; line-height:1.5em; margin: 0px;}
	ul#features{position:absolute; bottom:20px; right:20px;}
		ul#features li{line-height:20px; background:url("../images/bullet.png") no-repeat left center; padding-left:10px;}
		ul#features li a{font-weight:bold; color:#fff;}
		ul#features li a:hover{text-decoration:none;}
	
	#news{padding:10px; background:#EBE8DD;}
		#news ul{margin-top:-10px;}
			#news ul li{width:auto; margin:10px 0 0 0;}
	
	#mailing {width: 200px;}
	.mailingenter {margin: 10px 5px 0px 0px; padding:1px;}
	.mailingenter2 {margin: 10px 0px 0px 0px;}
	
	
	#twitter {float:right; padding:10px 10px 0px 0px;}
	.fb-like {float:right; padding:15px 0px 0px 0px;}
	#plusone {float:right; padding:11px 68px 0px 0px;}
	#valentines {float:right; padding:18px 0px 0px 0px;}
	
	#twittercontact {float:right; padding:10px 10px 0px 0px;}
	#fbcontact {float:right; padding:10px 10px 0px 0px;}
	
	#giftlink {clear:both;}
	/*=about*/
	
	/*=gallery*/
	#photo_gallery{clear:left; margin-top:4px;}
	#photo{display:block;}
	#caption{margin-top:1.4em;}
	#gallery_thumbs{float:left; width:190px; margin-top:93px;}
	#gallery_thumbs li{position:relative; float:left; width:53px; height:53px; overflow:hidden; margin:0 0 10px 10px; display:inline;}
	#gallery_thumbs li a{display:block; width:53px; height:53px;}
	#overlay{position:absolute; display:block; top:0; left:0; width:53px; height:53px; background:url("../images/overlay.png") repeat left top;  z-index:1000;}
	
	#gallery_navigation{clear:both; float:left; width:190px;}
		#gallery_navigation a{font-size:1.1em;}
		#gallery_navigation a#previous{background:url("../images/previous.png") no-repeat left center; padding-left:10px; float:left;}
		#gallery_navigation a#previous:hover{background:url("../images/previous_on.png") no-repeat left center;}
		#gallery_navigation a#previous.inactive{background:url("../images/previous_inactive.png") no-repeat left center; color:#ccc; text-decoration:none;}
		#gallery_navigation a#previous.inactive:hover{color:#ccc; text-decoration:none; cursor:default; background:url("../images/previous_inactive.png") no-repeat left center;}
		
		#gallery_navigation a#next{background:url("../images/next.png") no-repeat right center; padding-right:10px; float:right;}
		#gallery_navigation a#next:hover{background:url("../images/next_on.png") no-repeat right center; padding-right:10px;}
		#gallery_navigation a#next.inactive{background:url("../images/next_inactive.png") no-repeat right center; color:#ccc; text-decoration:none;}
		#gallery_navigation a#next.inactive:hover{color:#ccc; text-decoration:none; cursor:default; background:url("../images/next_inactive.png") no-repeat right center;}
	
	/*=treatments*/
		
	/*=health*/
	#health p#help{margin-top:20px;}
	ul#ailments{width:100%; float:left; margin:15px 0 20px 0;}
	ul#ailments li{width:170px; float:left;}
	ul#ailments li.odd{width:190px;}
	
	/*=beauty*/
	dl{float:left; width:100%; margin-bottom:15px;}
	dt{font-weight:bold; width:100%; clear:left;}
	dd{float:left; width:100%;}
	dd.last{margin-bottom:15px;}
	dd span.type{display:block; float:left; width:120px;}
	#nails_eyes{width:190px; float:left;}
		#nails_eyes p{clear:right;}
	#waxing{width:170px; float:right;}	
	#microdermabrasion{width:360px; float:left; clear:right;}
	#p micro {font-size:2.6em; line-height:30px; margin:0 0 20px 0; font-weight:normal;}
	
	
	/*=products*/
	#product_list{position:relative; background:url("../images/products.jpg"); width:760px; height:392px; background-position:left bottom;}
	#product_list ul{margin:0; padding:0;}
		#product_list a{white-space:normal; text-decoration:none; cursor:default;}
		#product_list a:hover{color:#5F604B; border:none;}
		
		.hotspot{position:absolute;}
		a:hover .hotspot{border:1px solid #fff;}
		.info{display:none; width:25em; height:7em; padding:10px;}
		a:hover .info{position:absolute; display:block; background:#fff;}
			.name{display:block; font-weight:bold; margin:0; padding:0; line-height:1.1em;}
			.description{display:block;}
		
	/*hotspots*/
	.balm .hotspot{top:225px; left:180px; width:140px; height:155px;}
	.balm .info{top:225px; left:322px;}
	.soak .hotspot{top:45px; left:415px; width:125px; height:285px;}
	.soak .info{top:235px; left:120px;}
	.cream .hotspot{top:10px; left:253px; width:135px; height:335px;}
	.cream .info{top:250px; left:390px;}
	.oil .hotspot{top:128px; left:365px; width:100px; height:240px;}
	.oil .info{top:128px; left:70px;}
	
	#product_list a:hover{border:none;}
	
	#products h1{color:#fff; position:absolute; top:15px; left:15px; width:190px; line-height:1.1em;}
	#products h1 em{font-size:11px; font-style:italic; display:block; line-height:15px;}
	
	/*=press*/
	ul.testimonial li{width:350px; background:url("../images/speech_marks.png") no-repeat left top; padding-left:20px;}
		ul.testimonial li h3{font-size:1em; font-style:italic;}
		ul.testimonial li p{font-size:1em;}
		ul.testimonial li .guestname{display:block;}
		
	ul.press{margin-bottom:20px;}
	ul.press li{}
	#placeholder{width:380px; margin-top:19px;}
	#placeholder img{margin-top:0px; display:inline;}
	#placeholder p{text-align:left;}
	
	
	/*=seasonal*/
	
	/*=voucher*/
	#vouchers .content_4_4 .col_2 img{margin-top:0;  border-top:0;}
	
	/*=contact*/
	.vcard div{font-size:1.1em; line-height:1.6em;}
		.vcard div div{font-size:1em;}
	
	.adr{margin-bottom:1.6em;}
		.adr span{display:block;}
		.tel{margin-bottom:1.6em; font-weight:bold;}
		
	#opening_times{margin-bottom:1.6em;}
		#opening_times td{width:95px;}

	.map_link{display:block;}
	.tube,.bus{font-weight:bold;}
	
	img#map{margin-top:20px;}
	
	/*hr */
	.hr{clear:both; line-height:1px; height:1px; width:100%;}
	.hr hr{display:none;}

/*=clear fix*/
	.clear{clear:both;}
	.clearfix:after{content:"."; display:block; height:0; clear:both; visibility:hidden;}
	
/*=Preloading of gallery*/
.preload{display:none; position:absolute; visibility:hidden; left:-999em; width:10px; height:10px;}

.zoomable{cursor:pointer;}

/*=romance pamper*/
#pampers p#introduction{font-size:1.4em; line-height:1.5em; margin:0 0 10px 0;}