/* CSS Document */

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

* {margin:0; padding:0;}

body {margin:0; background:#a0b9d6 url(images/bg.gif) repeat-x; font-family: Tahoma, Arial, sans-serif; font-size:12px; line-height:14px; color:#003b6d;}

p, h2, h3, ul, blockquote {padding-top:20px; padding-bottom:20px;}

ul, blockquote {padding-left:30px; padding-right:20px;}

a {color:#a29766;}

a:hover {text-decoration:none;}

a img {border-style:none;}

#address p, #footer h2, #footer p {margin:0; padding:0;}

.addtitle {font-weight:bold; color:#003b6d; font-size:11px;}

#footer a {color:#45678f;}

#text p, h2, h3 {padding:10px 25px;}

#text ul, blockquote, ol {padding:15px 55px;}

#forms p, #formsh3 {padding:10px;} #forms ul {margin:0; padding:10px 0 0 10px;} #forms ul li {padding-bottom:5px;}





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

#wrap {width:780px; margin:0 auto; background:url(images/bg-tile.gif) repeat-y; overflow:auto;}

#body {width:780px; background:url(images/bg-header.jpg) no-repeat; overflow:auto}

#text {width:580px; float:right; padding-right:8px; padding-top:91px; padding-bottom:20px; clear:both;}

#address {width:152px; height:106px; font-size:12px; color:#6e6025; line-height:16px; margin-left:23px; padding-bottom:12px; position:relative; margin-top:-123px; clear:left;}

#forms {padding:10px; background-color:#FFF; border:5px solid #155489;	width:142px; margin: 10px 20px 10px 10px; float:right; color:#003b6d; clear:right;}

#forms h3, #forms a {color:#155489; font-weight:bold;}

#footer {width:720px; background:url(images/bg-footer.gif) no-repeat #a0b9d6; padding:30px 30px; text-align:center; color:#45678f; font-size:10px; line-height:16px; clear:both;}



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

h1 {background-repeat: no-repeat; height: 81px; width:360px; text-indent: -999em; margin: 0 0 0 25px; padding:0;}

#address h2 {font-size:11px; color:#003b6d; padding:0 0 20px 0; margin:0;}

h2 {font-size:12px; color:#a29766;}

#text h3 {font-size:12px; font-weight:normal; font-style:inherit; color:#003b6d;}

#footer h2 {color:#003b6d; margin:0; padding:0; font-size:11px;}

h1#logo {

margin: 0;

padding: 0;

background-repeat: no-repeat; 

width: 372px;/* this width reflects the width of the logo image */

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

overflow: hidden; 

text-indent: -999em;} /* hides rich text so only background image shows */



h1#logo a {

display: block; 

height: 176px;/*same height as logo h1*/ 

width: 372px;/*same width as logo h1*/}



/* CLASSES ---------- */

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

.img {margin:-10px 20px 10px 10px; float:right;}

.right {float:right;}

.top  {color:#a29766; font-size:11px; font-weight:bold;}

.hide {display:none;}

.flash {width:580px; height:225px;}

.flashp {color:#000; background-image: url(images/1.jpg); text-align:center; width:530px; height:200px; margin-left:0px; padding-top:20px;}

.block {display:block;}

.listnone {list-style:none;}

.center {text-align:center;}

.left {float:left;}

.clear {clear:both;}

.sub {margin-top:77px;}

.resources {border:5px solid #155489;}



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





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

ul#nav {list-style: none; padding: 0; margin:0 0 0 6px; width:186px; position:absolute; top:324px; z-index:99;}



/*  Sets styles for all links that are inside the ul id="nav" */

#nav a {display: block;height: 30px; overflow: hidden; text-indent:-999em; width:186px}



/* Set the image for each nav item */

#aboutouroffice {background: url(images/nav-about-our-office.jpg); }

#aboutorthodontics {background: url(images/nav-about-orthodontics.jpg); }

#braces101 {background: url(images/nav-braces-101.jpg); }

#emergencycare {background: url(images/nav-emergency-care.jpg); }

#thegameroom {background: url(images/nav-the-game-room.jpg); }

#contactus {background: url(images/nav-contact-us.jpg); }

#home {background: url(images/nav-home.jpg); }



/* 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:-186px 0pt;}



/* Set the cursor to default arrow so link does not appear clickable */

#nav .active {cursor: default}



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

#nav li {display: inline; }

#nav li ul {background: #003b6d; left: -999em; padding: 5px 0 0 0; position: absolute; z-index: 1; }

#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -30px 0 0 176px; color:#FFF;}

#nav ul li a {height:20px; margin: 0; text-decoration: none; width: 192px; text-indent:0; color:#FFF; font-size:11px;	padding-left:10px;}

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













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.button {

float:right;

height:85px;

width:200px}



ul#sesame-games p {

padding-bottom: 1em}







h2.media-center {

background:#000033;

color:#FFF;

margin:0 auto;

padding:5px; width:510px;}

div.media-center {

background:#336699;

color:#FFF;

display:inline-block;

margin:0 auto;

overflow:auto;

padding:10px; width:500px;}

div.media-center a {

color:#FFF;}

div.media-center img {

border:1px solid #FFF;}