/* Reset */
* {margin: 0; padding: 0; border: 0; outline: none;}

/* Layout */
body {background-color: #fff;}
#header-wrap {background-color: #cdecff; height: 136px;}
#header {background: url(../images/banner-bg.jpg) no-repeat center; width: 1024px; margin: 0 auto; position: relative;}
#content {width: 800px; margin: 0 auto; padding: 25px 0;}
#footer-wrap {background-color: #cdecff; height: 132px; border: solid 1px #00a650; border-width: 1px 0; clear: both;}
#footer {background: url(../images/footer-bg1.jpg) no-repeat center; width: 1024px; height: 103px; padding: 15px 0; margin: 0 auto;}
.left {float: left;}
.right {float: right;}
hr {background-color: #00a650; color: #00a650; height: 1px; margin: 10px 0; _margin: 5px 0;}
.sidebar {background: #fff; width: 300px; display: block; border: solid 1px #1f4284; float: right; clear: right; margin: 5px 0 15px 15px; padding: 10px;}
.sidebarleft {background: #fff; width: 300px; display: block; border: solid 1px #1f4284; float: left; clear: left; margin: 5px 15px 15px 0; padding: 10px;}

/* Typo */
body {font-size: 100%;}
#content {font-size: .88em; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif, Times, serif; color: #002a5c; line-height: 1.29em; font-weight: normal;}
#footer {font-size: .75em; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif, Times, serif; text-align: center; color: #00b6e8;}
.text-nav {font-size: .83em; margin: 0;}
p {margin: 0 0 10px;}

/* Links */
a, .text-nav a, #footer a {color: #00b6e8;}
a:hover, .text-nav a:hover, #footer a:hover {color: #ee3030;}
#sesame {font-size: .83em;}
.sub_nav a:hover, .sub_nav a.active {color: #ee3030;}

/* Images */
.img-left {border: 0; margin: 5px 15px 15px 0; float: left; clear: left;}
.img-right {border: 0; margin: 5px 0 15px 15px; float: right; clear: right;}
.img-left-border {border: solid 1px #cdecff; margin: 5px 15px 15px 0; float: left; clear: left;}
.img-right-border {border: solid 1px #cdecff; margin: 5px 0 15px 15px; float: right; clear: right;}
.img-center-border {border: solid 1px #cdecff; margin: 10px auto; display: block;}
.photo {border: solid 1px #cdecff; margin: 5px 0 15px 15px; float: right; clear: right;}
#logos {float: left; margin-top: 30px;}
.border {border: solid 1px #cdecff;}

/* Lists */
ul, ol {margin: 0 0 10px 25px;}
dl.logos, dl.logos dt, dl.logos dd {list-style: none; margin: 0; padding: 0;}
dl.logos {border: 1px solid #CCC; border-width: 0 0 1px 1px; margin: 10px 0 5px 0; padding: 10px 0 5px 10px; width: 80%;}
dl.logos dd {margin-bottom: 10px; padding: 10px 0 5px 0;}
dl.logos span {font-size: 14px; font-weight: bold; line-height: normal;}

/* Headings */
h1 {font-size: 2.14em; font-family: Georgia, "Times New Roman", Times, serif; line-height: 1.14em;}
h2.welcome {font-size: 1.21em; font-family: Georgia, "Times New Roman", Times, serif; font-style: italic;}
h2 {font-size: 1.29em; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight: normal; margin: 0 0 10px;}
h3 {font-size: 1em; margin: 0; font-weight: bold;}
h4 {font-size: 1em; text-align: center;}


/* Flash */
.flash {width: 500px; margin: 10px auto;}
.upgrade {width: 80%; background: #e4e4e4; font-size: .83em; text-align: left; margin: 50px auto; padding: 5px; border: solid 1px #000; overflow: auto;}
.flash-replaced .alt {display: block; height: 0px; position: absolute; overflow: hidden; width: 0px;}
#flash-banner {width: 912px; height: 136px; margin-left: 110px;}
#flash-home {float: left; margin: 20px 50px 20px 25px; _margin: 10px 25px 10px 12px;}
#flash-palatal-expander {border: solid 1px #1f4284; width: 200px; height: 150px;}


/* Top Links */
#top-nav {width: 268px; top: 102px; right: 100px; list-style: none; position: absolute; z-index: 2;}
#top-nav li {display: inline; float: left;}
#top-nav a {height: 34px; display: block; text-decoration: none; text-indent: -999em; overflow: hidden;}
#top-nav a:hover, #top-nav a.active, #top-nav li:hover, #top-nav lisfhover2, li:hover #contact-us, li.sfhover2 #contact-us {background-position: 0 -34px;}

#pt-login {background: url(../images/nav/pt-login.gif); width: 112px;}
#home {background: url(../images/nav/home.gif); width: 62px;}
#contact-us {background: url(../images/nav/contact-us.gif); width: 94px;}

/* Drop Down */
#top-nav li ul {background: #CDECFF; border: solid 1px #00a650; margin: 0; padding: 1px 1px 0 1px; left: -9999px; position: absolute; z-index: 3;}
#top-nav ul li {float: none;}
#top-nav li:hover ul, #top-nav li.sfhover2 ul {left: auto; margin: 0;}
#top-nav ul li a {font: bold 12px "Trebuchet MS", Arial, Helvetica, sans-serif; color: #002a5c; height: 18px; line-height: 18px; display: block; margin-bottom: 1px; padding: 4px 0 4px 10px; width: 170px; text-indent: 0; text-decoration: none;}
#top-nav ul li a:hover {color: #ee3030;}

/* Navigation */
#nav-wrap {background-color: #cdecff; height: 30px; border: solid 1px #00a650; border-width: 1px 0;}
#nav {width: 1024px; padding: 0; margin: 0 auto; height: 30px; list-style: none;}
#nav li {display: inline; float: left;}
#nav a {display: block; text-decoration: none; text-indent: -999em; overflow: hidden; height: 30px;}

#what-sets-us-apart {background: url(../images/nav/what-sets-us-apart.gif); width: 167px;}
#community {background: url(../images/nav/community.gif); width: 101px;}
#about-our-office {background: url(../images/nav/about-our-office.gif); width: 128px;}
#for-new-patients {background: url(../images/nav/for-new-patients.gif); width: 132px;}
#invisalign {background: url(../images/nav/invisalign.gif); width: 99px;}
#about-orthodontics {background: url(../images/nav/about-orthodontics.gif); width: 137px;}
#emergency-care {background: url(../images/nav/emergency-care.gif); width: 120px;}
#the-game-room {background: url(../images/nav/the-game-room.gif); width: 133px;}

#nav a:hover, #nav li.active a, #nav li:hover, #nav lisfhover,
li:hover #about-our-office, li.sfhover #about-our-office,
li:hover #for-new-patients, li.sfhover #for-new-patients,
li:hover #about-orthodontics, li.sfhover #about-orthodontics {background-position: 0 -30px;}
#nav .active {cursor: default;}

/* Drop Down */
#nav li ul {background: #CDECFF; border: solid 1px #00a650; margin: 0; padding: 1px 1px 0 1px; left: -9999px; position: absolute; z-index: 3;}
#nav ul li {float: none;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: 0;}
#nav ul li a {font: bold 12px "Trebuchet MS", Arial, Helvetica, sans-serif; color: #002a5c; height: 18px; line-height: 18px; display: block; margin-bottom: 1px; padding: 4px 0 4px 10px; width: 170px; text-indent: 0; text-decoration: none;}
#nav ul li a:hover {color: #ee3030;}

.clear {clear: both;}

/* The Game Room */
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: block;}
ul#sesame-games img {border: 0; margin: 0 0 10px 10px;}
ul#sesame-games a img {float:right; clear: right; height:85px; width:200px;}
ul#sesame-games p {padding-bottom: 1em;}
