/*----------------------------------------------------------------------------------
	CSS :: Dorothy Lane Dental Associates (Charles Moser)
----------------------------------------------------------------------------------*/

* {
	font-family: Tahoma;
	margin: 0;
	padding: 0;
}

p, ul, ol {
	font: normal normal normal 11px Verdana;
	color: #1A1A1A;
	line-height: 16px;
}

a {
	text-decoration: underline;
	outline: none;	
}

a:hover {
	text-decoration: none;
	color: #000;
}

div.clr {
	clear: both;
}

html,
body,
div#outer,
div#inner {
    min-height: 100%;
    width: 100%;
    height: auto;
}

* html,
* html body,
* html div#outer,
* html div#inner {
    height: 100%;
}

body {
	background: #2B3149 url(../images/bg/bg.gif) repeat-x;
}

div#outer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

div#inner {
    position: absolute;
    left: 50%;
    width: 786px;
    margin-left: -393px; /* lines up the wrapper b area flushed to the background of wrapper a ( due to the shadow effect on wrapper a )*/
	background: #A5C6C6;
	border-left: 2px solid #000;
	border-right: 2px solid #000;
}

/*----------------------------------------------------------------------------------
	Header :: Definitions
----------------------------------------------------------------------------------*/

	#inner div#header {
		position: relative;
		margin: auto;
		width: 786px;
		height: 370px;
		z-index: 1;
		background: #fff url(../images/bg/header.jpg) no-repeat;
	}

/*----------------------------------------------------------------------------------
	Header :: Shadows
----------------------------------------------------------------------------------*/
	
	#header div#lshadow,
	#header div#rshadow {
		position: absolute;
		width: 15px;
		height: 297px;
		top: 0px;
	}
	
	#header div#lshadow {
		left: -15px;
		background: transparent url(../images/misc/l_shadow.png) no-repeat;
	}
	
	#header div#rshadow {
		right: -15px;
		background: transparent url(../images/misc/r_shadow.png) no-repeat;
	}
	
	
/*----------------------------------------------------------------------------------
	Header :: Dorothy Lane Dental Logo
----------------------------------------------------------------------------------*/

	#header a#logo {
		position: absolute;
		z-index: 2;
		top: 0px;
		left: 12px;
		text-align: left;
		text-indent: -999em;
		text-decoration: none;
		outline: none;
		height: 80px;
		width: 418px;
		background: transparent url(../images/logo/dorothy_lane_dental_care.gif) no-repeat 0 0;
	}

/*----------------------------------------------------------------------------------
	Header :: Tagline
----------------------------------------------------------------------------------*/
	
	#header h2 {
		position: absolute;
		top: 94px;
		left: 75px;
		color: #fff;
	}
	
/*----------------------------------------------------------------------------------
	Header :: Right Side Spans
----------------------------------------------------------------------------------*/
	
	#header span#phone {
		position: absolute;
		top: 12px;
		left: 470px;
		width: 310px;
		height: 34px;
		background: transparent url(../images/misc/call_for_appointment.gif) no-repeat;
		text-align: left;
		text-indent: -999em;
	}
	
	#header span#hours {
		position: absolute;
		top: 44px;
		left: 476px;
		font: normal normal bold 11px Tahoma;
		color: #fff;
	}

	
/*----------------------------------------------------------------------------------
	Header :: Flash
----------------------------------------------------------------------------------*/

	#header div#flash {
		position: absolute;
		bottom: 4px;
		right: 0px;
		width: 515px;
		height: 266px;
	}
	
/*----------------------------------------------------------------------------------
	Header :: Nav
----------------------------------------------------------------------------------*/
	
	#header div#nav-contain {
		position: absolute;
		left: 4px;
		bottom: 4px;
		width: 305px;
		height: 222px;
		background: transparent url(../images/bg/nav.png) no-repeat;
		z-index: 1;
	}
	
	ul#nav {
		position: absolute;
		left: 4px;
		bottom: 41px;
		margin-left: 6px;
		width: 255px;
		list-style: none;
		z-index: 10;
	}
	
	#nav li {
		width: 255px;
		height: 29px;
		border-bottom: 1px solid #fff; 
		text-align: right;
	}
	
	#nav a {
		display: block;
		width: 129px;
		height: 29px;
		text-align: left;
		text-indent: -999em;
		text-decoration: none;
		outline: none;
		background-repeat: no-repeat;
	/*	line-height: -0.5; */
		margin-left: 50%;
	}
	
	#nav a:hover,
	#nav li.hover a#nav-1,
	#nav li.hover a#nav-2,
	#nav li.hover a#nav-3,
	#nav li.hover a#nav-4,
	#nav li.hover a#nav-5,
	#nav li.hover a#nav-6,
	#nav li.hover a#nav-7
	{
		background-position: 0 -29px;
	}
	
	#nav a#nav-1 {
		background-image: url(../images/nav/home.gif);
	}
	
	#nav a#nav-2 {
		background-image: url(../images/nav/staff.gif);
	}
	
	#nav a#nav-3 {
		background-image: url(../images/nav/services.gif);
	}
	
	#nav a#nav-4 {
		background-image: url(../images/nav/faq.gif);
	}
	
	#nav a#nav-5 {
		background-image: url(../images/nav/contact.gif);
	}
	
	#nav a#nav-6 {
		background-image: url(../images/nav/directions.gif);
	}
	
	#nav a#nav-7 {
		background-image: url(../images/nav/coupon.gif);
	}
	
/*----------------------------------------------------------------------------------
	Body :: Definitions
----------------------------------------------------------------------------------*/
	
	#inner div#body {
		position: relative;
		margin: 0px auto 150px auto;
		text-align: left;
	}
	
/*----------------------------------------------------------------------------------
	Body :: Image Definitions
----------------------------------------------------------------------------------*/
	
	#sidebar a#dentures {
		display: block;
		width: 232px;
		height: 51px;
		text-align: left;
		text-indent: -999em;
		text-decoration: none;
		outline: none;
		background: transparent url(../images/sidebar/dentures.gif) no-repeat;
	}
	
	#sidebar a#subscribe {
		display: block;
		width: 227px;
		height: 50px;
		text-align: left;
		text-indent: -999em;
		text-decoration: none;
		outline: none;
		margin: auto;
		background: transparent url(../images/sidebar/coupon_offer.png) no-repeat;
	}
	
	#sidebar a#financing {
		display: block;
		width: 227px;
		height: 50px;
		text-align: left;
		text-indent: -999em;
		text-decoration: none;
		outline: none;
		margin: auto;
		background: transparent url(../images/sidebar/financing.png) no-repeat;
	}
	
	#sidebar div#directions-sidebar {
		position: relative;
	}
	
	#directions-sidebar div#dl-img {
		position: absolute;
		top: 10px;
		left: 0px;
	}
	
	.img-shadow {
		float:left;
		background-color: #324353;
		margin: 10px 0 0 10px !important;
		margin: 10px 0 0 5px;
	}
	
	.img-shadow img {
		display: block;
		position: relative;
		border: 3px solid #BADCFF;
		margin: -3px 3px 3px -3px;
	}
	
/*----------------------------------------------------------------------------------
	Body :: Content Definitions
----------------------------------------------------------------------------------*/
	
	#body div#content {
		position: relative;
		float: right;
		width: 465px;
		background: #fff url(../images/bg/content.gif) repeat-x;
		margin: 6px;
		padding: 18px 18px 40px 18px;
	}
	
	* html #body div#content {
		margin: 6px 3px 6px 0px;
		padding: 18px 8px 40px 8px;
	}
	
	#content img.fr {
		float: right;
		border: 2px solid #000;
		margin: 10px;
	}
	
	#content h1 {
		font: normal normal normal 20px "Swis721 Ex BT",sans-serif;
		color: #4B5475;
		margin-bottom: 10px;
	}
	
	#content h2 {
		font: normal normal normal 16px "Swis721 Ex BT",sans-serif;
		color: #4B5475;
		margin-bottom: 6px;
	}
	
	#content ul {
		margin: 5px 5px 16px 15px;
		list-style: square;
	}
	
	#content ol {
		margin: 5px 5px 16px 15px;
	}
	
	#content ol li {
		margin-left: 10px;
	}
	
	#content li {
		font-weight: bold;
		color: #546F8A;
	}
	
	#content p {
		margin: 8px 0px 16px 0px;
	}
	
	#content img {
		border: 2px solid #546F8A;
	}
	
	#content img.coupon {
		float: left;
	}
	
/*----------------------------------------------------------------------------------
	Body :: Sidebar Definitions
----------------------------------------------------------------------------------*/
	
	#body div#sidebar {
		position: relative;
		float: left;
		width: 261px;
		margin: 6px;
		text-align: left;
	}
	
	#sidebar dl {
		width: 251px;
		font: normal normal bold 11px Arial;
		color: #4A5C5C;
		text-align: left;
		margin-bottom: 24px;
	}

	#sidebar dt {
		margin-left: 135px;
		padding-top: 28px;
		padding-bottom: 8px;
	}
	
	#sidebar dt a {
		font: normal normal bold 12px Arial;
		color: #4A5C5C;
	}
	
	#sidebar dt a:hover {
		color: #000;
	}
	
	#sidebar dd {
		margin-left: 135px;
		line-height: 16px;
	}
	
	#header h2,
	#sidebar h2 {
		font: normal normal normal 32px "Century Old Style Std", script;
	}
	
	#sidebar h2 {
		margin-left: 24px;
		color: #6B7F7F;
	}
	
/*----------------------------------------------------------------------------------
	Footer :: Definitions
----------------------------------------------------------------------------------*/

	#inner div#footer {
	    position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 130px;
		background: #203B47 url(../images/bg/footer.gif) repeat-x;
	}
	
	#footer p {
		text-align: center;
		font: normal normal bold 11px Tahoma;
		color: #fff;
		margin-top: 15px;
	}
	
	#footer div#footer-highlight {
		position: absolute;
		top: -121px;
		left: 0px;
		width: 272px;
		height: 121px;
		background: transparent url(../images/misc/highlight.png) no-repeat;
	}
	
	#footer a {
		color: #eaeaea;
	}
	
/*----------------------------------------------------------------------------------
	Content :: Contact Form
----------------------------------------------------------------------------------*/

	form#contact-form {
		font-size: 13px;
		margin: 20px auto 20px auto;
		text-align: center;
		width: 100%;
		background: #546F8A;
		border: 2px solid #fff;
	}
	
	#contact-form fieldset {
		width: 80%;
		padding: 8px;
		margin: 15px;
		border: 1px solid #ccc;
		text-align: left;
	}
	
	#contact-form legend {
		background: #96ACC3;
		font-weight: bold;
		color: #fff;
		padding: 2px 15px;
		border: 1px solid #ccc;
		margin-bottom: 10px;
	}
	
	#contact-form label {
		position: relative;
		display: block;
		clear: both;
	}
	#datasheet strong {
		color: #999;
		font-weight: bold;
	}
	
	#contact-form span.label-text {
		position: relative;
		display: block;
		float: left;
		width: 140px;
		height: 30px;
		color: #fff;
		font-weight: bold;
		margin-right: 1px;
		margin-right: 3px;
	}
	
	#contact-form input,
	#contact-form textarea,
	#contact-form select {
		background-color: #D1D1D1;	
		font-size: 11px;
		padding: 3px 8px;
		color: #636363;
		border: 1px solid #787878;
	}
	
	#contact-form input {
		background: #D1D1D1 url(../images/bg/input_boxes.gif) repeat-x;
	}
	
	#contact-form select {
		padding: 3px 1px;
	}
	
	#contact-form option {
		padding: 0 5px;
	}
	
	#contact-form textarea {
		margin: 5px 0;
	}
	
	#contact-form input {
		width: 155px;
	}
	
	input#submit {
		font: normal normal bold 11px Verdana;
		color: #000;
		background: transparent url(../images/nav/submit_button.gif) no-repeat;
		border: 0;
		width: 146px;
		height: 24px;
		margin: 5px;
	}

	span.req {
		color: #ffff00;
		font-weight: bold;
	}