/* global css document for medfordcommons.com */

*
	{	/* whole document application */		
		font-family: Arial, Helvetica, sans-serif;
		font-size: 10pt;
		color: #000;
	}
body
	{	/* body */
		background: transparent url(../images/bg.jpg) repeat-x;
		background-color: #A0B6C2;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
	}
.full_container
	{
		width: 100%;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		border: none;
	}
.body_container
	{
		width: 756px;
		margin: 0 auto;
		padding: 0 0 0 0;
	}
	
/* GLOBAL TEXT CSS */
/* ########## */
p
	{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 10pt;
		color: #000;
	}
p.f_right
	{
		float:right;
		margin: 0 0 0 0;
	}
p.signature
	{
		text-align: right;
		font-size: 12pt;
		font-weight: normal;
		color: #A6BC09;
		margin: 0 0 0 0;
	}
p.footer
	{
		font-size: 8pt;
	}
p.red
	{
		color: #910000;
	}
h2
	{	/* scramble bg header */
		/* goes behind h3 */
		font-size: 32pt;
		font-weight: bold;
		color: #F0F0F0;
		line-height: 0em;
		margin: 30px 0 0 0;
		width: 300px;
		font: bold 32pt/6px Arial, Helvetica, sans-serif;
	}
h3
	{
		/* green header */
		/* appears over h2 */ 
		font-size: 16pt;
		font-weight: bold;
		color: #A6BC09;
		margin: -25px 0 0 0;
	}
h4
	{
		/* black bold */
		/* appears under h3 */
		font-size: 12pt;
		font-weight: bold;
		color: #000;
		margin: 20px 0 20px 0;
	}
h5
	{	/* green w/ no adjusted margins */
		font-size: 14pt;
		font-weight: bold;
		color: #A6BC09;
		margin: 0 0 0 0;
	}
strong
	{
		/* global strong */
		font-size: 12pt;
		font-weight: bold;
		color: #000;
		margin: 0 0 0 0;
	}
a
	{
		/* global a */
		font-size: inherit;
		font-weight: inherit;
		color: #003366;
		text-decoration: underline;
	}
a:hover
	{
		text-decoration: none;
	}
a.external
	{
		padding: 0 12px 0 0;
		background: url(../images/external_link_bg.jpg) right no-repeat;
	}
a.back_to_top
	{
		padding: 0 0 0 12px;
		background: url(../images/icon_back_to_top.jpg) left no-repeat;
	}
a.bland
	{
		text-decoration: none;
	}
a.bland:hover
	{
		color: #A6BC09;
	}
img
	{
		border: none;
	}
	
/* span link for javascript functions */
span.link
	{
		color: #003366;
		text-decoration: underline;
	}
span.link:hover
	{
		text-decoration: none;
		cursor: pointer;
	}
/* HEADER CSS */
/* ########## */
.header_container
	{	/* full width holding all header */
		position: relative;
		width: 100%;
		height: auto;
	}
.header
	{	/* holding header */
		position: relative;
		width: 756px;
		height: 123px;
		background: transparent url(../images/header.jpg) no-repeat;
	}
.header .logo
	{
		position: absolute;
		top: 13px;
		left: 22px;
		width: 282px;
		height: 89px;
		/* background-color: red; DEBUG:LOCATION */
	}
.header .headline
	{
		/* white headline top right */
		position: absolute;
		color: #FFF;
		font-weight: bold;
		font-size: 8pt;
		top: 5px;
		left: 420px;
		width: 500px;
	}
.header .epa
	{
		/* epa logo w/ link */
		position: absolute;
		height: 120px;
		width: 120px;
		top: 0px;
		left: 315px;
	}	
.header .epa a
	{
		position: absolute;
		height: 120px;
		width: 120px;
	}
/* NAVIGATION CSS */
/* ########## */

div.navigation
	{	/* navigation temporary holder */
		position: relative;
		width: 750px;
		height: 60px;
		margin: 0 auto;
		background: transparent url(../images/navigation_bg.jpg) repeat-x;
		background-color: #FFF;
		padding: 10px 0 0 0;
		text-align: left;
	}
ul.navigation
	{	/* btn holding ul */
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		width: 750px;
		list-style: none;
	}
ul.navigation .btn
	{	/* actual li buttons */		
		background: url(../images/navigation_seperation.gif) right top repeat-y;
		display: inline;
		padding: 9px 7px 7px 9px;
		margin: 0 0 0 0;

	}
ul.navigation .btn a
	{	/* a overlaying all li btn's */
		position: relative;
		top: 0;
		left: 0;
		width: auto;
		height: 35px;
		color: #FFF;
		font-weight: bold;
		text-decoration: none;
	}
ul.navigation .btn a:hover
	{	/* hovering a on main links */
		text-decoration: underline;
	}

/* ||||||||||||||||| NAVIGATION ARROWS |||||||||||||*/
/* each arrow is absolute and is specific to it's 	*/
/* corresponding button. You will have to modify	*/
/* these if the main buttons are changed			*/
.arrow_home
	{	/* arrow that points from main btn */
		/* to submentu section */
		position: absolute;
		height: 13px;
		width: 19px;
		top: 30px;
		left: 15px;
		background: url(../images/navigation_arrow.gif) no-repeat;
		
	}
.arrow_what
	{	/* arrow that points from main btn */
		/* to submentu section */
		position: absolute;
		height: 13px;
		width: 19px;
		top: 30px;
		left: 120px;
		background: url(../images/navigation_arrow.gif) no-repeat;
		
	}
.arrow_project
	{	/* arrow that points from main btn */
		/* to submentu section */
		position: absolute;
		height: 13px;
		width: 19px;
		top: 30px;
		left: 260px;
		background: url(../images/navigation_arrow.gif) no-repeat;
		
	}
.arrow_benefits
	{	/* arrow that points from main btn */
		/* to submentu section */
		position: absolute;
		height: 13px;
		width: 19px;
		top: 30px;
		left: 365px;
		background: url(../images/navigation_arrow.gif) no-repeat;
		
	}
.arrow_contact
	{	/* arrow that points from main btn */
		/* to submentu section */
		position: absolute;
		height: 13px;
		width: 19px;
		top: 30px;
		left: 360px;
		background: url(../images/navigation_arrow.gif) no-repeat;
		
	}
/* ||||||||||||||||| NAVIGATION ARROWS |||||||||||||*/

	
/* SUB NAVIGATION SECTION */
ul.navigation_sub
	{	/* btn holding ul */
		margin: 0 0 0 0;
		padding: 20px 0 0 0;
		
		list-style: none;
	}
ul.navigation_sub .btn_sub
	{	/* actual li buttons */		
		background: url(../images/navigation_sub_seperation.gif) right center no-repeat;
		display: inline;
		padding: 12px 12px 12px 12px;
		margin: 0px 0 0 0;

	}
ul.navigation_sub .btn_sub a
	{	/* a overlaying all li btn's */
		position: relative;
		top: 0;
		left: 0;
		width: auto;
		height: 35px;
		color: #938463;
		font-weight: normal;
		text-decoration: none;
	}
ul.navigation_sub .btn_sub a:hover
	{	/* hovering a on main links */
		text-decoration: underline;
	}
/* CONTENT CSS */
/* ########## */
#content_container
	{
		/* full  width holding navigation and content for shadow */
		position: relative;
		width: 756px;
		height: auto;
		background: transparent url(../images/content_bg.jpg) repeat-y;
		padding: 0 0 0 0;
		margin: 0 0 0 0;
		
	}
#narrow_content
	{	/* top content holder */
		position: relative;
		width: 450px;
		height: auto;
		min-height: 600px;
		padding: 0 20px 20px 40px;
	}
.bottom_content
	{	/* brown bottom content holder */
		position: relative;
		width: 675px;
		height: auto;
		padding: 0 0 0 0;
		background-color: #DDDAAF;
		border: 1px solid #CDC6C2;
		margin: 20px 0 20px 0;
	}
.bottom_content_container
	{	/* white box inside of brown container */
		/* its ok to use pixels on width - box is fixed */
		position: relative;
		height: auto;
		width: 610px;
		margin: 10px 20px 10px 20px;
		padding: 10px 10px 10px 10px;
		background-color: #F8F8F8;
		border: 1px solid #CCC69D;
		
	}
.bottom_content_top_corners
	{	/* top corners of bottom content */
		position: relative;
		width: 677px;
		height: 11px;
		margin: -1px 0 0 -1px;
		background: transparent url(../images/btm_content_top_corners.gif) no-repeat;
	}
.bottom_content_btm_corners
	{	/* bottom corners of bottom content */
		position: relative;
		width: 677px;
		height: 11px;
		margin: -1px 0 -1px -1px;
		background: transparent url(../images/btm_content_btm_corners.gif) no-repeat;
	}
.usr_white
	{	/* holds the  s in white box */
		position: relative;
		width: 590px;
		height: auto;
		margin: 0 0 0 0;
		padding: 10px 10px 10px 10px;
		background-color: #F8F8F8;
		border: 1px solid #E5E5E5;
	}
.usr_color
	{	/* holds the  s in color box */
		position: relative;
		width: 590px;
		height: auto;
		margin: 0 0 0 0;
		padding: 10px 10px 10px 10px;
		background-color: #F8F8F8;
		background: transparent url(../images/usr_comments_bg.gif) repeat;
		border: 1px solid #E5E5E5;
	}
.report
	{
	color: #910000;
	font-size: 8pt;
	float: right;
	background: transparent url(../images/report_comment_icon.gif) top left no-repeat;
	padding: 0 0 5px 20px;
	margin: -3px -3px 0 0;
	text-decoration: none;
	}
.report:hover
	{
	text-decoration: underline;
	
	}
.image_holder_right
	{	/* image holder floating right */
		float: right;
		clear: both;
		width: auto;
		height: auto;
		border: 0;
		text-align: center;
		margin: 0 20px 20px 20px;
		padding: 0 0 20px 0;
	}	        

/* LIST FOR SITE MAP */
ul.map li
	{
	color: #A6BC09;
	list-style: square;
	}
ul.map a
	{
	font-size: 11pt;
	color: black;
	text-decoration: none;
	}
ul.map a:hover
	{
	text-decoration: underline;
	}

ul.map li ul li a
	{
	font-size: 10pt;
	}
ul.map li ul li ul li a
	{
	font-size: 8pt;
	}


/* RECENT CSS */
/* ########## */
.show_hide_btn
	{
		float: right;
		background: transparent url(../images/plus.gif) no-repeat;
		background-position: 60px 1px;
		width: 80px;
		height: auto;
		margin: -10px 35px 0 0;
	}
.show_hide_btn a
	{
		font-size: 8pt;
		text-decoration: none;
	}
.show_hide_btn a:hover
	{
		text-decoration: underline;
	}
.recent_updates
	{	/* box WITHOUT background image */
		position: absolute;
		width: 255px;
		height: auto;
		top: -70px;
		left: 520px;
		background-color: #F2F2F2;
		border: 1px solid #D0D0D0;
		padding: 10px 10px 10px 10px;
	}
#recent_updates_img
	{	/* box WITH background image */
		position: absolute;
		width: 254px;
		height: auto;
		top: -90px;
		left: 505px;
		background-color: #F2F2F2;
		background: transparent url(../images/recent_updates_bg.gif) no-repeat;
		padding: 30px 0px 10px 10px;
	}
#recent_updates_img_hide
	{	/* box WITH background image */
		position: absolute;
		width: 254px;
		height: auto;
		top: -90px;
		left: 505px;
		background-color: #F2F2F2;
		background: transparent url(../images/recent_updates_bg.gif) no-repeat;
		padding: 30px 0px 10px 10px;
	}
#recent_updates_img h3
	{
		font-size: 10pt;
		margin: 0 0 0 0;
		width: 210px;
	}		
#recent_updates_img p
	{
		font-size: 9pt;
		width: 210px;
		margin: 10px 0 0 0;
	}
#recent_updates_img hr
	{
		height: 1px;
		width: 180px;
		color: #CECECE;
		text-align: center;
		margin: 10px 0 10px 0; /* align for mozilla */
		padding: 0 0 0 0;
	
		border: 1px solid #CECECE;
		border-bottom: none;
	}
	
/* FOOTER CSS */
/* ########## */
div.footer
	{
		width: 680px;
		text-align: center;
	}
.printer_friendly
	{
		/* text WITH printer image */
		background-color: #F2F2F2;
		background: transparent url(../images/printer.jpg) right top no-repeat;
		height: 25px;
		text-align: right;
		width: 650px;
		padding: 1px 40px 0 0;
	}

/* MISC CSS */
/* ########## */
ul.phases
	{
		list-style: none;
		margin: 40px 0 0 0;
		padding: 0 0 5px 0;
		width: 409px;
		border-bottom: 1px solid #000;
	}
ul.phases li
	{
		display: inline;
		margin: 0 4px 0 0;
	}
ul.phases li a.active
	{
		color: #000;
		border: 1px solid #000;
		border-bottom: 2px solid #FFF;
		background: #FFF;
		padding: 5px 5px 5px 5px;
		text-decoration: none;
		font-weight: bold;
	}
ul.phases li a.active:hover
	{
		background: #FFF;
	}
ul.phases li a
	{
		color: #FFF;
		border: 1px solid #000;
		background: #6C6C6C;
		padding: 5px 5px 5px 5px;
		text-decoration: none;
		font-weight: bold;
	}
ul.phases li a:hover
	{
		background: #000;
	}
.contact_holder
	{
		float: left;
		clear: none;
		width: 155px; 
		height: 198px; 
		padding: 20px 0 0 0;
		margin: 0 10px 0 0;
		background: url(../images/contact_bg.jpg) repeat-x;
	}
.contact_holder .column
	{
		position: absolute;
		width: 135px;
		height: 198px;	
		padding: 20px 10px;
	}
.contact_holder #left
	{
		top: 15px;
		left: 40px;
	}
.contact_holder #center
	{
		top: 0;
		left: 140px;
	}
.contact_holder #right
	{
		top: 0;
		left: 150px;
	}
.contact_holder .seperator
	{
		position: absolute;
		height: 196px;
		width: 1px;
		background: url(../images/contact_seperator.jpg) no-repeat;
	}
.contact_holder #left_sep
	{
		top: 2px;
		left: 147px;
	}
.contact_holder #right_sep
	{
		top: 2px;
		left: 145px;
	}
.contact_holder h3
	{
		font-size: 10pt;
		margin: 0 0 0 0;
	}
.contact_holder p
	{
		font-size: 9pt;
	}
.contact_holder a
	{
		font-size: 8pt;
	}
.video_holder
	{
		position: relative;
		height: 200px;
		width: 400px;
		padding: 20px 0 0 20px;
		margin: 0 0 0 0;
		background: url(../images/video_bg.jpg) repeat-x;
	}
.lithia_cont_holder
	{
		width: 110px;
		margin: 0 10px 5px 0px;
		padding: 15px;
		/* 
		background: url(../images/lithia_bg.jpg) repeat;
		*/
		border: 3px dotted #B0B0B0;
		background-color: #F0F0F0;
	}
.lithia_cont_holder#home { margin: 0 10px 5px 0px; float: left; height: 160px; }
.lithia_cont_holder#cont { margin: 3px 0 0 0; float: right; height: 155px; }
.lithia_cont_holder h3 { font-size: 10pt; margin: 0 0 0 0; }
.lithia_cont_holder p { font-size: 9pt; }
.lithia_cont_holder a { font-size: 8pt; }
span.extra_contact
{
	font-size: 10pt;
	width: auto;
	height: auto;
	padding: 8px 40px 8px 8px;
	background: transparent url(../images/extra_arrow.jpg) top right no-repeat;
	background-color: #F0F0F0;
	border: 3px dotted #B0B0B0;
	color: #003366;
	text-decoration: underline;
}
span.extra_contact:hover
{
	text-decoration: none;
	cursor: pointer;
}
.nodisp
	{
		display: none;
	}
#nodisp
	{	/* used for javascript swaps */
		display: none;	
	}
hr
	{	/* global hr */
		height: 9px;
		width: 100%;
		color: #F8F8F8;
		text-align: center;
		margin: 20px 0 0 0;
		padding: 0 0 0 0;
	
		border-top: 1px solid #DFDFDF;
		border-right: none;
		border-left: none;
		border-bottom: 1px solid #DFDFDF;
	}
hr.dotted
	{	/* dotted hr used in usr  s */
		height: 4px;
		width: 100%;
		text-align: center;
		margin: 10px 0 10px 0;
		padding: 0 0 0 0;
		
		border-top: 3px dotted #BDB4AD;
		border-right: none;
		border-left: none;
		border-bottom: none;
	}
.form
	{	/* global form */
		color: #003366;
		background: url(../images/form_bg.jpg) repeat;
		border: 1px solid #C7C7C7;
		margin: 0 0 0 0;
		padding: 5px 5px 5px 5px;
		width: 300px;
	}
.form_disabled
	{	/* global form */
		color: #7a8b9d;
		background: url(../images/form_bg_disabled.jpg) repeat;
		border: 1px solid #C7C7C7;
		margin: 0 0 0 0;
		padding: 5px 5px 5px 5px;
		width: 300px;
	}
.form_checkbox
	{	/* global form */
		color: #003366;
		background: url(../images/form_bg.jpg) repeat;
		border: 1px solid #C7C7C7;
		margin: 0 0 0 0;
		padding: 5px 5px 5px 5px;
	}
.form_btn
	{	/* form btn */
		border: 1px solid #CFCFCF;
		background-color: #F2F2F2;
		color: #A6BC09;
		font-size: 12pt;
		font-weight: normal;
		padding: 3px 3px 3px 3px;	
	}
/* testing css */
/* remove before going live */