/* HTML, BODY ---------- */

html, body {

	height: 100%;

	background: #72bcc3 url(../images/bg.jpg) repeat 0 0; 

	margin: 0

	}

* {margin:0; padding:0;}



/* TEXT ---------- */

body {

	color: #000; 

	font: 12px/18px Tahoma, Helvetica, sans-serif; 

	text-align:left;

	}

p {

	margin: 0px 0 15px 0

	}



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

h1{

	margin:0;

	}

.title{

	margin:0 0 10px 0px; 

	background-repeat: no-repeat; 

	height:37px;/* this height reflects the height of the heading image */

	overflow: hidden; text-indent: -999em;

	} /* hides rich text so only background image shows */

h2{

	color: #404040; 

	margin: 0;

	font-size:12px;

	font-weight:bold;

	}

h3{

	color: #404040;

	font-size:12px;

	margin: 0;

	font-weight:bold;

	}



/* LISTS ---------- */

ol, ul {margin:0 0 10px 0;}



/* LINKS ---------- */

a {color: #58999f; text-decoration: underline}

a:hover {color: #58999f; text-decoration: none; font-weight:normal;}

#logo a {margin: 0; width: 439px; height: 33px; display: block; background: url(../images/logo.gif) no-repeat; }

.sesame {margin-top:8px;}

	.sesame a {text-decoration:underline;}

	.sesame a:visited {text-decoration:underline;}

	.sesame a:hover {text-decoration:underline;}



li .first {padding-left:0; border-left:none;}



/* NAV ---------- */

#nav {position:absolute; top:140px; left:50%; margin: 0 0 0 -380px;}

#nav a {display: block;overflow: hidden; text-indent: -999px; width: 176px;}

#our-office {background: url(../images/about-our-office.gif) 0 0; width:176px; height:42px;}

#about-ortho {background: url(../images/about-orthodontics.gif) 0 0; width:176px; height:31px;}

#braces-101 {background: url(../images/braces-101.gif) 0 0; width:176px; height:30px;}

#treatment-options {background: url(../images/treatment-options.gif) 0 0; width:176px; height:30px;}

#emergency-care {background: url(../images/emergency-care.gif) 0 0; width:176px; height:30px;}

#the-game-room {background: url(../images/the-game-room.gif) 0 0; width:176px; height:30px;}

#contact {background: url(../images/contact.gif) 0 0; width:176px; height:30px;}

#patient-login {background: url(../images/patient-login.gif) 0 0; width:176px; height:30px;}

#home {background: url(../images/adams-orthodontics.gif) 0 0;width:176px; height:32px;}

#nav a:hover, #nav .active, 

#nav li:hover #our-office, #nav li.sfhover #our-office, 

#nav li:hover #about-ortho, #nav li.sfhover #about-ortho, 

#nav li:hover #braces-101, #nav li.sfhover #braces-101, 

#nav li:hover #ortho-tech, #nav li.sfhover #ortho-tech, 

#nav li:hover #contact, #nav li.sfhover #contact {background-position: -176px 0}



/* DROP-DOWN-NAVIGATION ----------------*/

#nav li {display: inline; z-index:100; margin:0; padding:0;}

#nav li ul { /* second-level lists */margin: -32px 0 0 174px; padding: 0 ;width: 160px; position: absolute; background: #72bcc3; left: -999em; line-height: 30px; font-size: 12px; height: auto; border: 2px solid #cfd18f;}

#nav li ul a {	list-style-image:none; padding: 0 0 0 10px; width: 150px; color: #29344c; text-indent: 10px; text-decoration: none; height: auto;}

#nav li:hover ul, #nav li.sfhover ul {left: auto;display:block;z-index:100;}

#nav li:hover ul a:hover, #nav li.sfhover ul a:hover {color: #29344c; background: #fff;}

	

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

#subnavcontainer {width: 580px; height:45px; float:left; margin:0 0 0 -20px;}

#subnav ul{width:537px;}

	#subnav li {display:inline; list-style:none; text-indent:none; white-space:nowrap;}

	#subnav li a {padding: 0 4px 0 5px; font: normal 12px/0px Tahoma, Helvetic, sans-serif;

	border-left: 1px solid #000; white-space:nowrap; text-decoration: none;}

	#subnav li a:visited {text-decoration: none;}

	#subnav li:hover a, #subnav li a.active {font-weight:bold; text-decoration:none;}

	#subnav .first{border-left:none;}

#subnav li.first a{padding-left:0; border-left:none;}

.subnavstyles {text-align:left;}



/* IMAGES ---------- */

img {border:none;}



/*right floating image with border*/

.right {float:right; border: 3px solid #cfd18f; margin:0 10px 0 10px;}

.left {float:left; border: 3px solid #cfd18f; margin:0 10px 0 0;}



/* LAYOUT ---------- */

.clear{clear:both;}

.column{ width: 150px; float:left;}

#column-container{width:537px; height:100px;}

#container{

	margin: 0 0 -155px 0; /* the bottom margin is the negative value of the footer's height */

	min-height:100%;

	height: auto !important;

	height: 100%;

	}
.bordered { border:#cfd18f 2px solid}
#top{ position:absolute; top:0; left:0; background: url(../images/header-bg.png) repeat-x 0 0; height:85px; width:100%;display:block;}

#teeth{	background: url(../images/teeth.gif) no-repeat 0 0; position:absolute; top:53px; left:50%; margin: 0 0 0 130px; height:54px; width:200px; display:block;}

#main {background: url(../images/content-bg.png) repeat-y 0 0; margin: 80px auto 0 auto; width: 877px; min-height:910px; height:auto !important; height:868px;}

.video-container { width:243px; height:206px; float:left}

	/* IE6 #main hack-------------------*/

	*html #main {background:#fff; border-right:1px solid #999999;border-left:1px solid #999999;}

	/* IE7 #main hack-------------------*/

	*+html #main {min-height:920px;}

	/* Safari #main hack-------------------*/

	@media screen and (-webkit-min-device-pixel-ratio:0) {

			#main { min-height: 907px; }

		}	

#header{position:absolute; top:35px; left:50%; margin: 0 0 0 -380px; width:439px; display:block;}

	#header h1{	font: bold 16px/60px Georgia, "Times New Roman", Times, serif; color: #006351; }

	/* IE6 #header h1 hack-------------------*/

	*html #header h1{ font: bold 16px/44px Georgia, "Times New Roman", Times, serif;}

#address{ background: #d5ebed; border: 2px solid #cfd18f; position:absolute; top: 440px; left: 50%; margin: 0 0 0 -380px; padding:10px 0 10px 15px; width:157px; font-size:11px; line-height:14px; color:#29344c;}

#address p{margin:5px 0 0 0;}

#invisalign { position:absolute; top:610px; left: 50%; margin: 0 0 0 -361px;}

	/* IE7 #invisalign top hack-------------------*/

	*+html #invisalign { top:615px;}

#social-icons { position:absolute; top:770px; left: 50%; margin: 0 0 0 -367px; }

    /* IE7 #social-icons top hack-----------------*/
	
	*+html #social-icons { top:775px; }

#text{width:537px; margin: 70px 0 0 282px; padding: 40px 0 75px 0;}

	/* IE6 #text hack -----------------*/

	*html #text{padding: 70px 0 95px 0;}

	/* IE7 #text hack -----------------*/

	*+html #text{padding: 70px 0 95px 0;}

	@media screen and (-webkit-min-device-pixel-ratio:0) {

			#text { padding-bottom:160px; }

		}

#text ul{margin-left:20px;}

#spotlight{	border: 2px solid #cfd18f; margin: 30px 0 18px 0 ; width:529px; height:241px;}

#flash-home{z-index:1; width: 529px; height:241 px;}

#footer {background: #72bcc3 url(../images/footer-bg.gif) repeat-x 0 0; color: #fff; font-size: 11px; margin:0; padding: 20px 0 0 0; text-align: center; width:100%; height:155px;}

.push{height:155px;}

#footer p{margin:8px;}

#footer ul{margin:0; padding:0; text-indent:none; line-height:13px;}

#footer li {display:inline; list-style:none; text-indent:none;}

#footer li a {color:#fff; padding: 0 2px 0 3px;	border-left:1px solid #fff;}

#footer li a:visited {color:#fff;text-decoration:none; }

#footer li:hover a, #footer li a:hover, #footer li a.active {color:#fff; text-decoration:underline;}

#footer li.first a{padding-left:0; border-left:none;}



/*----------------------------- 

Shortcuts	

-----------------------------*/



/* Image Replacement -- add class="replace" to root element, i.e. <p> and add a bg image*/

.replace {letter-spacing : -1000em;line-height: 0;overflow: hidden;line-height: 0;text-indent: -999em;}

/* Just for Opera, but hide from MacIE */



/*\*/html>body .replace {	letter-spacing : normal;text-indent : -999em;overflow : hidden;}

/* End of hack */



/* RESOURCES ---------- */

dl.logos, dl.logos dt, dl.logos dd {list-style:none;margin:0;padding:0;}

dl.logos {margin-bottom: 10px;padding:10px;}

dl.logos dd {border-bottom:1px solid #CCC;margin:0;padding:10px 0 5px 0;width:50%;}

dl.logos span {font-size: 16px; font-weight:bold;}



/* THE GAME ROOM ---------- */

div#sesame-game {line-height: 0;margin: 10px 0px 0 0px; text-align: center; width: 537px;}

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

ul#sesame-games li {clear: both; text-indent:none; margin-left:-20px;}

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

ul#sesame-games a.button {float:right; height:85px; width:200px; margin-right:10px;}

ul#sesame-games p {width: 320px; padding-bottom: 10px;}

	

/* LOCATION ---------- */

iframe {

	border: 1px solid #PRIMARYCOLORGOESHERE;

	margin-bottom:20px;

	}

	

/* MEDIA CENTER ---------- */

h2.media-center {

background:#000033;

color:#FFF;

margin:0;

padding:5px;}

div.media-center {

background:#336699;

color:#FFF;

display:inline-block;

margin-bottom:10px;

overflow:auto;

padding:10px;}

div.media-center a {

color:#FFF;}

div.media-center img {

border:1px solid #FFF;}

/* IE6 upgrade alert */
#ie_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;
}
#ie_alert ul {margin: 0 0 15px 25px;}
#ie_alert p {margin: 0 0 15px 0; line-height: 14px; padding: 0;}
a.upgrade {float: left; margin: 0 10px 0 0;}
span#ie_alert_reasons {color: #a52003;}