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

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

@media screen {

	/* =General
	-----------------------------------------------------------------------------*/
	body {
	  padding: 0;
	  margin: 0;
	  background: #fff url(../images/bg.jpg) repeat-x;
	  font: 12px Arial, Helvetica, sans-serif;
	  color: #383838;
	  text-align: center; /* Centered design work around for IE 5.X and 6 in quirks mode. */
	  min-width: 942px; /* Centered design work around for Netscape 6. */
	  overflow: -moz-scrollbars-vertical;
	}
	
	/* Class for clearing floats */
	.clear { clear:both; height:0px;}
	* html .clear { clear:both; height:0px; margin:0; padding:0; font-size:0; margin-bottom:-2px;}
	
	/* Remove border around linked images */
	img { border: 0; }
	
	abbr {border-bottom:none; }
	
	p { margin: 0.8em 0; }
	
	h1, h2, h3, h4, h5 { margin: 0.4em 0; color:#01224c;}
	h1 { font-size: 1.5em; }
	h2 { font-size: 1.3em; color:#2b4c16; }
	h3 { font-size: 1.1em; }
	h4 { /* different color */ }
	h5 { /* different color */ }
	
	
	/* =Links
	-----------------------------------------------------------------------------*/
	a:link, a:visited { color: #2b4c16; }
	a:hover { color: #2b4c16; }
	
	a[href$='.pdf'] {
		display:inline-block;
		padding-right:22px;
		line-height:16px;
		background:transparent url(../images/icon_pdf.gif) no-repeat right center;
	}
	
	
	/* =Structure
	-----------------------------------------------------------------------------*/
	#container {
	  width: 942px;
	  margin: 0 auto;
	  text-align: left; /* Centered design work around for IE 5.X and 6 in quirks mode. */
	}
		
	#content { background: url(../images/content-middle.gif) repeat-y top left; }
	#content #top-texture { background:url(../images/content-top.jpg) no-repeat top left;}
	#content #bottom-texture { background:url(../images/content-bottom.jpg) no-repeat bottom left; height:425px !important; padding:20px 18px 0 18px;}
	#two_column #content #bottom-texture { background:url(../images/2col-content-bottom.jpg) no-repeat bottom left; min-height:425px; height:auto !important; height:425px; padding:15px 17px; }
	
	#three_column #footer { height:60px; margin:18px 0 20px 0; padding:75px 22px 0 22px; background:url(../images/footer-3col.jpg) no-repeat;}
	#two_column #footer { height:63px; margin:18px 0 20px 0; padding:25px 22px 0 22px; background:url(../images/footer-2col.jpg) no-repeat;}
	
	
	/* =Navigation
	-----------------------------------------------------------------------------*/
	ul#nav_main { height:43px; margin:0; padding:0; list-style-type:none; overflow:hidden;}
	ul#nav_main li { height:43px; float:left; position:relative; overflow:hidden; }
	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.meet-us { width:121px; }
	ul#nav_main li.meet-us a span,ul#nav_main li.meet-us a:link span { background:url(../images/buttons/btn-meet-us.gif) no-repeat; }
	ul#nav_main li.meet-us a:hover span,body.meet-us ul#nav_main li.meet-us a span { background:url(../images/buttons/btn-meet-us.gif) no-repeat 0 -43px; }
	
	ul#nav_main li.locations { width:122px; }
	ul#nav_main li.locations a span,ul#nav_main li.locations a:link span { background:url(../images/buttons/btn-locations.gif) no-repeat; }
	ul#nav_main li.locations a:hover span,body.locations ul#nav_main li.locations a span { background:url(../images/buttons/btn-locations.gif) no-repeat 0 -43px; }
	
	ul#nav_main li.for-parents { width:138px; }
	ul#nav_main li.for-parents a span,ul#nav_main li.for-parents a:link span { background:url(../images/buttons/btn-for-parents.gif) no-repeat; }
	ul#nav_main li.for-parents a:hover span,body.for-parents ul#nav_main li.for-parents a span { background:url(../images/buttons/btn-for-parents.gif) no-repeat 0 -43px; }
	
	ul#nav_main li.patient-services { width:177px; }
	ul#nav_main li.patient-services a span,ul#nav_main li.patient-services a:link span { background:url(../images/buttons/btn-patient-services.gif) no-repeat; }
	ul#nav_main li.patient-services a:hover span,body.patient-services ul#nav_main li.patient-services a span { background:url(../images/buttons/btn-patient-services.gif) no-repeat 0 -43px; }
	
	ul#nav_main li.new-patients { width:152px; }
	ul#nav_main li.new-patients a span,ul#nav_main li.new-patients a:link span { background:url(../images/buttons/btn-new-patients.gif) no-repeat; }
	ul#nav_main li.new-patients a:hover span,body.new-patients ul#nav_main li.new-patients a span { background:url(../images/buttons/btn-new-patients.gif) no-repeat 0 -43px; }
	
	ul#nav_main li.news { width:91px; }
	ul#nav_main li.news a span,ul#nav_main li.news a:link span { background:url(../images/buttons/btn-news.gif) no-repeat; }
	ul#nav_main li.news a:hover span,body.news ul#nav_main li.news a span { background:url(../images/buttons/btn-news.gif) no-repeat 0 -43px; }
	
	ul#nav_main li.contact-us { width:141px; }
	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 -43px; }
	
	#nav_sub { float:right; display:inline; text-align:right; color:#01224C; margin:15px 30px 0 0; padding:5px 10px;  background:url(../images/nav-sub.jpg) no-repeat; width:139px; height:15px; overflow:hidden; }
	#nav_sub a, 
	#nav_sub a:visited { color:#01224C; text-decoration: none; }
	#nav_sub a:hover { color:#01224C; text-decoration: underline; }
	
	#nav_supp { }
	#nav_supp a, 
	#nav_supp a:visited { color: #383838; text-decoration: none; }
	#nav_supp a:hover { text-decoration: underline; }
	
	
	/* =Header
	-----------------------------------------------------------------------------*/
	#branding { height:102px; background:url(../images/branding.gif) no-repeat; overflow:hidden; }
	
	#branding h1 { width:381px; height:95px; margin:0; padding-top:40px; position:relative; overflow:hidden; float:left; display:inline; }
	#branding h1 span { width:100%; height:100%; margin-top:-40px; position:absolute; cursor:pointer; background:url(../images/logo.gif) no-repeat; }
	
	#branding #phone { margin:60px 0 0 0; padding:0; color:#01224c; }
	#branding #phone .office-name { font-size:16px; margin:0px 15px 0 25px; padding:0;}
	#branding #phone .phone-number { font-size:20px; font-weight:bold; }
	
	/* =Three Column
	-----------------------------------------------------------------------------*/	
	
	#content #bottom-texture {height:445px;}
	
	#three_column #content_main { margin:0; padding:0; }
	
	#three_column #content_main #flash {width:509px; height:356px; overflow:hidden; float:left; margin:0;}
	
	#three_column #content_main #right { width:380px; float:right; }
	
	#three_column #content_main #quick-access { background:url(../images/quick-access.jpg) no-repeat; height:70px; width:356px; overflow:hidden; margin:0; padding:12px 0 0 20px; }
	
	#three_column #content_main #quick-access h2 { margin:0; padding:0; font-size:16px;}
	
	#three_column #content_main #quick-access a,
	#three_column #content_main #quick-access a:visited { color:#383838; text-decoration:none; }
	#three_column #content_main #quick-access a:hover { text-decoration:underline; }
	
	#three_column #content_main #quick-access ul { list-style-type:none; margin:3px 0 0 0; padding:0; float:left;}
	#three_column #content_main #quick-access ul.right {margin-left:40px;}
	#three_column #content_main #quick-access ul li { margin:0; padding:0 0 2px 20px; background:url(../images/quick-access-bullet.gif) no-repeat 0 center; }
	
	#three_column #content_main #welcome-news { background:url(../images/welcome-news.jpg) no-repeat; height:240px; width:336px; padding:17px 20px 0 20px; margin:15px 0 0 0; overflow:hidden; }
	
	#three_column #content_main #welcome-news h1 { font-size:18px; margin:0; padding:0; width:335px;}
	#three_column #content_main #welcome-news h2 { font-size:16px; margin:4px 0; padding:0; width:335px;}
	#three_column #content_main #welcome-news p { line-height:18px; margin:5px 0 10px 0; padding:0; width:335px;}
	#three_column #content_main #welcome-news ul { list-style-type:none; margin:0; padding:0; width:335px;}
	#three_column #content_main #welcome-news ul li {margin:0; padding:0 0 2px 0; line-height:18px;}
	#three_column #content_main #welcome-news ul li strong { color:#2b4c16; }
	
	#three_column #content_main #welcome-news ul li a,
	#three_column #content_main #welcome-news ul li a:visited {color: #2b4c16; text-decoration:underline;}
	#three_column #content_main #welcome-news ul li a:hover {text-decoration:underline;}
	
	#three_column #content_sub { position:absolute; margin:0; padding:0; top:535px; width:902px; overflow:hidden; clear:both;}
	#three_column #content_sub .callout {}
	#three_column #content_sub .callout .center {margin:0 60px;}
	
	
	/* =Two Column
	-----------------------------------------------------------------------------*/
	#two_column #banner { margin:0; padding:0; height:55px; width:909px; background:url(../images/banner.jpg) no-repeat;}
	#two_column #banner h1 { margin:0; padding:10px 25px 0 0; font-size:30px; color:#04598b; font-family:Arial, Helvetica, sans-serif; font-weight:normal; float:right; }
	
	#two_column #content_main {background:#fff; width:675px; margin:20px 0 5px 0; padding:0; float:right;}
		#two_column #content_main .t {background: url(../images/2col-cm-dot.gif) 0 0 repeat-x; width:100%; }
		#two_column #content_main .b {background: url(../images/2col-cm-dot.gif) 0 100% repeat-x; }
		#two_column #content_main .l {background: url(../images/2col-cm-dot.gif) 0 0 repeat-y; }
		#two_column #content_main .r {background: url(../images/2col-cm-dot.gif) 100% 0 repeat-y; }
		#two_column #content_main .bl {background: url(../images/2col-cm-bl.gif) 0 100% no-repeat; }
		#two_column #content_main .br {background: url(../images/2col-cm-br.gif) 100% 100% no-repeat; }
		#two_column #content_main .tl {background: url(../images/2col-cm-tl.gif) 0 0 no-repeat; }
		#two_column #content_main .tr {background: url(../images/2col-cm-tr.gif) 100% 0 no-repeat; padding:5px 15px 20px 15px;} 
	
	
	#two_column #content_sub {background:#fff url(../images/its.jpg) no-repeat; width:212px; margin:20px 0 190px 0; padding:0; float:left;}
		#two_column #content_sub .top { background:url(../images/in-this-section-img.jpg);}
		#two_column #content_sub .t {background: url(../images/2col-cm-dot.gif) 0 0 repeat-x; width:100%; }
		#two_column #content_sub .b {background: url(../images/2col-cm-dot.gif) 0 100% repeat-x; }
		#two_column #content_sub .l {background: url(../images/2col-cm-dot.gif) 0 0 repeat-y; }
		#two_column #content_sub .r {background: url(../images/2col-cm-dot.gif) 100% 0 repeat-y; }
		#two_column #content_sub .bl {background: url(../images/2col-cm-bl.gif) 0 100% no-repeat; }
		#two_column #content_sub .br {background: url(../images/2col-cm-br.gif) 100% 100% no-repeat; }
		#two_column #content_sub .tl {background: url(../images/its-tl.jpg) 0 0 no-repeat; }
		#two_column #content_sub .tr {background: url(../images/its-tr.jpg) 100% 0 no-repeat; padding:10px 1px;}
	
	#two_column #content_sub h2 {font-size:16px; margin:0 0 5px 15px;}
	
	#two_column #content_sub ul { list-style-type:none; margin:0; padding:0; border-top:1px solid #99bf81; border-bottom:25px solid #fff;}
	#two_column #content_sub ul li { border-bottom:1px solid #c5dbb7;}
	#two_column #content_sub ul li .title {display:block; background:#b6d1a5; text-decoration:none; color:#3d6921; padding:4px 15px 4px 15px; width:180px; font-size:13px; font-weight:bold; border-bottom:1px solid #c5dbb7;}
	#two_column #content_sub ul li a,
	#two_column #content_sub ul li a:visited {display:block; background:#fff; text-decoration:none; color:#3d6921; padding:4px 15px 4px 15px; width:180px; font-size:13px; font-weight:bold; }
	#two_column #content_sub ul li a:hover { background:#b6d1a5; text-decoration:none; }
	
	#two_column #content_sub ul li ul {border:0px; }
	#two_column #content_sub ul li ul li a,
	#two_column #content_sub ul li ul li a:visited {display:block; background:#fff; text-decoration:none; color:#3d6921; padding:4px 15px 4px 25px; width:170px; font-size:13px; font-weight:bold;}
	#two_column #content_sub ul li ul li a:hover {background:#b6d1a5; text-decoration:none;}
	
	
	/* =Footer
	-----------------------------------------------------------------------------*/
	#site_info { margin-top:7px; }
	#site_info a, 
	#site_info a:visited { color: #383838; text-decoration: none; }
	#site_info a:hover { 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; }
	
	.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;
	}
	
	/* =Lists
	-----------------------------------------------------------------------------*/
	#two_column #content_main ul { list-style-type:circle;}
	#two_column #content_main li { margin:0; padding:2px 0;}
	
	
	/* =Driving Directions 
	-----------------------------------------------------------------------------*/
	#driving_directions { margin:0; padding:0; border:0; width:250px; height:230px; float:right; background:url(../images/drivingDirections.jpg) no-repeat;}
	#driving_directions h2 {width:250px; height:35px; 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 .content {font-size:12px; padding:10px 20px;}
	#driving_directions .content input {margin:3px 0px; }
	#driving_directions .bottom {width:250px; height:35px; text-align:center;}
	#driving_directions .bottom #submitButton {margin:0px auto; cursor:pointer;}


	/* =Vcard
	-----------------------------------------------------------------------------*/
	.vcard {margin:0px; padding:0 15px;}
	
	
	/* =Health Library
	-----------------------------------------------------------------------------*/
	#health_library { width:650px; height:100%; font-size:12px; font-family:Arial, Helvetica, sans-serif;}
	#health_library .interactive {width:225px; margin:0; padding:0; border: 1px dashed  #FF0000; margin:0 10px 0 10px; padding: 10px; background: #f2f2f2 none repeat scroll 0%; line-height: 1.5em; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: #333333; float:right; }
	#health_library .interactive h2{ margin:0; padding:0;}
	#health_library .interactive img{ margin:0; padding:0 10px 0 0; float:left;}
	#health_library .interactive ul{ margin:0; padding:10px 0 0 15px;  }
	#health_library .interactive a:link{ text-decoration:none; }
	#health_library .interactive a:hover{ text-decoration:underline; }
	#health_library .interactive a:visited{ text-decoration:none; }
	
	#health_library .topics {width:350px; margin-bottom:10px; padding:10px; border: dashed 1px #CCCCCC;}
	#health_library .icons {margin-right:8px; float:left;}
	#health_library .txt {margin:0 0 0 45px;}
	
	/* =Misc 1
	-----------------------------------------------------------------------------*/
	.question { background: #FF0000; }
	.highlight { font-weight:bold; background:#FFFF00; }
	
	
	/* =Misc 2
	-----------------------------------------------------------------------------*/
	img.left { float:left; margin:0 10px 10px 0; }
	img.right { float:right; margin:0 0 10px 10px; }
	
	p.left { text-align:left; }
	p.right { text-align:right; }
	p.center { text-align:center; }
	p.small {font-size:10px;}
	
	
}