/*	my own additions	*/


/* use the following if needing to see how things are laid out */
/*	style="border: 1px solid black;	*/


/*

size of each page:	width = 960px
					height = header height + 'Need Help' column height + footer height
size of header:		width = 100%
					height = 160px
size of footer:		width = 100%
					height = padding and content determine size (see .footer in Site.css)

size of 'Need Help' column:	width = 200px
							height = 600px

size of content area:	width = 760px (20px margin + 720px + 20px margin)
						height = 600px (20px margin + 560px + 20px margin)

*/


/*	this applies to the content area on all pages.  
	all dynamic content for each page will be contained in this */ 

.input_fonts
{
    font-family:arial,helvetica,clean,sans-serif;
}

.page_content_block
{
	width: 720px;
	padding-top: 5px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 20px;
	float: left;
	background-color:#FFFFFF;
	min-height:600px;
}

/*	This section is for the master page header */

.badge_image
{
	margin: 10px 0px 0px 10px;
	float: left;
}

.title_block
{
	width: 700px;
	height: 110px;
	margin: 30px 0px 0px 30px;		/*	t, r, b, l */
	float: left;
}

.title_extended
{
	color: #C9A745;
	font-size: x-large;
	letter-spacing: 2px;
	font-style: oblique;
	float: left;
}

.subtitle_ple
{
	color: #FFFFFF;
	letter-spacing: 1px;
	font-weight: bold;
	float: left;
}

.subtitle_augp
{
	color: Aqua;
	letter-spacing: 1px;
	font-size: 1.5em;			/* x-large just seems to big */
	float: right;
}



/*	for contact information to the left of each page	*/
.contact_block
{
	background: #010823;
	width: 200px;
	float: left;
}

.contacts_block
{
	color: #FFFFFF;
	margin: 20px 0px 0px 15px;	/*	t, r, b, l */
}

.contact_header
{
	font-weight: 500;
	letter-spacing: 1px;
	font-style: oblique;
}

.contact_value
{
	margin-left: 15px;
	font-size: 11px;
}

/*	the following .contact_value a:<xxx> entries are for the email link in the contacts_block	
	I kind of want the link to be an 'anti-hyperlink' in looks	*/ 

/*	force the color to be white instead of the usual blue	*/
.contact_value a:link, .contact_value a:visited, .contact_value a:active
{
    color: white;
	text-decoration: none;
}

/*	change to a grayer color and underline.  Give a visual cue	*/
.contact_value a:hover
{
    color: #D6D6D2;
    text-decoration: underline;
}



/*
	
*/
img, a
{
	border:none;
}

.instruction_block_full_width
{
	width: 100%;
	float: left;
}

.instruction_block_3quarter_width
{
	width: 75%;
	float: left;
}

.instruction_block_onehalf_width
{
	width: 50%;
	float: left;
}

.instruction_block_onethird_width
{
	width: 33%;
	float: left;
}

.instruction_block_separator
{
	margin-top: 30px;
}

.instructions_title
{
    padding-left: 5px;
	font-size: medium;
	font-weight: bold;
	background-color: #EEEEDF;
}

.instructions_detail
{
    text-align: left;
	font-size: .95em;
    padding: 10px 10px 10px 10px;		/* t, r, b, l */
}

.instruction_list_items
{
 padding: 10px 0px 0px 20px;			/* t, r, b, l */
 line-height: 1.5em;
}


/*
	this next section refers to notification boxes (outlined within a thin black square)
*/

.notification_box
{
	border: 1px solid black;
}

.notification_box_title
{
	font-variant: small-caps;
	float: left;
	font-weight: bold;
	margin-left: 10px;
	font-size: .95em;
}

.notification_box_content
{
	margin: 5px 20px 10px 20px;		/* t, r, b, l */
	float: left;
	text-align: justify;
	font-size: .95em;
}

/*
	THIS NEXT SECTION IS USED TO LINE UP (IN A VERTICAL MANNER) INPUT COMPONENTS 

	what I have tried to do here is:

		1.	create a 3 column vertical layout
		
			|-------------------- vertical_input_block --------------------|
			||----- input_vertical_block_left -----||-------- ???? -------||
			|||---- input_horizontal_row_block ---|||
			||||----- cell stuff ----||-- ???? --||||
*/

.input_vertical_block
{
	width: 100%;
}

.input_vertical_block_left
{
	float: left;
	width: 60%;
}

.input_horizontal_row_block
{
	height: 25px;
}

.input_horizontal_cell_left
{
	width: 30%;
	float: left;
	padding-top: 5px;
	padding-right: 10px;
}

.input_horizontal_cell_right
{
	width: 65%;
	float: right;
}


.vertical_block
{
	float: left; 
	margin-bottom: 10px;
}

.horizontal_row_block
{
 padding-top: 3px;
 padding-bottom: 3px;
}

.horizontal_cell_left
{
	width: 30%;
	float: left;
}

.horizontal_cell_right
{
	width: 30%;
	float: right;
}


/*
	The following section is for the AJAX accordian component
*/

.accordion 
{
 width: 650px;
}  
          
.accordionHeader 
{  
    border: 1px solid #2F4F4F;  
    color: white;  
    background-color: #010823; 	 
    font-family: Arial, Sans-Serif;  
    font-size: 11px;  
    font-weight: bold;  
    padding: 5px;  
    margin-top: 5px;  
    cursor: pointer;  
}  
          
.accordionHeaderSelected 
{  
    border: 1px solid #2F4F4F;  
    color: #010823;  
    background-color: white;
    font-family: Arial, Sans-Serif;  
    font-size: 12px;  
    font-weight: bold;  
    padding: 5px;  
    margin-top: 5px;  
    cursor: pointer;  
}  
          
.accordionContent 
{  
    background-color: #D3DEEF;  
    border: 1px dashed #2F4F4F;  
    border-top: none;  
    padding: 5px;  
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 11px;
}

/*	for the contact page	*/

.contact_box
{
 padding-top: 15px;
}

.contact_instructions_title
{
 padding-left: 5px;
 padding-top: 3px;
 padding-bottom: 3px;
 font-size: .95em;
 font-weight: bold;
 color: White;
 background-color: #010823; 
}

.contact_input_block
{
	font-size: .95em;
    padding-top: 10px;
}


/*	these are used to nice space out into 2 columns any time mail to information is displayed	*/
.mail_to_entity
{
	float: left;
	font-weight: bold;
	color: #000000;
	letter-spacing: 1px;
	width:150px;
	margin-left: 5px;
}

.mail_to_detail
{
 float: left;
 margin-bottom: 10px;
}



/*	autocomplete locations	*/

.ac_completion_list 
{
border: solid 1px #444444;
margin: 0px;
padding: 2px;
height: 200px;
overflow: auto;
background-color: #FFFFFF;
}

/*	items in flyout	*/
.ac_completion_list_item
{
color: #1C1C1C;
}

.ac_completion_list_item_highlighted 
{
background-color: aqua;
}


/*	the sign out link contained in the master page	*/

.signout_block_full_width
{
 width: 100%;
 top: 0px;
}

.signout_placement
{
 float: right;
 margin-bottom: 10px;
 margin-right: 20px;
}

.signout_look
{
 color: Aqua;
 text-decoration: none;
}


/*	centers <h1>, <div> and <p> blocks	*/

.center_block_element
{
 margin-left: auto;
 margin-right: auto;
}

.large_font
{
 font-size: 1.2em;
}

.tab_content
{
 float: left;
 text-align: justify;
 font-size: 8pt;
 padding-right: 30px;
 width: 95%;
}

.tab_content_review
{
 float: left;
 text-align: justify;
 font-size: 7pt;
 width: 100%;
}

.tab_header
{
 width: 80px;
 text-align: center;
}

.tab_header_needs_validation
{
 background-color: #FF5050;
}

.tab_header_validated
{
 background-color: #66ff00;
}


.tab_entry_vertical_block
{
 width: 90%;
 margin-left: 30px;
 line-height: 25px;
 float: left;
}

.tab_entry_vertical_block_label
{
 width: 20%;
 float: left;
}

.tab_entry_vertical_block_entry
{
  width: 550px;
 float: left;
}

.tab_entry_vertical_block_note
{
 width: 10%;
 float: right;
}

.required_entry
{
 border: 2px solid #FF0000;		/* red  */
}

.valid_entry
{
 border: 2px solid #00FF00;		/* green  */
}

.required_label
{
 color: #FF0000;		/* red  */
}

.valid_label
{
 color: #339900;
}

.hide_component
{
 display: none;
}

.show_component
{
 display: inline;
}

.font_pushed_right
{
 float: right;
 margin-right: 10px;
 color: Black;
}

.center_horizontal_by_padding
{
 padding-left: auto;
 padding-right: auto;
}

.center_horizontal_by_margin
{
 margin-left: auto;
 margin-right: auto;
}


.submit_button_base
{
   font-size:10px;
   font-family:Arial,sans-serif;
   font-weight:bold;
   width:100px;
   height:25px;
   border-style:ridge;
   border-color:#000000;
   border-width:1px;
}

.submit_button_enabled
{
 background-color: #010823;
 color: #FFFFFF;
}

.submit_button_disabled
{
 background-color: #CCCCCC;
 color: #9999FF;
}

.fines_fees_ordinance_message
{
 font-variant: small-caps;
 /*margin-left: 10px;*/
 margin-bottom: 10px; 
 font-size: .90em;
 font-weight: bold;
 float: right;
 }


.button_block
{
 font-variant: small-caps;
 font-weight: bold;
 margin-left: 10px;
 font-size: 10pt;			/* this was 11px */
}


.error_message
{
 color: Red;
 font-size: 8pt;
 font-weight: bold;
}


.challenge_image
{
 float: left;
 margin-left: 5px;
}



.contact_tab_horizontal_block
{
 width: 95%;
 /*margin-left: 10px;*/
 line-height: 25px;
 float: left;
}

.contact_tab_horizontal_cell
{
 margin-left: 0px;
 float: left;
}

.contact_tab_horizontal_qtr
{
 width: 30%;
}

.contact_tab_horizontal_qtr_entry
{
 width: 160px;
}

.contact_tab_horizontal_small
{
 width: 15%;
 float: left;
}
.contact_tab_horizontal_smaller
{
 width: 10%;
 float: left;
}

.review_tab_vertical_block
{
 width: 100%;
/*margin-left: 30px;*/
 float: left;
 margin-bottom: 3px;
}

.review_tab_fake_label
{
 border: none 0px;
 background-color: Transparent;
 font-size: 8pt;
 font-weight: bold;
}

.review_tab_align_label_to_text
{
 padding-top: 2px;
}

.link_no_underline
{
 text-decoration: none;
}

.click_for_pdf_basic
{
 font-size: .80em;
 margin-left: 50px;
}

.center_standlone_text
{
 width: 100%;
 text-align: center;
}


/*
	for emergency contacts table on the 'Review' tab
*/

.ec_table_review_50_column_center_text
{
 width: 50px;
 text-align: center;
}