@charset "UTF-8";
/* CSS Document */

body {
 font-size:62.5%;
 background:#FFF url(../img/bg/background-image-flowers.jpg) top center no-repeat;
 margin:0 auto;
 color:#000;
 }
  
#wrapper {
  width:800px;
  margin: 2em auto;
  position: relative;
   }  


/*   GENERAL 
---------------------------------------------*/


h1,p,ol li,ul li,td {
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  color:#000;
  }


h1 {
  font-size:1.8em;
  margin:0 0 .5em 12px;
  font-weight:lighter;
  line-height: 1.2em;
  }

h2 {
  font-size:1.3em;
  font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: .2em;
  font-weight:lighter;
  color:#fff;
  display: block;
  background-color:#E15AA3;
  padding:0em 0 0 1em;
  }

p {
 font-size:1.3em;
 margin:1em 1em 1em 12px;
 padding:0;
 }
 
p.fine {
  font-size:1.1em;
  }

.exampletext {
  color:#555;
  font-size:1.2em !important;
  }
  
img {
  border:none;}
  


/*  MAST HEAD
---------------------------------------------*/

#masthead {
  height:6.4em;}


#logo {
	width:300px;
	margin: 0 0 0 1em;
	padding: 1em 0 0em 1em;
	}

#logo ul {
    margin:0;
	padding:0;}


#logo ul li a,
#logo ul li span {
	
	display: block;
	width: 61px;
	height: 57px;
	background: url(../img/logo/tripletwist-logo.gif) no-repeat 0 0;
	}
#logo ul li img {
	list-style:none;
	display: block;
	width: 0;
	}
#logo ul li a:hover {
	list-style:none;
	display: block;
	height: 57px;
	background: url(../img/logo/tripletwist-logo.gif) no-repeat 0px -57px;
	}

#logo ul li {
  list-style:none;
  float:left;
  color:#222;
  font-family:"Myriad Pro", Arial, Helvetica, sans-serif;
  font-size:1.5em;
  }

#logo ul li.tag {
  padding:.3em 0 0 0;
  font-weight:bold;}




#logo ul li.beauty {
  padding:1.2em 0 0 0;
  color:#555;}



#masthead ul.mastphone {  /* Phone on Top right of page */
  padding:.5em 2em 0em 0;
  margin:0;
  list-style:none;
  float:right;
  }


.logo {
  color:#333;
  font-family:"Myriad Pro", Arial, Helvetica, san-serif;
  font-size:1.4em;
  float:left;
  }

.phone {
  color:#333;
  font-family:"Myriad Pro", Arial, Helvetica, san-serif;
  font-size:1.6em;
  text-align:right;
  }

.location {
  color:#333;
  font-family:"Myriad Pro", Arial, Helvetica, san-serif;
  font-size:1.3em;
  text-transform: uppercase;
  text-align:right;
  }

.location a {
    color: #bd4983;
}


.location a:visited {
   color: #bd4983;
}

.location a:hover {
  color: #db5498;

  }

  
  
.logotag {
  color:#999;
  font-family:"Myriad Pro", Arial, Helvetica, san-serif;
  font-size:1.4em;
  float:left;
  margin:.4em 0 0 .8em;
}

.logotag a {
 color:#999;
  text-decoration:none;}




/*  NAV MAIN 
---------------------------------------------*/

#navmain {
 width:100%;
/* background-color:#212121; */
 height:4em;}

#navmain ul {
  list-style:none;
  display:inline;
  
  }

#navmain ul li {
 font-family: "Helvetica Neue", Helvetica, Arial, san-serif;
 float:right;
 color:#000;
 font-weight: lighter;
 font-size:1.5em;
  margin:.7em .8em 0em;
  
 }





/*   LINKS (NAV)
---------------------------------------------*/


#navmain li a:link {
 padding:.5em 0;
 color:#000;
 text-decoration:none;
}


#navmain li a:visited {
padding:.5em 0;
 color:#000;
 text-decoration:none;}

#navmain li a:hover {
padding:.5em 0;
 color:#000;
 background-color: #ebebeb;
 }

#navmain li a:active {
padding:.5em 0;
 color:#333;
 text-decoration:none;}

#navmain li.current {
  border-bottom: #F06EAB 5px solid;}


/*   LINKS (CONTENT)  #005BAD
---------------------------------------------*/



#content a:link {
  font-weight: bold;
  color: #bd4983;
  }
  
#content a:visited {
  font-weight: bold;
  color: #bd4983;
  }

#content a:hover {
  font-weight: bold;
  color: #bd4983;
  background:#EEE;
  }
	
#content a:active {
  font-weight: bold;
  color: #bd4983;
  background:#EEE;
  }

#videobox {
  padding:2em 2em .5em 0;
  }

#videobox2 {
  padding:0em 2em .5em 0;
  }


#videobox ul {
  margin:0;
  padding:1em 0 1em 1em;
  list-style: none;}

#videobox ul li {
  text-indent: 2em;}

#videobox ul li a,
#videobox ul li span {
	
	display: block;
	width: 400px;
	height: 228px;
	background: url(../img/home/san-francisco-wedding-makeup-hair.jpg) no-repeat 0 0;
	list-style: none;
	}

#videobox ul li a:hover {
	list-style:none;
	display: block;
	background: url(../img/home/san-francisco-wedding-makeup-hair.jpg) no-repeat 0 -228px;
}
 
#bottomcontainer {
  margin:0 auto;
  }

 
#part1, #part2, #part3 {
  display:block;
  width:230px;
  float:left;
  margin-left:2.6em;
  }
 
/*   MODULES
---------------------------------------------*/

#modules {
  margin:0;
  padding:0;}


/*   CONTENT
---------------------------------------------*/


#gutter {
  padding:1em;
  margin:0;}

#content {
  clear:left;
  width:100%;
  line-height:2em;
  padding:0;
  margin:0;
  }

#contentwidth {
  width:100%;
  margin:0;
  padding:0;
  clear:left;
  float:left;
  background-color:#fff;
  background:url(../img/bg/transparent-bg.png);
  }
  
#contentwidth h1.first {
  padding-top:0;
  margin-top:0;}

#content h1.first {
  padding:.5em 0;
  margin-top:0;}
  
  
/*   LISTS
---------------------------------------------*/  
  

#contentleft ul,
#contentwide ul {
  margin:0;
  padding:.3em 0 0 1em;
  }

#contentleft ul li,
#contentwide ul li {
  font-size: 1.3em;
  margin-bottom:1em;
  }

#contentleft ul li.when,
#contentwide ul li.when {
  list-style: none;
  font-style: oblique;
  padding:0;
  }
#contentleft ul li.where,
#contentwide ul li.where {
  list-style: none;
  text-align:right;;
  display:block;
  margin:0 0 1em 0;}


#contentleft ul li.description,
#contentwide ul li.description {
  padding:.2em 1em 0 0em;
  line-height: 1.3em;}


#contentleft ul.circles,
#contentwide ul.circles {
  padding:0 0em 0 2em;
  list-style: circle;}
  
#contentleft ul.circles li,
#contentwide ul.circles li {
  padding:0em 0 .5em;
  margin:0em 0 0 .8em;
  }


#contentwide {
  padding:0em;
  width:100%;}

  

#contentright {
  padding:0;
  width:73%;
  float:right;}

#contentleft {
  padding:1em;
  width:435px;}


#contentleft-intake {
  padding:0 0 0 .5em;
  width:26%;}


#contentfull {
  padding:0em;
  width:100%;}

#content-intake {
  width:100%;
  background: #fff;}

#wrapper-intake {
  width: 100%;
  background:#fff;}
  


/*   SIDEBAR
---------------------------------------------*/


  
#sidebar {
  clear:both;
  width:327px;
  float:right;
  padding:0 0 0 0;
  margin:0}
  
#sidebar ul {
  list-style: circle;
  font-size:1.2em;
  padding:0;
  margin:0 1em 0 2em;
  }


#sidebar ul li {
  padding:.6em 0 .6em;
  line-height:1.4em;}

#sidebar p {
  font-size:1.2em;
  }

#sidebar p.first {
  margin:0;
  padding:0;}


#sidebar h3 {
  font-family: Helvetica, Arial, san-serif;
  font-size:1.3em;
  font-weight: bold;
  padding:0;
  margin:0;}

#sidebar h3.first {
  margin:0;
  padding:0;}


#sidebar p.first {
  margin: 1em 0 0 0;}


/*   FOOTER
---------------------------------------------*/

#footer {
  clear:both;
  padding:0;
  margin:0;}

#footer ul {
  list-style:none;
  font-size:1.2em;
  margin:0em 0 0 0em;
  padding:1em 0 0 1.9em;

  }
  
#footer ul li {
  padding: 0 2.5em 0 0;
  list-style:none;
  float:left;
  color:#444;
  display:block;}
  
#footer ul li a {
  color: #444;
  }

#footer ul li a:visited {
  color: #444;
  }

#footer ul li a:hover {
  color: #666;
  }

#footer ul li a:active {
  color: #666;
  }


#footernav {
  clear:both;
  margin:0em 0;
  padding:.7em 1em 0em;}

#footernav ul {
  list-style:none;
  font-size:1.2em;
  color:#555;
  margin:0;
  padding:0 0 0 1em;
  }
  
#footernav ul li {
  padding: 0 2.5em 0 0;
  list-style:none;
  float:left;
  display:block;}
  
#footernav ul li a {
  color: #444;
  }

#footernav ul li a:visited {
  color: #444;
  }

#footernav ul li a:hover {
  color: #666;
  background:#ccc;
  }

#footernav ul li a:active {
  color: #666;
  }


#footerall {}



/* STYLES
---------------------------------------------*/ 

/* self-clear floats */
.group:after {
	content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
    }
	
.alignright_img {
  clear:both;
  float:right;
  padding:0 0 0 .5em;
  }
  
.alignright_imgpad {
  clear:both;
  float:right;
  padding:0 0 0 .5em;
  margin:0 0 0 1em;
  }

.alignleft_img_nb {
  float:left;
  padding:.7em 1em 0 0;
  margin:0;
  }

td {
  padding:0;}
 
.formtext {
  float:right;
  margin-right:.5em;
  line-height: 1.2em;
  padding:.4em 0;}
  
.formfield {
  font-family: Helvetica, Arial;
  font-size:1.2em;
  padding:.4em;}
 
.submit {
  margin:.5em 0;
  padding:.8em;
  } 
  
.videoborder {
 border-bottom:0;
 margin-bottom:0;}
 
.aster {
  font-size:1.5em;
  color:red;}

input:focus, textarea:focus{
background-color: lightyellow;
}

.alternateinfo {
  display:none;}

.radiotext {
  font-size:1.2em;
  padding-right:2em;}

.alert {
  background:#ff0f80;
  padding:1em;
  color:#fff;}



/* DL
---------------------------------------------*/ 
  
dl {
  margin: .5em 0;
  padding: 1em;
  clear:left;
  }

dl:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  }

dl dt {
  font-family: "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
  font-size:1.4em;
  margin:0;
  color:#000;

  }

dl dt a {
  font-weight:normal;}

dl dt img {
  float: left;
  margin: 0 .9em 0 0;
  padding:0;
  }

dl dd {
  margin-left:102px;
  }

dl ul li {
  list-style:none;
  list-style-type:square;
  font-weight:normal;
  font-size:13px;
  }



.secondaryh1 {
  padding:1em 0 0 6.1em;}


#videoplayer {
  text-align: center;
  padding:2em 0;
  }

/* STYLES
---------------------------------------------*/ 

 #dhtmltooltip{
position: absolute;
left: -300px;
width: 350px;
border: 5px solid #B7A0BD;
padding: 1.2em;
visibility: hidden;
z-index: 100;
background:white url(../img/images/tooltip-background.jpg) repeat-x top left;
/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
}

#dhtmlpointer{
position:absolute;
left: -300px;
z-index: 101;
visibility: hidden;
}