/* CSS Document */
/* Create a Zeroing Selector -  Browsers tend to apply default margins on the body (and other elements) if they are not explicitly stated */ 
html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, td, tr, form, fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}

/* The body element provides you with an excellent opportunity to set some default settings. Take this opportunity to set your font properties and values and allow the rest of your document to inherit the settings you set here unless you override them. */

body {
	color: #777777;
	margin: 0px;
	padding: 0px;
	font: 12px Arial, Helvetica, sans-serif;
	text-align: center;
	background: #FFFFFF;
}

/* Find p elements in #content and if those p elements contain em elements, change the text color to #990000.*/

p em {
	color: #777777;
	font: 12px Arial, Helvetica, sans-serif;
	background: #F4F4F4;
}

/* Class styles let you set style attributes for any range or block of text, and can be applied to any HTML tag.*/

.bold {
	color: #666666;
	font: bold 12px Arial, Helvetica, sans-serif;
}

.hilite {
	background: #F4F4F4;
}

a:link {color: #FF9900; text-decoration: none;}
a:visited {color: #FF9900; text-decoration: none;}
a:hover {color: #003885; text-decoration: underline;}
a:active {color: #FF9900; text-decoration: none;}

h1 {
	font-size: 220%;
}

h2 {
	font-size: 190%;
}

h3 {
	font-size: 160%;
}

h4 {
	font-size: 130%;
	color: #003885;
}

h5 {
	font-size: 100%;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

h6 {
	font-size: 70%;
}

hr {
	border: 0;
	height: 1px;
	background: #CCCCCC;
}	

.hr_footer {
	border-top: 1px solid #666666;
}

.hr_page_title {
	margin-top: 5px;
	margin-bottom: 10px;
	border-top: 1px solid #C24600;
}

.hr_top_border {
	border-top: 1px solid #E6E6E6; /* #CCCCCC or #E6E6E6;*/
	margin-bottom: 5px;
	margin-top: 1px;
}

.hr_dotted {
	border-top: 1px dotted #BDBDBD;
	margin: 10px 2px 5px;
}

.hr_light {
	border-top: 1px solid #CCCCCC;
	margin-top: 5px;
	margin-bottom: 10px;
}

.hr_light2 {
	border-top: 1px solid #CCCCCC;
	margin-top: 8px;
}

/*Clearing Floats The Old Fashioned Way*/

.clearit {             /* Used primarily to clear nested_right_content_page_title - prevents horizontal and vertical scroll in firefox */
     clear:right; 
     height:0; 
     margin:0;
     font-size: 1px;
     line-height: 0;
}
	 
.clearit_right {             /* Same as .clearit - Used primarily to clear nested_right_content_page_title - prevents horizontal and vertical scroll in firefox */
     clear:right; 
     height:0; 
     margin:0;
     font-size: 1px;
     line-height: 0;
}	 
	 
.clearit_left {            /* Used primarily to clear multi leftimage and leftimage_detail */
     clear:left; 
     height:0; 
     margin:0;
     font-size: 1px;
     line-height: 0;
}	
	 
.clearit_both {
     clear:both; 
     height:0; 
     margin:0;
     font-size: 1px;
     line-height: 0;
}	
	 
.image_border {
	margin-right: 15px;
	margin-top: 3px;
	border: 1px dashed #496D9D;  /*#CCCCCC*/
	padding: 12px;
	margin-bottom: 5px;
	background: #F9FAFD;
}

.leftimage {
	margin-right: 10px;
	float: left;
	margin-top: 0px;
}

.leftimage_detail {
	margin-right: 15px;
	float: left;
	margin-top: 3px;
	border: 1px dashed #496D9D;  /*#CCCCCC*/
	padding: 12px;
	margin-bottom: 5px;
	background: #F9FAFD;
}
	
.rightimage {
	float: right;
	margin-left: 5px;
}
	 
.rightimage_detail {
	margin-left: 15px;
	float: right;
	margin-top: 3px;
	border: 1px dashed #496D9D; /*#CCCCCC*/
	padding: 12px;
	margin-bottom: 3px;
	background: #F9FAFD;
}
	
.image_media_player {
	background: url(../videos/images/media_player_125.gif) no-repeat;
	width: 125px;
	height: 123px;
}
	
.image_video {
	padding-top: 10px;
	padding-left: 8px;
}
	
.image_browser_window {
	background: url(../directory/images/browser_window_125.gif) no-repeat;
	width: 125px;
	height: 117px;
}
	
.image_link	{
	padding-top: 19px;
	padding-left: 5px;	
}
	
.image_link_detail {
	float: left;
	border: 1px dashed #496D9D;
	background: #F9FAFD; /*#F9FAFD;*/
	height: 137px;
	margin-right: 15px;
	margin-bottom: 5px;
	padding-top: 15px;
	padding-right: 15px;
	padding-left: 15px;
}
	
.image_picture_frame {
	float: left;
	border: 3px double #CCCCCC;  /*#CCCCCC*/
	padding: 10px;
	background: #F9FAFD;
	margin-top: 3px;
	margin-bottom: 3px;
	text-align: center;
}
	
.image_picture_frame_detail {
	margin-right: 15px;
	float: left;
	margin-top: 3px;
	border: 3px double #CCCCCC;  /*#CCCCCC*/
	padding: 12px;
	margin-bottom: 5px;
	background: #F9FAFD;
}
	
.image_news_article {
	background: url(../news/images/news_background.gif) no-repeat;
	width: 125px;
	height: 134px;
}
	
.image_news	{
	padding-top: 22px;
	padding-left: 20px;	
}	
	
.image_classified {
	background: url(../classifieds/images/classifieds_bg.gif) no-repeat;
	width: 125px;
	height: 125px;
}
	
.image_classified_ad {
	padding-top: 30px;
	padding-left: 5px;
}	
	
.image_picture_voting {
	background: url(../pics/images/picture_voting_bg.gif) no-repeat;
	width: 125px;
	height: 125px;
}
	
.image_pic {
	padding-top: 23px;
	text-align: center; /*padding-left: 9px;*/
}	
	
.image_banner {
	margin-top: 6px;
	background: #003885;
	border: 1px solid #FFE11D;
	padding: 14px;
	margin-bottom: 2px;
}	
	 
.text_banner {
	font: 10px Arial, Helvetica, sans-serif;
	color: #FFE11D;
}	

.security_image {
	border: 1px solid #CCCCCC;
	width: 161px;
	height: 45px;
}


/*Acts as a container element for all elements used on the page*/

#wrapper_popup {
	text-align: left;
	width: 90%;
	margin-right: auto;
	margin-left: auto;
	background: #FFFFFF;
	margin-top: 4px;
}
	 
#wrapper_popup ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}	 
	 
#wrapper_popup li {
	padding-left: 0.6em;
	background: url(../images/bullet.gif) no-repeat 0 0.4em;
}	 

.nested_left_content_page_title {
	float: left;
	margin-top: 8px;
}
	 
.nested_left_content_page_title a:link {color: #003885; text-decoration: underline;}
.nested_left_content_page_title a:visited {color: #003885; text-decoration: underline;}
.nested_left_content_page_title a:hover {color: #003885; text-decoration: underline;}
.nested_left_content_page_title a:active {color: #003885; text-decoration: underline;}	 

.nested_right_content_page_title {
	float: right;
	text-align: right;
	margin-top: 15px;
	margin-right: 2px;
}	

.page_title1 {
	font: 20px Arial, Helvetica, sans-serif;
	color: #64638B;
}

.page_title2 {
	font: 20px Arial, Helvetica, sans-serif;
	color: #003885;
}

.page_title3 {
	font: 22px Arial, Helvetica, sans-serif;
	color: #C24600;
}

.content_holder {
	overflow: auto;
	/*padding: 1px;*/ /*1px added all around so that table and Hlooper borders will show in Firefox */
}
	
.content_holder h1 {
	font: 12px Arial, Helvetica, sans-serif;
	background: #F4F4F4 url(../images/table_th_bck.gif) repeat-x;
	height: 18px;
	margin-bottom: 5px;
	padding: 5px;
	border: 1px solid #E6E6E6;
	margin-right: 2px;
	margin-left: 1px;
}

/*form fieldset {
	border: 1px solid #CCCCCC;
	padding: 3px 5px 10px;
	background: #F4F4F4 url(../images/table_tr_bck.gif) repeat;
}*/

.form_border {
	margin-bottom: 2px;
	border: 1px solid #E6E6E6;
	background: #F9FAFD;
	padding: 6px 8px 3px;
}

form { 
	width: 100%; /* set width in form, not fieldset (still takes up more room w/ fieldset width */
	font-family: Arial, Helvetica, sans-serif;
}

form fieldset {
	border: 1px solid #CCCCCC;
	padding: 3px 5px 10px;
	background: #FFFFFF;
}

form fieldset legend {
	font-size:1.1em;
	color: #666666;  /* be careful with padding, it'll shift the nice offset on top of border  */
	font-weight: bold;
}

form label {
	display: block;  /* block float the labels to left column, set a width */
	float: left;
	width: 150px;
	padding: 0;
	margin: 6px 8px 0 0;
}

form fieldset label:first-letter { /* use first-letter pseudo-class to underline accesskey, note that */
	text-decoration:underline;     /* Firefox 1.07 WIN and Explorer 5.2 Mac don't support first-letter */
                                   /* pseudo-class on legend elements, but do support it on label elements */
                                   /* we instead underline first letter on each label element and accesskey */
                                   /* each input. doing only legends would  lessens cognitive load */
                                   /* opera breaks after first letter underlined legends but not labels */
}

form input, form textarea, form select {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto; /* set margin on left of form elements rather than right of
                   label aligns textarea better in IE  - NOTE: I changed this as it was affecting 
				   the layout of the entire site*/
	margin-top: 3px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	border: 1px solid #CCCCCC;
}

form input#submit, form input#reset, form input#button  {
	color: #FFFFFF;
	cursor: hand;
	background: #768396;
	border-top: 1px solid #999999;
	border-right: 1px solid #666666;
	border-bottom: 1px solid #666666;
	border-left: 1px solid #999999;
	margin-right: 2px;
	margin-top: 5px;
}

form input#image {
	cursor: hand;
	border-style: none;
	margin: 0px;
	padding: 0px;
}

form textarea {
	overflow: auto;
	font-family: Arial, Helvetica, sans-serif;
}

form .form_required_field_info {
	display: block; /* instructions/comments left margin set to align w/ right column inputs */
	padding: 1px 3px;
	margin-bottom: 5px;
	background: url(../images/icon_cloverleaf.gif) no-repeat left center;
	text-indent: 10px;
	margin-top: 5px;
}

form .form_field_info {
	display: block;  /* block float the labels to left column, set a width */
	float: left;
	padding: 0;
	margin-top: 4px;
	margin-left: 0;
}

form .form_required_field_label { /* uses class instead of div, more efficient */
	background: url(../images/icon_cloverleaf.gif) no-repeat right center;
} 

form br {
	clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}

/* End Form Content */


/* Start Table Content/
/* 
	Grey Suits you Sir. Please host the images on your own server.
	written by Stuart Colville http://www.muffinresearch.co.uk
*/
table {
	width: 99.5%;  /*99.5% added for Opera in order to remove horizontal scroll*/
	margin-bottom: 3px;
	border: 1px solid #E6E6E6;
	margin-left: 1px; /*1px added for Firefox in order to view table left border */
	margin-top: 1px; /*1px added for Firefox in order to view table left border */
}

caption {
	text-align: left;
	padding: 7px;
	background: #F9FAFD;
}

table,td {
	border-collapse: collapse;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.5;
	border: 1px solid #E6E6E6;
}

thead th, tbody th {
	background: #F4F4F4 url(../images/table_th_bck.gif) repeat-x;
	color: #666666;
	padding: 5px;
	border-left: 1px solid #E6E6E6;
	text-align: center;
	font-weight: normal;
}

tbody th {
  background: #FAFAFA;
  border-top: 1px solid #CCCCCC;
  text-align: center;
  font-weight: normal;
}

tbody tr td {
	padding: 5px 2px 5px 5px;
	color: #666666;
}

tbody tr:hover {
  background: #FFF url(../images/table_tr_bck.gif) repeat;
}

tbody tr:hover td {
  color: #666666;
}

tfoot td, tfoot th {
	border-top: 1px solid #CCCCCC;
	padding: 5px;
	background: #F4F4F4 url(../images/table_foot_bck.gif) repeat;
	color: #666666;
	text-align: center;
	border-bottom: 1px solid #CCCCCC;
}

thead th a:link {color: #666666; text-decoration: underline;}
thead th a:visited {color: #666666; text-decoration: underline;}
thead th a:hover {color: #003885; text-decoration: underline;}
thead th a:active {color: #666666; text-decoration: underline;}

/* End Table Content */