/*-----------------------------------------------------------------------------
Website Style Sheet

version:   1.0
author:    Bryan Miller
email:     bmiller@practisinc.com
website:   http://www.greenspoonorthopaedics.com/
-----------------------------------------------------------------------------*/

@media screen {

	/* =General
	-----------------------------------------------------------------------------*/
	body {
	  padding: 0;
	  margin: 0;
	  background-color: #f6f7ef;
	  font: 12px Arial, Helvetica, sans-serif;
	  color:#414141;
	  text-align: center; /* Centered design work around for IE 5.X and 6 in quirks mode. */
	  min-width: 910px; /* Centered design work around for Netscape 6. */
	  overflow: -moz-scrollbars-vertical;
	}
	
	/* Class for clearing floats */
	.clear { clear:both; height:0px;}
	
	/* Remove border around linked images */
	img { border: 0; }
	
	p { margin: 9px 0; }
	
	h1, h2, h3, h4, h5 { margin: 12px 0; color:#147b96;}
	h1 { font-size: 24px; }
	h2 { font-size: 18px; color:#dc872c;}
	h3 { font-size: 14px; }
	h4 { /* different color */ }
	h5 { /* different color */ }
	
	
	/* =Links
	-----------------------------------------------------------------------------*/
	a:link, a:visited { color:#147b96;  text-decoration:none; }
	a:hover { color:#147b96; text-decoration:underline; }
	
	
	/* =Structure
	-----------------------------------------------------------------------------*/
	#container {
	  width: 910px;
	  margin: 0 auto;
	  padding:0;
	  text-align: left; /* Centered design work around for IE 5.X and 6 in quirks mode. */
	}
	
	#content { margin:0; padding:0;}
	
	#footer { margin:0; padding:20px 0 20px 0; line-height:18px; text-align:center; clear:both;}

	/* =Navigation
	-----------------------------------------------------------------------------*/
	ul#nav_main { height:53px; margin:0; padding:0; list-style-type:none; }
	ul#nav_main li { height:53px; float:left; position:relative; }
	ul#nav_main li span { width:100%; height:100%; position:absolute; }
	ul#nav_main li a { display:block; cursor:pointer;}
	* html #nav_main a:hover { background:#ccccff; cursor:pointer;}
	
	
	/* This is an example of what needs to be done for each li in the main navigation unordered list. 
	   You can copy this block and just change out the class name, widths and background image names/locations. */
	ul#nav_main li.home { width:100px; }
	ul#nav_main li.home a span,ul#nav_main li.home a:link span { background:url(../images/buttons/btn-home.gif) no-repeat; }
	ul#nav_main li.home a:hover span,body.home ul#nav_main li.home a span { background:url(../images/buttons/btn-home.gif) no-repeat 0 -53px; }
	
	ul#nav_main li.about-us { width:106px; }
	ul#nav_main li.about-us a span,ul#nav_main li.about-us a:link span { background:url(../images/buttons/btn-about-us.gif) no-repeat; }
	ul#nav_main li.about-us a:hover span,body.about-us ul#nav_main li.about-us a span { background:url(../images/buttons/btn-about-us.gif) no-repeat 0 -53px; }
	
	ul#nav_main li.our-office { width:108px; }
	ul#nav_main li.our-office a span,ul#nav_main li.our-office a:link span { background:url(../images/buttons/btn-our-office.gif) no-repeat; }
	ul#nav_main li.our-office a:hover span,body.our-office ul#nav_main li.our-office a span { background:url(../images/buttons/btn-our-office.gif) no-repeat 0 -53px; }
	
	ul#nav_main li.services-specialties { width:191px; }
	ul#nav_main li.services-specialties a span,ul#nav_main li.services-specialties a:link span { background:url(../images/buttons/btn-services-specialties.gif) no-repeat; }
	ul#nav_main li.services-specialties a:hover span,body.services-specialties ul#nav_main li.services-specialties a span { background:url(../images/buttons/btn-services-specialties.gif) no-repeat 0 -53px; }
	
	ul#nav_main li.patient-education { width:161px; }
	ul#nav_main li.patient-education a span,ul#nav_main li.patient-education a:link span { background:url(../images/buttons/btn-patient-education.gif) no-repeat; }
	ul#nav_main li.patient-education a:hover span,body.patient-education ul#nav_main li.patient-education a span { background:url(../images/buttons/btn-patient-education.gif) no-repeat 0 -53px; }
	
	ul#nav_main li.your-visit { width:108px; }
	ul#nav_main li.your-visit a span,ul#nav_main li.your-visit a:link span { background:url(../images/buttons/btn-your-visit.gif) no-repeat; }
	ul#nav_main li.your-visit a:hover span,body.your-visit ul#nav_main li.your-visit a span { background:url(../images/buttons/btn-your-visit.gif) no-repeat 0 -53px; }
	
	ul#nav_main li.contact-us { width:136px; }
	ul#nav_main li.contact-us a span,ul#nav_main li.contact-us a:link span { background:url(../images/buttons/btn-contact-us.gif) no-repeat; }
	ul#nav_main li.contact-us a:hover span,body.contact-us ul#nav_main li.contact-us a span { background:url(../images/buttons/btn-contact-us.gif) no-repeat 0 -53px; }
	
	
	#nav_supp { }
	#nav_supp, #nav_supp a, #nav_supp a:visited { color:#0386ab; text-decoration:none; }
	#nav_supp a:hover { color:#0386ab; text-decoration:underline; }
	
	
	/* =Header
	-----------------------------------------------------------------------------*/
	#branding { height:101px; background:url(../images/branding-right.jpg) no-repeat top right;}
	
	#branding h1 { width:323px; height:101px; margin:0; padding:0; position:relative; overflow:hidden; }
	#branding h1 span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(../images/logo.jpg) no-repeat; }
	
	/* =Three Column
	-----------------------------------------------------------------------------*/
	
	#three_column #content_main { height:290px; width:910px; background:url(../images/3col-content-main.jpg) no-repeat top left; }
	
	#three_column #content_main #flash { width:649px; float:left; }
	
	#three_column #content_main #quick-access { height:199px; width:261px; background:url(../images/quick-access-bg.jpg) no-repeat top right; float:right; }
	#three_column #content_main #quick-access h1 { width:136px; height:29px; margin:26px 0 0 21px; padding:0; position:relative; overflow:hidden; }
	#three_column #content_main #quick-access h1 span { width:100%; height:100%; position:absolute; background:url(../images/quick-access.gif) no-repeat; }
	#three_column #content_main #quick-access ul { list-style-type:none; margin:0; padding:0; }
	#three_column #content_main #quick-access ul li { color:#3f3f3f; margin:0 0 0 23px; padding:0; font-size:14px; line-height:40px;}
	#three_column #content_main #quick-access ul li a, 
	#three_column #content_main #quick-access ul li a:visited,
	#three_column #content_main #quick-access ul li a:hover { color:#3f3f3f; text-decoration:none; font-size:14px; }
	
	#three_column #content_main #callout { float:right; clear:right;}
	
	#three_column #content_sub { width:900px; background:#fff url(../images/3col-content-sub-bg.jpg) no-repeat top center; margin:0px 5px; padding-top:24px;}
	#three_column #content_sub .content { height:145px; background:url(../images/3col-content-sub-bottom.jpg) no-repeat bottom center; padding-bottom:35px;}
	
	#three_column #content_sub #welcome { width:360px; float:left; margin:0; padding:0 0 0 20px;}
	#three_column #content_sub #welcome h1 { width:362px; height:23px; margin:0; padding:0; position:relative; overflow:hidden; }
	#three_column #content_sub #welcome h1 span { width:100%; height:100%; position:absolute; background:url(../images/welcome.jpg) no-repeat; }
	#three_column #content_sub #welcome p {margin:5px 0 0 0; padding:0; line-height:16px; }
	
	
	#three_column #content_sub #specialty-areas { width:475px; float:right; }
	#three_column #content_sub #specialty-areas h1 { width:142px; height:23px; margin:0; padding:0; position:relative; overflow:hidden; }
	#three_column #content_sub #specialty-areas h1 span { width:100%; height:100%; position:absolute; background:url(../images/specialty-areas.jpg) no-repeat; }
	
	#three_column #content_sub #specialty-areas ul { float:left; width:205px; list-style-type:none; margin:0; padding:5px 30px 0 0; }
	#three_column #content_sub #specialty-areas ul li { border-bottom:1px solid #9cc9d4; padding:0px 0 2px 0; margin:0;}
	#three_column #content_sub #specialty-areas ul li a,
	#three_column #content_sub #specialty-areas ul li a:visited,
	#three_column #content_sub #specialty-areas ul li a:hover { margin:0; padding:0; text-decoration:none; }
	
	/* =Two Column
	-----------------------------------------------------------------------------*/
	#two_column #content_main { background: url(../images/2col-content-main-bg.jpg) repeat-y top left; width:688px; float:left; margin:0; padding:0; }
	#two_column #content_main .top { background:url(../images/2col-content-main-top.jpg) no-repeat top left; margin:0; padding:20px 0 0 0; }
	#two_column #content_main .bottom { background:url(../images/2col-content-main-bottom.jpg) no-repeat bottom left; min-height:350px; height:auto !important; height:350px; margin:0; padding:0 40px 50px 40px; }
	
	#two_column #content_sub {width:225px; float:left; margin-left:-4px; } 
	
	#two_column #content_sub #in-this-section { height:260px; background:url(../images/in-this-section-bg.jpg) no-repeat; padding:20px 0 0 22px;}
	
	#two_column #content_sub #in-this-section h1 { width:145px; height:16px; margin:0 0 8px 0; padding:0; position:relative; overflow:hidden; }
	#two_column #content_sub #in-this-section h1 span { width:100%; height:100%; position:absolute; background:url(../images/in-this-section.gif) no-repeat; }
	
	#two_column #content_sub .vcard {width:180px;}
	
	#two_column #content_sub #in-this-section ul { list-style-type:none; width:180px; margin:0; padding:0; background:url(../images/hr-bevel.gif) no-repeat top;}
	#two_column #content_sub #in-this-section ul li { color:#3f3f3f; margin:0; padding:0; background:url(../images/hr-bevel.gif) no-repeat bottom; }
	#two_column #content_sub #in-this-section ul li a, 
	#two_column #content_sub #in-this-section ul li a:visited,
	#two_column #content_sub #in-this-section ul li a:hover { display:block; color:#3f3f3f; text-decoration:none; font-size:12px; line-height:23px; margin:0 0 0 2px; padding:0;}
	
	
	#two_column #content_sub #callouts { margin:-8px 0 0 0; padding:0; }
	
	
	* html #two_column #footer { padding:10px 0 20px 0; }
	*+html #two_column #footer { padding:10px 0 20px 0; }
	
	
	/* =Driving Directions 
	-----------------------------------------------------------------------------*/
	#driving_directions { margin:0; padding:0; border:0; width:250px; height:220px; float:right; background:url(../images/directionsBg.gif) no-repeat;}
	#driving_directions h2 {width:250px; height:30px; margin:0; padding:0; position:relative;}
	#driving_directions h2 span {width:100%; height:100%; position:absolute; background:url(../images/directionsTop.gif) no-repeat;}
	#driving_directions form {margin:0; padding:0; border:0;}
	#driving_directions p {margin:3px 0; padding:0;}
	#driving_directions .dd-content {font-size:12px; padding:5px 10px 10px 30px ;}
	#driving_directions .dd-content input {margin:3px 0px;}
	#driving_directions .dd-bottom {width:250px; height:35px; text-align:center;}
	#driving_directions .dd-bottom #submitButton {margin:0px auto; padding:0; cursor:pointer;}
	
	/* =Vcard
	-----------------------------------------------------------------------------*/
	.vcard-dl {margin-top:10px; background: url(../images/vcard.gif) center no-repeat; background-position: 0 50%; width:180px;}
	.vcard-dl a {margin-left:25px; display:block;}
	
	
	/* =Footer
	-----------------------------------------------------------------------------*/
	#site_info,
	#site_info a, 
	#site_info a:visited { color:#0386ab; text-decoration:none;}
	#site_info a:hover { color:#0386ab; text-decoration:underline; }
	
	
	/* =Forms
	-----------------------------------------------------------------------------*/
	form { padding: 0.4em; margin: 0; }
	form em { color: #FF0000; }
	form p { clear: left; margin: 0; padding: 0; padding-top: 0.4em; }
	form p label { float: left; width: 25%; }
	
	fieldset { padding: 0.6em; padding-left: 0.7em; }
	fieldset legend { padding: 0; margin-bottom: 0.2em; font-weight: bold; color: #000000; font-size: 1.1em; }
	
	input.txt { width: 200px; }
	
	/*textarea {
	  width: 300px;
	  height: 100px;
	}
	*/
	
	.formerror {
	  border: 1px solid red;
	  background-color : #FFCCCC;
	  width: auto;
	  padding: 0.4em;
	  margin-bottom: 0.4em;
	}
	.formerror ul { padding-left: 1.7em; }
	
	
	/* =Tables
	-----------------------------------------------------------------------------*/
	td {
	  text-align: left;
	  vertical-align:top;
	}
	
	td.middle {
		vertical-align:middle;
	}
	
	/* =Misc 1
	-----------------------------------------------------------------------------*/
	.question { background: #FF0000; }
	.highlight { font-weight:bold; background:#FFFF00; }
	
	
	/* =Misc 2
	-----------------------------------------------------------------------------*/
	img.left { float:left; }
	img.right { float:right; }
	
	p.left { text-align:left; }
	p.right { text-align:right; }
	p.center { text-align:cetner; }
	
	.fn {font-weight:bold;}
	
	
	
	
}