/* CSS STYLE SHEET FOR SM HAIR SALONS LTD WEBSITE */
/* PRODUCED BY: ASD SOLUTIONS */
/* COPYRIGHT SM HAIR SALONS LTD 2007 - ALL RIGHTS RESERVED */


/* SITE FRAMEWORK STYLES */

* {
	margin: 0;
	padding: 0;
}

html {
	height: 100%;
}

body {
	background: #404040 url('bg.jpg') no-repeat 50% 40%;
	height: 100%;
	margin: 0;
	min-width: 950px;
	min-height: 600px;
	text-align: center;
	padding: 0;
	border: 0;
	font-family: helvetica, arial, verdana, sans-serif;
	font-size: 100%;
}


.logo {
	position: absolute;
	left: 0px;
	top: 30px;
	width: 322px;
	height: 49px;
	border: 0;
	padding: 0;
	margin: 0;
	display: block;
}


.contact_details {
	position: absolute;
	left: 530px;
	top: 50px;
	border: 0;
	padding: 0;
	margin: 0;
}

.hero {
	position: absolute;
	top: 112px;
	width: 247px;
	height: 370px;
	left: 0px;
	margin: 0;
}

#wrap {
	width: 1px;
	height: 50%;
	margin-bottom: -328px;
	text-align: left;
	float: left;
}

#main {
	margin: 0 auto;
	position: relative;
	height: 656px;
	width: 900px;
	padding: 0;
	border: 0;
	text-align: left;
	clear: left;
	
}

#main_inset {
	top: 120px;
	margin: 0 auto;
	position: relative;
	height: 460px;
	width: 900px;
	padding: 0;
	background-color: transparent;
	border: 0;
	text-align: left;
	clear: left;
}

.pattern_upper_right {
	position: absolute;
	right: 0px;
	top: 0px;
}

.pattern_lower_left {
	position: absolute;
	left: 0px;
	bottom: 0px;
}


/* MAIN CONTENT STYLES */


/* IMPORTED FROM CURRENT TEMPLATE VARIATION */

.desc {
	clear: both;
	display: inline;
	font-family: helvetica, arial, verdana, sans-serif;
	color: #404040;
	padding: 0;
	margin: 2px 0 6px 0;
	float: left;
}

.price {
	display: inline;
	font-family: helvetica, arial, verdana, sans-serif;
	color: #404040;
	padding: 0;
	margin: 2px 0 6px 0;
	float: right;
}

#maincontent a, #maincontent a:link, #maincontent a:active, #maincontent a:visited {
	color: #404040;
	text-decoration: underline;
	padding: 0;
	margin: 0;
	border: 0;
}

#maincontent a:hover, #maincontent a:link:hover, #maincontent a:visited:hover {
	text-decoration: none; 
	color: #404040;
	padding: 0;
	margin: 0;
	border: 0;
}


.img_inline_left {
	float: left;
	border: 1px solid #a7a9ac;
	margin: -18px 8px 0 -95px;
}


#main_image {
	position: absolute;
	top: 15px;
	right: 14px;
	width: 288px;
	height: 430px;
	background-color: #ffffff;
	border: 0;
	overflow: hidden;
}


/* SLIDESHOW COVER */

#slideshow_cover {
	z-index: 1;
	position: absolute;
	top: 25px;
	right: 24px;
	width: 220px;
	height: 320px;
	overflow: hidden;
}

#slideshow_cover a {
	display: inline;
	position: relative;
	width: 69px;
	height: 44px;
	background-color: #f00;
	border: 1px solid #fff;
}

/* SLIDESHOW CONTROLS */

#slideshow_controls {
	position: absolute;
	display: block;
	width: 220px;
	height: 44px;
	top: 302px;
	right: 25px;
	overflow: hidden;
	padding: 0;
	opacity: .0;
	filter: alpha(opacity=0);
}

#slideshow_controls li {
	display: inline;
	padding: 0;
	margin: 0;
}

#slideshow_controls img {
	display: inline;
	margin: 0;
	padding: 0;
	border: 0;
	padding-right: 0;
}




/* TOP MENU STYLES */

#topmenu {
	height: 0px;
	font-family: helvetica, arial, verdana, sans-serif;
	display: block;	
	position: relative;
	text-align: right;
	top: 105px;
	width: 887px;
	margin: 0;
	padding: 7px 0 7px 13px;
	font-family: georgia, times, serif;
	font-size: 0.9em;
	font-weight: normal;	
	font-style: italic;
}


#topmenu li {
	display: inline;
}

#topmenu li a {
	text-decoration: none;
	color: #fff;
	padding: 0 5px;
	outline: none;
}


#topmenu li a:hover {
	text-decoration: underline;
}


#topmenu li a.selected {
	text-decoration: underline;
	color: #fff;
	outline: none;
}

#topmenu li a.selected:hover {
	text-decoration: underline;
}




/* LEFT LINKS STYLE */

#leftlinks {
	position: absolute;
	top: 15px;
	left: 15px;
	width: 150px;
	height: 430px;
	border: 0;
	margin: 0;
	padding: 0;
	overflow: auto;
	background: #949393 url('/images/layout/leftmenu_bg.jpg') top left no-repeat;
}

#leftlinks li {
	display: block;
	padding: 0;
	margin: 0;
}


#leftlinks li a {
	font-family: georgia, times, serif;
	font-size: 0.8em;
	font-weight: normal;
	font-style: italic;
	text-align: left;
	text-decoration: none;
	margin: 0 0 1px 0;
	padding: 4px 0 4px 7px;
	display: block; 
	width: 143px;
	border: 0;
	background-color:#929292; 
	border: 0;
	color: #fff; 
	outline: none;
}

#leftlinks li a.highlight {
	background-color: #F74300; 
	color: #fff;
}

#leftlinks li a:hover {
	color: #595959;
}

#leftlinks li a.level1 {
	background-color:#eaeaea; 
	width: 138px;
	padding: 4px 0 4px 12px;
	color: #404040; 
}

#leftlinks li a.level1highlight {
	background-color:#eaeaea; 
	width: 138px;
	padding: 4px 0 4px 12px;
	color: #F74300; 
}

#leftlinks li a.level1:hover {
	color: #F74300; 
}

#leftlinks li a.level1highlight:hover {
	color: #F74300; 
}

#leftlinks li a.a_center {
	text-align: center;
}

#leftlinks li a.a_center:hover {
	color: #F74300;
	text-decoration: none;
}

#leftlinks img {
	z-index: 2;
	border: 1px solid #a7a9ac;
	margin: 0 0 0 -2px;
	padding: 0;
}



/* FOOTER STYLE */

#footer {
	position: absolute;
	top: 468px;
	margin: 0 auto;
	left: 0px;
	height: 27px;
	width: 900px;
	border: 0;
}

#footer p {
	font-family: helvetica, arial, verdana, sans-serif;
	font-size: 0.7EM;
	color: #929292;
	line-height: 14pt;
	text-align: right;
	margin: 0;
	padding: 0.3em 0 0 0;
}

#footer p span {
	padding: 0 4px;
}

#footer a, #footer a:link, #footer a:active, #footer a:visited {
	color: #929292;
	text-decoration: none;
	padding: 0;
	margin: 0;
	border: 0;
}

#footer a:hover {
	color: #929292;
	text-decoration: underline;
	padding: 0;
	margin: 0;
	border: 0;
}


/* ADDITIONAL STYLES */

/* ENLARGED MAP STYLES */

#page_fader_container {
	position: absolute;
	display: block;
	top: -1px;
	left: -1px;
	z-index: 3;
	width: 852px;
	height: 462px;
	margin: 0;
	text-align: left;
}

#page_fader {
	display: block;
	z-index: 3;
	position: absolute;
	width: 850px;
	height: 460px;
	background-color: #000;
	border: 1px solid #000;
	opacity: .9;
	filter: alpha(opacity=90);
}

#map_container {
	position: absolute;
	top: 30px;
	left: 30px;
	z-index: 4;
	width: 800px;
	height: 400px;
	margin: 0;
	text-align: left;	
}

#nearby_parking {
	z-index: 4;
	display: block;
	width: 340px;
	height: 400px;
	position: absolute;
	left: 450px;
	border: 0;
	text-align: left;
}

#nearby_parking img {
	float: left;
	margin: 0 12px 12px 0;
}

#nearby_parking h1 {
	float: left;
	font-family: helvetica, arial, verdana, sans-serif;
	font-size: 14pt;
	color: #fff;
	margin: 10px 0 0 0;
}

#map {
	z-index: 4;
	width: 420px;
	height: 400px;
	position: absolute;
	background-color: #fff;
	border: 0;
	text-align: center;
}

#map img {
	margin: 16px 0 0 0;
	border: 1px solid #404040;
	width: 385px;
	height: 365px;
}

#nearby_parking a {
	position: absolute;
	right: 0px;
	bottom: 0px;
	font-family: helvetica, arial, verdana, sans-serif;
	font-size: 0.75EM;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	padding: 6px 0 0 0;
	display: block; 
	width: 142px;
	height: 18px;
	background-color: #303030;
	border: 1px solid #151515;
	color: #fff; 
	outline: none;
}

#nearby_parking p {
	clear: left;
	font-family: helvetica, arial, verdana, sans-serif;
	font-size: 0.8em;
	color: #fff;
	margin: 4px 0 8px 0;	
}

#nearby_parking a:hover {
	text-decoration: none;
	background-color: #353535;
	border: 1px solid #151515;
	color: #fff;
}

/* SALON LINKS STYLES */

#salon_links li {
	display: block;
	padding: 0;
	margin: 0;
}



/* HOME PAGE */


div.home_sil {
	background: transparent url('hurleys-salon-logo.png') top left no-repeat;
	position: absolute;
	top: 110px;
	left: 15px;
	z-index: 1;
	height: 197px;
	width: 350px;
}

div.home_sil div.gallery_text {
	position: absolute;
	top: 165px;
	left: -2px;
}

div.home_sil div.gallery_text p a {
	text-indent: -10000px;
	background-color: transparent;
	background-image: url('/images/layout/get_inspired.png');
	background-position: 0 0;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 204px;
	height: 121px;
	outline: none;
}

div.home_sil div.gallery_text p a:hover {
	background-position: 0 -121px;
}


div.home_sil div.gallery_text p span.block {
	font-family: georgia, times, serif;
	font-size: 1.1em;
	font-weight: normal;
	font-style: italic;
	color: #929292;
	background-color: #2b2b2b;
	line-height: 1;
	padding: 3px 6px;
	margin: 1px 0 0 0;
	display: inline;
	float: left;
	clear: left;
}

div.home_sil div.gallery_text p span.block a {
	color: #f74300;
	text-decoration: none;
}

div.home_sil div.gallery_text p span.block a:hover {
	color: #fff;
}

div.home_sil div.gallery_text p span.title {
	margin: 1px 0 3px 0;
}



div.home_welcome {
	z-index: 1000;
	position: absolute;
	left: 500px;
	top: 60px;
	display: block;
}

div.home_welcome h1 {
	font-family: georgia, times, serif;
	font-size: 0.9em;
	font-weight: normal;
	text-align: left;
	color: #404040;
	text-transform: uppercase;
	padding: 0;
	margin: 0;
	line-height: 1.0em;
}

div.home_welcome h1 span {
	font-size: 2em;
	font-weight: normal;
	line-height: 0.5em;
	padding: 0;
	margin: 0;
}

div.home_welcome div.text_content {
	position: absolute;
	top: 80px;
}

div.home_welcome p.welcome {
	font-family: georgia, times, serif;
	font-size: 0.9em;
	font-weight: normal;
	color: #fff;
	text-transform: uppercase;
	line-height: 1.3em;
	padding: 0;
	margin: 0;
	width: 345px;
}

div.home_welcome p {
	font-family: helvetica, arial, verdana, sans-serif;
	font-size: 0.8em;
	font-weight: normal;
	color: #fff;
	line-height: 1.3em;
	padding: 0;
	margin: 1.5em 0;
	width: 345px;
}

div.home_welcome p a {
	color: #f74300;
	text-decoration: none;
}

div.home_welcome p a:hover {
	text-decoration: underline;
}


div.home_welcome p span.block {
	font-family: georgia, times, serif;
	font-size: 1.25em;
	font-weight: normal;
	font-style: italic;
	color: #929292;
	background-color: #404040;
	line-height: 1;
	padding: 1px 6px;
	margin: 0 0 10px 0;
	display: inline;
	float: left;
	clear: left;
}

div.home_welcome p span.block a {
	text-decoration: none;
	color: #f74300;
}

div.home_welcome p span.block a:hover {
	color: #fff;
}

div.home_boxes {
	z-index: 1000;
	position: absolute;
	bottom: 15px;
}


div.home_boxes div.home_box {
	border: 1px solid #212121;
	padding: 4px;
	background: transparent url('/images/layout/home_box_bg.png') 4px 4px no-repeat;
	float: left;
	width: 270px;
	display: block;
	height: 92px;
	margin-left: 15px;
	position: relative;
}

div.home_boxes div.home_box h3 {
	font-family: georgia, times, serif;
	font-size: 0.9em;
	font-weight: normal;
	font-style: italic;
	text-align: left;
	color: #929292;
	padding: 10px 0 4px 12px;
}

div.home_boxes div.home_box h3 a {
	color: #929292;
	text-decoration: none;
}

div.home_boxes div.home_box h3 a:hover {
	color: #fff; 
}

div.home_boxes div.home_box p {
	font-family: helvetica, arial, verdana, sans-serif;
	font-size: 0.70em;
	font-weight: normal;
	font-style: normal;
	text-align: left;
	color: #fff;
	line-height: 1.3;
	padding: 3px 0 0 12px;
	width: 175px;
}

div.home_boxes div.home_box img {
	position: absolute;
	right: 12px;
	bottom: 4px;
}

div.home_boxes div.home_box img.instant_photo {
	position: absolute;
	right: 4px;
	bottom: -5px;
}





div.loreal_logo {
	background: transparent url('/images/layout/loreal_pro_logo.png') top left no-repeat;
	display: block;
	width: 103px;
	height: 27px;
	position: absolute;
	top: 15px;
	right: 15px;
}


/* PRODUCTS PAGE */

div.products_image {
	position: absolute;
	top: 193px;
	left: 3px;
}

div.product_logos {
	z-index: 1000;
	position: absolute;
	bottom: 39px;
	left: 25px;
	display: block;
	width: 132px;
	height: 160px;
}

div.product_photo {
	position: absolute;
	bottom: 0;
	right: 2px;
	border: 0
	display: block;
	width: 305px;
	height: 455px;
	margin: 0;
	padding: 0;
}


/* SALONS PAGE */

div.salon_thumbs {
	padding: 1.0em 0 0 0;
	margin: 0 0 0 22px;
}

div.salon_thumbs img {
	border: 1px solid #404040;
	width: 85px;
	height: 85px;
	margin: 0 3px;
}



/* POLAROID PHOTO */

div.polaroid_photo {
	position: absolute;
	bottom: 0;
	right: 0;
	border: 0
	display: block;
	width: 336px;
	height: 460px;
	margin: 0;
	padding: 0;
	background: transparent url('/images/layout/polaroid_bg.png') top left no-repeat;
}

div.polaroid_photo img {
	margin: 39px 0 0 34px;
	border: 0;
}