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


.flash-replaced .alt {/*JQUERY STYLE - sets size of container to 0 to hide alternative content*/
 display: block;height: 0px;position: absolute;overflow: hidden;width: 0px;}
 
/* HTML, BODY ---------- */
* {margin:0; padding:0;}
body {margin:0; background:#3c5e54 url(../images/tile.jpg) repeat-x; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:20px; color:#675944; }
p, h2, h3, ul, blockquote, ol {padding-bottom:10px; padding-top:10px;}
ul, blockquote, ol {padding-left:30px; padding-right:10px; padding-top:10px;}
a {color:#675944; }
a:hover {text-decoration:none;}
a img {border-style:none;}
p.breadcrumbs, .breadcrumbs a {font-size:12px; font-weight:bold; color:#466b61; clear:both; padding-top:30px;}
hr {color:#cdbeac; margin:20px 0; clear:both; width:650px;}


/* LAYOUT ---------- */
#wrap {width:990px; margin:0 auto; background:url(../images/tile-body.jpg) repeat-y; }
#body {width:990px; margin:0 auto; background:url(../images/bg-body.jpg) no-repeat; }
#address {width:463px; margin-left:231px; clear:both;  font-size:12px; color:#392f20; }
#content {width:716px; margin-left:274px;  padding-bottom:10px; }
#footer {width:870px; clear:both; margin:0 auto; background:url(../images/bg-footer.jpg) no-repeat; text-align:center; font-size:12px; line-height:16px; padding:85px 60px 30px 60px;}

.body-height-home {min-height:964px; height:auto !important; height:964px;}
.body-height-sub {min-height:674px; height:auto !important; height:674px;}

#content p, #content h2, #content h3, #content h4 {padding-right:60px;}

.padding-home {padding:0 0 310px 0;}
.padding-sub {padding:0 0 0px 0;}

/* BANNERS ---------- */
#logos {width:159px; margin-left:40px; top:92px; position:absolute; z-index:4;}
#callout {width:169px; position:absolute; z-index:3; top:580px; margin-left:40px;}

/* HEADERS ---------- */

h1 {background-repeat: no-repeat; height: 66px; width:391px; text-indent: -999em; margin: 0; padding:0; background-position: bottom; }
h1.replaced {overflow: hidden; text-indent: -999em; background-repeat: no-repeat; }
h1.jcir {font-size: 35px; margin: 50px 0 40px 0; }

h1#logo {
margin: 0 0 0 481px;
padding: 0;
background-repeat: no-repeat; 
width: 353px;/* this width reflects the width of the logo image */
height: 219px; /* this height reflects the height of the heading image */
overflow: hidden; 
text-indent: -999em;} /* hides rich text so only background image shows */

h1#logo a {
display: block; 
height: 219px;/*same height as logo h1*/ 
width: 353px;/*same width as logo h1*/}

#footer h2 {font-size:12px; color:#7b6d58;}
#content h2 {color:#3c5e54; font-size:18px;}
#content h2.special {font-size:14px; font-style:italic;}
#content h3 {color:#b5a591; font-size:16px;}
#content h4 {font-size:14px; font-style:italic;}

/* CLASSES ---------- */
#footer .sesame {color:#FFF; font-weight:bold; font-size:12px;}
.img {float:right; margin:-170px 0 0 10px; padding:0;}
.right {float:right;}
.left {float:left;}
.imgleft {float:left; margin:0 10px 10px 0;}
.imgright {float:right; margin:0 0 10px 10px;}
.hide {display:none;}
.flashhome {width:982px; height:326px; background:url(../images/flash.png) no-repeat 0 3px; position: absolute; top: 226px; z-index: 22; padding-left:8px;}
.block {display:block;}
.listnone {list-style:none;}
.center {text-align:center;}
.clear {clear:both;}
.marginnone {margin:0; padding:0;}
.resources {padding:7px; background:#FFF; border:2px solid #3c5e54;}
.phone {color:#74988e; font-weight:bold;}

/* NAVIGATION ---------- */


#nav_div {background:#50412e; width:199px; margin-left:22px; padding: 20px 0 0 0;  position:absolute; z-index:100; top:244px; height:300px;}

/* NAVIGATION MAIN ---------- */
ul#nav {list-style: none; padding: 0 0 0 10px;  width:189px;}

/*  Sets styles for all links that are inside the ul id="nav" */
#nav a {display: block; overflow: hidden; text-indent:-999em; height:30px; width:189px;}

/* Set the image for each nav item */
.meetourteam {background: url(../images/nav/meet-our-team.gif); }
.faqs {background: url(../images/nav/ask-the-orthodontist.gif); }
.aboutbraces {background: url(../images/nav/about-braces.gif); }
.emergencycare {background: url(../images/nav/emergency-care.gif); }
.contactus {background: url(../images/nav/contact-us.gif); }
.treatmentoptions {background: url(../images/nav/treatment-options.gif); }
.invisalign {background: url(../images/nav/invisalign.gif);}
.fornewpatients {background: url(../images/nav/for-new-patients.gif); }
.home {background: url(../images/nav/home.gif); }

/* Shift the image position up to show the active state */
#nav a:hover, #nav .active, #nav li:hover, #nav li.sfhover, 
#nav li:hover .aboutus, #nav li.sfhover .aboutus, 
#nav li:hover .aboutouroffice, #nav li.sfhover .aboutouroffice, 
#nav li:hover .emergencycare, #nav li.sfhover .emergencycare, 
#nav li:hover .beforeandafter, #nav li.sfhover .beforeandafter, 
#nav li:hover .treatmentoptions, #nav li.sfhover .treatmentoptions, 
#nav li:hover .fornewpatients, #nav li.sfhover .fornewpatients {background-position:-189px 0;}

/* Set the cursor to default arrow so link does not appear clickable */
#nav .active {cursor: default}

#nav, #nav ul {list-style: none; margin: 0; }
#nav li {display: inline; }
#nav li ul { left: -999em; padding: 0; position: absolute; z-index: 1; padding:0 0; }
#nav li ul li {float:none; display:inline; white-space:nowrap;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -30px 0 0 179px; color:#FFF;  background:#74988e; border:1px solid #638a7f;}
#nav ul li a {height:auto;  text-decoration: none; width: auto; overflow:auto; text-indent:0; color:#FFF; font-size:13px; padding:1px 30px 1px 10px;  }
#nav ul li a:hover {color:#2e2415; }

/* LOGINS MAIN ---------- */
ul#logins {list-style: none; padding: 0; margin-left:22px; width:201px; position:absolute; z-index:24; top:0px;}

/*  Sets styles for all links that are inside the ul id="nav" */
#logins a {display: block; overflow: hidden; text-indent:-999em;  height:35px; width:201px;}
/* Set the image for each nav item */
.patientlogin {background: url(../images/nav/patient-login.png); }

/* Shift the image position up to show the active state */
#logins a:hover, #logins .active, #logins li:hover, #logins li.sfhover, 
#logins li:hover .patientlogin, #logins li.sfhover .patientlogin {background-position:0 -35px;}


/* SITE MAP NAV */
ul#sitemap {list-style:circle;}
#sitemap li a {background:none; }
#sitemap li a:hover {text-decoration:none;}


/* FOOTERNAV */
ul#footernav {list-style:none; line-height:auto; margin:0; padding:0;}
#footernav li {padding:0; margin-bottom:5px; display:inline; white-space:nowrap;}
#footernav li a {border-right:1px solid #5c8277;padding:0 5px 0 2px;background:none; text-decoration:none; color:#5c8277; font-size:12px; line-height:auto; text-indent:none; height:auto;}
#footernav li a:hover {text-decoration:underline;}
#footernav li ul {display:none;}
#footernav a.bordernone {border:none;}
#footernav a.negativemargin {padding-left:0px;}

.bordernone {border:none;}
#sidebar {
background: #fff;
width: 275px;
margin: 0 35px 20px 20px;
padding: 0;
border: solid 1px #3C5E54;
float: right;
clear: right;}
#sidebar a {
font-size:12px;
color:#3c5e54;
}
#sidebar h3 {
background: #97AFC2;
margin: 0;
padding: 15px;
color: #fff;}
.thumb {
border: solid 1px #3f6055;
margin: 0 10px 10px 0;
float: left;
clear: left;}
#sidebar p {
padding: 0 15px;
margin: 15px 0;}


span.indent {
padding-left: 40px;}
.img-left {
border: solid 1px #3C5E54;
margin: 0 15px 20px 0;
float: left;}
.logo-links-left {border:solid 1px #3C5E54;}

#testi { margin-top:130px;}
ul#testimonials {
	margin: 0;
	padding: 0;
	list-style: none;
	list-style-image: none;
	list-style-position:inside;
	margin:0px 15px;
	}

ul#testimonials p {
	margin: 0;
	padding: 0;
	font-size:12px;
	}
	
.left-border {
	border: solid 1px #333; /* Customize me!! */
	float: left;
	clear: left;
	margin: 10px 15px 15px 0;
	}
	.cf:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.cf {display: inline-block;} /*this trips hasLayout for ie7*/
.cf {display: block;} /*this returns it back to normal*/
* html .cf {height: 1px;}

div.invisalign-video {
	background: url(http://media.sesamehost.com/images/invisalign-pro-package/invisalign-video-bg.jpg) no-repeat;
	
	width: 450px;
	height: 250px;
	border: solid 1px #333; /* Customize me!! */
	margin-bottom: 15px;
	text-align: right;
	}
	
div.invisalign-video img {
	margin: 30px 50px 0;
	}
	/* Invisalign Videos */
.invisalign-video {
	margin:0px 15px;
	}
#video-invisalign {
	width: 360px; 
	height: 266px;
	display: block;
	}
#video-invisalign-best-friends, #video-invisalign-news-travels-fast {
	width: 320px;
	height: 206px;
	display: block;
	}
#video-invisalign-lobby {
	width: 320px; 
	height: 266px;
	display: block;
	}
.left-video-border{
	border: solid 1px #333; /* Customize me!! */
	float: left;
	clear: left;
	margin:10px 15px;
	}

/* Invisalign Before and After */
ul#before-after-cycle li img.invisalign {
	height: 265px;
	}
#invisalign-beforeandafter {
	width: 520px;
	min-height: 335px;
	line-height: 18px;
	margin: 120px 0 18px; /* Adjust this top margin if needed according to your design */
	padding: 10px 0 10px 10px;
	background-color: #74988e; /* Customize me */
	border: solid 1px #3f6055; /* Customize me */
	-moz-border-radius: 5px; /* Optional - you may customize or remove */
	-webkit-border-radius: 5px; /* Optional - you may customize or remove */
	position: relative;
	}
ul.slideshow {
	list-style: none; 
	margin: 0; 
	padding: 0;
	}
ul#before-after-cycle li img {
	width: 232px;
	float: left;
	margin-right: 10px;
	border: solid 1px #333; /* Customize me */
	}
#invisalign-beforeandafter p {
	float: left;
	width: 190px;
	margin: 0 0 10px 0;
	}
#invisalign-beforeandafter div.cycle-detail {
	min-height: 55px;
	clear: both;
	background-color: #fff; /* Customize me */
	padding: 10px;
	margin: 0 10px 0 0;
	border: solid 1px #333; /* Customize me */
	-moz-border-radius: 5px; /* Optional - you may customize or remove */
	-webkit-border-radius: 5px; /* Optional - you may customize or remove */
	}
#invisalign-beforeandafter .before-after-nav {
	background: #3f6055; /* Customize me */
	position: absolute; 
	z-index: 50;
	top: -19px;
	left: 11px;
	padding: 0 3px;
	border: solid 1px #333; /* Customize me */
	border-width: 1px 1px 0 1px;
	-moz-border-radius: 5px 5px 0 0; /* Optional - you may customize or remove */
	-webkit-border-top-left-radius: 5px; /* Optional - you may customize or remove */
	-webkit-border-top-right-radius: 5px;} /* Optional - you may customize or remove */
#invisalign-beforeandafter .before-after-nav a {
	text-decoration: none; 
	font-size: 12px; 
	padding: 5px; 
	margin: 0 3px; 
	color: #fff;} /* Customize me */
#invisalign-beforeandafter .before-after-nav a.activeSlide {color: #333;} /* Customize me */



.right-border {
	border: solid 1px #3f6055; /* Customize me!! */
	float: right;
	clear: right;
	margin: 20px 35px 15px 5px;
	}
	


	
/* Invisalign Footer */	
#invisalign-footer {
	background: #fff;
	width: 660px;
	margin: 30px 0;
	padding: 0;
	border: solid 1px #3f6055; /* Customize me!! */
	font-size: 11px;
	-moz-border-radius: 5px; /* Optional - you may customize or remove */
	-webkit-border-radius: 5px; /* Optional - you may customize or remove */
	clear: both;
	}
#invisalign-footer h3 {
	background: #3f6055; /* Customize me!! */
	margin: 0;
	padding: 8px 15px;
	color: #fff; /* Customize me!! */
	font-size: 14px;
	-moz-border-radius: 5px 5px 0 0; /* Optional - you may customize or remove */
	-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; /* Optional - you may customize or remove */
	}
#invisalign-footer ul li img {
	margin: 0 10px 0 15px;
	float: left;
	}
#invisalign-footer p {
	padding: 0 15px;
	margin: 30px 0 15px 0;
	}
#invisalign-footer ul {
	margin: 15px; 
	padding: 0 0 15px 0;
	list-style: none;
	border: solid 1px #3f6055; /* Customize me!! */
	border-width: 0 0 1px 0;
	}
#invisalign-footer li {
	width: 33%;
	float: left;
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	}
#invisalign-footer li a {
	float: left;
	color:#3c5e54;
	}	
.invisalign-footer-logo {
	margin: 0 30px 0 15px;
	float: left;
	}
/* Clear Fix */
.clear {clear: both;}
.cf:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.cf {display: inline-block;} /*this trips hasLayout for ie7*/
.cf {display: block; } /*this returns it back to normal*/
.cf a{color:#3c5e54; } 
* html .cf {height: 1px;}

#invisalign-faq h3{
	color:#666666;
	}