/* Layout */

body {background: url(images/bg_pattern.gif) repeat; margin: 0 0 20px 0; text-align: center; font: 12px Tahoma, Verdana, Arial; color: #245557;}

#container {background: #c5ad65; width: 746px; margin: 0 auto; padding: 10px; border: solid 2px #e3e7a6; border-width: 0 2px 2px 2px; text-align: left; position: relative;}

#header {margin-bottom: 8px;}

#logo {margin: 0; float: left;}

#banner {margin: 0 0 0 10px;}

#wrap {background: url(images/wrap_bg.gif) repeat-y; margin-bottom: 10px;}

#content_wrap {background: #e3e7a6; width: 573px; padding: 0; margin: 0; position: relative; left: 169px; border: solid 2px #397e7b; border-width: 2px 2px 0 2px; min-height: 340px;}

* html #content_wrap {height: 340px;}

#content {margin: 10px; line-height: 18px;}

#address {margin: 10px;}

#footer {background: #e3e7a6; text-align: center; clear: both; padding: 5px 0;}

.clear {clear: both;}

.wrap_border {border: solid 2px #397e7b;}

img {border: 0; display: inline;}

.sidebar {background: #cfc3ad; width: 105px; display: block; text-align: center; border: solid 1px #013366; float: right; margin: 5px 0 15px 15px; padding: 5px;}

p {margin: 0 0 10px 0;}



/* Flash Elements */

#flash {background: url(images/flash_bg.jpg); float: right; width: 295px; height: 292px; margin: 0 0 0 10px;}

p.upgrade {width: 183px; background: url(images/get_flash_player.gif) no-repeat 5; background-color: #FFCC00; font-size: 10px; text-align: left; margin: 0 auto; padding: 5px 5px 5px 105px; border: solid 1px #000;}

#slideshow {margin: 0 auto; width: 400px;}

#know-teeth {margin: 0 auto; width: 500px;}

#flash-smile-gallery {margin: 0 auto; width: 500px;}



/* Links */

a {color: #245557;}

a:hover {text-decoration: none;}



/* Images */

.img_right {border: 0; margin: 5px 0 15px 15px; float: right; clear: right;}

.img_center {margin: 0 auto; display: block;}

.img_center_border {border: solid 1px #245557; margin: 0 auto; margin-bottom: 10px; display: block;}

.img_right_border {border: solid 1px #245557; margin: 5px 0 15px 15px; float: right; display: inline;}

.img_left_border {border: solid 1px #245557; margin: 5px 15px 15px 0; float: left; display: inline;}



/* Lists */

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



/* Headings */

h1 {background: #245557; width: 553px; margin: 0; font: normal 20px Tahoma, Verdana, Arial; color: #e3e7a6; padding: 5px 10px;}

h2 {font-size: 18px; margin: 0 0 5px 0;}

h3 {font-size: 12px; font-weight: bold; margin: 10px 0 3px 0;}



/* Top Navigation */

#top_nav {position: absolute; z-index: 1; top: 12px; right: 12px; margin: 0;}

#top_nav a {display: block; text-decoration: none; text-indent: -999em; overflow: hidden; height: 36px;}

#pt_login, #dt_login, #contact, #index {height: 36px; float: left;}

#pt_login {background: url(images/nav/patient_login.jpg); width: 89px;}

#dt_login {background: url(images/nav/doctor_login.jpg); width: 95px;}

#contact {background: url(images/nav/contact.jpg); width: 80px;}

#index {background: url(images/nav/home.jpg); width: 54px;}

#top_nav li.active,

#pt_login:hover, li.Hsfhover#pt_login,

#dt_login:hover, li.Hsfhover#dt_login,

#contact:hover, li.Hsfhover#contact,

#index:hover, li.Hsfhover#index {background-position: 0 -36px;}

#top_nav li.active {cursor: default;}



#top_nav, #top_nav ul {list-style: none; margin: 0; padding: 0;}

#top_nav li {display: inline;}

#top_nav li ul {left: -9999px; position: absolute; z-index: 2;}

#top_nav li:hover ul, #top_nav li.Hsfhover ul {left: auto; margin-top: 0;}

#top_nav ul li a {background: #c5ad65; border: solid 1px #342f3f; border-width: 0 1px 1px 1px; color: #fff; height: 18px; line-height: 18px; padding: 2px 0 2px 10px; width: 145px; text-indent: 0;}

#top_nav ul li a:hover {background: #245557; color: #fff; text-decoration: none;}



/* Side Navigation */

#nav {background-color: #fff; width: 155px; border: solid 2px #397e7b; border-width: 2px 2px 0 2px; margin: 0; padding: 10px 0; position: absolute; z-index: 3;}

#nav a {display: block; text-decoration: none; text-indent: -999em; overflow: hidden;}



#our_office {background: url(images/nav/our_office.gif);}

#new_patients {background: url(images/nav/new_patients.gif);}

#reg_checkups {background: url(images/nav/reg_checkups.gif);}

#teeth_101 {background: url(images/nav/teeth_101.gif);}

#improve_smile {background: url(images/nav/improve_smile.gif);}

#invisalign {background: url(images/nav/invisalign.gif);}

#games {background: url(images/nav/fun_games.gif);}

#site_map {background: url(images/nav/site_map.gif);}



#nav a {width: 155px; height: 25px;}

#nav a:hover, #nav a.active,

#nav li:hover #our_office, #nav li.sfhover #our_office,

#nav li:hover #new_patients, #nav li.sfhover #new_patients,

#nav li:hover #teeth_101, #nav li.sfhover #teeth_101,

#nav li:hover #improve_smile, #nav li.sfhover #improve_smile,

#nav li:hover #games, #nav li.sfhover #games {background-position: 0 -25px;}

#nav a.active {cursor: default;}



/* Drop Down */

#nav ul {line-height: 1; list-style: none; margin: 0; padding: 0; border: 0;}

#nav li {display: inline;}

#nav li ul {background: #e3e7a6; border: solid 2px #397e7b; font-size: 12px; color: #071e68; left: -9999px; position: absolute; z-index: 4; padding: 3px;}

#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -27px 0 0 155px;}

#nav ul li a {color: #071e68; padding: 2px 0 2px 10px; width: 150px; height: 18px; line-height: 18px; text-indent: 0;}

#nav ul li a:hover {background: #fff;}

