/* CSS Document */
/* HTML, BODY ---------- */
body {margin:0 0 0 0; background:#bee0ed url(images/tile.jpg) repeat-x; font-family: Tahoma, Arial, sans-serif; font-size:12px; line-height:19px; color:#464646;}
#col1 img {margin-bottom:192px;}
a {color:#0582ca; font-size:12px; }
a:hover {text-decoration:none;}
#col4 a {color:#FFF; text-decoration:none;}
#col4 a:hover {text-decoration:underline;}
* #address p {margin:0; padding:11px 0 0 0;}
#footer a {font-weight:normal;}

/* LAYOUT ---------- */
* #container {width: 860px; position: absolute; top: 0; left: 50%; margin-left: -430px; }
* #header {width:860px; margin:0 auto; background:url(images/header.gif) no-repeat; overflow:hidden; position: relative;}
* #content {width:860px; margin:0 auto; background: url(images/content-bottom.gif) no-repeat center bottom #FFF; overflow:auto; padding-top:13px; clear:both; }
* #col1 {width:344px; float:left; }
* #col2 {width:496px; float:left; padding-bottom:200px;}
/*#buffer {width:860px; margin:0 auto; padding: 0 0 5px 0; }*/

* #address {width:201px; height: 110px; background:url(images/address-background.gif) no-repeat; margin: 0 0 0 16px; padding:5px; color:#464646; line-height:normal; text-align:left; font-size:11px; clear: right; position: absolute; bottom: 130px; z-index: 20;}

#logos-home {margin: 0 0 0 0; position: absolute; bottom: 178px; right: 105px; z-index: 30px; height: 45px; width: 530px;}

#logos-home img {border: 0;}

* HTML #address {position: relative;}
* #footer {width: 846px;  border:2px solid #FFF; background:#347f29; margin:5px 0 0; padding:7px 5px 5px 5px; color:#FFF; clear:both; overflow:auto;}
* #col3 {width:50%; float:left; text-align:left;}
* #col4 {width:50%; float:left; text-align:right;}


/* HEADERS ---------- */
h1 {background-repeat: no-repeat; height: 33px; width:495px; text-indent: -999em; margin: 0 0 0 -5px; padding:0;}
h3 {color:#0582ca; font-size:12px; margin:0; padding:0; }
h2 {color:#0582ca; font-size:14px; }
* #address h4 {font-size:12px; color:#464646; margin:0; padding:0;}
* #footer h2 {font-size:11px; color:#FFF; padding:0; margin:0;}

/* CLASSES ---------- */
* .sesame {color:#464646; font-size:11px; font-weight:normal; margin:0; padding:5px 0 0 0;}
* .img {margin:0 10px 10px 10px;}
* .right {float:right;}


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


/* NAVIGATION MAIN ---------- */
ul#nav {list-style: none; padding: 0; margin:0 auto; width:860px; clear:both; }

#nav li {float:left; color:#8dc6e7; }

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

/* Set the image for each nav item */
* #aboutouroffice {background: url(images/nav-about-our-office.gif); width:132px; }
* #aboutorthodontics {background: url(images/nav-about-orthodontics.gif); width:162px; }
* #braces101 {background: url(images/nav-braces-101.gif); width:102px; }
* #emergencycare {background: url(images/nav-emergency-care.gif); width:141px; }
* #thegameroom {background: url(images/nav-the-game-room.gif); width:140px; }
* #contactus {background: url(images/nav-contact-us.gif); width:113px;}
* #home {background: url(images/nav-home.gif); width:70px;}

/* 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 #aboutorthodontics, #nav li.sfhover #aboutorthodontics, 
#nav li:hover #braces101, #nav li.sfhover #braces101, 
#nav li:hover #emergencycare, #nav li.sfhover #emergencycare, 
#nav li:hover #thegameroom, #nav li.sfhover #thegameroom, 
#nav li:hover #home, #nav li.sfhover #home, 
#nav li:hover #contactus, #nav li.sfhover #contactus {background-position:0 -31px;}

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

* #nav, #nav ul {list-style: none; margin: 0; padding: 0}
#nav ul li {float:none;}
#nav li ul { left: -9999em; padding: 0; position: absolute;  }
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: 0px 0 0 10px;}
#nav ul li a {height:25px; margin: 0; text-decoration: none; width: 191px; text-indent:0; color:#000; font-size:12px;	padding-left:5px; background:#8dc6e7; border-top:1px solid #FFF; text-transform:uppercase; font-weight:normal;}
#nav ul li a:hover {background:#3183b4; color:#FFF;}



/* LOGO NAVIGATION ---------- */
ul#logo { list-style: none; padding: 0; margin:0; width:705px; float:left;}

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

/* Set the image for each nav item */
* #logolink {background: url(images/spacer.gif);}

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


/* LOGINS NAV ITEMS ---------- */

#logins {height: 23px; width:400px; list-style: none; margin:0; padding:0; z-index: 10; position: absolute; right: -95px; top: 7px;}

/*  Sets styles for all links that are inside the ul id="nav" */
#logins a {display: block; width: 146px; height: 23px; overflow: hidden; text-indent:-999em; padding: 0; margin: 0 0 0 3px; float: left;}

/* Set the image for each nav item */
* #patientlogin {background: url(images/nav-patient-login.gif) no-repeat;}
* #office-news {background: url(images/nav-office-news.gif) no-repeat;}

/* Shift the image position up to show the active state */
#logins a:hover, #logins.active, #logins li:hover, #logins li.sfhover {background-position:0 -23px;}
/* Set the cursor to default arrow so link does not appear clickable */
* #logins * .active {cursor: default}


/* SUB NAVIGATION ---------- */
div#sub { width: 495px; margin:0; }

* html div#sub { margin-right: 0px; }

/* for IE6*/
div#sub ul {list-style: none; width:495px; margin:0; padding:0;}

/*  Sets styles for all links that are inside the ul id="nav" */
#sub a { color:#464646; font-size:12px; text-decoration:none; }
#sub a:hover {font-weight:bold;}
#sub li { display: inline; white-space: nowrap; font-weight:normal; }

/* Shift the image position up to show the active state */
#sub a:hover, #sub a.active, #sub .activea, #sub .active a {font-weight:bold;}

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

div#sesame-game {
background: #000;
line-height: 0;
margin: 10px auto;
text-align: center;
width: 400px;}

ul#sesame-games {
list-style: none;
margin: 0;
padding: 0;}

ul#sesame-games li {
clear: both;
display: inline-block;}

ul#sesame-games img {
border: 0;
float: right;
margin: 0 0 10px 10px;}

ul#sesame-games p {
padding-bottom: 1em;}




* #braces-diagram {background: url(images/braces-diagram/braces-diagram-bg.gif); height: 374px; position: relative; width: 425px}
#braces-diagram a {cursor: help; display: block; position: absolute}
#braces-diagram a:hover {background: transparent}
a#elastic-tie {height: 20px; left: 90px; top: 100px; width: 65px}
a#loop-archwire {height: 20px; left: 150px; top: 80px; width: 100px}
a#archwire {height: 20px; left: 190px; top: 100px; width: 65px}
a#bracket {height: 20px; left: 230px; top: 120px; width: 60px}
a#headgear-tube {height: 20px; left: 335px; top: 100px; width: 90px}
a#coil-spring {height: 20px; left: 150px; top: 300px; width: 65px}
a#tie-wire {height: 20px; left: 235px; top: 325px; width: 65px}
a#band {height: 20px; left: 270px; top: 300px; width: 40px}
a#hook {height: 20px; left: 315px; top: 280px; width: 35px}
a#elastic {height: 40px; left: 355px; top: 280px; width: 45px}
a#print {cursor: pointer; height: 23px; left: 365px; top: 351px; width: 60px}
#braces-diagram a img {border: none; display: block; height: 0; position: absolute; width: 0}
#braces-diagram a:hover img {height: 74px; width: 425px}
a#elastic-tie:hover img {left: -90px; top: -100px}
a#loop-archwire:hover img {left: -150px; top: -80px}
a#archwire:hover img {left: -190px; top: -100px}
a#bracket:hover img {left: -230px; top: -120px}
a#headgear-tube:hover img {left: -335px; top: -100px}
a#coil-spring:hover img {left: -150px; top: -300px}
a#tie-wire:hover img {left: -235px; top: -325px}
a#band:hover img {left: -270px; top: -300px}
a#hook:hover img {left: -315px; top: -280px}
a#elastic:hover img {left: -355px; top: -280px}

/* edit.com */

ul, ol {
	margin-top:0px;
	margin-bottom:0px;
}

.FooterText {
	color: #FFF;
	font-size: 11px;
	font-weight: bold;
}

.NormalText, body, td {
	font-family: Tahoma, Verdana , Helvetica, sans-serif;
	font-size: 12px;
	color: #464646;
    text-decoration: none;
	font-weight: normal;
	text-transform: none;
	font-style:normal;
}

.SubHeader {
	color: #0582CA;
	font-size: 12px;
	font-weight: bold;
}

.SubjectHeader {
	color: #0582CA;
	font-size: 14px;
	font-weight: bold;
}

.PageTitle {
	font-family: Georgia, Times New Roman, "Times", serif;
	color: #464646;
	font-size: 18px;
	font-weight: bold;
}

table.patforms { border:solid 2px #025789; width:239px; margin: 0 10px 10px 10px; }
* td.pforms { padding: 10px; }

a.about { color:#464646; font-size:12px; text-decoration:none; }
a.about:hover {font-weight:bold;}


/* Invisalign Teen */

.left {float: left;}
.img-left {
  margin: 0 20px 20px 0;
  float: left;
  clear: left;
}
.img-right {
  margin: 0 0 20px 20px;
  float: right;
  clear: right;
}
.border {
  border: solid 1px #333; /* Customize me! */
  /* Add more nifty stuff in here if you like */
}
span.indent {padding-left: 40px;}
#invisalign-sidebar {
  background: #fff; /* Customize me! */
  width: 275px;
  margin: 0 0 20px 20px;
  padding: 0;
  border: solid 1px #333; /* Customize me! */
  line-height: 18px;
  font-size: 11px;
  float: right;
  clear: right;
}
#invisalign-sidebar a {
  color: #036; /* Customize me! */
}
#invisalign-sidebar h3 {
  background: #97AFC2; /* Customize me! */
  font-size: 16px; /* Customize me! */
  font-weight: bold; /* Customize me! */
  margin: 0;
  padding: 15px;
  color: #fff; /* Customize me! */
}
#invisalign-sidebar p {
  padding: 0 18px;
  margin: 18px 0;
}
.thumb {
  border: solid 1px #333; /* Customize me! */
  margin: 0 10px 10px 0;
  float: left;
  clear: 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*/
* html .cf {height: 1px;}

#logins #facebook-header{float:none; margin:0; position:absolute; top:0; left:-40px; background:url(images/facebooksm.png) 0 0 no-repeat; display:block; height:23px; width:23px; z-index:99!important}