/*----------------------------------------
Name: global.css
Developed by:
Date Created:
Last Updated:
Copyright:
----------------------------------------*/

/* Imports
----------------------------------------*/
@import url("reset.css");
@import url("externalLinks.css");
@import url("jquery.lightbox-0.5.css");


body  {
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #8E6227;
	font-family: futura, arial, sans-serif;
	font-size: 100%;
	background-color: #000;
	background-image: url(../images/background/curtain_ptrn.jpg);
	background-repeat: repeat-y;
	background-position: center;
}

body, p, td, th, li
{
	font-family: futura, arial, sans-serif;
	font-size:0.875em;
	line-height:1.5em;
	color:#8E6227;
}

#scallops
{
	width: 100%;
	text-align: center;
	padding: 0px;
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 0;
	margin-left: 0px;
	height: 28px;
	position: fixed;
	bottom: 0px;
	z-index: 100;
}

#mainContainer
{
	width: 100%;
	text-align: left;
	padding: 0px;
	background-image: url(../images/background/curtains.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 0;
	margin-left: 0px;
	height: 572px;
}
.thrColFix #container {
	width: 930px;
	margin: 0 auto;
	text-align: left; /* this overrides the text-align: center on the body element. */
} 
.thrColFix #sidebar1 {
	float: left; /* since this element is floated, a width must be given */
	width: 89px;
	text-align: right;
	background-image: url(../images/background/marqee_bck.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	height: 593px;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
}
.thrColFix #sidebar2 {
	float: right; /* since this element is floated, a width must be given */
	width: 89px; /* padding keeps the content of the div away from the edges */
	background-image: url(../images/background/sidebar2_bck.jpg);
	height: 593px;
	background-repeat: no-repeat;
	background-position: left top;
}
.thrColFix #mainColumn {
	margin: 0 89px; /* the right and left margins on this div element creates the two outer columns on the sides of the page. No matter how much content the sidebar divs contain, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the sidebar spaces when the content in each sidebar ends. */
	padding: 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}

.thrColFix #pattern {
	background-image: url(../images/background/content_pttrn.gif);
	background-repeat: repeat-y;
}

.thrColFix #top {
	background-image: url(../images/background/maincontent_top.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

.thrColFix #column1 {
	float: left; /* since this element is floated, a width must be given */
	width: 185px;
}
.thrColFix #column3 {
	float: right; /* since this element is floated, a width must be given */
	width: 240px;
}
.thrColFix #column2 {
	padding: 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	margin-top: 0;
	margin-right: 255px;
	margin-bottom: 0;
	margin-left: 205px;
}

#followUs  {
	padding: 0;
	margin: 0px;
}

p
{
	margin: 0 0 1em 0;
	font-family: Futura, Arial, sans-serif;
	font-size: .875em;
}

/*--- Link Styles ---*/
a:link, a:visited
{
	color:#8E6227;
	text-decoration: none;
}

a:hover, a:active
{
	color:#16A8A4;
	text-decoration:none;
}

h1
{
	color:#8e6227;
	margin:.875em 0 .5em 0;
	font-size:2.125em;
	font-family: futura, arial, sans-serif;
}

h2
{
	color:#8e6227;
	margin:.875em 0 .5em 0;
	font-size:1.75em;
	font-family: futura, arial, sans-serif;
}

h3
{
	color:#8e6227;
	margin:.875em 0 .5em 0;
	font-size:1.5em;
	font-family: futura, arial, sans-serif;
}

h4
{
	color:#8e6227;
	margin:.875em 0 .5em 0;
	font-size:1.25em;
	font-family: futura, arial, sans-serif;
}

h5
{
	color:#8e6227;
	margin:.875em 0 .5em 0;
	font-size:1.125em;
	font-family: Futura, Arial, sans-serif;
	font-style: normal;
}

h6
{
	color:#8e6227;
	margin:.875em 0 .5em 0;
	font-size:1em;
	font-family: Futura, Arial, sans-serif;
	font-style: normal;
}

hr
{
	color:#A2702C;
}

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

ol
{
	margin-left:0px;
	
}

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

/* Standard Definitions
----------------------------------------*/
.left 		{
	float:left;
	margin-right: 20px;
}
.right 		{
	float:right;
	margin-left: 20px;
}
.clearThis 	{
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
.clearLeft 	{clear:left;}
.clearRight	{clear:right;
}
.small		{font-size:.625em;}
.large		{font-size:1em;}
.soft		{color:#D3D3D3;}
.hide		{display:none;}
.invisible		{
	position: absolute;
	left: -1000px;
}
.center		{text-align:center;}
p.last		{margin-bottom:0px;}
.dashed		{
	height:0;
	font:0/0 serif;
	border-bottom:1px dashed #694522
}

.linkgreen  {
	color:#6ba783;
}

/* Banner
----------------------------------------*/
#banner
{
	z-index: 10;
	width:752px;
	height:67px;
	background-image: url(../images/background/banner_bck.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

/* Header
----------------------------------------*/
#header
{
	width:752px;
	height:363px;
	background-image: url(../images/background/header_bck.jpg);
	background-position: center top;
	background-repeat: no-repeat;
}

/* Marquee
----------------------------------------*/
#marquee
{
	width: 85px;
	height: 568px;
	margin: 0px;
	padding: 0px;
}
/* Service Menu
----------------------------------------*/
#services {
	height: 25px; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
	background-image: url(../images/background/service_bck.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 0px;
	padding-bottom: 0px;
	width: 752px;
}
.thrColFix #column2 {
	width: 285px;
	margin-left: 315px;
}
.thrColFix #column1 {
	padding: 0;
	margin: 0px;
	float: left;
	width: 285px;
}
.thrColFix #followUs {
	width: 602px;
	text-align: center;
	margin: 0;
	padding-top: 25px;
	padding-right: 0;
	padding-bottom: 25px;
	padding-left: 0;
}

/* Nav
----------------------------------------*/
#topNavigation {
	height: 73px; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
	background-image: url(../images/background/nav_bck.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 54px;
	width: 698px;
}

/* Main navigation
------------------------------------------------------------------*/
#serviceNav
{
	width: 686px;
	text-align: center;
	padding: 0px;
	margin: 0;
	height: 25px;
}
ul#serviceNav {
	width:478px;
	height:25px;
	position: relative;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 274px;
}
ul#serviceNav li {
	padding:0;
	margin:0;
	float:left;
	text-indent:-9999px;	
	list-style-type:none;
}
ul#serviceNav li a {
	height:25px;
	border:0;
	display:block;
	text-indent:-9999px;
	outline:none;
	text-decoration:none;
	background-color: transparent;
	background-image: url(../images/nav/service/service.png);
	background-repeat: no-repeat;
}
#nav
{
	width: 686px;
	text-align: center;
	padding: 0px;
	margin: 0;
	height: 73px;
}
ul#nav {
	width:698px;
	height:73px;
	position: relative;
	margin: 0px;
	padding: 0px;
	}
ul#nav li {
	padding:0;
	margin:0;
	float:left;
	text-indent:-9999px;	
	list-style-type:none;
	}
ul#nav li a {
	height:73px;
	border:0;
	display:block;
	text-indent:-9999px;
	outline:none;
	text-decoration:none;
	background-color: transparent;
	background-image: url(../images/nav/nav.png);
	background-repeat: no-repeat;
	}
li#serviceMenu a {
	width:204px;
	height:25px;
}	 
li#beautyOperators a {
	width:157px;
	height:73px;
	 }
li#about a {
	width:165px;
	height:73px;
	 }
li#loungeEvents a {
	width:148px;
	height:73px;
	 }
li#merchandise a {
	width:118px;
	height:73px;
	 }
li#links a {
	width:56px;
	height:73px;
	 }
li#serviceMenu a:link, li#serviceMenu a:visited {	
	background-position:0px -25px;
	}
li#serviceMenu a:hover, li#serviceMenu a:focus {	
	background-position:0px 0px;
	}
li#beautyOperators a:link, li#beautyOperators a:visited {	
	background-position:0px -73px;
	}	 	 	 	 
li#beautyOperators a:hover, li#beautyOperators a:focus {
	background-position:0px 0px;
	 }
li#about a:link, li#about a:visited {	
	background-position:-157px -73px;
	}
li#about a:hover, li#about a:focus {	
	background-position:-157px 0px;
	}
li#loungeEvents a:link, li#loungeEvents a:visited {	
	background-position: -322px -73px;
	}
li#loungeEvents a:hover, li#loungeEvents a:focus {	
	background-position: -322px 0px;
	}
li#merchandise a:link, li#merchandise a:visited {	
	background-position: -470px -73px;
	}
li#merchandise a:hover, li#merchandise a:focus {	
	background-position: -470px 0px;
	}
li#links a:link, li#links a:visited {	
	background-position: -588px -73px;
	}
li#links a:hover, li#links a:focus {	
	background-position: -588px 0px;
	}

/* Main navigation "active tabs"
------------------------------------------------------------------*/
body#service_menu ul#serviceNav li#serviceMenu a {
	background-position:0px -50px;
	}
body#beauty_operators ul#nav li#beautyOperators a {
	background-position:0px -146px;
	}
body#about_the_salon ul#nav li#about a {
	background-position:-157px -146px;
	}
body#lounge_events ul#nav li#loungeEvents a {
	background-position:-322px -146px;
	}
body#merchandise ul#nav li#merchandise a {
	background-position:-470px -146px;
	}
body#links ul#nav li#links a {
	background-position:-588px -146px;
	}

/* Bottom Navigation
------------------------------------------------------------------*/
.pipelist {
	overflow: hidden;
	width: 575px;
	font-size:0.875em;
	color: #8e6227;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 1em;
	margin-left: auto;
	padding-top: 30px;
	padding-bottom: 25px;
   }
.pipelist ul {
   list-style: none;
   margin: 0;
   padding: 0;
   }
.pipelist li {
	border-left: 1px solid #8e6227;
	float: left;
	line-height: 1.2em;
	margin: 0 1em 0 -1em;
	padding: 0 1em 0 1em;
	white-space: nowrap;
   }
.pipelist a {
	text-decoration: none;
	color: #A2702C;
   }
	
/* Main Content
----------------------------------------*/
#mainContent
{
	width:752px;
	background-image: url(../images/background/content_ptrn.jpg);
	background-repeat: repeat-y;
	background-position: center;
}

#content
{
	min-height:100px;
	width:602px;
	background-image: url(../images/background/content_top.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	position: relative;
	margin: 0px;
	padding-top: 1px;
	padding-right: 75px;
	padding-bottom: 1px;
	padding-left: 75px;
}

#content p 
{
	padding-left: 0px;
	font-family: futura, arial, sans-serif;
	color: #a2702c;
}

/* Footer
----------------------------------------*/
#footer
{
	width:682px;
	height:auto;
	background-image: url(../images/background/content_btm.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 30px;
	padding-left: 35px;
	text-align: center;
	padding-right: 35px;
}

#footer p 
{
	font-size:0.625em;
	color: #FFF;
	text-align: right;
}