/* 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('/images/layout/bg.png') repeat-x 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: 320px;
	height: 47px;
	border: 0;
	padding: 0;
	margin: 0;
}


.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: #fff url('/images/layout/canvas_bg.jpg') top left no-repeat;
	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 {
	background: #9ea2a7 url('/images/layout/header_bg.png') top left repeat-y;
	font-family: helvetica, arial, verdana, sans-serif;
	display: block;	
	position: relative;
	text-align: right;
	top: 105px;
	width: 874px;
	margin: 0;
	padding: 7px 13px 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 {
	color: #404040;
	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;
	padding: 4px 0 4px 7px;
	display: block; 
	width: 143px;
	border: 0;
	background-color: transparent; 
	border-bottom: 1px solid #929292;
	color: #929292; 
	outline: none;
}

#leftlinks li a.highlight {
	background-color: #d9d9d9; 
	color: #404040;
}

#leftlinks li a:hover {
	color: #fff;
}

#leftlinks li a.level1 {
	background-color:#929292; 
	width: 138px;
	padding: 4px 0 4px 12px;
	color: #404040; 
	border-bottom: 1px solid #404040;
}

#leftlinks li a.level1highlight {
	background-color:#eaeaea; 
	width: 138px;
	padding: 4px 0 4px 12px;
	color: #404040;
	border-bottom: 1px solid #404040;
}

#leftlinks li a.level1:hover {
	color: #fff; 
}

#leftlinks li a.level1highlight:hover {
	color: #404040; 
}

#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: #fff;
	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: #fff;
	text-decoration: none;
	padding: 0;
	margin: 0;
	border: 0;
}

#footer a:hover {
	color: #fff;
	text-decoration: underline;
	padding: 0;
	margin: 0;
	border: 0;
}


#footer div.social_icons {
	float: left;
	width: 100px;
	height: 21px;
	margin: 2px 0 0 0;
}

#footer div.social_icons a {
	text-indent: -10000px;
	display: block;
	width: 25px;
	height: 25px;
	float: left;
	padding: 0 2px 0 0;
}

#footer div.social_icons a.facebook {
	background: transparent url('/images/layout/social-icons.png') 0px 0px no-repeat;
}

#footer div.social_icons a.twitter {
	background: transparent url('/images/layout/social-icons.png') -28px 0px no-repeat;
}

#footer div.social_icons a.newsfeed {
	background: transparent url('/images/layout/rss-icon.png') top left no-repeat;
}

/* 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('/images/layout/home-model.jpg') bottom left no-repeat;
	position: absolute;
	bottom: 0;
	left: 0px;
	z-index: 1;
	height: 460px;
	width: 900px;
}

div.home_sil div.gallery_text {
	position: absolute;
	top: 179px;
	left: 0px;
}

div.home_sil div.gallery_text p a {
	text-indent: -10000px;
	background-color: transparent;
	background-image: url('/images/layout/get-inspired.jpg');
	background-position: 0 0;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 217px;
	height: 117px;
	outline: none;
}

div.home_sil div.gallery_text p a:hover {
	background-position: 0 -117px;
}


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: 75px;
	top: 80px;
	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;
	display: block;
	height: 73px;
	width: 343px;
	text-indent: -9999px;
	background: transparent url('/images/layout/welcome-to-our-world.png') top left no-repeat;
}

div.home_welcome h1 span {
	font-size: 2em;
	font-weight: normal;
	line-height: 1.5em;
	padding: 0;
	margin: 0;
}

div.home_welcome p {
	font-family: helvetica, arial, verdana, sans-serif;
	font-size: 0.8em;
	font-weight: normal;
	color: #404040;
	line-height: 1.3em;
	padding: 0;
	margin: 1.5em 0;
	width: 345px;
}

div.home_welcome p.we-invite {
	padding: 0;
	margin: 22px 0 0 2px;
	width: 339px;
	height: 29px;
	display: block;
	text-indent: -9999px;
	background: transparent url('/images/layout/we-invite-you.png') top left no-repeat;
}

div.home_welcome p.hair-spa-lifestyle {
	padding: 0;
	margin: 40px 0 0 0;
	width: 338px;
	height: 10px;
	display: block;
	text-indent: -9999px;
	background: transparent url('/images/layout/hair-spa-lifestyle.png') top left no-repeat;
}

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.85em;
	font-weight: normal;
	text-align: left;
	text-transform: uppercase;
	color: #929292;
	padding: 10px 0 4px 12px;
}

div.home_boxes div.home_box h3 a {
	color: #949393;
	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 a img {
	border: 0;
}

div.home_boxes div.home_box img {
	position: absolute;
	right: 4px;
	bottom: 4px;
	border: 0;
}

div.home_boxes div.home_box img.model-1 {
	right: 20px;
	bottom: 4px;
}

div.home_boxes div.home_box img.model-2 {
	right: 4px;
	bottom: 4px;
}

div.home_boxes div.home_box img.model-3 {
	right: 4px;
	bottom: 4px;
}





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;
	bottom: 0px;
	left: 3px;
}

div.product_logos {
	z-index: 1000;
	position: absolute;
	bottom: 84px;
	left: 22px;
	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;
}

div.edgetoedge_photo {
	position: absolute;
	bottom: 0;
	right: 0px;
	border: 0
	display: block;
	width: 320px;
	height: 460px;
	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;
	overflow: hidden;
	width: 336px;
	height: 460px;
	margin: 0;
	padding: 0;
	background: transparent url('/images/layout/polaroid_bg.png') top left no-repeat;
}

div.polaroid_photo img {
	display: none;
	position: absolute;
	top: 39px;
	left: 34px;
	margin: 0;
	border: 0;
}

div.polaroid_photo img.display {
	display: block;
}



#maincontent div.salon_summary {
	float: left;
}

#maincontent div.salon_summary div.summary_box {
	float: left;
	width: 160px;
}

#maincontent div.salon_summary div.summary_box h2 {
	font-weight: normal;
	width: 140px;
	border-bottom: 1px solid #404040;
	font-size: 0.75em;
	margin: 0 0 0.7em 0;
	padding: 0;
}

#maincontent div.salon_summary div.summary_box p {
	line-height: 1.5;
	margin: 0;
}

#maincontent div.salon_summary div.summary_box p span {
	padding: 0 0.5em;
}


#maincontent div.salon_summary div.summary_box table {
	color: #404040;
	font-size: 0.75em;
	border-collapse: collapse;
}

#maincontent div.salon_summary div.summary_box table tr {

}

#maincontent div.salon_summary div.summary_box table tr th {
	padding: 0.15em 0.75em 0.15em 0;
	text-align: left;
}

#maincontent div.salon_summary div.summary_box table tr td {
	text-align: left;
}




#salon_map {
	border: 1px solid #404040;
	display: block;
	float: left;
	width: 330px;
	height: 250px;
	margin: 0 0 10px 0;
}

.short {
	height: 230px !important;
}


div.gallery_home_image {
	position: absolute;
	bottom: 5px;
	left: 11px;
}

