/* Imports
----------------------------------------*/
@import url("css/reset.css");


/* Elements
----------------------------------------*/
body { background:#000000 url(../images/bg.jpg) top center no-repeat; }

body, p, td, th, li { font-family: Arial, Helvetica, sans-serif; font-size:.875em; line-height:1.5em; color:#fff; }

#mainContainer { width:988px; margin: 0px auto; }

p { margin: 0px 0px 1em 0px; }

a:link, a:visited { color:#fff; text-decoration:none; outline:none; }
a:hover, a:active { color:#e41c23; text-decoration:none; outline:none; }

h1 { color:#E41C23; margin:.825em 0 .5em 0; font-size:2.125em; }
h2 { color:#fff; margin:0; font-size:1.2em; line-height:1.7em; }
h3 { color:#E41C23; margin:.825em 0 .5em 0; font-size:1.5em; }
h4 { color:#E41C23; margin:.825em 0 .5em 0; font-size:1.25em; }
h5 { color:#E41C23; margin:.825em 0 .5em 0; font-size:1.125em; }

ul { margin-left:25px; list-style-type:none;}

ol { margin-left:25px; }

a img{border:none !important;}

blockquote	{margin: 0 0 18px 18px; color:#666666; font-style: italic;}
strong		{font-weight:bold;}
em		{font-style:italic;}

/* Standard Definitions
----------------------------------------*/
.left 		{float:left;}
.right 		{float:right;}
.clearThis 	{clear:both;}
.small		{font-size:.625em;}
.large		{font-size:1em;}
.soft		{color:#D3D3D3;}
.hide		{display:none;}
p.last		{margin-bottom:0px;}

/* Header
----------------------------------------*/
#header { width:988px; height:137px; position:relative; }

#logo { position:absolute; top:46px; left:27px; width:265px; height:70px; }

	/* Nav
	----------------------------------------*/
ul#nav { display:block; float:right;  margin-top:95px; margin-right:28px; }
	
ul#nav li { display:inline; list-style-type:none; margin-left:18px; text-transform:uppercase; font-size:0.8em; font-weight:bold;}

/* Image Replacement 
----------------------------------------*/
ul#nav li a {/*Set to height of image*/ height:20px; display:inline; text-indent:-9999px; outline:none; text-decoration:none; color:#fff;}
ul#nav li.current a { color:#e41c23 !important;}
ul#nav li a:hover {text-decoration:underline;}


/* CSS Rollover (Sprites) - Advanced Users!
----------------------------------------*/

/*Each link must have a unique ID - Include all of your links here - Remove if not using!*/
li#navHome a:hover, li#navWork a:hover, li#navServices a:hover, li#navContact a:hover {background-position:0 -20px; /*Set to height of image !must be negative!*/}
		
/* Main Content
----------------------------------------*/
#mainContent { width:988px; background:none; display:inline-block; }
#insideContent { width:935px; background:none; display:inline-block; padding-left:30px; }
#innercontent {width:955px; margin:10px auto 20px auto; display: inline-block; background:url(../images/innercontent_bg.png) top right no-repeat; }


#slider {display:block; width:935px; height:414px; margin:4px auto;}

#introtext {width:935px; margin:10px auto 20px auto; font-size:1.55em;}
#introtext h2 {font-size:0.80em !important; line-height:1.9em;}

#homehooks {width:935px; margin:10px auto 20px auto; padding-left:28px; font-size:12px; display:inline-block;}
#hook1, #hook2, #hook3 {float:left; width:204px; margin:0px 39px 0px 0px}
#hook4 {float:left; margin:0px; width:204px;}


/* Inside pages
----------------------------------------*/

#innercontent {width:955px; margin:10px auto 20px auto; display: inline-block; }
#innercontent p { margin:0 0 1em 0;}

.aboutphoto { margin:0px 10px 10px 0px; float:left;}
.productsmain { margin:0px 10px 10px 0px; float:left;}
.aboutcontent {float:left; display:block; width:610px; margin:0; padding:10px 0px 0px 0px;}
.producttitle { font-size:1.1em; margin:12px 0px 0px 0px !important;}

.productblock {float:left; margin-right:15px; width:300px; padding-top:10px;}
.productblocklast {float:left; margin-right:0px; width:300px; padding-top:10px;}

a.productlink { color:#E41C23; font-size:0.9em; text-decoration:none;}
a:hover.productlink { text-decoration:underline; }

#gallerycontainer { width:654px; float:right; margin-right:25px; }

#galleryselection { float:left; width:230px; margin-top:20px; border-bottom:solid 1px #ee2130; border-top:solid 1px #ee2130;  }
span.select { border-bottom:solid 1px #ee2130; border-top:solid 1px #ee2130; display:block; padding:3px 0px; font-size:0.87em; color:#fff; }

ul#gallerylist li a { margin-left:-55px; font-size:1.2em; line-height:1.6em; background:url(../images/listicon.gif) 0px 6px no-repeat; padding-left:15px; color:#fff}
ul#gallerylist li.current a{ color:#E41C23; }

#map_canvas { color:#000; border:solid 3px #333; font-size:0.85em; line-height:1.2em; float:left; margin-right:17px; margin-top:12px;}
#map_canvas span { display:none;}

#salons { float:right; width:475px; margin-top:10px}
#salons p.state { display:block; text-transform:uppercase; color:#ccc; font-weight:bold; font-size:1.1em; margin-bottom:5px;}
#salons p.state2 { display:block; text-transform:uppercase; color:#ccc; font-weight:bold; font-size:1.1em; margin:15px 0px 5px 0px;}
.locations { float:left; width:220px; margin:5px 10px 15px 0px; font-size:0.9em;}
.locations span.locationtitle { font-size:1.1em !important; font-weight:bold;}
.locations a { color:#ee2130; text-decoration:none;}
.locations a:hover { text-decoration:underline;}

#contactdetails { width:250px; float:left;}
#contactdetails p { line-height:2.0em; color:#fff;}
#contactdetails p a { color:#ee2130; text-decoration:none; }
#contactdetails p a:hover { text-decoration:underline; }

#contactform {float:left; border-left:solid 1px #fff; padding-left:20px;}
#contactform h2 {margin:3px 0px 0px 0px !important; line-height:1em;}
#contactform label { font-size:0.8em;}
#contactform input, #contactform textarea { font-size:0.8em; padding:2px; font-family:Arial,Helvetica,sans-serif;}

.testimonials { float:left; width:450px; margin-right:25px; margin-bottom:20px; }
.testimonials h3 { color:#E41C23; font-size:1.2em; line-height:1.7em; margin:0px 0px 15px 0px; }


/* Footer
----------------------------------------*/

#footer { width:988px; height:70px; position:relative;}
#footer ul#footerlinks {display:block; position:absolute; top:10px; left:-10px;width:500px;}
#footer ul#footerlinks li { display:inline; list-style-type:none; color:#665e5e; font-size:0.8em; margin-right:10px;}
#footer ul#footerlinks li a {color:#665e5e; text-decoration:none;}
#footer ul#footerlinks li a:hover {color:#665e5e; text-decoration:underline;}
#footer p { font-size:.625em; }

#copyright {float:right; font-size:0.7em; margin-right:10px; color:#665e5e;}


/* Easy slider
----------------------------------------*/

#slider ul, #slider li, #slider2 ul, #slider2 li{ margin:0; padding:0; list-style:none; }
#slider2{margin-top:1em;}
#slider li, #slider2 li{ width:935px;  height:414px; overflow:hidden; }	
#prevBtn, #nextBtn, #slider1next, #slider1prev{  display:none;width:30px;height:77px;position:absolute;left:-30px;top:71px;z-index:1000;}	
#nextBtn, #slider1next{ left:696px;}
#prevBtn a, #nextBtn a,#slider1next a, #slider1prev a{  display:none; position:relative; width:30px; height:77px; background:url(../images/btn_prev.gif) no-repeat 0 0;	}
#nextBtn a, #slider1next a{ background:url(../images/btn_next.gif) no-repeat 0 0;}	
		
/* numeric controls */	

ol#controls{ margin:1em 0; padding:0; height:28px;	}
ol#controls li{ margin:0 10px 0 0; padding:0; float:left; list-style:none; height:28px; line-height:28px;}
ol#controls li a{ float:left; height:28px; line-height:28px; border:1px solid #ccc; background:#DAF3F8; color:#555; padding:0 10px; text-decoration:none; }
ol#controls li.current a{ background:#5DC9E1; color:#fff;}
ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
	
	
/* Gallery slideshow
----------------------------------------*/

#slideshow {list-style:none; color:#fff}
#slideshow span {display:none}
#wrapper {width:654px; margin:20px auto; display:none}
#wrapper * {margin:0; padding:0}
#fullsize {position:relative; width:654px; height:433px; }
#information {position:absolute; bottom:0; width:654px; height:0; background:#000; color:#fff; overflow:hidden; z-index:200; opacity:.7; filter:alpha(opacity=70); display:none; }
#information h3 {padding:4px 8px 3px; font-size:14px}
#information p {padding:0 8px 8px;}
#image {width:654px}
#image img {position:absolute; z-index:25; width:auto}
.imgnav {position:absolute; width:25%; height:400px; cursor:pointer; z-index:150}
#imgprev {left:0; background:url(../images/left.gif) left center no-repeat}
#imgnext {right:0; background:url(../images/right.gif) right center no-repeat}
#imglink {position:absolute; height:433px; width:100%; z-index:100; opacity:.4; filter:alpha(opacity=40)}
.linkhover {background:url(/images/link.gif) center center no-repeat}
#thumbnails {margin-top:15px}
#slideleft {float:left; width:20px; height:81px; background:url(../images/scroll-left.gif) center center no-repeat; background-color:#222}
#slideleft:hover {background-color:#333}
#slideright {float:right; width:20px; height:81px; background:#222 url(../images/scroll-right.gif) center center no-repeat}
#slideright:hover {background-color:#333}
#slidearea {float:left; position:relative; width:600px; margin-left:5px; height:81px; overflow:hidden}
#shifter {position:absolute; left:0; height:81px}
#shifter img {cursor:pointer; border:1px solid #666; padding:2px}


/* FAQ slider
----------------------------------------*/

#insideContent .qa {padding-bottom:10px; margin:10px 0px 10px 0px;}
#insideContent .question {margin:0px 0px 5px 20px; padding:0px 20px 3px 20px;font-weight:bold; font-size:0.9em; cursor:pointer; border-bottom:1px solid #a9a9a9; background:url(../images/faqdown.gif) 7px 7px no-repeat;}
#insideContent .question_active {background:url(../images/faqup.gif) 7px 7px no-repeat !important;}
#insideContent .answer {padding:0 20px 0 40px;display:none;}