body {
	font-family: verdana;
	font-size: 12px;
	width: 900px;
	margin: auto auto auto auto;
	background-color: #6B5A37;
}

a:hover {
	color: #393939;
	text-decoration: underline;
}

a img {
	border-style: none;
}

.header {
	width: 900px;
	height: 85px;
}

.logo {
	width: 900px;
}

#hoursold {
	clear: both;
	float: left;
	vertical-align: bottom;
	bottom: inherit;
	color: white;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 13px;
	width: 400px;
	text-align: left;
}

#menuold {
	clear: both;
	float: right;
	vertical-align: bottom;
	bottom: inherit;
	width: 500px;
	color: white;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 13px;
	text-align: left;
}

.hours {
	float: left;
	color: white;
	width: 450px;
	height: 15px;
	text-align: left;
	font-size:11px;
}

.menu {
	float: right;
	color: white;
	width: 450px;
	height: 15px;
	margin: 0px;
	padding: 0px;
	font-size:11px;
}

.menu a:hover {
	text-decoration: underline;
}

.menu ul {
	float: right;
	clear: none;
	height: 15px;
	margin: 0px;
	padding: 0px;
}

.menu li {
	float: left;
	margin-left: 20px;
	list-style-type: none;
}

.menu a {
	color: white;
	text-decoration: none;
}

#page {
	background-color: white;
	width: 900px;
	height: 550px;
	margin-top: 5px;
	margin-right: auto;
	margin-left: auto;
	clear: both;
	padding-top: 15px;
}

#pagecontent {
	width: 870px;
	margin-right: auto;
	margin-left: auto;
	clear: both;
	height: 550px;
}

#topsection{
	width: 870px;
	height: 376px;
	background-color: #C2BC8F;
}

#bottomsection{
	width: 870px;
	height: 150px;
	margin-top: 5px;
	background-color: #A6C7C7;
}

#bottomhdr {
	font-size: 18px;
	font-family: "Haettenschweiler";
}

#leftcolumn450 {
	background-color: #C2BC8F;
	float: left;
	width: 430px;
	height: 525px;
	padding-top: 10px;
	padding-left: 10px;
}

#rightcolumn450 {
	background-color: white;
	float: right;
	width: 430px;
	height: 525px;
}

#leftcolumn550 {
	background-color: #C2BC8F;
	float: left;
	width: 530px;
	height: 535px;
}

#rightcolumn350 {
	background-color: #A6C7C7;
	float: right;
	width: 320px;
	height: 520px;
	padding-top: 10px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
}

#leftcolumn {
	float: left;
	width: 550px;
	height: 366px;
	margin: 0px;
	padding: 5px;
}

#rightcolumn {
	background-color: transparent;
	float: right;
	width: 300px;
	height: 366px;
	margin-right: 5px;
	margin-left: 5px;
	margin-top: 5px;
}

#rightcolumn h1 {
	font-family: Arial,Helvetica,sans-serif;
	font-size: 0.8em;
}

#rightcolumn h2 {
	color: #333333;
	font-size: 3em;
	font-weight: bolder;
	line-height: 0.2em;
	margin-left: 10px;
	margin-right: 15px;
	text-align: left;
	font-style: italic;
	font-family: "Monotype Corsiva";
}

#rightcolumn h3 {
	color: #660000;
	font-family: "Times New Roman", Times, serif;
	font-size: 1.3em;
	margin-left: 5px;
	margin-right: 15px;
	text-align: left;
	font-style: italic;
}

#rightcolumn a {
	color: #232f01;
	font-family: "Times New Roman",Times,serif;
	text-decoration: none;
}


#footerold {
	clear: both;
	color: #ffffff;
	font-weight: bold;
	line-height: normal;
	margin-left: auto;
	margin-right: auto;
	padding-top: 10px;
	text-align: center;
	width: 800px;
}

#footer {
	color: white;
	height: auto;
	vertical-align: top;
	bottom: inherit;
	padding-top: 10px;
	clear: both;
	width: 900px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

#promotions {
	margin-top: 20px;
}

#welcome {
	padding: 5px;
}
.LftCol550 {
	float: left;
	width: 615px;
	height: 380px;
}
.rghtCol320 {
	float: right;
	width: 255px;
}
.text1 {
    FONT-FAMILY: Verdana;
    COLOR: #226981;
    FONT-SIZE: 16px;
	font-weight: bold;
	text-align: left;
	margin-left: 20px;
	margin-right: 20px;
}
.text2 {

    FONT-FAMILY: Verdana;
    COLOR: #6B5A37;
    FONT-SIZE: 12px;
	text-align: left;
	margin-left: 20px;
	margin-right: 20px;
}
.text3 {
    FONT-FAMILY: Verdana;
    COLOR: #6B5A37;
    FONT-SIZE: 16px;
	font-weight: bold;
	text-align: left;
	margin-left: 20px;
	margin-right: 20px;
}
.text4 {
    FONT-FAMILY: Verdana;
    COLOR: black;
    FONT-SIZE: 14px;
	font-weight: bold;
	text-align: center;
}
.text4a {
    FONT-FAMILY: Verdana;
    COLOR: #226981;
    FONT-SIZE: 14px;
	font-weight: bold;
	text-align: center;
}
.text5 {
    FONT-FAMILY: Verdana;
    COLOR: #6B5A37;
    FONT-SIZE: 13px;
	font-weight: normal;
	text-align: left;
	margin-left: 30px;
	margin-right: 20px;
}
.text7 {
    FONT-FAMILY: Verdana;
    COLOR: #6B5A37;
    FONT-SIZE: 15px;
	font-weight: bold;
	text-align: left;
	margin-left: 40px;
	margin-right: 20px;
}

#address {
	width:280px;
}

#addresstextold {
	color: #333333;
	font-family: "Lucida Sans Unicode";
	font-size: 8px;
	font-weight: bold;
	text-align: center;
}

#addresslineold {
	background-color: transparent;
	float: right;
	width: 330px;
	background-image: url(../images/linegr.psd);
	background-repeat: repeat;
}
.homeSliderbox {
	background-color: #C2BC8F;
	width: 392px;
	height: 130px;
	margin-top: 7px;
	margin-left: 25px;
	border: 3px solid black;
	border-color: #FFFFFF;
}

.sliderBoxLeft /* Photo */
{
	float:left;
	width:160px;
	color: #FFFFFF;
	padding: 1px;
	height: 128px;
}
	
.sliderBoxRight /* text */
{
	float:right;
	width: 228px;
	color: #FFFFFF;
	padding: 1px;
	height: 128px;
}

.slidertext2 {

    FONT-FAMILY: Verdana;
    COLOR: #6B5A37;
    FONT-SIZE: 12px;
	text-align: left;
	margin-left: 15px;
}
.slidertext3 {
    FONT-FAMILY: Verdana;
    COLOR: #6B5A37;
    FONT-SIZE: 16px;
	font-weight: bold;
	text-align: left;
	margin-left: 5px;
	margin-right: 5px;
}

.AboutUsSliderbox {
	width: 310px;
	height: 525px;
}

.AboutUsSliderImg {
	color: #FFFFFF;
	text-align: center;
	width: 330px;
}


.homeHairSvcs {
	font-family: verdana;
	font-size: 18px;
	color: #333333;
}


/*_____________________________________________ Start - Projects - jCarouselLiteDemo _____________________________________________*/

#jCarouselLiteDemo .carousel {
    padding: 0px 0 0 0;
    margin: 0px 0px 0px 0px;
    position: relative;     
}

    #jCarouselLiteDemo .digg {
        position: absolute;
        left: 610px;
        top: 110px;
    }
    #jCarouselLiteDemo .main {
        margin-left: 40px;
    }

    #jCarouselLiteDemo .demo em {
        color: #FF3300;
        font-weight: bold;
        font-size: 60%;        
        font-style: normal;
    }
    #jCarouselLiteDemo .carousel button { /*Don't remove this. we still use this for individual demos. only the front pages use images as of now*/
        float: left;
    }              
    #jCarouselLiteDemo .carousel a.prev {
        display: block;
        float: left;
        width: 30px;
        height: 130px;
        text-decoration: none;
        background: url("../image/imageNavLeft.gif") left 60px no-repeat;
    }
        #jCarouselLiteDemo .carousel a.next {
            background: url("../image/imageNavRight.gif") right 60px no-repeat;
        }
			#jCarouselLiteDemo .carousel a {
				color: #226981;
				text-decoration: underline;
				padding-top: 4px;
				padding-right: 20px;
				padding-bottom: 4px;
				padding-left: 4px;
				display: block;
				font-weight: bold;
			}
            #jCarouselLiteDemo .carousel a:hover {
				background-color: #CCCCCC;
            }                 
			#jCarouselLiteDemo .carousel a:active {
				background-color: #FFFFFF;
				text-decoration: none;
			}
            #jCarouselLiteDemo .carousel a.next:hover {
                background-image: url("../image/imageNavRightHover.gif");
            }
            #jCarouselLiteDemo .carousel a.prev:hover {
                background-image: url("../image/imageNavLeftHover.gif");
            }    
    #jCarouselLiteDemo .carousel .jCarouselLite {
	float: left;
	/* Needed for rendering without flicker */
        position: relative;
	visibility: hidden;
	left: -5000px;
    }
        #jCarouselLiteDemo .carousel ul {
            margin: 0;
			COLOR: #226981;
			text-decoration:none;
        }
        #jCarouselLiteDemo .carousel li {
			margin: 0;
			FONT-FAMILY: Verdana;
			COLOR: #226981;
			list-style-image: none;
			list-style-type: none;
        }
        #jCarouselLiteDemo .carousel li img{
            background-color: #A6C7C7;
            color: #ffffff;
        }
        #jCarouselLiteDemo .carousel li p text1 {
            background-color: #A6C7C7;
            width: 360px;
            margin: 0px;
            color: #ffffff;
        }
        
        #jCarouselLiteDemo .widget img {
            cursor: pointer;
        }
            #jCarouselLiteDemo .mid {
                margin-left: 80px;
                width: 280px;
                height: 133px;
            }
            #jCarouselLiteDemo .vertical {
                margin-left: 170px;
            }
                #jCarouselLiteDemo .vertical .jCarouselLite {   /* so that in IE 6, the carousel div doesnt expand to fill the space */
                    width: 170px;
                }
            #jCarouselLiteDemo .imageSlider li img, 
            #jCarouselLiteDemo .imageSlider li p, 
            #jCarouselLiteDemo .imageSliderExt li img , 
            #jCarouselLiteDemo .imageSliderExt li p {
                width: 280px;
                height: 133px;
            }
            
/*_____________________________________________ End - Projects - jCarouselLiteDemo _____________________________________________*/


/*_____________________________________________ Start - Utility classes _____________________________________________*/

/* Default classes for clearing float, also clearing the end without presentational markup*/
.clear { clear: both; }
    .cLeft { clear: left; }
    .cRight { clear: right; }
    .cEnd {
	/* clear fix without presentational markup. Mostly use .cEnd class for the float container. But when lotta containers
    in one selector, add it directly here like #propertyEntry div */
        display: block;
	/* Hides from IE-mac \*/
        height: 1%;
	display: block;
	width: 900px;
    /* End hide from IE-mac */
    }
        html>body .cEnd {
    }
    .cEnd:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }

/* Default classes for hiding and showing elements */    
.hide { display: none; }
    .block { display: block; }
    .inline { display: inline; }
 
 /* For loading divup that comes up when some ajax request is executed */   
.p-shadow {
      width: 90%;
      float:left;
      background: url(/image/shadowAlpha.png) no-repeat bottom right !important;
      background: url(/image/shadow.gif) no-repeat bottom right;
      margin: 10px 0 0 10px !important;
      margin: 10px 0 0 5px;
  }
    .p-shadow div {
          background: none !important;
          background: url(/image/shadow2.gif) no-repeat left top;
          padding: 0 !important;
          padding: 0 6px 6px 0;
    }
    .p-shadow p {
          color: #777;
          background-color: #fff;
          font: italic 1em georgia, serif;
          border: 1px solid #a9a9a9;
          padding: 4px;
          margin: -6px 6px 6px -6px !important;
          margin: 0;
    }
    
    #loadingDemo {
        display: none;
        position: absolute;
        width: 150px;
        left: 150px;
        top: 200px;
    }    
.disabled {
    color: green;
}    
