/*==================
   Nadia Salon Inc
   Design By: www.nlevin.com
   CSS Document   
   STYLE.CSS   
==================*/

@import url(reset.css);
@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:extralight,light,regular,bold);

/* HTML5 tags */
header, section, footer,
aside, nav, article, figure {
	display: block;
}

/***** Global *****/
/* Body */
body {
	background: #F5F4EF url('../images/bg.jpg');
	color: #000305;
	font-size: 87.5%; /* Base font size: 14px */
	font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	line-height: 1.429em;
	margin: 0;
	padding: 0;
	text-align: left;
}	
#topbg { background: #F5F4EF url('../images/topbg.gif') repeat-x top; height: 100px;}
.body {clear: both; margin: 0 auto; width: 940px;}
.content { padding-top: 20px;}

/* Nav */
nav { font-family: 'Yanone Kaffeesatz', arial, serif; font-size: 1.571em;}
nav ul {list-style: none; float: left; margin-left: 205px;}
nav li {float: left; display: inline; margin: 40px 40px 0 0; text-transform: uppercase; font-weight: 200; letter-spacing: 0.5px;}
nav li.last { margin-right: 0;}
nav li.active { border-bottom: 3px solid #e10005; font-weight: 400; letter-spacing: 1px; padding-bottom: 3px;}	
nav li.active a {color: #e10005;}
nav li a {color: #000;}
nav li a:hover { color: #e10005; -webkit-transition: color 0.2s linear; border: none; }

/* Headings */
h1 {text-indent: -9999px; width: 198px; height:148px; float: left; background: url('../images/nadialogo.png') no-repeat; }

h2 {font-size: 2em}	/* 24px */
h3 {font-size: 1.8em}	/* 22px */
h4 {font-size: 1.571em}	/* 20px */
h5 {font-size: 1.429em}	/* 18px */
h6 {font-size: 1.286em}		/* 16px */

h2, h3, h4, h5, h6 {
	font-weight: 400;
	line-height: 1.1;
	margin-bottom: .8em;
	text-transform: uppercase;
	font-family: 'Yanone Kaffeesatz', arial, serif;
}

h3 { position: relative; color: #25250d;}
h3 a { position: absolute; top: 0; z-index: 2;
	color: #25250d;
	-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));	
}
h3 a:hover { border: 0;}
h3:after { text-shadow: 0px 1px 0px #fff; color: #56562c; }

/*Safari Gradients*/
h3.ans:after { content: "About Nadia Salon"; }
h3.fsm:after { content: "Featured Staff Member"; }
h3.pas:after { content: "Products and Sponsors"; }
h3.tws:after { content: "This Week's Specials"; }
h3.wocs:after { content: "What Our Customer's Say"; }

/* Anchors */
a {outline: 0; text-decoration: none; color: #770c0e;}
a img {border: 0px; text-decoration: none;}
a:hover { color: #e10005; -webkit-transition: color 0.2s linear; border-bottom: 1px solid #e10005; }
a:active { position: relative; top: 1px; }
	
/* Paragraphs */
p {margin-bottom: 1.143em; color: #47442d;}
* p:last-child {margin-bottom: 0;}

/* Layout 940 Grid (18 col) */
.col18 { width: 940px; }
.col12 { width: 620px; margin-right: 20px; float: left; }
.col9 { width: 460px; margin-right: 20px; float: left; }
.col6 { width:300px; margin-right:20px; float: left; }
.col4-5 { width: 220px; margin-right: 20px; float: left; }
.col3 { width:140px; margin-right:20px; float: left; }
.last { float: right; margin-right: 0px; }
.clear { clear: both; }
.right { float: right;}
.left {float: left;}
.img { background: #fff; padding: 5px; border: 1px solid #d9d9a8; margin-right: 10px; -webkit-box-shadow: 0 0 2px #d9d9a8;}
div.hr { height: 60px; background: url('../images/hr.png') no-repeat center; clear:both; width: 940px; margin: 10px auto;}
div.hr hr { display: none; }

/* Intro */
#quote { 
	position: absolute; 
	white-space: nowrap;
	top: 115px; 
	margin-left: 250px;
	color: #8f8a5b; 
	font-size: 1.571em; 
	font-family: 'Yanone Kaffeesatz', arial, serif; 
	font-weight: 200;
	text-shadow: 0 1px 0 #fff;
}
#quote span.author { font-size: .7em;}

#intro {  
	margin: 66px auto 30px auto;
	width: 940px;
	height: 237px;
}
h2.bigquote {
	position: absolute;
	top: 200px;
	margin-left: 25px;
	padding: 0 5px;
	background: #fff;
	z-index: 10;
	font-size: 3em;
}
p.bigquote {
	position: absolute;
	top: 270px;
	margin-left: 25px;
	padding: 2px 5px;
	color: #000;
	background: #fff;
	z-index: 10;
	font-size: 1em;	
}
p.last{ margin-top: 20px; }
p.intro { font-size: 1.2em; line-height: 1.5em; }

#intro {
	box-shadow: 0px 1px 5px #8f8a5b;
	-moz-box-shadow: 0px 1px 5px #8f8a5b;
	-webkit-box-shadow: 0px 1px 5px #8f8a5b;
	border: 5px solid #fff;
}
#slider_controls ul#slider_nav { position: absolute; display: inline; top: 375px; margin-left: 845px; z-index: 99;}
#slider_controls ul#slider_nav li {float: left; margin-right: 10px; }
#slider_controls ul#slider_nav li a { background: #f3f3e0; opacity: .3; text-shadow: 0 1px 0 #000; padding: 2px 10px; border-radius: 10px;}
#slider_controls ul#slider_nav li a.activeSlide { background: #fff; opacity: 1;}

/* Services */
ul#hours {
	background: #fff;
	padding: 20px;
	border: 1px #d9d9a8 solid;
	-webkit-box-shadow: 0 0 2px #d9d9a8;
	line-height: 1.5em;
}

span.day {
	display: block;
	width: 100px;
	float: left;
	color: #8f9449;
}

ul#hours li {
	color: #47442d;
}

/* Services */
ul.service-list {
	width: 550px;
	margin-bottom: 20px;
	background: #fff;
	padding: 20px;
	border: 1px #d9d9a8 solid;
	-webkit-box-shadow: 0 0 2px #d9d9a8;
	line-height: 1.5em;
}

ul.service-list li { color: #47442d; }
ul.service-list li:hover { background: #F7F7F7; }
.price { float: right; }
ul#nadiastaff li { margin: 0; padding: 0; float: left; }

.staff {
	-moz-transform:scale(.8);
	-webkit-transform:scale(.8);
	-moz-transition: -moz-transform 0.1s ease-in;
	-webkit-transition: -webkit-transform 0.1s ease-in;
	opacity: .8;
}

.staff:hover, ul#nadiastaff li.selected img {
	cursor: pointer;
	-moz-transform:scale(.9);
	-webkit-transform:scale(.9);
	opacity: 1;
}

.staff:hover { -webkit-box-shadow: 0px 0px 6px rgba(225,0,5,.5); border: 1px #e74548 solid; }
ul#nadiastaff li.selected img { -webkit-box-shadow: 0px 0px 6px rgba(225,0,5,1); border: 1px #e10005 solid; }

ul#nadiastaff .staffInfo { 
	background: rgba(0,0,0,.5);
	padding: 10px;
	z-index: 1;
	position: absolute;
	width: 80px;
	margin-top: -45px;
	margin-left: 5px;
}

ul#nadiastaff .staffInfo h4, ul#nadiastaff .staffInfo h5 {
	font-family: Helvetica;
	text-transform: capitalize;
	font-size: 1em;
	color: #fff;
	margin: 0;
	text-shadow: 0 1px #000;
}

.staff0, .staff1, .staff2, .staff3, .staff4 {
	float: right;
	display: none;
	font-weight: bold;
}

/*contact*/
.error_message { display: block; height: 22px; line-height: 22px; background: #FBE3E4 url('../images/error.gif') no-repeat 10px center; padding: 3px 10px 3px 35px; } 
#success_page h1 { background: url('../assets/success.gif') left no-repeat; padding-left:22px; }
iframe {
	border: 1px solid #ccc;
	background: #fff;
	padding: 10px;
	margin-top: 49px;
}
label{
	position:relative;
	line-height:2.25em;
	cursor:pointer;
	font-size: 1.25em;
	font-weight: normal;
	color: #444;
	margin-right: 5px;
	float:left;
	width:150px;
	text-shadow: 0 1px #fff;
}
label.disabled{cursor:default;}
input[type="text"], textarea, select { 
	padding: .5em; font-size: 1.25em;
	border:1px solid #AAA;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	margin-bottom: 15px;
	margin-right: 15px;
	float: none;
	width: 320px;
}
select { height: 40px; width: 337px; }
input[type="text"]:hover, textarea:hover, select:hover {
	border:1px solid #B3DD4E;
}
input[type="text"]:focus, textarea:focus, select:hover {
	border:1px solid #73BC32;
	-moz-box-shadow:0 0 5px #73BC32;
	-webkit-box-shadow:0 0 5px #73BC32;
	box-shadow:0 0 5px #blue;
}
input[disabled="disabled"], input[disabled="disabled"]:hover {
	background: #CCC;
	border: 1px solid #CCC;
}
.required {
	font-family: 'Yanone Kaffeesatz', arial, serif;
	color: red;
}
.submit { margin-left: 180px;}

.nicebutton{
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	background: #5EAC1A;
	background: -moz-linear-gradient(center top , #A4D03D, #5EAC1A);
	background: -webkit-gradient(linear, left top, left bottom, from(#A4D03D), to(#5EAC1A));
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#A4D03D', endColorstr='#5EAC1A');
	border: 1px solid #6B8F23;
	color: #FFFFFF;
	cursor: pointer;
	text-shadow: 1px 1px #5B7F13;
	padding: 8px 10px;
	font-weight: bold;
	font-size: 1.25em;
	text-transform: uppercase;
}
.nicebutton:hover{
	color: #FFFFFF;
	background: #73BC32;
	background: -moz-linear-gradient(center top , #B3DD4E, #73BC32);
	background: -webkit-gradient(linear, left top, left bottom, from(#B3DD4E), to(#73BC32));
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#B3DD4E', endColorstr='#73BC32');
}
.nicebutton:active{
	color: #1B3802;
	background: #346E0B;
	background: -moz-linear-gradient(center top , #346E0B, #6D9A1A);
	background: -webkit-gradient(linear, left top, left bottom, from(#346E0B), to(#6D9A1A));
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#346E0B', endColorstr='#6D9A1A');
}

/*footer*/
footer {
	font-size: .85em;
	color: #888254;
	height: 100px;
}

footer .col {
	width: 180px;
	float: left;
}

footer .last {
	width: 400px;
	text-align: right;
}

address {
	background: url('../images/address.png') no-repeat top left;
	padding-left: 16px;
	font-style: normal;
}
.phone {
	background: url('../images/phone.png') no-repeat top left;
	padding-left: 16px;
}
.email {
	background: url('../images/email.png') no-repeat top left;
	padding-left: 16px;
}

a.facebook {
	position: relative;
	display: block;
	text-indent: -9999px;
	width: 137px;
	height: 28px;
	background: url('../images/facetwitter.png') no-repeat 0px -28px;
	float: left;
	border: none;
	margin-left: 100px;
}
a.facebook:hover {
	background-position: 0px 0px;
	border: none;
}

a.twitter { 
	display: block;
	text-indent: -9999px;
	width: 130px;
	height: 28px;
	margin-left: 260px;
	background: url('../images/facetwitter.png') no-repeat -160px -28px;
	border: none;
}
a.twitter:hover {
	background-position: -160px 0px;
	border: none;
}

/*"Default Avatar By:
Fancy Avatars, © 2009 Brandon Mathis, 
http://brandonmathis.com/projects/fancy-avatars/" */