@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:#eee4f0 url(../images/tile.jpg) repeat-x; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:22px; color:#FFF; }
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:#aae0fc; }
a:hover {text-decoration:none;}
a img {border-style:none;}
p.breadcrumbs, .breadcrumbs a {font-size:12px; font-weight:bold; color:#dc84d6; clear:both; padding-top:30px; padding-bottom:20px;}
hr {color:#71c2eb; clear:both; width:100%;}
#footer a {color:#4b4b4b;}
#address p {margin:0; padding:0 0 10px 0;}

/* LISTS */
#content ul {list-style: none; margin-left: 15px; margin-right:30px;}
#content li {padding-left: 12px; background: url(../images/bullet.png) 0 7px no-repeat; margin-left: 15px; margin-right:30px;}


/* LAYOUT ---------- */
#wrap {width:990px; margin:0 auto; background:url(../images/tile-body.jpg) repeat-y; min-height:640px; height:auto !important; height:640px;}
#body {width:990px; background:url(../images/bg-body.jpg) no-repeat; }
#body_wrap {width:100%; clear:both; padding:60px 0 0 0}
#address {float:right; width:233px; text-align:center; padding:85px 17px 0 0; line-height:normal; font-size:12px;}
#content {width:651px; margin-left:58px;}
#footer {width:874px; clear:both; margin:0 auto; color:#4b4b4b; font-size:11px; line-height:20px; background:url(../images/bg-footer.jpg) no-repeat; padding:20px 58px;}

.homeheight {min-height:1020px; height:auto !important; height:1020px;}
.subheight {min-height:640px; height:auto !important; height:640px;}

/* BANNERS ---------- */
#callout {width:223px; position:absolute; z-index:3; top:568px; margin-left:739px;}

/* HEADERS ---------- */

h1 {background-repeat: no-repeat; height: 77px; width:535px; 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: 0; padding-top:20px;}

h1#logo {
margin: 0;
padding: 26px 0 0 58px;
background-repeat: no-repeat; 
width: 441px;/* this width reflects the width of the logo image */
height: 154px; /* 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: 154px;/*same height as logo h1*/ 
width: 441px;/*same width as logo h1*/}

#address h2 {margin:0; padding:0; color:#aae0fc; font-size:13px; text-transform:uppercase;}
#footer h2 {font-size:13px; color:#c0e8fd; padding-right:237px;}
#content h2 {color:#71c2eb; font-size:18px;}
#content h2.special {font-size:32px;  font-weight:normal; color:#ca74c4; font-family:"Times New Roman", Times, serif; margin:30px 0 10px 0; }
#content h3 {font-size:14px; font-style:italic; font-weight:normal; color:#b784b3;}
#content h4 {font-size:13px; }

/* CLASSES ---------- */
#footer p.sesame, #footer p.sesame a {color:#015783; font-weight:bold; font-size:12px; }
.img {float:left; margin:15px 15px 10px -3px; padding:0; width:250px;}
.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:695px; height:324px; background:url(../images/flash.jpg) no-repea; margin-left:36px; }
.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 #71c2eb;}
.font15 {font-size:15px;}

/* NAVIGATION ---------- */



/* NAVIGATION MAIN ---------- */
ul#nav {list-style: none; padding: 0;  width:943px; margin-left:18px;  position:absolute; z-index:100; top:180px; height:36px;}
#nav li {float:left;}
/*  Sets styles for all links that are inside the ul id="nav" */
#nav a {display: block; overflow: hidden; text-indent:-999em; height:36px; }

/* Set the image for each nav item */
.aboutus {background: url(../images/nav/about-us.jpg); width:90px;}
.faqs {background: url(../images/nav/ask-the-orthodontist.jpg); width:58px;}
.beforebraces {background: url(../images/nav/before-braces.jpg); width:138px;}
.duringbraces {background: url(../images/nav/during-braces.jpg); width:137px;}
.catchingproblemsearly {background: url(../images/nav/catching-problems-early.jpg); width:217px;}
.contactus {background: url(../images/nav/contact-us.jpg); width:114px;}
.afterbraces {background: url(../images/nav/after-braces.jpg); width:123px;}
.home {background: url(../images/nav/home.jpg); width:66px;}

/* 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 .beforebraces, #nav li.sfhover .beforebraces, 
#nav li:hover .catchingproblemsearly, #nav li.sfhover .catchingproblemsearly, 
#nav li:hover .faqs, #nav li.sfhover .faqs, 
#nav li:hover .duringbraces, #nav li.sfhover .duringbraces, 
#nav li:hover .contactus, #nav li.sfhover .contactus, 
#nav li:hover .home, #nav li.sfhover .home, 
#nav li:hover .afterbraces, #nav li.sfhover .afterbraces {background-position:0 -36px;}

/* 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 {display:inline; white-space:nowrap; float:none;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: 0 0 0 0; color:#FFF;  background: #9d3d96; border-top:1px solid #4b4b4b; padding:5px 0;}
#nav ul li a {height:auto;  text-decoration: none; width: auto; overflow:auto; text-indent:0; color:#FFF; font-size:14px; padding:1px 30px 1px 10px;  }
#nav ul li a:hover {color:#e492de; }

/* LOGINS MAIN ---------- */
ul#logins {list-style: none; padding: 0; margin-left:738px; width:230px; position:absolute; z-index:24; top:0px;}
#logins li {float:left;}

/*  Sets styles for all links that are inside the ul id="nav" */
#logins a {display: block; overflow: hidden; text-indent:-999em;  height:26px; width:115px;}
/* Set the image for each nav item */
.patientlogin {background: url(../images/nav/nav-patient-login.jpg); }
.doctorlogin {background: url(../images/nav/nav-doctor-login.jpg);}

/* Shift the image position up to show the active state */
#logins a:hover, #logins .active, #logins li:hover, #logins li.sfhover, 
#logins li:hover .doctorlogin, #logins li.sfhover .doctorlogin,
#logins li:hover .patientlogin, #logins li.sfhover .patientlogin {background-position:0 -26px;}

#logins, #logins ul {list-style: none; margin: 0; }
#logins li {display: inline; }
#logins li ul { left: -999em; padding: 0; position: absolute; z-index: 1; padding:0 3px; }
#logins li ul li {display:inline; white-space:nowrap; float:none;}
#logins li:hover ul, #logins li.sfhover ul {left: auto; margin: 0 0 0 0; color:#FFF;  background: #9d3d96; border-top:1px solid #4b4b4b;}
#logins ul li a {height:auto;  text-decoration: none; width: auto; overflow:auto; text-indent:0; color:#FFF; font-size:14px; padding:1px 30px 1px 10px;  }
#logins ul li a:hover {color:#e492de; }

/* SUB NAV */
#sub_tile {width:223px; background:url(../images/tile-more-in-this-section.jpg) repeat-y; position:absolute; z-index:32; top:549px; margin-left:739px;}
#sub_bg {width:223px; background:url(../images/bg-more-in-this-section.jpg) no-repeat;}
#sub_bottom {width:201px; background:url(../images/bg-bottom-more-in-this-section.jpg) bottom no-repeat; padding:30px 22px 30px 0; text-align:right; font-size:13px;}
#sub_bottom ul {margin:0; padding:0; list-style:none;}
#sub_bottom a {color:#FFF;}
#sub_bottom a:hover, #sub_bottom a.active {color:#e492de; text-decoration:none;}

/* SITE MAP NAV */
ul#sitemap {list-style:none; margin-left: 15px; margin-right:30px;}
#sitemap li a {background:none; margin-left: 15px; margin-right:30px;}
#sitemap li a:hover {text-decoration:none;}

/* jQuery Slideshow */
#content .slideshow {margin: 0px; padding: 0px; list-style: none; overflow: hidden;}
#content #smiles{ padding:0px; margin:0px; margin-left:20px; }
#content #smiles li {width: 591px; text-align: center; background-color: #fff; padding:0px; margin:0px;}
#content #smiles li .topsection { background-image:url(../images/topsection.jpg); background-position:left bottom; background-repeat:no-repeat; height:18px; }
#content #smiles li .bodysection { background-image:url(../images/bodysection.jpg); background-position:left top; background-repeat:repeat-y; }
#content #smiles li .bodysection p{ padding:3px; margin:0px; }
#content #smiles li .footersection { background-image:url(../images/footersection.jpg); background-position:left top; background-repeat:no-repeat; height:18px; }


#before-after li {width: 594px; height: 470px;}
#before-after span, #smiles span {padding: 5px 0; color: #753B61;}
#controls {text-align: right;}
#texas {width: 100%; height: 309px;}
#texas p {width: 345px; position: absolute; left: 250px; top: 0; padding: 5px 0; color: #454a27; border: solid 1px #621a4b; border-width: 1px 0;}
