@charset "utf-8";
/* CSS Document */


.flash-replaced .alt {/*JQUERY STYLE - sets size of container to 0 to hide alternative content*/
 display: block;height: 0px;position: absolute;overflow: hidden;width: 0px;}
 
/* HTML, BODY ---------- */
* {margin:0; padding:0;}
body {margin:0; background:#2f5667 url(../images/tile.jpg) repeat-x; font-family: Arial, Helvetica, sans-serif; font-size:13px; line-height:20px; color:#555454;}
p, h2, h3, ul, blockquote, ol {padding-bottom:10px; padding-top:10px;}
ul, blockquote, ol {padding-left:30px; padding-right:10px; padding-top:10px;}
a {color:#3e76ad; }
a:hover {text-decoration:none;}
a img {border-style:none;}
#footernav a {color:#427dab; }
p.breadcrumbs, .breadcrumbs a {font-size:12px; font-weight:bold; color:#0a497b; clear:both;}


/* LAYOUT ---------- */
#wrap {width:990px; margin:0 auto; background:url(../images/tile-body.jpg) repeat-y; position:relative;}
#body {width:990px; background:url(../images/bg-body.jpg) no-repeat; min-height:750px; height:auto !important; height:750px;}
#address {width:500px; padding:12px 0 0 0; font-size:12px; line-height:12px; color:#FFF;}
#content {width:700px; margin-left:253px; clear:both;  min-height: 750px;}
.body-home #content {min-height: 470px;}
#footerwrap {width:100%; background:url(../images/tile-footer.jpg) repeat-x #0a497b;}
#footer {color:#427dab; width:990px; /*padding:51px 118px 30px 0;*/ background:url(../images/bg-footer.jpg) no-repeat; background-position:0px 0px;  line-height:18px; clear: both; margin:0 auto;}
#logos {float:left; width:auto; text-align:center; clear:both; margin:40px 0px 0px 120px;}
#logos ul{ list-style-type:none;}
#logos ul li{float:left; margin: 0px 10px 0px 10px;}
#footer p{margin:0px 0px 0px 20px; text-align:center;}



/* BANNERS ---------- */
#callout-form {position:absolute; z-index:3; top:577px; margin-left:29px; }
#callout-invisalign {position:absolute; z-index:3; top:751px; margin-left:29px; }
#callout-consultation {position:absolute; z-index:3; top:672px; margin-left:29px; }
#callout-blog {position:absolute; z-index:3; top:760px; margin-left:29px; }
#callout-rewards {position:absolute; z-index:3; top:849px; margin-left:29px; }
#social{ position:absolute; z-index:3; top:965px; margin-left:29px; width:160px; text-align:center; }

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

h1 {background-repeat: no-repeat; height: 60px; width:318px; text-indent: -999em; margin: 0; padding:0; background-position: bottom;}
h1.replaced {overflow: hidden; text-indent: -999em; background-repeat: no-repeat; background-position: 0 0}
h1.jcir {font-size: 35px; margin: 40px 0 0 0;}

h1#logo {
margin: 0;
padding: 0 0 40px 0;
background-repeat: no-repeat; 
width: 990px;/* 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: 990px;/*same width as logo h1*/}

#content h2 {color:#0a497b; font-size:15px;}
#content h3 {color:#74a7c9; font-size:13px;}
#footer h2 {color:#FFF; font-size:13px;}
#address h2 {margin:0; padding:0 8px 0 0; color:#050505; font-size:12px; float:left; text-align:right; width:94px;}

/* CLASSES ---------- */
#footer .sesame {color:#959696; font-weight:bold; font-size:13px;}
.img {float:right; padding:0 10px 0 0;}
.right {float:right;}
.left {float:left;}
.imgleft {float:left; margin:0 20px 10px 0;}
.hide {display:none;}
.flashhome {width:611px; height:333px;  margin-left:285px; clear:both; background:url(../images/1.jpg) }
.block {display:block;}
.listnone {list-style:none;}
.center {text-align:center;}
.clear {clear:both;}
.marginnone {margin:0; padding:0;}
.resources {padding:7px; background:#FFF; border:3px solid #0b6da0;}

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


/* NAVIGATION MAIN ---------- */
ul#nav {list-style: none; padding: 0; margin:0 0 0 17px; width:183px; position:absolute; z-index:240; top:254px;}

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

/* Set the image for each nav item */
#meettheorthodontist {background: url(../images/nav-meet-the-orthodontist.jpg); }
#meetourteam {background: url(../images/nav-meet-our-team.jpg); }
#yourfirstvisit {background: url(../images/nav-your-first-visit.jpg); }
#home {background: url(../images/nav-home.jpg); }
#inovationbraces {background: url(../images/nav-in-ovation-braces.jpg); }
#invisalign {background: url(../images/nav-invisalign.jpg); }
#adulttreatment {background: url(../images/nav-adult-treatment.jpg); }
#commonproblems {background: url(../images/nav-common-problems.jpg); }
#treatmenttiming {background: url(../images/nav-treatment-timing.jpg); }
#smilegallery {background: url(../images/nav-smile-gallery.jpg); }
#officetour {background: url(../images/nav-office-tour.jpg); }
#financialinformation {background: url(../images/nav-financial-information.jpg); }
#blog {background: url(../images/nav-blog.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 #meettheorthodontist, #nav li.sfhover #meettheorthodontist, 
#nav li:hover #meettheteam, #nav li.sfhover #meettheteam, 
#nav li:hover #home, #nav li.sfhover #home, 
#nav li:hover #yourfirstvisit, #nav li.sfhover #yourfirstvisit, 
#nav li:hover #inovationbraces, #nav li.sfhover #inovationbraces, 
#nav li:hover #invisalign, #nav li.sfhover #invisalign, 
#nav li:hover #adulttreatment, #nav li.sfhover #adulttreatment, 
#nav li:hover #treatmenttiming, #nav li.sfhover #treatmenttiming, 
#nav li:hover #smilegallery, #nav li.sfhover #smilegallery, 
#nav li:hover #officetour, #nav li.sfhover #officetour,
#nav li:hover #financialinformation, #nav li.sfhover #financialinformation,
#nav li:hover #blog, #nav li.sfhover #blog,
#nav li:hover #commonproblems, #nav li.sfhover #commonproblems {background-position:-183px 0px;}

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

/* NAVIGATION LOGINS ---------- */
ul#logins {list-style: none; padding: 0; margin:0 0 0 640px; width:327px; position:absolute; z-index:69; top:0px;}
#logins li {float:left}
/*  Sets styles for all links that are inside the ul id="nav" */
#logins a {display: block;height: 40px; overflow: hidden; text-indent:-999em; }

/* Set the image for each nav item */
#contactus {background: url(../images/nav-contact-us.jpg); width:164px}
#patientlogin {background: url(../images/nav-patient-login.jpg); width:163px}


/* Shift the image position up to show the active state */
#logins a:hover, #logins .active, #nav li:hover, #logins li.sfhover, 
#logins li:hover #patientlogin, #logins li.sfhover #patientlogin, 
#logins li:hover #contactus, #logins li.sfhover #contactus {background-position:0px -40px ;}

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




ul#sitemap {list-style:circle;}
#sitemap li a {background:none; text-decoration:underline}
#sitemap li a:hover {text-decoration:none;}



/* IN-OVATION */

img.right {
float:right;
margin:0 0 10px 10px;}
.clear {
clear:both;}
h2.media-center {
background:#000033;
color:#FFF;
margin:0;
padding:5px;}
div.media-center {
background:#336699;
color:#FFF;
margin-bottom:10px;
padding:10px;}
div.media-center a {
color:#FFF;}
div.media-center img {
border:1px solid #FFF;}
.flash {
border: solid 1px #ccc;}
#flash-in-ovation {
width: 320px;
height: 266px;}

#logotable {width:60%; border:none; padding:10px;}
#logotable td {padding:10px;background:#FFF; border:2px solid #0b6da0; width:50%; text-align:center; }
#logotable a {min-height:50px; height:auto !important; height:50px;}

.left {
	float: left;
	margin: 0 10px 10px 0;
	}
img.right {
	float: right;
	margin: 0 0 10px 10px;
	}
img.right-border {
	float: right;
	clear: right;
	margin: 0 0 10px 10px;
	border: solid 1px #333;
	}
.clear {
	clear: both;
	}
#damon-bracket {
	display: block;
	margin: 0 auto 10px auto;
	}
#damon-wrap {
	width: 400px;
	margin: 0 auto;
	}
#damon-left {
	float: left;
	width: 175px;
 	margin-right: 20px;
	}
#damon-right {
	float: left;
	width: 170px;
	}
#flash-damon-system-comparison {
	margin: 10px auto;
	width: 250px;
	display: block;
	}
#video-the-damon-system {
	margin: 0 15px 15px 0;
	width: 280px;
	height: 246px;
	float: left;
	clear: left;
	}
#video-the-damon-system-2 {
	margin: 0 15px 15px 0;
	width: 400px;
	height: 330px;
	float: left;
	clear: left;
	}
p.flash_notice {
	margin: 18px;
	padding: 9px;
	color: #ff0000;
	border: 1px dotted #ff0000;
	background: #ffffff;
	text-align: center;
	}
	
	
	
	
	
	/* Reset */
#pro-pack {
  position: relative;
  font-size: inherit;
  line-height: inherit;
}
#pro-pack img {display: block;}
#pro-pack a, #pro-pack img, #pro-pack object {
  border:none; 
  outline:none;
}

/* Global Styles ------------------- */
#pro-pack .border {
  border: solid 1px #333; /* Customize me!! */
}
#pro-pack .right {
  float: right;
  margin: 0 0 20px 20px;
}
#pro-pack .left {
  margin: 0 20px 20px 0;
  float: left;
}
#pro-pack .img-right {
  margin: 0 0 20px 20px;
  float: right;
  clear: right;
}
#pro-pack .img-left {
  margin: 0 20px 20px 0;	
  float: left;
  clear: left;
}
#pro-pack p.flash_notice {
  margin: 18px;
  padding: 9px;
  color: #ff0000;
  border: 1px dotted #ff0000;
  background: #ffffff;
  text-align: center;
}

/* Main Invisalign page ----------------- */
#pro-pack #video-invisalign {
  width: 360px; 
  height: 266px;
  display: block;
}

/* Invisalign Videos ------------------- */
#pro-pack div.invisalign-flash {
  background: url(/sesame_media/images/invisalign-pro-package/invisalign-video-bg.jpg) no-repeat;
  width: 450px;
  height: 250px;
  border: solid 1px #333; /* Customize me!! */
  margin-bottom: 20px;
}
#pro-pack div.invisalign-flash img {
  margin: 30px 50px 0;
  float: right;
}
#pro-pack .bump-right {
  margin-right: 5px;
}
#pro-pack #video-invisalign-best-friends, #pro-pack #video-invisalign-news-travels-fast {
  width: 320px;
  height: 206px;
  display: block;
  margin-bottom:25px;
}
#pro-pack #video-invisalign-lobby {
  width: 320px; 
  height: 266px;
  display: block;
}


/* Clear Fix --------------------- */
.clear {clear: both;}
.cf:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.cf {display: inline-block;} /*this trips hasLayout for ie7*/
.cf {display: block;} /*this returns it back to normal*/
* html .cf {height: 1px;}