

/*
Copyright (c) 2006, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 0.11.3
*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
td,th{vertical-align:top;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
q:before,q:after{content:'';}
html,body{width:100%;height:100%;}

/* JOURNAL-WORLD CSS FRAMEWORK 
   Typography
   Nathan Borror, Jeff Croft, and Christian Metts
   March, 2007
   
   This stylesheet exists to provide simple, sane defaults for clean, elegant
   tpography. It is not created with the expectation that it will be used
   as-is very oten, but rather to establish a "jumping-off" point for designers.
   It aims to establish solid vertical rythym, comfortable leading, and other
   basics of readability.
   
   The baseline grid established is 18px tall. All line-heights and margins are
   set in mutiples of this value (albeit sometimes in ems, rather than pixels,
   which helps to maintain the baseline grid, even when text has been resized
   in a designer's stylesheet or the user's browser).
   
   Some pieces of the Typography portion of this framework (such as sidenotes) 
   assume they are being used within the context of the 50px grid established by 
   the Grid Layout component.
-------------------------------------------------------------------------------- */


/* default styles for html elements
-------------------------------------------------------------------------------- */

body,ul,ol,dl,h1,h2,h3,h4,h5,h6,td,th,caption,pre,p,blockquote,input,select,textarea
{
   font-family: Helvetica, Arial, sans-serif;
   font-size: 12px;
   line-height: 18px;
   font-weight: normal;
   color: #222;
}

a 
{ 
   color: #667ab2;
   text-decoration: none; 
   outline: none;
   font-weight: bold;
}

a:hover
{
   text-decoration: underline;
}

a.inactive
{
	color: #ccc;
	text-decoration: none;
}

h1,h2,h3,h4,h5,h6
{
   margin: 0;
   font-weight: bold;
}

h1 { font-size: 36px; line-height: 36px; padding-top: 18px; padding-bottom: 18px; }
h2 { font-size: 28px; line-height: 36px; padding-top: 9px; padding-bottom: 9px; }
h3 { font-size: 18px; line-height: 18px; padding-top: 9px; padding-bottom: 9px; }
h4 { font-size: 14px; line-height: 18px; padding-top: 9px; padding-bottom: 9px; }
h5 { font-size: 12px; line-height: 18px; padding-top: 9px; padding-bottom: 9px; }
h6 { font-size: 10px; line-height: 18px; padding-top: 9px; padding-bottom: 9px; }

p { margin: 0 0 18px 0; }

ul, ol 
{
   margin-top: 18px;
   margin-bottom: 18px;
   padding-left: 20px;
   list-style-position: outside;
   list-style-type: disc;
}

ol
{
   list-style-type: decimal;
}

dl
{
   margin-top: 18px;
   margin-bottom: 18px;
}

dl dt 
{
   font-weight: bold;
}

blockquote 
{
   margin-top: 18px;
   margin-bottom: 18px;
   padding-left: 17px;
   border-left: 1px solid #666;
   font-style: italic;
}

blockquote * { color: #666; }

strong { font-weight: bold; }

em { font-style: italic; }

/* default styles for common classes
-------------------------------------------------------------------------------- */

.small
{
   font-size: 10px;
   line-height: 18px;
}

.large
{
   font-size: 14px;
   line-height: 18px;
}

.quiet
{
   color: #666;
}


/* extra default styles for common typographic idioms
-------------------------------------------------------------------------------- */

.footnotes
{
   border-top: 1px solid #666;
   margin-top: -1px;
   color: #666;
   font-size: 10px;
}

.sidenote { font-size: 10px; }

.sidenote.right { float: right; }
.sidenote.right.span1 { margin-right: -60px; }
.sidenote.right.span2 { margin-right: -120px; }
.sidenote.right.span3 { margin-right: -180px; }
.sidenote.right.span4 { margin-right: -240px; }

.sidenote.left { float: left; }
.sidenote.left.span1 { margin-left: -60px; }
.sidenote.left.span2 { margin-left: -120px; }
.sidenote.left.span3 { margin-left: -180px; }
.sidenote.left.span4 { margin-left: -240px; }

/* Copyright 2008 Jeroen Cranendonk <jeroenc@jscwebdesign.nl> */

h1
{
	text-transform: capitalize;
	text-align: left;
	font-family: Nimbus,Times,serif;
	font-variant: small-caps;
	font-size: 24px;
	padding: 8px 0;
}

h2
{
	text-transform: uppercase;
	text-align: center;
	font-family: serif;
	font-size: 13px;
	padding: 9px 0;
}

h3
{
	text-transform: uppercase;
	text-align: left;
	font-size: 12px;
	font-weight: normal;
	padding: 0;
}

input.text, textarea
{
	border: 2px solid #d4d0c8;
	padding-left: 2px;
	margin-bottom: 0.5em;
	width: 200px;
}

input.text
{
	height: 17px;
}

input.submit
{
	border: 1px solid black;
	padding: 0 15px 1px;
	cursor: pointer;
}

div.error
{
	margin-bottom: 1em;
	color: #ff52c1;
}

input.error, textarea.error
{
	border: 2px solid #ff52c1;
}

.tooltip
{
	position: absolute;
	border: 1px solid #42210b;
	background: #dbc5af;
	color: #42210b;
	padding: 2px 6px;
	font-family: "Nimbus sans", arial, sans-serif;
}

ul, ol
{
	margin-top: 0;
}

/* Copyright 2008 Jeroen Cranendonk <jeroenc@jscwebdesign.nl> */

body
{
	/*background: #a67c52;*/
	background: white;
}

#root
{
	width: 760px;
	height: 560px;
	margin: 0 auto;
	position: relative;
	background: #a67c52 url('/images/bg1.jpg') no-repeat center;
}

#root table
{
	border: 0;
	margin: 0;
	padding: 0;
}

#root td
{
	vertical-align: top;
}

#root *
{
	color: #42210b;
	font-family: "Nimbus sans", "Nimbus sans l", arial, sans-serif;
}

#menu
{
	position: absolute;
	top: 14px;
	width: 760px;
}

#content
{
	position: absolute;
	background: url('/images/ebdbcc80.png') repeat;
	top: 72px;
	left: 0;
	width: 760px;
	height: 325px;
	overflow: hidden;
}

#scrollwrapper
{
	height: 325px;
	overflow: auto;
	margin-right: 25px;
}

#scrolltrack
{
	float: right; 
	width: 8px; 
	height: 315px;
	margin: 5px 7px 0 0;
	background: #42210b;
}

#scrollhandle
{
	width: 8px; 
	height: 8px; 
	background: #a67c52;
}

#sublinks
{
	position: relative;
	padding: 3px 0 0 6px;
	border-top: 1px solid #aa9786;
}

#sublinks a
{
	text-transform: capitalize;	
	font-size: 14px;
	font-family: Nimbus,Times,serif;	
	font-variant: small-caps;
	margin-right: 20px;
	text-decoration: none;
}

#content td
{
	padding: 0 13px;
}

#content td#photo
{
	text-align: right;
	padding: 0;
}

#content td#photo img
{
	margin-top: 5px;
}

#footer
{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 760px;
	height: 149px;
	background: url('/images/bg2.jpg') no-repeat left bottom;
}

#footer .bar
{
	position: absolute;
	height: 32px;
	width: 760px;
	background: #42210b;
	border-bottom: 10px solid #765030;
}

#cdhc_logo
{
	position: absolute;
	top: 46px;
	left: 14px;
	width: 140px;
	height: 101px;
}

#justforkids
{
	position: absolute;
	top: 6px;
	left: 552px;
	width: 208px;
	height: 143px;
}

#justforkids_top
{
	position: absolute;
	top: -44px;
	left: 569px;
	width: 160px;
	height: 50px;
}

#cnote
{
	position: absolute;
	width: 100%;
	left: 0;
	bottom: -1.75em;
	padding-top: 0.25em;
	text-align: right;
}

.sitemap ul
{
	margin-bottom: 0;
}


/* Copyright 2008 Jeroen Cranendonk <jeroenc@jscwebdesign.nl> */

#menu1 { background: #603813; }
#menu2 { background: #42210b; }

#menu .menu
{
	list-style: none;
	margin: 0;
	padding: 0;
	color: #fee;
	font-family: serif;
	position: relative;
	height: 22px;
	clear: both;
}

#menu .menu li
{
	float: left;
	text-transform: capitalize;
}

#menu1 .menu li { margin-left: 70px; }
#menu2 .menu li { margin-left: 45px; }
#menu .menu span { visibility: hidden; }

#menu .menu li.firstchild
{
	margin-left: 10px;
}

#menu .menu a
{
	font-family: serif;
	color: #fee;
	text-decoration: none;
	font-weight: normal;
	display: block;
	height: 22px;
	padding: 0 5px;
	background: transparent url('/images/menu/menu.png') no-repeat left top;
}

#menu .menu a:hover { background-color: #85501d; }

#menu1 #about_us { width: 46px; background-position: 5px 6px; }
#menu1 #services { width: 59px; background-position: 5px -27px; }
#menu1 #faq { width: 31px; background-position: 5px -62px; }
#menu1 #new_patient_forms { width: 135px; background-position: 5px -94px; }
#menu1 #orthodontic_care { width: 132px; background-position: 5px -127px; }

#menu2 #tour { width: 190px; background-position: 5px -161px; }
#menu2 #before_and_after { width: 110px; background-position: 5px -194px; }
#menu2 #digital_xrays { width: 102px; background-position: 5px -227px; }
#menu2 #links { width: 40px; background-position: 5px -261px; }
#menu2 #contact { width: 60px; background-position: 5px -294px; }
