/* CSS Document */
/* HTML, BODY ---------- */
* {margin:0; padding:0;}
body {margin:0; background:url(images/tile.jpg) repeat-x #0082d1;}
p, h2, h3, ul, blockquote, ol {padding-bottom:10px; padding-top:10px;}
ul, blockquote, ol {padding-left:30px; padding-right:20px;}
a {color:#0092ce;}
a:hover {text-decoration:none;}
a img {border-style:none;}
#footer a {color:#67bbee;}
input {margin-right:5px;}

/* edit.com visible styles */
BODY, TD, .NormalText { text-decoration: none; font-weight: normal; font-style: normal; color: #000; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 18px; }

.Title		{ color: #0D97D5; font-size: 34px; font-weight: normal; font-family: Times New Roman; line-height: 34px; }
.Header		{ color: #0D97D5; font-size: 20px; font-weight: normal; font-family: Arial; line-height: 20px; }
.Subheader	{ color: #000000; font-size: 15px; font-weight: bold; font-family: Arial; line-height: 18px; }

.Blue		{ color: #0D97D5; }
.Black		{ color: #000000; }
.White		{ color: #FFFFFF; }

.SmallText	{ font-size: 10px; }
.MediumText	{ font-size: 16px; line-height: 16px; }
.LargeText	{ font-size: 24px; line-height: 24px; }

IMG.FloatLeft 	{ float: left; margin: 0 5px 5px 0; }
IMG.FloatRight 	{ float: right; margin: 0 0 5px 5px; }

/* LAYOUT ---------- */
* #wrap {width:801px; margin:0 auto; background:url(images/tile-body.gif) repeat-y; overflow:auto;}
* #body {width:801px; background:url(images/bg-body.jpg) no-repeat; min-height:821px; height:auto !important; height:821px;}
* #content {width:580px; margin:0 0 0 197px; padding:115px 0 10px 0;}
* #sidebar {position:absolute; top:241px; margin:0 0 0 13px; z-index:50; width:160px;}
* #navbox {width:154px; border:1px solid #000; height:280px;}
* #footer {text-align:center; font-size:11px; color:#67bbee; width:611px; padding:15px 95px 20px 95px; margin:0 auto; background:url(images/bg-footer.gif) no-repeat;}
* #patientforms {float:right; clear:right; width:208px; border:2px solid #000; background:#8cceeb; padding: 10px; margin:0 0 10px 50px;}

/* HEADERS ---------- */
h1 {background-repeat: no-repeat; height: 48px; width:315px; text-indent: -999em; margin: 0; padding:0;}
* #content h3 {font-size:15px; }
* #content h2 {color:#0d97d5; font-size:20px; font-weight:normal;}
* #footer h2 {color:#FFF; font-size:11px;}

h1#logo {
margin: 0;
padding: 0;
background-repeat: no-repeat; 
width: 609px;/* this width reflects the width of the logo image */
height: 145px; /* 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: 145px;/*same height as logo h1*/ 
width: 609px;/*same width as logo h1*/}

/* CLASSES ---------- */
* #footer .sesame {color:#034269;}
* .img {margin:0 0 10px 0px; float:right; padding-left:25px;}
* .staff {margin:0 20px 10px 25px; float:right; border:1px solid #000;}
* .imgleft {margin:0 10px 10px 0px; float:left;}
* .right {float:right;}
* .left {float:left;}
* .top  {color:#e4a732; font-size:11px; font-weight:bold;}
* .hide {display:none;}
* .block {display:block;}
* .listnone {list-style:none;}
* .center {text-align:center;}
* .clear {clear:both;}
* .resources {border:1px solid #000;}
* .address {color:#FFF;}
* .blue {color:#67bbee;}
* .breadcrumbs, .breadcrumbs a {color:#0082d1; padding-top:20px; font-weight:bold; text-transform:capitalize;}

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


/* NAVIGATION MAIN ---------- */
ul#nav {list-style: none; padding: 0; margin:0; width:154px; }

/*  Sets styles for all links that are inside the ul id="nav" */
* #nav a {display: block;height: 27px; overflow: hidden; text-indent:-999em; width:154px}

/* Set the image for each nav item */
* #aboutouroffice {background: url(images/nav-about-our-office.gif); }
* #aboutorthodontics {background: url(images/nav-about-orthodontics.gif); }
* #braces101 {background: url(images/nav-braces-101.gif); }
* #emergencycare {background: url(images/nav-emergency-care.gif); }
* #orthodontictechnologies {background: url(images/nav-orthodontic-technologies.gif); }
* #thegameroom {background: url(images/nav-the-game-room.gif); }
* #contactus {background: url(images/nav-contact-us.gif); }
* #home {background: url(images/nav-home.gif); }

/* 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 #orthodontictechnologies, #nav li.sfhover #orthodontictechnologies, 
#nav li:hover #home, #nav li.sfhover #home, 
#nav li:hover #contactus, #nav li.sfhover #contactus {background-position:-154px 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: #0092ce; left: -999em; padding: 10px; position: absolute; z-index: 1; }
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -27px 0 0 154px; color:#FFF;}
#nav ul li a {margin: 0; text-decoration: none;  text-indent:0; color:#FFF; font-size:12px; height:auto;}
#nav ul li a:hover {color:#fef200;}


/* 3rd flyout */


#nav li ul ul {width:160px; left: -999em; padding: 0; position: absolute; z-index:100; padding-left:10px;
padding-bottom:5px; padding-top:5px;
}
#nav li ul li {float:none; display:inline; }
#nav li:hover ul ul, #nav li.sfhover ul ul {left: -999em;
}
#nav li li:hover ul,  #nav li li.sfhover ul {
    left: -17px;
	top:27px;
}

#nav ul li li a {margin: 0; text-decoration: none;  text-indent:0; }


/* BANNERS MAIN ---------- */
ul#banners {list-style: none; padding: 0; margin:0; width:160px; }

/*  Sets styles for all links that are inside the ul id="nav" */
#banners a {display: block; overflow: hidden; text-indent:-999em; }

/* LOGINS NAV ITEMS ---------- */

ul#banners {width:160px; list-style: none; padding:0; margin:0 0 0 0; }

/*  Sets styles for all links that are inside the ul id="nav" */
#banners a {display: block; overflow: hidden; text-indent:-999em; margin-top:8px;}

/* Set the image for each nav item */
* #viewourvideo {background: url(images/banner-video.jpg); width:155px; height:89px;}
* #complimentary {background: url(images/banner-consultation.jpg); width:155px; height:89px;}
* #aao {background: url(images/banner-aao.jpg); width:154px; height:92px;}

/* Set the cursor to default arrow so link does not appear clickable */
* #banners .active {cursor: default}



/* LOGINS NAV ITEMS ---------- */

ul#logins {height: 30px; width:123px; list-style: none; padding:0; margin:18px 0 0 7px; }

/*  Sets styles for all links that are inside the ul id="nav" */
#logins a {display: block;height: 30px; overflow: hidden; text-indent:-999em; width:123px;}

/* Set the image for each nav item */
* #patientlogin {background: url(images/nav-patient-login.gif);}

/* Shift the image position up to show the active state */
#logins a:hover, #logins .active, #logins li:hover, #logins li.sfhover {background-position:-123px 0;}
/* Set the cursor to default arrow so link does not appear clickable */
* #logins .active {cursor: default}

/* CALLOUTS NAV ITEMS ---------- */

ul#callouts {list-style: none; padding:0; position:absolute; top:866px; margin:0 0 0 178px; width:605px;}

/*  Sets styles for all links that are inside the ul id="nav" */
#callouts a {display: block; overflow: hidden; text-indent:-999em; margin-right:6px;}

#callouts li {float:left;}

/* Set the image for each nav item */
* #earlyinterceptivetreatment {background: url(images/banner-early-interceptive-treatment.jpg); width:145px; height:91px;}
* #suresmile {background: url(images/banner-suresmile.jpg); width:144px; height:91px;}
* #ibraces {background: url(images/banner-ibraces.jpg); width:145px; height:91px;}
* #invisalign {background: url(images/banner-invisalign.jpg); width:145px; height:91px;}

/* Set the cursor to default arrow so link does not appear clickable */
* #callouts .active {cursor: default}

div#sesame-game {
background: #000;
line-height: 0;
margin: 10px auto;
text-align: center;
width: 500px; }

ul#sesame-games {
list-style: none;
margin: 0;
padding: 0; width: 500px; }

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}



#content h2.media-center {
background:#000033;
color:#FFF;
margin:0;
padding:5px; width:410px;}
#content div.media-center {
background:#336699;
color:#FFF;
display:inline-block;
margin-bottom:10px;
overflow:auto;
padding:10px; width:400px;}
#content div.media-center a {
color:#FFF;}
#content div.media-center img {
border:1px solid #FFF;}
#content div.media-center h3 {color:#FFF;}


.flash-replaced .alt {
display: block;
width: 0px;
height: 0px;
position: absolute;
overflow: hidden;}



p.small {
font-size: 10px;}
img.photo {
border: solid 1px #000;
float: right;
margin: 0 0 15px 15px;}
div.learn-more {
background-color: #fff;
color: #036;
width: 50%;
border: solid 1px #fff;
padding: 0;
margin: 15px 18px 15px 15px;
float: right;}
div.learn-more a {color: #036;}
.learn-more h3 {
background-color: #97AFC2;
color: #fff;
margin: 0 0 10px 0;
padding: 10px;}
.learn-more p {
padding: 0;
margin: 0 0 10px 0;}
* .clear {clear: both;}
* #flash-suresmile-pt-testimonial {
margin: 15px auto;
width: 320px;
height: 206px;
border: solid 1px #ccc;}

img.right {
	float: right;
	clear: right;
	margin: 0 0 10px 10px;
	}
#social { width:125px; float:right; margin-top:10px ;}