* { margin: 0; outline: none; padding: 0; }

body { background: #A2BEA5 url(images/bg.jpg) repeat-x; }



/* - - - - - - - - - - TEXT - - - - - - - - - - */

body, form, input, textarea { color: #222; font-family: verdana, sans-serif; font-size: 12px; }



BODY, TD, .NormalText { font-weight: normal; text-decoration: none; font-style: normal; color: #222; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; }



.Title		{ color: #2E7F3D; font-family: Georgia, Verdana, sans-serif; font-size: 24px; font-weight: normal; line-height: 24px; }

.Header		{ color: #222222; font-family: Verdana, sans-serif; font-size: 14px; font-weight: bold; }

.Subheader	{ color: #222222; font-family: verdana, sans-serif; font-size: 12px; font-weight: bold; }



.LightGreen	{ color: #2E7F3D; }

.Green		{ color: #22522F; }

.Black		{ color: #000000; }



.SmallText	{ font-size: 10px; }

.MediumText	{ font-size: 16px; line-height: 16px; }

.LargeText	{ font-size: 24px; line-height: 24px; }
.clear { clear:both}


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

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

 

TABLE.GreenBottomBorder TD { border-bottom: 1px solid #22522F; padding: 20px 0; }

TD.GreenBorderBottom { border-bottom: 1px solid #22522F; padding: 20px 0; }



div.hr { background: #22522F; clear: both; height: 1px; margin: 30px 0; width: 100%; }

div.hr hr { display: none; }

p { color: #222; line-height: 18px; margin: 10px 0; }

p.big { clear: left; padding: 10px 0; }

p.breadcrumbs { color: #222; font-size: 10px; line-height: 10px; }

p.top-link { clear: both; font-size: 11px; line-height: 14px; text-align: right; }

ul.sitemap { font-size: 12px; line-height: 12px; list-style: disc; margin: 10px 20px; }

ul.sitemap li { margin: 10px 0; }

ul.sitemap ul { font-size: 12px; line-height: 12px; list-style: circle; margin: 10px 30px; }

ul.sitemap ul li { margin: 10px 0; }

.flash p { background: #F00; border: 1px dotted #FFF; color: #FFF; line-height: 18px; padding: 10px; }

#content ol { clear: left; font-size: 11px; line-height: 12px; list-style: decimal; margin: 10px 40px; }

#content ol li { margin: 10px 0; }

#content ol li ol { clear: left; line-height: 12px; list-style: upper-alpha; margin: 10px 30px; }

#content ol li ol li { margin: 10px 0; }

#content ul { clear: left; font-size: 11px; line-height: 12px; list-style: disc; margin: 10px 40px; }

#content ul li { margin: 10px 0; }

#content ul li ul { clear: left; line-height: 12px; list-style: circle; margin: 10px 30px; }

#content ul li ul li { margin: 10px 0; }

#footer p { color: #505050; font-size: 11px; line-height: 14px; }

#footer p.text-nav { color: #2D7E3D; font-size: 10px; }

#subnav ul { color: #2D7E3D; font-size: 11px; line-height: 16px; list-style: disc; margin: 0 0 50px 15px; }

ul#home-page-list { font-size: 12px; line-height: 12px; list-style: none; margin: 10px 0; padding: 0; width: 520px; }

ul#home-page-list li { color: #2D7E3D; display: inline; float: left; margin: 5px 0; width: 260px; }



/* - - - LINKS - - - */

a { color: #2D7E3D; text-decoration: underline; }

a:hover { text-decoration: none; }

p.big a { color: #FF7C00; font-size: 14px; font-weight: bold; }

p.breadcrumbs a { color: #2D7E3D; font-size: 10px; line-height: 10px; text-decoration: none; }

p.breadcrumbs a:hover { text-decoration: underline; }

p.top-link a { color: #2D7E3D; text-decoration: none; }

p.top-link a:hover { color: #2D7E3D; text-decoration: underline; }

.flash a { color: #FFF; font-weight: bold; }

#footer a { color: #2D7E3D; text-decoration: none; }

#footer a:hover{ text-decoration: underline; }

#subnav ul li a { background: none; text-decoration: none; }

#subnav ul li a:hover { text-decoration: underline; }

#subnav ul li.active a { font-weight: bold; }



/* - - - HEADERS - - - */

h1 { background: no-repeat; height: 50px; margin-bottom: 20px; overflow: hidden; text-indent: -9999px; }

h1.sidebar { background: no-repeat; clear: both; height: 30px; margin: 0; overflow: hidden; text-indent: -9999px; }

h2 { color: #222; font-family: verdana, sans-serif; font-size: 14px; margin: 10px 0; }

h3 { color: #222; font-family: verdana, sans-serif; font-size: 12px; margin: 10px 0; }

h4 { color: #505050; font-family: verdana, sans-serif; font-size: 11px; font-weight: normal; margin: 5px 0; }



/* - - - - - - - - - - IMAGES - - - - - - - - - - */

img { border: 0; display: block; }

img.center { clear: both; margin: 0 auto 20px; }

img.left { clear: left; float: left; margin: 0 20px 20px 0; }

img.left-nofloat { clear: left; margin: 0 20px 20px 0; }

img.right { clear: right; float: right; margin: 0 0 20px 20px; }

img.auto { clear: right; float: right; margin: 0 0 20px 20px; }

img.center, img.left, img.left-nofloat, img.right, img.auto { border: #20512D 1px solid; }

* .flash img { float: right; padding: 20px 10px; }

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

* .map { border: #20512D 1px solid; margin-bottom: 20px; }



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

* #container { background: #FFF url(images/content-bg.jpg) repeat-y; margin: 0 auto; width: 780px; }

* #container-shadow { background: url(images/shadow-bg.png) repeat-y; margin: 0 auto; padding: 0 20px; width: 780px; }

* #content { float: left; padding: 30px; width: 520px; }

* #header { clear: both; display: block; width: 780px; position:relative }

* #header #logo { float: left; }
* #social { position:absolute; top:220px; left:80px;}
* #flash-home { background: url(images/flash-bg.jpg) no-repeat; position:relative;float:left;width:486px;height:292px;}

* #flash-brace-painter { border: #20512D 1px solid; height: 430px; width: 500px; }

* #flash-office-tour, * #flash-wilckodontics, * #flash-surgical-orthodontics { border: #20512D 1px solid; height: 375px; width: 500px; }

* #footer { background: #FFF; border-top: #20512D 1px solid; clear: both; padding: 20px 0; text-align: center; width: 780px; }

* #sidebar { float: left; padding: 30px 18px; width: 160px; }

* #in-ovation-comparison { border: 1px solid #20512D; display: inline-block; overflow: auto; padding: 5px; }

* #in-ovation-comparison p { margin: 0; }

* #in-ovation-comparison img.left { border: none; clear: left; float: left; margin: 0 10px 50px 0; }

* #in-ovation-comparison .float { float: left; width: 49%; }



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

#header-slideshow {background:url(images/header-slides-bg.jpg) no-repeat;position:relative;float:left;width:486px;height:292px;overflow:hidden;}

#header-slideshow img{position:absolute;top:0;left:0;z-index:8;opacity:0.0;}

#header-slideshow img.active {z-index:10;opacity:1.0;}

#header-slideshow img.last-active {z-index:9;}



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

* #nav { clear: both; width: 780px; }

#nav ul { list-style: none; width: 780px; }

#nav li { float: left; }

#nav a { display: block; height: 47px; overflow: hidden; text-indent: -9999px; }



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

a#meet-us { background: url(images/nav/meet-us.jpg); width: 76px; }

a#new-patients { background: url(images/nav/new-patients.jpg); width: 87px; }

a#for-our-patients { background: url(images/nav/for-our-patients.jpg); width: 87px; }

a#about-orthodontics { background: url(images/nav/about-orthodontics.jpg); width: 119px; }

a#braces-101 { background: url(images/nav/braces-101.jpg); width: 80px; }

a#special-treatments { background: url(images/nav/special-treatments.jpg); width: 109px; }

a#fun { background: url(images/nav/fun.jpg); width: 57px; }

a#contact-us { background: url(images/nav/contact-us.jpg); width: 87px; }

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



/* - - - NAVIGATION ROLLOVER EFFECTS - - - */

#nav ul li a:hover, #nav ul li.active a { background-position: 0 -47px; }

#nav ul li:hover #meet-us, #nav ul li.sfhover #meet-us,

#nav ul li:hover #new-patients, #nav ul li.sfhover #new-patients,

#nav ul li:hover #for-our-patients, #nav ul li.sfhover #for-our-patients,

#nav ul li:hover #about-orthodontics, #nav ul li.sfhover #about-orthodontics,

#nav ul li:hover #braces-101, #nav ul li.sfhover #braces-101,

#nav ul li:hover #special-treatments, #nav ul li.sfhover #special-treatments,

#nav ul li:hover #fun, #nav ul li.sfhover #fun,

#nav ul li:hover #contact-us, #nav ul li.sfhover #contact-us { background-position: 0 -47px; }



/* - - - SUBNAVIGATION - - - */

#nav ul li ul { background: #20512D; left: -9999px; list-style: none; padding: 5px 0; position: absolute; z-index: 1; width: 170px; }

#nav ul li:hover ul, #nav ul li.sfhover ul { left: auto; }

#nav ul li ul li { float: none; }

#nav ul li ul li a { display: block; height: 19px; line-height: 19px; overflow: hidden; text-indent: -9999px; width: 170px; }

#nav ul li.active ul li a { background-position: 0 0; }



/* - - - SUBNAVIGATION IMAGES - - - */

a.meet-the-doctors { background: url(images/nav/meet-the-doctors.jpg); }

a.meet-the-team { background: url(images/nav/meet-the-team.jpg); }

a.office-tour { background: url(images/nav/office-tour.jpg); }

a.our-philosophy { background: url(images/nav/our-philosophy.jpg); }

a.your-first-visit { background: url(images/nav/your-first-visit.jpg); }

a.financial-info { background: url(images/nav/financial-info.jpg); }

a.patient-forms { background: url(images/nav/patient-forms.jpg); }

a.patient-comments { background: url(images/nav/patient-comments.jpg); }

a.oral-care-video { background: url(images/nav/oral-care-video.jpg); }

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

a.expander-video { background: url(images/nav/expander-video.jpg); }

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

a.orthodontic-faq { background: url(images/nav/orthodontic-faq.jpg); }

a.sample-patients-video { background: url(images/nav/sample-patients-video.jpg); }

a.for-children { background: url(images/nav/for-children.jpg); }

a.for-adults { background: url(images/nav/for-adults.jpg); }

a.two-phase-treatment { background: url(images/nav/two-phase-treatment.jpg); }

a.ortho-dictionary { background: url(images/nav/ortho-dictionary.jpg); }

a.links { background: url(images/nav/links.jpg); }

a.life-with-braces { background: url(images/nav/life-with-braces.jpg); }

a.brace-types-video { background: url(images/nav/brace-types-video.jpg); }

a.appliances-video { background: url(images/nav/appliances-video.jpg); }

a.braces-diagram { background: url(images/nav/braces-diagram.jpg); }

a.retainers { background: url(images/nav/retainers.jpg); }

a.wilckodontics { background: url(images/nav/wilckodontics.jpg); }

a.tmjtmd { background: url(images/nav/tmjtmd.jpg); }

a.surgical-orthodontics { background: url(images/nav/surgical-orthodontics.jpg); }

a.invisalign { background: url(images/nav/invisalign.jpg); }

a.sleep-apnea { background: url(images/nav/sleep-apnea.jpg); }

a.in-ovation { background: url(images/nav/in-ovation.jpg); }

a.incognito { background: url(images/nav/incognito.jpg); }

a.ibraces { background: url(images/nav/ibraces.jpg); }

a.dentofacial-orthopedics { background: url(images/nav/dentofacial-orthopedics.jpg); }

a.locations { background: url(images/nav/locations.jpg); }

a.comment-form { background: url(images/nav/comment-form.jpg); }

a.refer-a-friend { background: url(images/nav/refer-a-friend.jpg); }

a.consultation-request { background: url(images/nav/consultation-request.jpg); }

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

a.brace-painter { background: url(images/nav/brace-painter.jpg); }



/* - - - SUBNAVIGATION ROLLOVER EFFECTS - - - */

#nav ul li ul li a:hover, #nav ul li ul li.active a { background-position: 0 -19px; }



/* - - - - - - - - - - FORMS - - - - - - - - - - */

/* Global form styles */

fieldset {border: none;}

fieldset div {clear: both;}

* #submit {/*these styles control the look of the button, change as necessary*/

	display: block;

	width:57px;

	height:20px;

	background:#FFA63D url(images/submit-button.gif) no-repeat;/* customize me! */

	border: 1px solid #D08400;

	text-align:center;

	line-height:20px;

	color:#FFA63D;/* customize me! */

	font-size:12px;

	font-weight:bold;

	overflow:hidden;

	text-indent:-9999px;}



/* referral form */

* .referral-form {

	width: 518px;}

.referral-form fieldset {border: none; padding: 9px 0;}

.referral-form label {/*floats labels left*/

	font-size: 12px;

	display:block;

	font-weight:bold;

	text-align:right;

	width:200px;

	float:left;

	line-height: 18px;

	padding-top: 4px;}

.referral-form label span {/*sits below labels; holds instructions*/

	color:#505050;

	display:block;

	font-size:11px;

	font-weight:normal;

	text-align:right;

	width:200px;}

.referral-form input, .referral-form textarea {

	float:left;

	font-size:12px;

	padding:4px 2px;

	border:solid 1px #D08400;/* customize me! */

	width:200px;

	margin:9px 0 9px 10px;

	background: #ffffff;}

.referral-form p.radio, .referral-form p.verification {

	clear: both;

	margin: 9px 0 9px 210px;

	font-size: 12px;}

.referral-form p.radio-float {

	clear: none;

	float:left;

	width: 200px;

	padding:0;

	margin:9px 0 9px 0;}

.referral-form p.verification {margin-top: 0;}

.referral-form p.verification img {border: 1px solid #D08400;}/* customize me! */

.referral-form p.radio input, .referral-form p.radio-float input {

	float: none;

	width: auto;

	margin: 0 0 0 10px;

	padding: 4px 2px;}



/* consultation form */

* .appointment-form {

	width: 518px;}

.appointment-form fieldset {border: none; padding: 9px 0;}

.appointment-form label {/*floats labels left*/

	font-size: 12px;

	display:block;

	font-weight:bold;

	text-align:right;

	width:200px;

	float:left;

	line-height: 18px;

	padding-top: 4px;}

.appointment-form label span {/*sits below labels; holds instructions*/

	color:#505050;

	display:block;

	font-size:11px;

	font-weight:normal;

	text-align:right;

	width:200px;}

.appointment-form input, .appointment-form select, .appointment-form textarea {

	float:left;

	font-size:12px;

	padding:4px 2px;

	border:solid 1px #D08400;/* customize me! */

	width:200px;

	margin:9px 0 9px 10px;

	background: #ffffff;}

.appointment-form p.radio, .appointment-form p.verification {

	clear: both;

	margin: 9px 0 9px 210px;

	font-size: 12px;}

.appointment-form p.radio-float {

	clear: none;

	float:left;

	width: 200px;

	padding:0;

	margin:9px 0 9px 0;}

.appointment-form p.verification {margin-top: 0;}

.appointment-form p.verification img {border: 1px solid #D08400;}/* customize me! */

.appointment-form p.radio input, .appointment-form p.radio-float input {

	float: none;

	width: auto;

	margin: 0 0 0 10px;

	padding: 4px 2px;}



/* comment form */	

* .comments {

	width: 518px;}

.comments li {font-weight: bold;}

.comments label {/*floats labels left*/

	font-size: 12px;

	line-height: 14px;

	display:block;

	font-weight:bold;

	text-align:right;

	width:200px;

	float:left;

	padding-top: 4px;}

.comments label span {/*sits below labels; holds instructions*/

	color:#505050;

	display:block;

	font-size:11px;

	font-weight:normal;

	text-align:right;

	width:200px;}

.comments .label-block label {float: none; clear: both; width: 100%; text-align: left;}

.comments input, .comments textarea {

	float:left;

	font-size:12px;

	padding:4px 2px;

	border:solid 1px #D08400;/* customize me! */

	width:200px;

	margin:9px 0 9px 10px;

	background: #ffffff;}

.comments p.verification {

	clear: both;

	margin: 9px 0 9px 210px;

	font-size: 12px;}

.comments p.radio-float {

	clear: none;

	float:left;

	width: 200px;

	padding:0;

	margin:9px 0 9px 0;}

.comments p.verification {margin-top: 0;}

.comments p.verification img {border: 1px solid #D08400;}/* customize me! */

.comments p.radio input, .comments p.radio-float input {

	float: none;

	margin: 0 0 0 10px;

	padding: 4px 2px;

	width: auto;}

.comments .radio {text-align: left; font-weight: normal;}

.comments .comments-box label {float: none; font-weight: normal; display: block; text-align: left;}

.comments .comments-box textarea {float: none; margin-left: 0; width:95%;}



/* Mini-Contact Form */

* .contact-form {

	width: 160px; }

.contact-form fieldset {border: none; }

.contact-form li {font-weight: bold;}

.contact-form label {display: none;}

.contact-form input, .contact-form textarea {

	color: #2D7E3D;

	font-size:11px;

	padding:2px 4px;

	border:solid 1px #D08400;

	width:150px;

	margin-bottom: 10px;

	background: #FFF;}

.contact-form button {/*these styles control the look of the button, change as necessary*/

	margin-bottom: 40px;

	display: block;

	width:57px;

	height:20px;

	background:#FFA63D url(images/submit-button.gif) no-repeat;/* customize me! */

	border: 1px solid #D08400;

	text-align:center;

	line-height:20px;

	color:#FFA63D;/* customize me! */

	font-size:12px;

	font-weight:bold;

	overflow:hidden;

	text-indent:-9999px;}

	

/* - - - - - - - - - - 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;

width: 520px}



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}

.social img { float:left; margin:0 5px 10px 0}