@charset "utf-8";
/* CSS Document */
* {
	margin:0;
	padding:0;
}
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background:url('../images/mainbg.gif') repeat-x;
	color:#2a2a2a;
	border-top-width: thick;
	border-top-style: solid;
	border-top-color: #A4C463;
}
p {
	font-size: 12px;
	line-height: 18px;
	color:#545454;
}
a {
	color:#336699;
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
}
a, img {
	border:none;
}
h1 {
	font-size:18px;
	font-weight:normal;
	line-height:22px;
	padding:0 0 12px 0;
	color:#474747;
	font-family: Georgia, "Times New Roman", Times, serif;
}
h2 {
	color: #5d9731;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:18px;
	font-weight:normal;
	padding-bottom:10px;
	padding-top:10px;
}
h3 {
	color:#222222;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:18px;
	font-weight:normal;
	padding-bottom:10px;
	padding-top:10px;
}

h4 {
	line-height:28px;
	color: #b02b2c;
}
.lineOne {
	color: #5d9731;
	font-family:Verdana, Geneva, sans-serif;
	font-size:24px;
	font-weight:normal;
	padding-bottom:10px;
	padding-top:10px;
}

.lineTwo {
	color: #5d9731;
	font-family:Verdana, Geneva, sans-serif;
	font-size:26px;
	font-weight:bold;
	padding: 10px 0 20px 0;
	margin: 0 50px 0 0;
	text-align: right;
}

.subheading {
	color:#222222;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:15px;
	font-weight:normal;
	padding-bottom:10px;
	padding-top:10px;
}

.offer {
	padding: 10px;
	margin: 0 0 10px 0;
	background-color: #f9f9f9;
	border: 1px dashed #82ad57;
}
.offerHeading  {
	font-size: 18px;
	line-height:140%;	
}

.offerHeadingThankYou  {
	font-size: 24px;
	line-height:140%;	
}

.offerHeadingSub  {
	font-size: 18px;
	line-height:140%;
}
.offer p {
	font-size: 14px;
	line-height:120%;	
}
.offerSmaller  {
	font-size: 12px;
	line-height:130%;
}

.float_left {
	float:left;
}
.float_right {
	float:right;
}
.clearer {
	clear:both;
}
.ptop40 {
	padding-top:40px;
}
.ptop21 {
	padding-top:21px;
}
.pleft24 {
	padding-left:24px;
}
.pleft18 {
	padding-left:18px;
}

/* LAYOUT
============================================================================ */

div#wrapper {
	width:879px;
	margin:0px auto;
	padding:0px;
}
/* -------- Header -------- */

div#wrapper div#header {
  background-image:url(../images/complexions_logo.gif);
  background-position:0 20px;
  background-repeat:no-repeat;
  float:left;
  height:130px;
  padding-bottom:10px;
  padding-left:16px;
  padding-right:0;
  text-align:right;
  width:856px;
}
#header div.contactno {
	float:right;
	margin-top:45px;
	width:372px;
}
#header div.contactno p {
	width:372px;
	float:left;
	font-size:15px;
}
#header div.contactno span.callno {
	color:#CC6600;
	float:left;
	font-size:24px;
	padding-bottom:3px;
	width:362px;
}
/* -------- Splash -------- */

div#wrapper div#splash {
	width:879px;
	height:346px;
	float:left;
	margin-top: 10px;
}
/* ------- Content Section --------- */

div#wrapper div#contentBox {
	width:859px;
	float:left;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 25px;
	margin-left: 0;
	padding-top: 20px;
	padding-right: 7px;
	padding-bottom: 0;
	padding-left: 13px;
}
/* ------- Left Content Section --------- */

#contentBox div#contentBoxLeft {
	width:550px;
	float:left;
}
#contentBoxLeft div.larger {
	width:530px;
	height:140px;
	float:left;
	background:url('../images2/complexions_heading_salon.gif') no-repeat;
}
#contentBoxLeft div.lefttopimg {
	width:473px;
	float:left;
	background:url('../images/left_corner.gif') no-repeat;
	padding-top: 25px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 28px;
}
#contentBoxLeft div.leftpoints {
	float:left;
	background:url('../images/right_corner.gif') right bottom no-repeat;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 28px;
	width: 500px;
}
.leftpoints ul {
	float:left;
	list-style-type:none;
	display:block;
	width: 475px;
}
.leftpoints ul li {
	float:left;
	background:url('../images/leaf_bullet.gif') no-repeat 0 0px;
	line-height:18px;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 26px;
	padding-left: 43px;
}
.leftpoints ul li span {
	font-size:14px;
	color:#C60;
}

div#products {
	width:280px;
	margin-top: 25px;
	margin-bottom: 25px;
	text-align: center;
}

div.products {
	padding: 20px;
	width: 100px;
	float:left;
}

/* ------- Right Content Section --------- */

#contentBox div#contentBoxRight {
	width:288px;
	float:right;
	margin-top: 10px;
}
#contentBoxRight div.form {
	width:276px;
	float:left;
	padding-right:21px;
	font-family:Arial, Helvetica, sans-serif;
}
.form div.top {
	width:276px;
	float:left;
	height:106px;
	background-image: url('../images/form_header_salon.gif');
	background-repeat: no-repeat;
}
.form div.middle {
	width:267.5px;
	float:left;
	background:url('../images/form_bg.gif') repeat-y;
	padding-top: 0;
	padding-right: 5px;
	padding-bottom: 0;
	padding-left: 5px;
	text-align:right;
}

.form div.middle h3{
	text-align: left;
	padding-left: 5px;
}
.form div.middle span.toptext {
	font-size:16px;
	font-weight:bold;
	color:#b02b2c;
	text-align:left;
}
/* --------- Form Elements ------- */

label {
	color: #000000;
	margin: 2px 8px 0 0;
	font-size: 11px;
	width:87px;
	float:left;
	text-align:right;
}
label.question {
	color: #000000;
	vertical-align: middle;
	font-size: 11px;
	width:87px;
	float:left;
	text-align:right;
}
textarea {
	font-size: 10px;
	height:55px;
	width: 164px;
	margin: 3px 0;
	vertical-align: text-top;
	border:1px solid #7F7F7F;
	padding: 3px;
	float:left;
}
input.required {
	font-size: 11px;
	width: 164px;
	margin: 3px 0;
	background-color: #FFFFFF;
	padding: 3px;
	border:1px solid #7F7F7F;
	float:left;
}
.aster {
	color: #498419;
}
.beige {
	color: #8c8c8c;
	font-size: 10px;
	line-height: 110%;
	padding: 2px 2px 4px 0;
}
.submitButton {
	padding: 6px 0 8px 0px;
}
.form .bottom {
	width:276px;
	float:left;
	background:url('../images/form_bottom.gif') no-repeat;
	height:4px;
	overflow:hidden;
}
/* -------- Right Flash ---------- */

div#wrapper div#flash {
	width:288px;
	float:right;
	margin-top: 25px;
	text-align:center;
	margin-bottom: 40px;
}

div#wrapper div#flash h4{
	margin-left:10px;
}

/*----------Certificate ------------*/

div#wrapper div#certificate {
	width:240px;
	float:right;
	background-image: url('../images/stamp.png');
	background-repeat: no-repeat;
	background-position: left bottom;
	height: 75px;
}

/* ---------- Testimonials ------------ */


div.testimonialMain {
	width:500px;
	margin-left: 66px;
	margin-top: 25px;
	margin-bottom: 25px;
}
div.testimonialMain span.testimonial_topbg {
	width:396px;
	float:left;
	background:url('../images/speech_bubble_top.gif') no-repeat;
	height:3px;
	overflow:hidden;
}
div.testimonialMain div.testimonial_text {
	width:396px;
	float:left;
	background:url('../images/speech_bubble_bg.gif') repeat-y;
}
div.testimonialMain div.testimonial_text p {
	width:347px;
	float:left;
	padding:14px 0px 20px 22px;
	color:#545454;
}
div.testimonialMain span.testimonial_botmbg {
	width:274px;
	float:left;
	color:#069;
	font-size:14px;
	padding:17px 0px 0px 122px;
	height:14px;
	background:url('../images/speechbubble_bottom.gif') no-repeat;
}
.testimonialBox p {
	width:690px;
	float:left;
	padding:0 0 13px 0;
}
/* ----------- Services ---------------- */

#contentBox div.servicesmain {
	width:450px;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 25px;
	margin-top: 25px;
	margin-bottom: 25px;
}
div.serviceslist {
	margin-top: 20px;
	margin-bottom: 20px;
}
div.serviceslist p {
	margin-left: 40px;	
}

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

#wrapper div#footer {
	width:879px;
	text-align:center;
	line-height:15px;
	font-size:10px;
	color:#5c5c5c;
	background-color: #E6E6E6;
	border: thin solid #CCC;
	margin: 10px;
	height: 90px;
}

#wrapper div#footer p{
	margin-top: 10px;
	margin-left: 25px;
	text-align: left;
}
/* ------------------- Landing page style ends ----------------------------- */

/* ------------------------ Thank you Page ----------------------- */
div#wrapper div#innersplash {
	width:879px;
	background:url('../images/inner_header.jpg') no-repeat;
	height:346px;
	float: left;
}

div#wrapper div#salon_thank_you_inner_splash {
	width:879px;
	background:url('../images/salon-thankyou1-splash.jpg') no-repeat;
	height:346px;
	float: left;
	margin-top: 10px;
}
div#innersplash div.innertext {
	width:520px;
	padding:30px 0px 0px 38px;
}

div#salon_thank_you_inner_splash div.innertext {
	width:500px;
	padding:30px 0px 0px 38px;
}
div#innersplash div.innertext p {
	font-size:14px;
	line-height:22px;
	width:500px;
}

div#salon_thank_you_inner_splash div.innertext p {
	font-size:14px;
	line-height:22px;
	width:500px;
}
#thankyou-link {
	padding:20px 0px 40px 0px;
}

/*
	List Expander 
*/

.listexpander{
	width:100%;
}

.listexpander img {
	float: left;
	margin: 5px	
} 

.listexpander p {
	margin-top: 5px;
	margin-left: 5px;	
}

.listexpander, .listexpander ul, .listexpander li{
	margin:0;
	padding:0;
	list-style:none;
}
.listexpander ul{
	display:none;
}
.listexpander li{
	line-height:200%;
	padding:5px;
	cursor:default;
	font-weight:bold;
	width:90%;
}

.listexpander li.collapsed, .listexpander li.expanded{cursor:pointer;} 

/* first level */

.listexpander li, .listexpander li.collapsed{
	background:#eee url(collapsed.gif) no-repeat 5px .4em;

} 
.listexpander li.expanded{background:#eee url(expanded.gif) no-repeat 5px .4em;}

/* second level */

.listexpander li ul, .listexpander li li{background:#f8f8f8;font-weight:normal;}
.listexpander li li.collapsed{background:#f8f8f8 url(collapsed.gif) no-repeat 5px .4em;} 
.listexpander li li.expanded{background:#f8f8f8 url(expanded.gif) no-repeat 5px .4em;}

/* third level */

.listexpander li li ul, .listexpander li li li{background:#fff;}
.listexpander li li li.collapsed{background:#fff url(collapsed.gif) no-repeat 5px .4em;} 
.listexpander li li li.expanded{background:#fff url(expanded.gif) no-repeat 5px .4em;}

/* fourth level */

.listexpander li li li li{text-indent:0;margin-left:30px;width:auto;}

/* etc. */

/* buttons */

p.listexpander{
	height:1.5em;
	margin:1em 0;
}
p.listexpander a{
	float:left;
	height:1.5em;
	line-height:1.5em;
	padding:0 10px;
	border:1px solid #eee;
	margin-right:5px;
	cursor:pointer;
}
p.listexpander a:hover{
	background:#f8f8f8;
}

/* float fix */
.listexpander li:after{
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.listexpander li{
	display: inline-block;
}
/* Hides from IE-mac \*/
* html .listexpander li{
	height: 1%;
}
.listexpander li{
	display: block;
}
/* End hide from IE-mac */
/* end float fix */

.gadget {
	padding: 30px 0 0 0;
}

#socialMedia {
	padding: 0 0 0 380px;
}

