body		{margin: 0; padding: 0; background: #E3DBC3 url(../images/bg.jpg) repeat-x 0 0; line-height: 18px}

h1			{margin: 0; padding: 0; font-weight: normal; font-size: 1em;}

h1 a		{width: 702px; height: 100px; margin: 0; display: block; overflow: hidden; background: #FFF url(../images/header.jpg) no-repeat 0 0; text-indent: -999em;}

h2			{margin: 0 0 10px; padding: 0; color: #fff; font: 22px/27px Tahoma; text-align: right; background: #5A8430 url(../images/bg_pagetitle.jpg) no-repeat 100% 0;}

h2 big		{display: block; padding: 12px; font-size: 1em;}

h3			{height: 50px; margin: 0; padding: 0; clear: left; overflow: hidden; background: no-repeat 0 0; text-indent: -999em;}

h4			{margin: 10px 0; color: #BA5034; font-size: 16px;}

h5			{margin: 10px 0; color: #BA5034; font-size: 12px;}

h6			{margin:5px 0; color:#000; font-size: 1em; font-weight: normal;}

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



/* ........................................ CLEARFIX HACK ........................................ */



* html div.clearfix			{height:1%;}

html[xmlns] div.clearfix	{display:block;}

div.clearfix				{display:inline-block;}

div.clearfix:after			{clear:both;content:" ";display:block;height:0;line-height:0;visibility:hidden;}



/* ........................................ TEXT ........................................ */



body, form, input, td, textarea,

.NormalText	{color: #000; font-size: 11px; font-family: Arial, Times;}



a		{color:#BA5034;text-decoration:none}

a:hover	{color:#000;}

div.back-to-top a			{color:#BA5034;line-height:14px;}

div.back-to-top a:hover		{color:#000;}



div.content ol				{clear:left;color:#000;line-height:16px;list-style:decimal;margin:10px 40px;padding:0}

div.content ol a			{color:#BA5034;text-decoration:none}

div.content ol a:hover		{color:#000;text-decoration:none}

div.content ol li			{margin:10px 0;padding:0}

html:not([lang*=""]) div.content ol li

							{width:100%}

div.content ol ol			{clear:left;color:#000;line-height:16px;list-style:lower-alpha;margin:10px 30px;padding:0}

div.content ol ol a			{color:#BA5034;text-decoration:none}

div.content ol ol a:hover	{color:#000;text-decoration:none}

div.content ol ol li		{margin:10px 0;padding:0}

/*html:not([lang*=""]) div.content ol ol li	{width:100%}*/

div.content ul				{clear:left;color:#000;line-height:16px;list-style:disc;margin:10px 40px;padding:0}

div.content ul a			{color:#BA5034;text-decoration:none}

div.content ul a:hover		{color:#000;text-decoration:none}

div.content ul li			{margin:10px 0;padding:0}

html:not([lang*=""]) div.content ul li

							{width:100%}

div.content ul ul			{clear:left;color:#000;line-height:16px;list-style:circle;margin:10px 30px;padding:0}

div.content ul ul a			{color:#BA5034;text-decoration:none}

div.content ul ul a:hover	{color:#000;text-decoration:none}

div.content ul ul li		{margin:10px 0;padding:0}

html:not([lang*=""]) div.content ul ul li

							{width:100%}



div#footer					{float:left;margin:0;padding:30px 0 25px; color: #000; text-align:center;width:702px; background: #E3DBC3 url(../images/content-end.jpg) no-repeat 0 0;}

div#footer a				{color: #BA5034;}

div#footer a:hover			{color: #000;}

div#footer p				{margin: 5px 0; line-height: 14px;}

div#footer div.hr			{background: #CEBEA7; margin: 5px 0;}



/* ........................................ IMAGES ........................................ */



img			{border:0;display:block}

img.clear	{}

img.center	{border: #EFEBE0 solid 1px; clear: both; margin: 20px auto;}

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

img.link	{clear: left; margin: 0;}

img.right	{border: #EFEBE0 solid 1px; clear: right; float: right; margin:10px 0 10px 20px;}





/* ........................................ LAYOUT ........................................ */



div.hr					{background: #BA5034; clear: both; height: 1px; margin: 20px 0; padding: 0;}

div.hr hr				{display: none;}

div.back-to-top			{clear: both; text-align: right;}

div.content				{float: right; padding: 0 18px 10px; width:474px;}

div.content td			{line-height: 18px;}

div#bg-left				{background: url(../images/bg-left.jpg) no-repeat 0 0;float:left;height:730px;width:150px}

div#bg-right			{background: url(../images/bg-right.jpg) no-repeat 0 0;float:left;height:730px;width:150px}

div#content-wrapper		{background: url(../images/content-bg.jpg) repeat-y 0 0;float:left;width:702px}

div#flash-common-treatments,

div#flash-types-of-braces,

div#flash-types-of-appliances,

div#flash-braces-diagram,

div#flash-brace-painter,

div#flash-emergency-care,

div#flash-office-tour	{clear:both;margin:20px auto}

div#flash-home			{background:url(../images/flash-bg.jpg) no-repeat;float:right;padding:1px 1px 0 0}

div#site				{margin: 0 auto; width: 1002px;}



/* ........................................ NAVIGATION ........................................ */



/* .......... code .......... */

div#navigation-wrapper	{background:url(../images/nav-bg.jpg) no-repeat;display:inline;float:left;margin:0;padding:51px 0 0;width:192px}

ul#navigation			{list-style:none;margin:0;padding:0;width:192px}

ul#navigation li		{float:left}

ul#navigation a			{display:block;height:40px;overflow:hidden;text-indent:-999em;width:192px}

/* .......... images .......... */

ul#navigation a#what-sets-us-apart	{height:42px;background:url(../images/nav/what-sets-us-apart.jpg);}

a#about-dr-karlin		{background:url(../images/nav/about-dr-karlin.jpg)}

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

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

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

a#invisalign-info			{background:url(../images/nav/invisalign-info.jpg)}


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

a#contests-and-events	{background:url(../images/nav/contests-and-events.jpg)}

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

ul#navigation a#home	{background:url(../images/nav/home.jpg);height:41px}

/* .......... subnavigation code .......... */

ul#navigation li ul		{left:-9999px;list-style:none;margin:0;padding:0;position:absolute;z-index:100}

ul#navigation li:hover ul,ul#navigation li.sfhover ul

						{left:auto;margin:-40px 0 0 192px}

ul#navigation ul li		{float:none;margin:0}

ul#navigation ul li a	{display:block;height:23px;line-height:23px;overflow:hidden;text-indent:-999em;width:160px}

/* .......... subnavigation images .......... */

ul#navigation ul li a#meet-dr-karlin{background:url(../images/nav/meet-dr-karlin.png);height:25px}

ul#navigation ul li a#board-certification{background:url(../images/nav/board-certification.png);height:24px}

ul#navigation ul li a#meet-the-team{background:url(../images/nav/meet-the-team.png);height:25px}

a#office-policies{background:url(../images/nav/office-policies.jpg)}

ul#navigation ul li a#office-tour{background:url(../images/nav/office-tour.png);height:24px}

ul#navigation ul li a#why-braces{background:url(../images/nav/why-braces.png);height:25px}

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

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

a#common-treatments{background:url(../images/nav/common-treatments.jpg)}

a#orthodontic-dictionary{background:url(../images/nav/orthodontic-dictionary.jpg)}

a#invisalign-page{background:url(../images/nav/invisalign.png)}
a#invisalign-teen{background:url(../images/nav/invisalign-teen.png)}
a#invisalign-costs{background:url(../images/nav/invisalign-costs.png)}
a#invisalign-faq{background:url(../images/nav/invisalign-faq.png)}
a#invisalign-testimonials{background:url(../images/nav/invisalign-testimonials.png)}
a#invisalign-before-and-after{background:url(../images/nav/invisalign-before-and-after.png)}
a#invisalign-videos{background:url(../images/nav/invisalign-videos.png)}

ul#navigation ul li a#useful-links{background:url(../images/nav/useful-links.png);height:24px}

ul#navigation ul li a#life-with-braces{background:url(../images/nav/life-with-braces.png);height:25px}

a#types-of-braces{background:url(../images/nav/types-of-braces.jpg)}

a#types-of-appliances{background:url(../images/nav/types-of-appliances.jpg)}

a#faq{background:url(../images/nav/faq.jpg)}

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

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

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

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

ul#navigation ul li a#emergency-care{background:url(../images/nav/emergency-care.png);height:24px}

ul#navigation ul li a#location{background:url(../images/nav/location.png);height:25px}

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

ul#navigation ul li a#refer-a-friend{background:url(../images/nav/refer-a-friend.png);height:24px}

/* .......... rollover effects .......... */

ul#navigation a:hover,ul#navigation .active{background-position:0 -40px}

ul#navigation li:hover a#about-dr-karlin,ul#navigation li.sfhover a#about-dr-karlin,

ul#navigation li:hover a#about-our-office,ul#navigation li.sfhover a#about-our-office,

ul#navigation li:hover a#about-orthodontics,ul#navigation li.sfhover a#about-orthodontics,

ul#navigation li:hover a#braces-101,ul#navigation li.sfhover a#braces-101,

ul#navigation li:hover a#invisalign-info,ul#navigation li.sfhover a#invisalign-info,

ul#navigation li:hover a#contact-us,ul#navigation li.sfhover a#contact-us{background-position:0 -40px}

ul#navigation a#what-sets-us-apart:hover,ul#navigation a#what-sets-us-apart.active{background-position:0 -42px;}

ul#navigation a#home:hover,ul#navigation a#home.active{background-position:0 -41px}

ul#navigation ul li a#meet-dr-karlin:hover,ul#navigation ul li a#meet-dr-karlin.active{background-position:0 -25px}

ul#navigation ul li a#board-certification:hover,ul#navigation ul li a#board-certification.active{background-position:0 -24px}

ul#navigation ul li a#meet-the-team:hover,ul#navigation ul li a#meet-the-team.active{background-position:0 -25px}

ul#navigation ul li a#office-tour:hover,ul#navigation ul li a#office-tour.active{background-position:0 -24px}

ul#navigation ul li a#why-braces:hover,ul#navigation ul li a#why-braces.active{background-position:0 -25px}

ul#navigation ul li a#useful-links:hover,ul#navigation ul li a#useful-links.active{background-position:0 -24px}

ul#navigation ul li a#life-with-braces:hover,ul#navigation ul li a#life-with-braces.active{background-position:0 -25px}

ul#navigation ul li a#emergency-care:hover,ul#navigation ul li a#emergency-care.active{background-position:0 -24px}

ul#navigation ul li a#location:hover,ul#navigation ul li a#location.active{background-position:0 -25px}

ul#navigation ul li a#refer-a-friend:hover,ul#navigation ul li a#refer-a-friend.active{background-position:0 -24px}

/* .......... subnavigation rollover effects .......... */

ul#navigation ul a:hover,ul#navigation ul a.active{background-position:0 -23px}

/* .......... cursor effects .......... */

ul#navigation a.active{cursor:default}



/* index */

div.flash a					{color:#FFF}

div.flash p					{background: #D61308; color: #FFF; padding: 10px;}

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



/* office-policies */



div#patient-forms			{background-color:#FFFBEF;border:#EFEBE0 solid 1px;clear:right;float:right;margin:0 0 10px 10px;padding:0 10px;width:200px;}

div#patient-forms a			{color:#BA5034;text-decoration:none;}

div#patient-forms a:hover	{text-decoration:underline;}

div#patient-forms p			{color:#000;}



/* office-policies, useful-links */



div#resource-list			{list-style:none;margin:0;padding:0;}

div#resource-list a			{color:#06F;}

div#resource-list p			{color:#000;}

div#resource-list li		{clear:both;}

div#resource-list img		{border:#EFEBE0 solid 1px;}



/* .......... 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: 20px 0;padding: 0}

ul#sesame-games li {clear: both;display: inline-block}

ul#sesame-games img {border: 0;float: right;margin: 0 0 10px 10px}

ul#sesame-games p {padding-bottom: 1em}