/**
 * portal_page.css
 * Stylesheet for the topdoghealth.com Portal Page
 * @author Tony Collings
 * @copyright Copyright (c) 2008, Tony Collings
 * @version 1.0 
 */
 
/*
 * NOTES: page_wrapper controls overall page width. This is set at 980px; 
 * Generally speaking leftcol = 580px and rightcol = 300px; 
 * Most fixed widths are calculated from this. 
 *
 */
 
/*	HTML OVERRIDES
	------------------------------------------------------------- */
	body, h1, h2, h3, table, ul, form {margin: 0px; padding: 0px; font: 12px/18px "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;}
	body {text-align: center; background: #fff url('img/bodyGradient.jpg') top left repeat-x; color: #555555; }
	a {color: #18516b; text-decoration: none; }
	a:hover {color: #18516b; text-decoration: underline; }
	h1,h2,h3 {line-height: 110%; }
	h1 {font-size: 22px; }
	h2 {font-size: 18px; }
	h3 {font-size: 14px; line-height: 18px; }
	table {font-size: 12px}
	th, td {padding: 5px; }
	ul {margin: 0px; }
	
/*	MODIFIERS
	------------------------------------------------------------- */
	.clear {clear: both; line-height: 1px; height: 1px; font-size: 1px; }
	.content {background: #fff url('img/content_gradient.jpg') bottom left repeat-x; }
	div.breadcrumbs {margin-bottom: 20px; color: #0088cc;}
	.floatleft {float: left; }
	.floatright {float: right; }
	.indent {display: block; margin-left: 20px; }
	

/*	LAYOUT
	------------------------------------------------------------- */
	#page_wrapper {width: 980px; margin: 0px auto; text-align: left; background-color: #fff; }
	#header { padding: 5px; background-color:#464646; height: 83px; } /* 83 = Size of Avatar */
	#header h1 {color: #fbfbfb; }
	#header a {color: #e4f2fd; }
	#header a:hover {color: #fff;}
	#header .headerLeft {float: left; padding: 20px 0px 0px 15px; height: 63px;}
	#header .user_greeting {float: left; height: 83px;}
	/* Header Navigation */
	div.navigation {background-color:#464646; width: 500px;  margin: 0px; vertical-align: bottom; padding-top: 54px; /* +1 to cover the div.clear height:1px */ text-align: right; float: right; _margin-bottom: -5px;  }
	div.navigation ul {

		margin-right: 14px;
		float: right;
		list-style: none;
	}
	
	div.navigation ul li {
		float: left;
	}
	
	#header div.navigation ul li a {
		font-weight: normal;
		display: block;
		line-height: 34px;
		padding: 0 10px;
		font-size: 14px;
		color: #999999;
		text-decoration: none; 
	}
	
	#header div.navigation ul li a:hover {
		color: #fff;
		text-decoration: none; 
	}
	
	#header div.navigation ul li a.current, #header div.navigation ul li#report_incident a.current{
		color: #555;
		background: #e4f2fd;
		-moz-border-radius-topleft: 3px;
		-khtml-border-top-left-radius: 3px;
		-webkit-border-top-left-radius: 3px;
		border-top-left-radius: 3px;
		-moz-border-radius-topright: 3px;
		-khtml-border-top-right-radius: 3px;
		-webkit-border-top-right-radius: 3px;
		border-top-right-radius: 3px;
		text-shadow: #c6d9e9 1px 1px 1px;
	}
	#header div.navigation ul li#report_incident a {
		background: #d54e21 url(http://s.wordpress.org/style/images/download-tab-bg.png) bottom left repeat-x;
		color: #fff;
		-moz-border-radius-topleft: 3px;
		-khtml-border-top-left-radius: 3px;
		-webkit-border-top-left-radius: 3px;
		border-top-left-radius: 3px;
		-moz-border-radius-topright: 3px;
		-khtml-border-top-right-radius: 3px;
		-webkit-border-top-right-radius: 3px;
		border-top-right-radius: 3px;
		text-shadow: #b5421c 1px 1px 1px;
	}
	
	#header div.navigation ul li#report_incident a:hover {
		color: #ffac90;
	}
	
	#header div.navigation ul li#report_incident a.current:hover {
		color: #555;
	}





	
		
		#titlebar {background-color: #e4f2fd; border-bottom: 1px solid #c6d9e9; }
		#titlebar h2 {font-family:Georgia, "Times New Roman", Times, serif; font-size: 24px; font-style:italic; color: #555555; padding: 20px;   }

		#menu ul {list-style-type: none; color: fff; background: #bbbbbb url('img/menuGradientUL.jpg') bottom left repeat-x; height: 40px;   }
		#menu ul li {display: block; float: left; margin: 0px; margin-right: 1px; background-color: #fff; vertical-align: middle;  }; 
		#menu ul li a { display: block; background: #d3d3d3 url('img/menuGradient.jpg') bottom left repeat-x; padding: 0px 20px; line-height: 40px;  color: #383838; text-decoration: none; }
		#menu ul li a:hover {background: #a1a1a1 url('img/menuGradient_over.jpg') bottom left repeat-x; color: #fff; text-decoration: none; }
		
		div.avatar_background {background: #464646 url('img/avatarBackground.jpg') top left no-repeat; margin-right: 20px; float: left; height: 83px; width: 83px; padding: 5px 0px 0px 5px; }
		div#greeting {float: left;  }
		/*
		div.report_incident {float: right; padding: 10px; margin: 10px; border: 1px solid #858585; }
		*/
		
	#footer {border-top: 1px solid #e5e5e5; padding: 10px 0px;font-size: 10px; text-align: center; }
		.footer_leftcol {float: left;  }
		.footer_rightcol {float: right;  }
		div.advertising {width: 100%; text-align: center; margin: 20px 0px; }
	#content {width: 980px; } /* Centers left and right cols */
	
	
	/*	PAGE SPECIFIC
		--------------------------------------------------------- */
		
		.leftcol,
		.rightcol {float: left; text-align: left; padding: 20px 10px; } /* 490px = 860px-50px(padding) (page width)/2 */
		.leftcol { width: 300px; }
		.rightcol { margin-left: 10px; width: 590px;  }
		

		
		/* Homepage */
		body#homepage .leftcol {width: 260px; padding: 10px; border-right: none;  }
		body#homepage .rightcol {width: 640px; padding: 10px; }
		
		/* The Search Box ! */
		div#the_big_search_box {margin: 5px 0px; padding: 10px; background-color: #e4f2fd; border: 1px solid #c6d9e9; clear: both; height: 300px; }
		div#search_box { padding: 20px 0px 0px 40px;  }
			div.search_left {float: left; width: 200px; padding-top: 30px; /* To affect bottom alignment for text */   }
			span.get_reports_txt {color: #464646; font-size: 24px; font-weight: lighter; }
			div.search_right {float: left; margin-left: 10px;   }
			div.search_options {color: #464646; margin-bottom: 10px; }
				.search_options a {color: #464646; }
				.search_options a:hover {color: #464646;}
			div.search_field {}
			
			div#zipSearchQuery,
			div#townSearchQuery,
			div.goButton {float: left; }
			
			div.login_register_text {color: #464646; margin-top: 20px;  }
		/* END Search box */
		#introduction {padding: 10px; }
		#incident_photos {height: 85px; margin-top: 10px;  }
		#incident_photos .incident_photo {border: 1px solid #c6d9e9; margin-right: 5px; }
		
		ul#topten {margin-top: 20px; }
		ul#topten li {list-style-type: none;  padding: 5px; font-weight: bold; color: #18536d; }
		ul#topten li a {color: #18536d; text-decoration: none; }
		ul#topten li a:hover { color: #464646; text-decoration: none;} 
		/* Lvl 2 */
		ul#topten ul {margin-top: 5px; }
		ul#topten ul li {font-weight: normal; margin-left: 10px; border-bottom: 1px solid #dadada;}
		
		div.incident {margin-top: 10px; width: 640px; }
			span.incident_added {color: #CCCCCC; font-size: 9px; }
			.incident_photo {float: left; border: 1px solid #c6d9e9; }
			.incident_photo img {margin: 3px; }
			.incident_details {float: left; margin-left: 10px; width: 500px; }
		

		body#homepage div#titlebar h2 {float: left;   }
		span.number {font-size: 18px;}
		div#statistics {float: right; margin-top: 5px; margin-right: 15px; }
		div.statistic {float: left; text-align: center; margin-left: 10px; border: 1px solid #c6d9e9; padding: 10px; color: #6fa5cf; }	


		/* View Incident Page */
		body#view_incident .leftcol {width: 580px;  }
		body#view_incident .rightcol {width: 300px;  }
		body#view_incident #content {padding: 20px; }
		body#view_incident #titlebar h2 {width: 600px; }
		body#view_incident #google_map {border:1px solid #464646; }
		#titlebar span.incident_edit {float: left; margin-top: 25px; }
		div#images {background-color: #f5fbff; border-bottom: 1px solid #e4f2fd; border-top: 1px solid #e4f2fd; padding: 5px; margin-bottom: 20px; padding-bottom: 10px; }
		.posting_times {color: #808080; font-size: 10px; margin-top: -2px; }
			/* Incident Status */
			#incident_status { margin-top: 20px; }
			#incident_status .status_description {clear: both; margin-bottom: 10px;  } 
			#incident_status .status_icon {float: left;  vertical-align: middle; margin-right: 10px; }
			#incident_status .status_icon img {vertical-align: middle; }
			#incident_status .status_button {float: left; }
			.fixed {padding: 10px; background-color: #d9f3d7; border: 1px solid #a1cf9d; color: #3b5a38;  }
			.not_fixed {padding: 10px; background-color: #f3b3b3; border: 1px solid #830f0f; color: #830f0f; }
			
		.location {margin: 10px 0px; }
		.location_title {font-size: 14px; }
		.google_ads {margin-top: 20px; }

		/* Paged Content {home:about:contact} */
		body#about .leftcol,
		body#contact .leftcol{width: 200px; float: left; }
		body#about .rightcol,
		body#contact .rightcol{}
		ul#leftcol_menu {}
		ul#leftcol_menu li {list-style-type: none; border-bottom: 1px solid #dadada; padding: 5px; font-weight: bold; color: #18536d; }
		ul#leftcol_menu li a {color: #18536d; text-decoration: none; }
		ul#leftcol_menu li a:hover { color: #464646; text-decoration: none;} 		
		
		
		
		/* Comments */
		.comment {margin-top: 20px; width: 580px; }
		.author_data{float: left; width: 200px;}
			.author_data img {float: left; }
			.author_metadata {float: left; margin-left: 10px; }
			span.username {font-size: 14px; }
			span.posted_time {font-size: 10px; font-weight: bold; }
		.comment_data{float: left; margin-left: 20px; width: 350px;   }
		ul#comment_tools {display: block; }
		ul#comment_tools li {list-style-type: none; display: inline; border-right: 1px solid #dedede; padding: 0px 10px; }
			ul#comment_tools li.firstitem {padding-left: 0px; }
			ul#comment_tools li.lastitem {border-right: none; }
		div.comment_editing_tools {}
			div.comment_editing_tools input {margin-right: 5px; }
		div#comments_wrapper {margin-left: 20px;  }
		div.leave_comment_wrapper {margin-top: 20px; margin-left: 220px; }
		div.incident_image {float: left; margin: 5px 5px 0px 0px; }
		
		/* Report Incident */
		body#report_incident #content {padding: 20px; }
		body#report_incident .leftcol {width: 460px; padding: 20px; border-right: none;   }
		body#report_incident .rightcol {width: 420px; padding: 10px; margin-top: 25px;  }
		
		/* Edit Incident */
		body#edit_incident #content {padding: 20px; }
		body#edit_incident .leftcol {width: 460px; padding: 20px; border-right: none;   }
		body#edit_incident .rightcol {width: 420px; padding: 10px;  margin-top: 25px; }
		

		/* Account Management */
		div#user_name {border: 1px solid #dadada; padding: 5px; margin-bottom: 20px;  }
		div#profile_sig {border: 1px solid #dadada; padding: 5px; margin-bottom: 20px; }
		div#user_avatar {float: left; margin-top: 5px; }
		div#user_description {float: left; margin-left: 20px; }
		ul#user_stats {color: #000; }
		ul#user_stats li {list-style-type: none; }
		span.grey {color: #888888; }
		
		ul#rightcol_menu {margin-top: 20px; }
		ul#rightcol_menu li {list-style-type: none; border-bottom: 1px solid #dadada; padding: 5px; font-weight: bold; color: #18536d; }
		ul#rightcol_menu li a {color: #18536d; text-decoration: none; }
		ul#rightcol_menu li a:hover { color: #464646; text-decoration: none;} 
		
		body#manage_profile .leftcol {width: 720px; padding: 20px; border-right: none;  }
		body#manage_profile .rightcol {width: 160px; padding: 10px; } 
		
		/* Search Results */
		
		body#search_results #google_map_wrapper {background: #fff url('img/googleMapShadow.jpg') top left no-repeat; width: 980px; height: 419px; }
		body#search_results #google_map {float: left; margin-top: 40px;  margin-left: 40px; width: 900px; height: 339px; _margin-left: 20px; }
		#google_map .loading {width: 100%; padding-top: 50px; text-align: center;  }
		span.incident_title {font-size: 18px; font-weight: normal; display: block; margin-right: 10px; float: left;  } 
		/* Register */
		body#register #content {padding: 20px; }


		/* Login */
		body#login #content {padding: 20px; }
		
		
		/* Report Content */
		body#report_content .leftcol {width: 200px; float: left; }
		body#report_content .rightcol { }
		
		/* Password Reset */
		body#password_reset #content {padding: 20px; width: 960px; }


				
/*	FORMS
	------------------------------------------------------------- */
	form {margin: 0px; padding: 0px;  }
	form fieldset {}
	form legend {display: none; visibility: hidden;}

	body#manage_account label,
	body#edit_incident label, 
	body#view_incident label, 
	body#report_content label,
	body#login label,
	body#password_reset label,
	body#register label,
	body#contact label,
	body#report_incident label {font-weight: bold;  display: block; clear: both;  }

	
	input, textarea, select, .textfield{
		font: 12px/18px "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
		padding: 3px;
	}

	/* Search Form on Homepage */
	form#searchForm input,
	form#searchForm select {font: 14px/18px "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;	padding: 3px;  }
	.searchFieldData {border: 2px solid #c6d9e9;}
	form#searchForm input#searchSubmitBtn {margin-left: 10px; }
	/* END Search Form */

	span.file_field {background-color: #eaeaea; border: 1px solid #d8d8d8; padding: 10px 20px; clear: both; display: block;  }
	
	span.asterisk {float: left; display: block; vertical-align: top; }
	
	
	.errors { border: 2px solid #bd4518; color: #bd4518;} 
	
	
	h2.errors,
	label.errors {color: #bd4518; border: none;  }
	
	
	div.errors {color: #bd4518; border: none;   }
	ul#error_messages {margin: 20px; margin-right: 0px; }
	ul#error_messages li {margin: 2px 0px; }
	

	
/*	MISCELLANEOUS
	------------------------------------------------------------- */
	
	#overlay{
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 90;
	background-color: #e7f3ff;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	line-height: 0px; 
	}
	/* Content Overlay */
	#map_wrapper {	
	position: absolute;
	left: 0px;
	top: 20px; 
	z-index: 100;
	text-align: center; 
	
	}
	
	#monthly_google_map {border:1px solid #c6dbef; }