@charset "UTF-8";
body {
font-size:62.5%;
background:#FFF url(../img/site/background-image-flowers-fade1.jpg) top center no-repeat;
color:#000;
margin:0 auto;
}

#wrap {
width:772px;
margin:2em auto;
}

#center {
margin:0 auto;
text-align:center;
}

p,ol li,ul li,td,form textarea, dl dt  {
font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
color:#555;
}

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

#alert {
clear:both;
float:left;
width:100%;
background-color:#FFFFE0;
padding:10px 0;
margin:.3em auto 1em !important;
text-align:center;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border:1px solid #D4D5BA;
}

#alert p {
font-size:1.3em;
font-weight:bold;
}

ul.bullets {
line-height:1em;
text-indent:2em;
}

ul.bullets li {
list-style:disc;
list-style-position:inside;
padding:0 !important;
margin:0;
}

.notice {
text-transform:uppercase;
font-size:.8em;
letter-spacing:.1em;
padding-left:1em;
font-weight:700;}

.section-break {
margin-top:1em;
}

#alert p {
margin:0;
padding:0;}


img + h3 {
padding-bottom:0;
margin-bottom:0;
}

h1:first-child {
padding:0 0 1em;
margin:0;}

strong {
color:#000;}

a + h3 {
padding-bottom:0;
margin-bottom:0;}

img + p {
padding-top:1em;
margin-top:1em;}

#pricingtable {
font-size:1.3em;
border:1px solid #e1e1e1;
margin:1em 0;
}


#pricingtable td {
padding:.8em .6em;}

.prices {
text-align:right;
}

.aligncenter {
text-align:center;
font-size:.8em;}

.intro {
font-size:1.6em;
line-height:1.5em;}

.header {
background-color:#EF8BC0;
color:#fff;
font-weight:700;}

.service-cat {
padding-left:.5em;}

h1,h2,h3, .company a, .city, .phone, .tagline {
font-family: athelas,serif;
}

h1,h2 {
color:#000;
font-style:italic;
font-weight:lighter;
}

h3 {
font-size:1.7em;
color:#000;
font-weight:lighter;
}



h1 {
padding:2em 0 .5em;
font-size:2.6em;
}

h2 {
font-size:2.4em;
margin:0;
padding:0;}

h2:first-child {
margin-top:0;
padding-top:0;}

h1 + p {
padding-top:0;
margin-top:0;}


h1.center {
width:350px;
float:right;
text-align:center;
font-weight:lighter;
padding:.8em .2em .4em;
color:#666;
font-size:2.9em;}


p, #content li {
font-size:1.4em;
line-height:1.4em;
margin:0 0 1em;
padding:0;
}

a:link + h1 {
margin-top:0;
padding-top:0;}

p:last-child {
margin-bottom:1em;
padding-bottom:1em;}

p + h3 {
margin-bottom:0;
padding-bottom:0;}

h3 + p {
margin-top:0;
padding-top:0;
}

h1 + h3 {
margin-bottom:0;
padding-bottom:0;}

h2 + h3 {
margin-bottom:0;
padding-bottom:0;
}

div + h3 {
margin-bottom:0;
padding-bottom:0;}

object + h3 {
padding:1em 0 0;
margin:0;}

h3:first-child {
margin-bottom:0;
padding-bottom:0;}

#content li {
padding:0 0 1em 0em;
}

.column-1 {
float:left;
width:441px;
padding-right:1.7em;}

.column-1-wide {
float:left;
width:100%;
}

.column-2 {
font-size:95%;
float:left;
width:265px;
padding:0em;
margin:0;
}

.column-2 h2 {
font-size:1.7em;
}

.column-2 h2:first-child {
padding-top:1em;
}


.column-2 p {
line-height:1.4em;}

.videoborder {
margin-top:1em;
border:3px solid #e1e1e1;}

a {
outline:none;}

a:link,a:visited {
color:#bd4983;
}

a:hover,a:active {
color:#bd4983;
background:#e8e8e8;
}

ul {
list-style:none;}

#announcementbox {
width:94.5%;
float:left;
font-size:1.3em;
background-color:lightyellow;
padding:.8em;
margin:1em 0em 1em 0em;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0px 0px 2px 0px #ababab;
-moz-box-shadow: 0px 0px 2px 0px #ababab;
box-shadow: 0px 0px 2px 0px #ababab;}

#announcementbox h3 {
padding:0 0 1em 0;
margin:0;
font-size:1.2em;
}

#announcementbox ul {
clear:both;
margin:0 0 1em 0em;
padding:0;}

#announcementbox li {
font-size:1em;
margin:0;
padding:0;}

#announcementbox p {
font-size:1em;
margin:0 0 1em;
padding:0;}

#announcementbox .expires {
position:relative;
top:15px;
float:left;
font-weight:700;
font-size:.9em;
}

#announcementbox p.fineprint {
font-size:.8em;
margin:1em 0;}

.promocode {
font-weight:700;
padding:.3em;
border:1px dotted #999;
background-color:#F9FFEE;}

.clear {
clear:both;}

#announcementbox p.clear2 {
clear:both;
padding:0;
margin:0;}

img {
border:none;
}

#masthead {
float:left;
width:100%;
height:6.5em;
}

#masthead li {
line-height:1em;}

#logoall {
width:333px;
height:30px;
margin:0;
padding:0;
}


.logo a:link, .logo a:visited {
background:url(../img/site/tripletwist-logo.gif) 0 0 no-repeat;
padding:0px 23px 21px;
position:relative;
top:6px;
}

.logo a:hover {
background:url(../img/site/tripletwist-logo.gif) 0 -35px no-repeat;
padding:0px 23px 21px;
position:relative;
top:6px;
}

.phone {
float:right;
}

.logo {
font-size:1.4em;
float:left;
}

.company a:link, .company a:visited, .company a:hover,.company a:active {
text-decoration:none;
color:#000;
background:none;}

#contactinfo {
width:270px;
float:right;
position:relative;
bottom:3em;
right:1.5em;
}

.action-buttons {
font-size:1.2em;
padding-bottom:1em;
text-align:right;
}


.city,.phone {
color:#333;
text-transform:uppercase;
}

.city {
font-size:1.4em;
text-align:right;}

.phone {
padding-top:4px;
font-size:1.6em;
}

#middlemodule {
clear:both;
padding:0 0 1em;
margin:0 auto;
text-align:center;
width:30%;
}

#middlemodule p {
color:#000;
font-size:1.1em;
padding:.5em;
background:lightyellow;
margin:0 auto;
text-align:center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0px 0px 5px 0px #ababab;
-moz-box-shadow: 0px 0px 5px 0px #ababab;
box-shadow: 0px 0px 5px 0px #ababab;
}

.company, ul, li,#contactinfo, .city, #valuestatement h2 {
padding:0;
margin:0;}

ul + p {
padding-top:1em;
margin-top:0;}

.company {
color:#333;
font-size:1.9em;
float:left;
}

.tagline {
width:300px;
color:#777;
font-size:1.7em;
float:left;
font-style:italic;
font-weight:lighter;
position:relative;
left:2.8em;
bottom:.6em;}


#navmain {
float:left;
width:100%;
margin:0;
padding:0 0 0 4px;
}


#nav li, .logo a {
float:left;
text-indent:-999em;
}

#nav a {
display:block;
height:67px;
}

.portfolio a:link,.portfolio a:visited {
width:154px;
background:url(../img/site/navigation.jpg) 0px 0 no-repeat;
}

.portfolio a:hover,.portfoliocurrent, .portfoliocurrent a:hover {
width:154px;
background:url(../img/site/navigation.jpg) -772px 0 no-repeat;
}

.makeover a:link,.makeover a:visited {
width:152px;
background:url(../img/site/navigation.jpg) -154px 0 no-repeat;
}

.makeover a:hover,.makeovercurrent,.makeovercurrent a:hover {
width:152px;
background:url(../img/site/navigation.jpg) -926px 0 no-repeat;
}

.pricing a:link,.pricing a:visited {
width:102px;
background:url(../img/site/navigation.jpg) -306px 0 no-repeat;
}

.pricing a:hover,.pricingcurrent,.pricingcurrent a:hover {
width:102px;
background:url(../img/site/navigation.jpg) -1078px 0 no-repeat;
}

.why a:link,.why a:visited {
width:158px;
background:url(../img/site/navigation.jpg) -408px 0 no-repeat;
}

.why a:hover,.whycurrent,.whycurrent a:hover {
width:158px;
background:url(../img/site/navigation.jpg) -1180px 0 no-repeat;
}

.news a:link,.news a:visited {
width:93px;
background:url(../img/site/navigation.jpg) -566px 0 no-repeat;
}

.news a:hover,.newscurrent,.newscurrent a:hover {
width:93px;
background:url(../img/site/navigation.jpg) -1338px 0 no-repeat;
}

.contact a:link,.contact a:visited {
width:111px;
background:url(../img/site/navigation.jpg) -661px 0 no-repeat;
}

.contact a:hover,.contactcurrent,.contactcurrent a:hover {
width:111px;
background:url(../img/site/navigation.jpg) -1433px 0 no-repeat;
}

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

#content {
clear:both;
float:left;
width:768px;
background-color:#fff;
border:5px solid #fff;
margin-bottom:1em;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0px 0px 5px 0px #ababab;
-moz-box-shadow: 0px 0px 5px 0px #ababab;
box-shadow: 0px 0px 5px 0px #ababab;
}

.homepagephoto {
background:#FFF url(../img/site/hair-makeup-san-francisco-5.jpg) center bottom no-repeat;}

.pricingphoto {
background:#FFF url(../img/site/pricing2.jpg) top right no-repeat;}

.cityhallphoto {
background:#FFF url(../img/site/city-hall-marriage2.jpg) top right no-repeat;}

#valuestatement {
clear:right;
float:right;
padding:1em 1.5em 1em 0;
width:300px;
text-align:center;
font-size:1em;}

.photoby {
font-size:1.1em;
padding-top:3.5em;}

.photoby a {
color:#777;}

#valuestatement p {
color:#666;
line-height:1.3em;
}


.col-1 {
float:left;
width:400px;}


h2 + p {
margin-top:1em;
padding-top:0;}

#valuestatement h3 {
font-size: 2em;}

h2.divide {
padding-top:1.5em;
margin-top:1.5em;
border-top:1px solid #C6C6C6;
}


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

#photocredits p {
text-align:center;
font-size:1.1em;
padding:.5em 0;}


p.caption {
padding:.4em 0 0 0;
margin:0;
font-size:1.2em;
text-align:left;
}



#contactinformation {
width:450px;
text-align:left;
padding:0 0 0 15px;
}

#contactinformation p {
font-size:1.3em;
padding:0;
margin:0;
line-height:1.5em;}


ul#reviewsites {
float:right;
height:40px;
width:255px;
margin:0;
padding:2px 0 0;
}

ul#reviewsites li a {
float:left;
text-indent:-999em;
margin:0;
height:40px;
display:block;
padding:0 0 0 5px;
}

.yelp a:link, .yelp a:visited {
height:40px;
width:78px;
background:url("http://www.tripletwist.com/includes/img/logo/yelp.png") 0 0 no-repeat;}

.yelp a:hover {
height:40px;
width:78px;
background:url("http://www.tripletwist.com/includes/img/logo/yelp.png") 0 -40px no-repeat;}

.knot a:link, .knot a:visited {
height:40px;
width:77px;
background:url("http://www.tripletwist.com/includes/img/logo/knot.png") 0 0 no-repeat;}

.knot a:hover {
height:40px;
width:77px;
background:url("http://www.tripletwist.com/includes/img/logo/knot.png") 0 -40px no-repeat;}

.hctg a:link, .hctg a:visited {
height:40px;
width:77px;
background:url("http://www.tripletwist.com/includes/img/logo/hctg.png") 0 0 no-repeat;}

.hctg a:hover {
height:40px;
width:77px;
background:url("http://www.tripletwist.com/includes/img/logo/hctg.png") 0 -40px no-repeat;}


#footer p {
color:#666;
}

#footer a:link,#footer a:visited,#footer a:hover,#footer a:active  {
color:#666;
font-weight:normal;
text-decoration:underline;}

object, .videoborder object {
display: block;
}

form p {
width:125px;
float:left;
clear:left;
padding-right:1em;
padding-top:.8em;}

.formfield {
width:260px;
float:left;
position:relative;
top:8px;
padding:.5em;
font-size:1.2em;
}

.formfield2 {
width:120px;
float:left;
margin:.8em 0 0;
padding:.5em;
font-size:1.2em;
}

.formfield3 {
width:120px;
float:left;
margin:.8em 0 0 1em;
padding:.5em;
font-size:1.2em;
}

.alternateinfo {
  display:none;}

.highlight {
background-color:#ffffcc;
border:1px dashed #d3d3d3;
padding:.5em;
text-align:center;
font-size:1.3em;
}

.highlightleft {
background-color:#ffffcc;
border:1px dashed #d3d3d3;
padding:.5em;
text-align:left;
}


.aster {
  font-size:1.5em;
  color:red;}

form textarea {
margin:1.2em 0 !important;
padding:1em 0;}

.submit {
clear:both;
margin:1em 100px 1em 143px;
padding:.5em 1em;
background-color:#e1e1e1;
font-size:1.4em;
border:1px solid #999;
}

.submit:hover {
background:#fff;}

p.fine {
width:290px;
font-size:1.2em;
text-align:left;
margin-left:143px;}

p.disclaimer {
font-size:1.2em;
font-style:oblique;
color:#888;
}

dl {
  margin: .5em 0;
  padding: 1em;
  clear:left;
  }

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

dl dt {
  font-size:1.4em;
  margin:0;
  color:#000;
  }

.alignleft {
float:left;
padding:5px 10px 5px 0;
margin:0;}


.alignright {
float:right;
padding:5px 0px 5px 10px;
margin:0;}


#aligncenter {
padding:0;
margin:0 auto;
text-align:center;}

dl dt a {
  font-weight:normal;}

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

dl dd {
  margin-left:110px;
  }

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

h1.mobileannouncement {
font-size:3.5em;
font-weight:strong;
text-align:center;
padding:0;
margin:1em 0;}

.limited {
text-align:right;
font-size:.8em;
letter-spacing:.2em;
font-weight:bold;
padding:0;
margin:0;}