* { margin: 0; outline: none; padding: 0; }
body { background: #fff url(../images/bg.jpg) repeat-x top; }

/* - - - - - - - - - - TEXT - - - - - - - - - - */
body, form, input, textarea { color: #000; font-family: verdana, sans-serif; font-size: 12px; }
p { color: #000; line-height: 18px; margin: 10px 0; }
p.top-link { clear: both; font-size: 11px; line-height: 14px; text-align: right; }
blockquote { margin: 10px 40px; padding: 0; }
body.site-map #content ul { color: #000; font-size: 12px; line-height: 12px; list-style: disc; list-style-image: url(../images/list.gif); margin: 10px 20px; }
body.site-map #content ul a { color: #887766; }
body.site-map #content ul li { margin: 10px 0; }
body.site-map #content ul ul { color: #000; font-size: 12px; line-height: 12px;  margin: 10px 30px; }
body.site-map #content ul ul a { color: #000; font-weight: normal; }
body.site-map #content ul ul li { margin: 10px 0; }
div.hr { background: #887766; clear: both; height: 1px; margin: 20px 0; padding: 0; width: 100%; }
div.hr hr { display: none; }
p#address { color: #685847; font-size: 12px; line-height: 18px; margin: 155px 0 0 30px; position: absolute; }
p#procedures-nav { color: #00457c; }
#content ul { font-size: 12px; line-height: 16px; list-style: disc; margin: 10px 40px; }
#content ul li { margin: 10px 0; }
#content ul li ul { line-height: 16px; list-style: circle; margin: 10px 30px; }
#content ul li ul li { margin: 10px 0; }
#footer p { color: #72604e; font-size: 11px; line-height: 14px; }
#footer p.sesame-link { text-align: center; font-size: 10px; }
span.number { font-size: 14px; font-weight: bold; }

#invisalign-links {width:90%; padding:10px 5px;}
.invisalign-links, .invisalign-links a {font-weight:normal; font-size:11px; color: #FFF; line-height:14px; margin-top:-8px;}
.invisalign-links a {text-decoration:underline;}
.invisalign-links a:hover {text-decoration:none;}

/* - - - LINKS - - - */
a { color: #887766; font-weight: bold; text-decoration: none; }
a:hover { text-decoration: underline; }
p.top-link a { color: #000; text-decoration: underline; }
p.top-link a:hover { color: #000; text-decoration: none; }
#footer a { color: #72604e; }
#footer p.sesame-link a { color: #72604e; }

/* - - - HEADERS - - - */
h1 { background: no-repeat; height: 25px; overflow: hidden; text-indent: -9999px; width:550px;} /* width: 388px */
h2 { color: #887766; font-family: verdana, sans-serif; font-size: 14px; margin: 10px 0; }
h2.special { color: #887766; font-family: verdana, sans-serif; font-size: 12px; margin: 10px 0; font-style:italic;}
h3 { color: #887766; font-family: verdana, sans-serif; font-size: 12px; margin: 10px 0; }
h4 { color: #fff; font-family: verdana, sans-serif; font-size: 12px; font-weight: normal; margin: 5px 0; }

/* - - - - - - - - - - IMAGES - - - - - - - - - - */
img { border: 0; display: block; }
img.center { border: 1px solid #cabcae; clear: both; margin: 10px auto; }
img.left { clear: left; float: left; margin: 0 10px 10px 0;  background: #497ba3;border: 10px solid #cabcae; }
img.right { background: #497ba3; border: 10px solid #cabcae; clear: right; float: right; margin: 0 0 10px 10px; padding: 1px; }
img.auto { background: #887766; border: 10px solid #d3c2b1; clear: right; float: right; margin: 0 0 10px 10px; padding: 1px; }
.auto { background: #887766; border: 10px solid #d3c2b1; clear: both;  margin: 0 0 10px 10px; padding: 1px; }
.flash-replaced .alt { display: block; height: 1000px; position: absolute; overflow: hidden; width: 0; }
img.clear { clear: right; }
img.link-block { background: #497ba3; border: 10px solid #cabcae; float: right; margin: 10px 0 10px 20px; padding: 1px; }
img.reader { clear: right; float: right; margin: 0 0 10px 10px; }
img.side {  margin: 20px auto; }
img.first { margin-top: 0px; }
img.staff { background: #cabcae; border: 10px solid #72604e; clear: right; float: right; margin: 0 0 10px 20px; padding: 1px; }
img.exam { border: none; }
img.braces { background: #cabcae; border: 10px solid #72604e; clear: right; float: right; margin: 0 0 10px 10px; padding: 1px; }
img.damon { background: none; border: none; padding: 5px; }
.logo { position: absolute; top: 15px; left: 20px;}
.map { border: 1px solid #cabcae; }

/* - - - - - - - - - - LAYOUT - - - - - - - - - - */
#container { margin: 0 auto; width: 770px; position:relative;}
#content {margin-left:220px;margin-bottom: 40px; width: 550px; min-height:740px; height:auto !important; height:540px;}
#header { display: block; height: 261px; margin-bottom: 45px; overflow: hidden; width: 770px; }
#footer { margin: 0 auto; padding: 40px 0; text-align: center; width: 770px; }
#footer-container { background: url(../images/footer-bg.jpg) top repeat-x ; clear: both; height: 200px; width: 100%; }
#side-bar { position:absolute; top:306px; margin-left:0px; z-index:5; width: 200px; }

/* - - - FLASH - - - */
#flash-home { height: 217px; margin: 10px 0 0 220px; position: absolute; width: 550px; }

/* - - - - - - - - - - NAVIGATION - - - - - - - - - - */
#nav { top: 227px; position: absolute; width: 450px; z-index:6;}
#nav ul { list-style: none; width: 450px; }
#nav li { float: left; }
#nav a { display: block; height: 34px; overflow: hidden; text-indent: -9999px; }

/* - - - NAVIGATION IMAGES - - - */
a#our-team { background: url(../images/nav/our-team.jpg); width: 92px; }
a#new-patients { background: url(../images/nav/new-patients.jpg); width: 113px; }
a#services { background: url(../images/nav/services.jpg); width: 80px; }
a#faqs { background: url(../images/nav/faqs.jpg); width: 56px; }
a#contact-us { background: url(../images/nav/contact-us.jpg); width: 109px; }

/* - - - NAVIGATION ROLLOVER EFFECTS - - - */
#nav ul a:hover, #nav ul li.active a { background-position: 0 -34px; }
#nav ul li:hover #our-team, #nav ul li.sfhover #our-team,
#nav ul li:hover #new-patients, #nav ul li.sfhover #new-patients,
#nav ul li:hover #services, #nav ul li.sfhover #services { background-position: 0 -34px; }

/* - - - SUBNAVIGATION - - - */

#nav ul li ul { background: url(../images/tile-pop-up.jpg) top repeat-x #eaeaec; border: 1px solid #887766; display: block; left: -9999px; list-style: none; position: absolute; z-index: 1; width: 188px; padding:10px 0;}
#nav ul li:hover ul, #nav ul li.sfhover ul { left: auto; }
#nav ul li ul li { float: none; }
#nav ul li ul li a { color: #887766; font-size: 11px; font-weight: normal; height: 25px; line-height: 25px; padding-left: 15px; text-decoration: none; text-indent: 0; width: 173px; }
#nav li:hover, #nav li.hover { position: static; }

/* - - - SUBNAVIGATION ROLLOVER EFFECTS - - - */
#nav ul li ul li a:hover, #nav ul li ul li.active a { background: #ffd51d; color: #887766; }

#nav ul li ul li.common-procedures a { padding-top: 10px; }

/* - - - ON-PAGE SUBNAVIGATION - - - */
#subnav { clear: both; margin: 0 auto; width: 200px; }
#subnav ul { list-style: none; margin-bottom: 20px; width: 200px; }
#subnav a { background: url(../images/on-page-subnav-bg.gif); color: #fff; display: block; font-size: 11px; font-weight: normal; height: 32px; line-height: 32px; padding-left: 10px; width: 190px; }
#subnav ul li.first a { background: url(../images/on-page-subnav-top.gif); }
#subnav ul li.last a { background: url(../images/on-page-subnav-bottom.gif); }

/* - - - ON-PAGE SUBNAVIGATION ROLLOVER EFFECTS - - - */
#subnav ul a:hover, #subnav ul li.active a { background-position: 0 -32px; font-weight: bold; text-decoration: none; }
#subnav ul li.last a:hover, #subnav ul li.active.last a { background-position: 0 32px; }
#subnav ul li.first a:hover, #subnav ul li.active.first a { background-position: 0 32px; }

/* - - - - - - - - - - TOP NAVIGATION - - - - - - - - - - */
#topnav { height: 30px; margin: 10px 0 0 250px; position: absolute; width: 301px; z-index: 100; }
#topnav ul { list-style: none; width: 301px; }
#topnav a { display: block; height: 30px; overflow: hidden; text-indent: -9999px; width: 301px;}
#topnav li {float:left; height: 30px;}

/* - - - TOP NAVIGATION IMAGES - - - */
a#home { background: url(../images/nav/home.jpg); width:53px; }
a#patient-login { background: url(../images/nav/patient-login.jpg); width: 124px; }
a#doctor-login { background: url(../images/nav/doctor-login.jpg); width: 124px; }

/* - - - TOP NAVIGATION ROLLOVER EFFECTS - - - */
#topnav ul a:hover, #topnav ul li.active a { background-position: 0 -30px; }

/* - - - - - - - - - - INVISALIGN TEEN - - - - - - - - - - */
#invisalign-teen-sidebar { background:#fff; border:solid 1px #477BAB; clear:right; float:right; margin:0 0 15px 15px; padding:0; width:275px; }
#invisalign-teen-sidebar p { font-size:11px; margin:10px 0; padding:0 15px; }
#invisalign-teen-sidebar h3 { background:#97AFC2; color:#fff; font-size:14px; margin:0; padding:15px; }
#invisalign-teen-sidebar a { color:#036; font-weight: normal; }
img.invisalign-teen-right { border:solid 1px #477BAB; clear:right; float:right; margin:0 0 15px 15px; }
img.invisalign-teen-left { border:solid 1px #477BAB; float:left; margin:0 15px 20px 0; }
img.invisalign-teen-thumb { border:solid 1px #477BAB; clear:left; float:left; margin:0 10px 10px 0; }

/* - - - - - - - - - - IE6 UPGRADE ALERT - - - - - - - - - - */
#alert { display: none; background-color: #fff; width: 400px; color: #333; text-align: left; font-size: 11px; letter-spacing: normal; font-weight: bold; padding: 15px 15px 0 15px; border: solid 2px #a52003; position: absolute; z-index: 5000; top: 10px; left: 10px; }
#alert p { margin: 0 0 15px 0; line-height: 14px; padding: 0; }
#alert ul { margin: 0 0 15px 25px; }
#alert a.upgrade { float: left; margin: 0 10px 0 0; }
#alert .right { float: right; }
#alert span.red { color: #a52003; }

/* Reset */
#pro-pack {
	position: relative;
	font-size: inherit;
	line-height: inherit;
	}
#pro-pack img {
	display: block;
	}
#pro-pack a, #pro-pack img, #pro-pack object {
	border:none; 
	outline:none;
	}
	
/* Global Styles ------------------- */
#pro-pack .border {
	border: solid 1px #333; /* Customize me!! */
	}
#pro-pack .right {
	float: right;
	margin: 0 0 15px 15px;
	}
#pro-pack .left {
	margin: 0 15px 15px 0;
	float: left;
	}
#pro-pack .right-border {
	border: solid 1px #333; /* Customize me!! */
	float: right;
	clear: right;
	margin: 0 0 15px 15px;
	}
#pro-pack .left-border {
	border: solid 1px #333; /* Customize me!! */
	float: left;
	clear: left;
	margin: 0 15px 15px 0;
	}
#pro-pack img.border {
	border: solid 1px #333; /* Customize me!! */
	}
		
/* Invisalign Footer -------------------- */	
#pro-pack #invisalign-footer {
	background: #fff;
	width: 100%;
	margin: 30px 0;
	padding: 0;
	border: solid 1px #333; /* Customize me!! */
	font-size: 11px;
	-moz-border-radius: 5px; /* Optional - you may customize or remove - Does not work in IE */
	-webkit-border-radius: 5px; /* Optional - you may customize or remove - Does not work in IE */
	clear: both;
	}
#pro-pack #invisalign-footer h3 {
	background: #887766; /* 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 - Does not work in IE */
	-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; /* Optional - you may customize or remove - Does not work in IE */
	}
#pro-pack #invisalign-footer ul li img {
	margin: 0 10px 0 15px;
	float: left;
	}
#pro-pack #invisalign-footer p {
	padding: 0 15px;
	margin: 30px 0 15px 0;
	}
#pro-pack #invisalign-footer ul {
	margin: 15px; 
	padding: 0 0 15px 0;
	list-style: none;
	border: solid 1px #333; /* Customize me!! */
	border-width: 0 0 1px 0;
	}
#pro-pack #invisalign-footer li {
	width: 33%;
	float: left;
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	}
#pro-pack #invisalign-footer li a {
	float: left;
	}	
#pro-pack .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*/
* html .cf {height: 1px;}