body		{margin: 0; padding: 0; background: #E3DBC3 url(../images/bg.jpg) repeat-x 0 0;}
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#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:1}
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{background:url(../images/nav/invisalign.jpg)}
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#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}