/* CSS Document */



/* HTML, BODY ---------- */

body {margin: 0; color: #FFF; font-size: 11px; line-height: 15px; font-family: Verdana, Georgia; background: #28903b;}

#subcontent,

#subcontent td,

.NormalText {line-height:20px;}



#subcontent a {color: #FFF;}

#subcontent a:hover {text-decoration:none;}

#footer a {color:#78cd87;}

#footer a:hover {color:#FFF;}

.clear-both {clear: both;}





/* LAYOUT ---------- */

#wrap {width:100%; background:url(images/content-bg.jpg) #3f0760 repeat-x; overflow:auto;}



#banner {width:755px; margin:0 auto; padding-top:30px; padding-left:27px; color:#000; position:relative}

#logowrap {width:212px; float:left; margin:0; padding:0;}

#bannerright {width:543px; float:left; margin:0; padding:0;}

#bannerright ul {margin:0; padding:0;}

#logo {text-indent: -999em; background:url(images/logo.gif) no-repeat; height:195px; list-style:none; padding:0 0 7px 0; margin:0; width:212px;}

#tagline {    background: url("images/tagline.gif") no-repeat scroll 0 0 transparent;
    height: 32px;
    left: 273px;
    list-style: none outside none;
    margin: 5px 0 0;
    padding: 0;
    position: absolute;
    text-indent: -999em;
    top: 196px;
    width: 518px;}

#drname {margin:25px 0 0 381px; padding:0; list-style:none; text-indent:-999em; background:url(images/dr-name.gif) no-repeat; height:39px; width:162px;}


#address {
    margin: 0;
    padding: 0 0 0 270px;
    text-align: right;
    width: 271px;}

#middle {width:782px; margin:0 auto; padding-bottom:20px; clear:both;}

#column1 {float:left; width:274px;}

#navback {width:157px; margin:22px 0 10px 0; padding:17px 62px 20px 55px; background:url(images/nav-bg.jpg) no-repeat; overflow:auto;}

#column2 {float:left; width:493px; margin:20px 0 15px 15px;}

#subcontent {width:493px; clear:both; padding:40px 0 20px;}

#more {background:url(images/more-in-this-section_06.gif) no-repeat; width:90px; height:49px; text-indent:-999em;  list-style:none; margin:0; padding:0;}

#wrapfooter {width:100%; background:url(images/footer-bg.jpg) repeat-x; overflow:auto;}

#footer {width:782px; margin:0 auto; font-size:11px; line-height:18px; text-align:center; color:#78cd87; padding:27px 10px 10px 10px;}

div.RightBox {float: right; background-color: #FFF; border:solid 2px #000; width:210px; margin: 0 10px 10px; padding:10px; color:#000;}

div.RightBox a:link, div.RightBox a:visited	{color:#000 !important;}

#facebook-icon {position:absolute; left:280px; top:100px; height:80px;}

/* HEADERS ---------- */

h1 {height: 36px; margin: 0; border: solid #3f0760; border-width: 0 0 7px; padding: 0 30px 0 0; color: #3f0760; font: italic 28px/normal Papyrus; text-align: right; background: no-repeat 190px 0;}

h1.include {width:393px; text-indent: -999em; padding:0 0px 0 100px; text-align: left;}

#column2 h2 {font-size:11px; margin:0; padding:0;}

#footer h2 {margin:0; font-size:11px; color:#FFF;}

#subcontent h3 {font-size:14px; line-height: normal;}

#subcontent h4 {font-size:16px; line-height: normal; color:#3f0760;}



/* CLASSES ---------- */

#footer .sesame {color:#FFF; font-weight:bold;}

#footer .sesame a:hover {color:#78cd87; font-weight:bold;}

#subcontent .top {color:#d1bbde; font-weight:bold;}

#subcontent .top a:hover {text-decoration:none;}

/* NAVIGATION ---------- */



/* NAVIGATION MAIN ---------- */

ul#nav {list-style: none;padding: 0; margin: 0; width:157px;}



/*  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 */

#aboutouroffice {background: url(images/nav-about-our-office.gif); }

#invisalign {background: url(images/nav-invisalign.gif); }

#damonsystem {background: url(images/nav-the-damon-system.gif); }

#aboutorthodontics {background: url(images/nav-about-orthodontics.gif); }

#firstvisit {background: url(images/nav-first-visit.gif); }

#patientpics {background: url(images/nav-patient-pics.gif); }

#orthotechnology {background: url(images/nav-ortho-technology.gif); }

#thegameroom {background: url(images/nav-the-game-room.gif); }

#emergencycare {background: url(images/nav-emergency-care.gif); }

#refer {background: url(images/nav-refer.gif); }

#contactus {background: url(images/nav-contact-us.gif); }

#whyourpractice {background: url(images/nav-why-our-practice.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 #aboutouroffice, #nav li.sfhover #aboutouroffice, 

#nav li:hover #refer, #nav li.sfhover #refer, 

#nav li:hover #emergencycare, #nav li.sfhover #emergencycare, 

#nav li:hover #aboutorthodontics, #nav li.sfhover #aboutorthodontics, 

#nav li:hover #patientpics, #nav li.sfhover #patientpics, 

#nav li:hover #orthotechnology, #nav li.sfhover #orthotechnology, 

#nav li:hover #contactus, #nav li.sfhover #contactus,

#nav li:hover #whyourpractice, #nav li.sfhover #whyourpractice,

#nav li:hover #home, #nav li.sfhover #home,  
#nav li:hover #invisalign, #nav li.sfhover #invisalign,  
#nav li:hover #damonsystem, #nav li.sfhover #damonsystem,  

#nav li:hover #thegameroom, #nav li.sfhover #thegameroom {background-position:-159px 0;}



/* Set the cursor to default arrow so link does not appear clickable */

#nav .active {cursor: default}



/* SUB NAVIGATION ---------- */

div#sub {float: left; clear: right; width: 311px; margin:0 0 0 10px;}



* html div#sub {margin-right: 0px;}



/* for IE6*/

div#sub ul {list-style: none; width:320px;}



/*  Sets styles for all links that are inside the ul id="nav" */

#sub a { color:#FFF; }

#sub a:hover {text-decoration:none;}

#sub li {display: inline; white-space: nowrap; }



/* Shift the image position up to show the active state */

#sub a:hover, #sub .active {text-decoration:none;}



/* Set the cursor to default arrow so link does not appear clickable */

#sub .active {cursor: default}



/* LOGO NAVIGATION ---------- */

ul#logo { list-style: none; width:212px; padding:0 0 7px 0; margin:0;}



/*  Sets styles for all links that are inside the ul id="nav" */

#logo a {display: block; height: 195px; width:212px; overflow: hidden; text-indent:-999em;}



/* Set the image for each nav item */

#logolink {background: url(images/logo.gif);}



/* Set the cursor to default arrow so link does not appear clickable */

#logo .active {cursor: default}



/* Edit style options  */



.Subheader			{color: #3f0760; font-size:16px; line-height: normal;}



td.Clear,

td.ImageLeft,

td.ImageRight		{}

td.ImageLeft img	{clear: both; margin: 0 10px 5px 0; float: left;}

td.ImageRight img	{clear: both; margin: 0 0 5px 10px; float: right;}

td.ImageRightContact img	{ margin: 0 0 5px 10px; float: right;}

.img-no-border {
	border: none;
}

td.ImageRightContact img.img-no-border-float-left {
	border: none;
	float: left;
	margin: 0 10px 10px 0;
}


#banner-logos {
	float: left;
	padding-left: 20px;
}

.float-left-contact {
	float: left;	
	width: 240px;
}





a {margin-top: 0px;}

/* Emergency Care */
ul#toggle-emergency {
  list-style: none;
 margin: 0 0 10px 0;
}

ul#toggle-emergency p {
margin-top:0px;
}
ul#toggle-emergency li {
  border: solid 1px #fff; /* Customize me! */
  border-width: 0 0 1px 0;
  padding: 10px 0;
  margin: 0;
}
.general-soreness {
  background: url(/sesame_media/images/emergency-care/general-soreness.gif) no-repeat;
  width: 80px;
  height: 60px;
}
.headgear {
  background: url(/sesame_media/images/emergency-care/headgear.gif) no-repeat;
  width: 80px;
  height: 60px;
}
.loose-appliance {
  background: url(/sesame_media/images/emergency-care/loose-appliance.gif) no-repeat;
  width: 80px;
  height: 60px;
}
.loose-bracket {
  background: url(/sesame_media/images/emergency-care/loose-bracket.gif) no-repeat;
  width: 80px;
  height: 60px;
}
.loose-wire {
  background: url(/sesame_media/images/emergency-care/loose-wire.gif) no-repeat;
  width: 80px;
  height: 60px;
}
.poking-wire {
  background: url(/sesame_media/images/emergency-care/poking-wire.gif) no-repeat;
  width: 80px;
  height: 60px;
}
#toggle-emergency .img-left {
  margin: 0 20px 5px 0;
  float: left;
  clear: left;
}
.border {
  border: solid 1px #333; /* Customize me! */
  /* Add more nifty stuff in here if you like */
}

/* 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*/
* html .cf {height: 1px;}


/* Common Treatments */
div.box {
  background-color: #28903b; /* Customize me! */
  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 */
  float: right;
  clear: right;
  width: 334px;
  padding: 5px 0 5px 5px;
  margin: 0 0 20px 20px;
}
div.box img {
  border: solid 1px #333; /* Customize me! */
  margin-right: 5px;
  float: left;
}
div.box p {
  float: left;
  width: 50%;
  margin: 0;
  padding: 0;
}

/* This styled div acts as the hr for most browsers */
div.hr {
  height: 0px;
  background-color: #eee; /* Customize me! */
  border: solid 1px #eee; /* Customize me! */
  border-width: 1px 0 0 0; /* Customize me! */
  margin: 20px 0;
  padding: 0;
  clear: both;
}
/* This is the backup for screen readers */
hr {
  display: none;
  height: 0px;
  background-color: #eee;
  border: solid 1px #eee;
  border-width: 1px 0 0 0;
  clear: both;
}


#slideshow-home {width:501px; height:243px; clear:both; margin-bottom:18px; margin-top:-3px; background:url(images/slide1.jpg) no-repeat; overflow:hidden;}


