/*------------------------------------------------------------------
[Main Stylesheet]
Project:	Dr. R. A. McFarland D.D.S. M.S. Orthodontics for Children & Adults
Version:	1.0
Last change:	14 September 2010 [created CSS file]
------------------------------------------------------------------*/
/*-- Reset --*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;background:transparent}body{line-height:1.125em}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

html { background: #efead5 url(../images/bg_html.jpg) repeat-x 0 0; }
body { color: #817872; background: url(../images/bg_body.jpg) no-repeat center 0; font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 22px; }

#container { width: 980px; margin: 0 auto; position: relative; }

/*-- Header --*/
#logo { width: 602px; margin: 37px 0 0 31px; float: left; }
	#logo a { height: 77px; display: block; background: url(../images/logo.png) no-repeat 0 0; text-indent: -9999px; }
#logins { margin: 12px 27px 0 0; float: right; background: url(../images/logins.png) no-repeat 0 0; }
	#logins a { height: 32px; display: block; text-indent: -9999px; }
	#logins li { width: 121px; margin: 0 9px 0 0; float: left; }
#address { width: 500px; margin: 10px 0 0 33px; float: left; clear: left; color: #777777; font-size: 13px; line-height: 18px; }
#social { width: 134px; margin: 15px 32px 0 0; float: right; clear: right; background: url(../images/social.png) no-repeat 0 0; }
	#social li { width: 27px; margin: 0 6px 0 0; float: left; }
		#social li a { height: 28px; display: block; text-indent: -9999px; }

#bd { margin: 31px 0 0; padding: 0 10px 50px; }
.home #bd { margin: 31px 0 0; padding: 0 10px 0px; }

/*-- Sidebar --*/
#sidebar { width: 251px; margin: 354px 0 0; float: left; }
	#sidebar img { display: block; }

/*-- Content --*/
#content { width: 640px; margin: 25px 33px 0 0; float: right; }
	#content h1, .home #content h2 { margin: 0 0 25px; color: #3b779c; font-family: Georgia, "Times New Roman", Times, serif; font-size: 30px; font-weight: normal; }
	#content h2 { margin: 0 0 5px; color: #562f54; font-family: Georgia, "Times New Roman", Times, serif; font-size: 24px; font-weight: normal; }
	#content h3 { margin: 0 0 5px; color: #562f54; font-family: Georgia, "Times New Roman", Times, serif; font-size: 18px; font-weight: normal; }
	#content h4 { margin: 0 0 5px; }
	#content p, #content ol, #content ul { margin: 0 0 15px; }
	#content a { color: #265776; text-decoration: none; }
		#content a:hover { text-decoration: underline; }
	#content li { margin: 0 0 0 25px; list-style-type: square; }
	#logos { text-align: center; }
		#logos img { margin: 0 25px 15px; vertical-align: middle; }
	.sub_nav { padding: 13px 20px; display: block; color: #265776; background: #f9f5ef; -moz-box-shadow: 0px 0px 4px #eee8dd; -webkit-box-shadow: 0px 0px 4px #eee8dd; box-shadow: 0px 0px 4px #eee8dd; }
		#content .sub_nav a { color: #265776; }
			#content .sub_nav a:hover, #content .sub_nav .active { color: #8a6a57; text-decoration: none; }
	.auto { margin: 0 0 15px 15px; padding: 0 0 8px; float: right; background: url(../images/bg_auto.jpg) no-repeat 0 bottom; border: 1px solid #FFF; -moz-box-shadow: 0px 0px 4px #ccc8dd; -webkit-box-shadow: 0px 0px 4px #eee8dd; box-shadow: 0px 0px 4px #eee8dd; }
	.column { width: 50%; float: left; }
	.back-to-top { clear: both; }
a#hover:hover{color:#3B779C;}
a#hover:link{text-decoration: none;}
a#hover:active{color: #0F0F0F;}
a#hover:visited{color:#3B779C;}
/*-- Footer --*/
#ft { color: #93897c; background: url(../images/bg_ft.jpg) repeat-x 0 0; text-align: right; font-size: 12px; }
	#ft-inner { width: 950px; margin: 0 auto; padding: 155px 0px 20px 0; background: url(../images/bg_ft_inner.jpg) no-repeat 0 0; }
	#ft a { color: #93897c; text-decoration: none; }
	#ft #sesame-link { color: #265776; }

/*-- Nav --*/
#nav { width: 253px; height: 335px; padding: 19px 0 0; position: absolute; top: 191px; left: 10px; background: url(../images/nav.jpg) no-repeat 0 0; }
	#nav ul ul { padding: 7px 0; position: absolute; top: 0; left: 252px; display: none; z-index: 999; background: #809b5d; border: 1px solid #FFF; }
		#nav ul ul a { width: 200px; padding: 7px 11px; display: block; color: #FFF; text-decoration: none; }
			#nav ul ul a:hover { color: #265776; background: #f0ead1; }
	#nav li { position: relative; }
	.head, #home { height: 30px; padding: 10px 0 0 33px; margin: 0 0 0 1px; display: block; color: #FFF; font-size: 17px; font-weight: bold; text-shadow: 0 0 4px #647a44; text-decoration: none; width: 216px; }
		.sfhover .head, .active .head, #home:hover, .active .head { background: #484c19; }

/* Home page nav styles START */		
		.head:hover { background: #484c19 !important; width: 216px;}
		
		#nav li.meet-the-team:hover ul, #nav li.for-new-patients:hover ul, #nav li.about-orthodontics:hover ul, #nav li.about-braces:hover ul, #nav li.orthodontic-treatments:hover ul, #nav li.first-aid:hover ul, #nav li.contact-us:hover ul { display: block; visibility: visible; }

		#nav ul ul { padding: 7px 0; margin: 0 0 0 1px; position: absolute; top: 0; left: 251px; display: none; z-index: 999; background: #809b5d; border: 1px solid #FFF; }
		
/* Home page nav styles END */		
		
		
/* Clear Fix */
.cf:after, #hd:after, #hd ul:after, #bd:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.cf, #hd, #hd ul, #bd {display: inline-block;}
.cf, #hd, #hd ul, #bd {display: block;}
* html .cf, * html #hd, * html #hd ul, * html #bd {height: 1px;}


/*****************************
 Specific page styles
*****************************/
/*-- Home --*/
#slideshow-home { width: 709px; height: 318px; overflow: hidden; }
.home #content h3 { margin: 0 0 15px; color: #8a6a57; font-size: 14px; font-weight: normal; font-style: italic; }

/*-- Meet the Staff --*/
.meet-the-staff #content h2 { clear: both; }

/*-- Office Tour --*/
#slideshow-container ul.slideshow {list-style: none;width: 600px;height: 449px;margin: 0 0 15px;padding: 0;}
#content #slideshow-container li {margin: 0;list-style-type: none;}
#slideshow-container {background: #f9f5ef; border: solid 1px #a0b606; -moz-border-radius: 5px; -webkit-border-radius: 5px; width: 600px;padding: 10px;line-height: 18px;}
#slideshow-container ul.slideshow img {width: 600px;height: 449px;margin: 0;}
.office-tour-nav {background-color: #fff; margin: 0 0 10px 0;padding: 5px 3px;border: solid 1px #a0b606; -moz-border-radius: 5px 5px 0 0; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; }
.office-tour-nav a {text-decoration: none;font-size: 12px;padding: 5px;margin: 0 3px;color: #333;}
.office-tour-nav a.activeSlide, .office-tour-nav a:hover {color: #009EC7;}

/* SESAME CSS */
img.right {margin: 0 0 15px 15px;float: right;clear: right;}
img.left {margin: 0 15px 15px 0;float: left;clear: left;}
img.left-border {float: left;clear: left;margin: 5px 15px 15px 0;border: solid 1px #333;/* Customize me! */
}
img.right-border {float: right;clear: right;margin: 5px 0 15px 15px;border: solid 1px #333;/* Customize me! */
}
p.flash_notice {margin: 18px;padding: 9px;color: #ff0000;border: 1px dotted #ff0000;background: #ffffff;text-align: center;}
.clear {clear: both;}
/* This styled div acts as the hr for most browsers */
div.hr {height: 10px;background: url(../images/hr.jpg) no-repeat center 0;border: none;margin: 20px 0;padding: 0;clear: both;}
hr {display: none;}
div.box {float: right;clear: right;width: 334px;background-color: #f9f5ef; padding: 5px 0 5px 5px;margin: 0 0 20px 20px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-box-shadow: 0px 0px 4px #eee8dd; -webkit-box-shadow: 0px 0px 4px #eee8dd; box-shadow: 0px 0px 4px #eee8dd; }
div.box img {float: left;border: solid 1px #333;/* Customize me! */
margin-right: 5px;}
div.box p {float: left;width: 50%;margin: 0;padding: 0;}
/* In-Ovation */
div.comparison {background: #fff;border: 1px solid #a0b606;display: inline-block;margin-bottom: 10px;clear: both;padding: 5px;}
div.comparison div {float: left;width: 49%;}
#video-in-ovation {width: 320px;height: 266px;}
/* invisalign teen */
.invisalign-teen img.right {border: solid 1px #000;margin: 0 0 15px 15px;float: right;clear: right;}
img.left {border: solid 1px #000;margin: 0 15px 20px 0;float: left;}
span.indent {padding-left: 40px;}
#invisalign-sidebar {background: #fff;width: 275px;margin: 0 0 15px 15px;padding: 0;border: solid 1px #000;float: right;clear: right;}
#invisalign-sidebar a {color: #036;}
#invisalign-sidebar h3 {background: #97AFC2;margin: 0;padding: 15px;color: #fff;}
#invisalign-sidebar p {padding: 0 15px;margin: 15px 0;}
.thumb {border: solid 1px #000;margin: 0 10px 10px 0;float: left;clear: left;}
.clear {clear: both;}
/* Emergency Care */
ul#toggle-emergency {list-style: none;margin: 0 0 1em 0;}
ul#toggle-emergency li {border: solid 1px #fff;border-width: 0 0 1px 0;padding: 1em 0;margin: 0;}
.general-soreness {background: url(http://media.sesamehost.com/images/emergency-care/general-soreness.gif) no-repeat;width: 80px;height: 60px;}
.headgear {background: url(http://media.sesamehost.com/images/emergency-care/headgear.gif) no-repeat;width: 80px;height: 60px;}
.loose-appliance {background: url(http://media.sesamehost.com/images/emergency-care/loose-appliance.gif) no-repeat;width: 80px;height: 60px;}
.loose-bracket {background: url(http://media.sesamehost.com/images/emergency-care/loose-bracket.gif) no-repeat;width: 80px;height: 60px;}
.loose-wire {background: url(http://media.sesamehost.com/images/emergency-care/loose-wire.gif) no-repeat;width: 80px;height: 60px;}
.poking-wire {background: url(http://media.sesamehost.com/images/emergency-care/poking-wire.gif) no-repeat;width: 80px;height: 60px;}
.left-border {border: solid 1px #333;margin: 5px 15px 15px 0;float: left;clear: left;}
/*-----------------------------------------------Forms*/
/* Global form styles */
div.referral-form, div.appointment-form, div.comments {width: 100%;margin-top: 18px;letter-spacing: normal;}
fieldset {border: 0;padding: 9px 0;margin: 0 18px;}
fieldset h2 {margin: 0 0 9px;}
fieldset p {margin: 0 0 18px;}
fieldset p.disclaimer {font-size: 90%;font-style: italic;margin: 0;}
fieldset dl {}
fieldset dl dt {font-size: 16px;clear: both;margin: 9px 0 0;}
fieldset dd ul {margin: 9px 0;}
fieldset dd ul li, fieldset dd ol li {list-style: none;}
fieldset dd li {clear: both;margin: 3px 0;padding: 5px 0 4px 10%;overflow: auto;height: auto;position: relative;}
fieldset dd li:hover {background: #d5e0eb;/* customize me - this is the hover color change of li */
}
fieldset dd li input:hover, fieldset dd li input:focus, fieldset dd li select:hover, fieldset dd li select:focus, fieldset dd li textarea:hover, fieldset dd li textarea:focus {background: #f1f1f1;/* customize me - this is the hover color change of form fields*/
 outline-color: #537197;/* customize me */
 }
fieldset li h3 {font-size: 12px;line-height: 18px;margin: 0;}
fieldset li div {float: left;display: inline-block;width: 40%;position: relative;padding-right: 5%;}
fieldset li div.input-street {width: 85%;}
fieldset li div.input-city {width: 60%;}
fieldset li div.input-full-name {width: 85%;}
fieldset li div.input-phone-full {width: 85%;}
fieldset li div.input-email {width: 85%;}
fieldset li div.input-zip {width: 20%;}
fieldset li div.content-switch, fieldset li div.radio, fieldset li div.checkbox {width: 85%;}
fieldset li div.radio input {border: none;}
fieldset li div.radio label {padding-right: 9px;font-size: 90%;}
/*fieldset li div.hidden-content, fieldset li.hidden-content {display: none;}
*/
fieldset li div.input-select-full {width: 85%;}
fieldset li div.input-comments {width: 85%;}
li div.input-comments textarea {height: 63px;overflow: auto;}
fieldset li div.input-captcha {width: 50%;}
fieldset li div.verification {width: 35%;}
li div.verification img {border: 1px solid;margin-top: 9px;-moz-border-radius: 4px;/*for Moz, optional*/
-webkit-border-radius: 4px;/*for Webkit Browsers, optional*/
}
fieldset li div label {line-height: 18px;font-weight: bold;margin-bottom: 9px;font-size: 80%;color: #537197;/*override to match site*/
}
fieldset li div input, fieldset li div textarea, fieldset li div select {display: block;line-height: 18px;width: 100%;border: 1px solid;padding: 4px 0 3px;text-indent: 4px;margin-top: 9px;-moz-border-radius: 4px;/*for Moz, optional*/
-webkit-border-radius: 4px;/*for Webkit Browsers, optional*/
}
fieldset li div select {height: 25px;}
fieldset li div.radio input {display: inline;width: auto;margin-right: 4px;}
fieldset li div div {width: 100%;}
fieldset dl dd.form-footer button {/*these styles control the look of the button, change as necessary*/
clear:both;/*do not change, forces button to sit below floated elements*/
display: block;width: 125px;height: 34px;text-align: center;margin: 0;background:#cfdae4;/* customize me! */
border: 1px solid #537197;line-height: 34px;color:#537197;/* customize me! */
font-size:12px;font-weight:bold;-moz-border-radius: 4px;/*for Moz, optional*/
-webkit-border-radius: 4px;/*for Webkit Browsers, optional*/
}
/* appointment form* Styles only for the appointment request form*/
/* comment form* Styles only for the comments form*/
/*numbering added by jQuery*/
fieldset ol li span.comment-number {font-size: 150%;color: #537197;/* customize me*/
position: absolute;left: 9px;top: 9px;}
/* referral form* Styles only for the referral form*/
.referral-form fieldset li div.radio {width: 40%;}
/* JQuery */
input.error, select.error, textarea.error {border-color: #a52003;background: #fefda1;}
div.error {background: url(../images/validate_error.gif) 0 0 no-repeat;color: #a52003;width: 18px;height: 18px;position: absolute;top: 0;right: 0;overflow: hidden;display: block;margin: 12px -2% 0 0;text-indent: -999em;}
div.success {background: url(../images/validate_ok.gif) 0 0 no-repeat;width: 18px;height: 18px;position: absolute;top: 0;right: 0;overflow: hidden;display: block;margin: 12px -2% 0 0;text-indent: -999em;}
.contact-form div.error, .contact-form div.success {margin-left: 0;}

.hide {display: none;}