/****************************************
CSS Document for Kent Medway Air Quality 
www.kentair.org.uk
AEA Energy & Environment
****************************************/

body {
	margin:0px;
	padding:0px;
	font-size:0.75em;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	background-color:#FFFFFF;
}
h1 {
	margin:0px;
	padding:0px;
	color:#FFFFFF;
	font-weight:normal;
	font-size:180%;
	padding-top:15px;
}
h2 {
	margin:0px;
	padding:0px;
	font-weight:normal;
	font-size:180%;
}
h3 {
	margin:0px;
	padding:0px;
	margin-top:15px;
	font-weight:normal;
	font-size:140%;
	color:#003399;
}
h5 {
	color:#FFFFFF;
	font-weight:bold;
	margin:0px;
	padding:0px;
	margin-top:5px;
	font-size:90%;
}
p, 
dd,
li {
	line-height:140%;
	margin-bottom:10px;
}
ul {
	margin:0px;
	padding:0px;
	margin-left:20px;
}
li {
	margin-bottom:5px;
}
ul li ul { /* Nested ULs*/
	margin-top:5px;
}
dt {
	font-weight:bold;
	background-color:#EEEEEE;
	padding:4px;
}
dd {
	margin:0px;
	padding:0px;
	margin-bottom:10px;
	color:#333333;
}

/* -- Layout ------------------------------------------ */

#wrapper { 
	/* Swap this value around to change between fixed and relative widths */
	width:770px;
	width:99%;
}
#content_wrapper {
	clear:both;
}
#content {
	margin-left:185px;
	padding-bottom:10px;
}
* html #content { /* Fix for IE's 3 pixel jog bug */
	float:left;
	margin-left:5px;
}
#side_nav {
	float:left;
	height:auto;
	width:170px;
	margin-right:10px;
}
#top_bar {
	font-size:90%;
	color:#333333;
	background-image:url(../images/bg_top_bar.gif);
	background-repeat:repeat-x;
	text-align:left;
	padding-top:5px;
	padding-right:10px;
	padding-bottom:5px;
	text-align:right;
	
}
/* --- Classes for header bar image ---- */
.tb_moathouse {
	background-image:url(../images/topbanner_moathouse.jpg);
}
.tb_bridge {
	background-image:url(../images/topbanner_bridge.jpg);
}
.tb_oasthouses {
	background-image:url(../images/topbanner_oasthouses.jpg);
}
.tb_castle {
	background-image:url(../images/topbanner_castle.jpg);
}
/* --- --- */
#header_bar {
	position:relative;
	background-position:top right;
	background-repeat:no-repeat;
	background-color:#758DBD;
	height:76px;
	padding-left:185px;
}
#blue_bar {
	background-color:#758DBD;
	padding-top:4px;
	line-height:220%;
	color:#FFFFFF;
	margin-bottom:10px;
}
#footer {
	clear:both;
	font-size:85%;
	border-bottom:3px solid #758DBD;
}
#footer img {
	margin:0px 5px 5px 5px;
	float:left;
	margin-right:15px;
}
#header_map_overlay {
	position:absolute;
	top:-15px;
	left:10px;
	width:160px;
	height:106px;
	background-image:url(../images/kent_map.png) !important; /*Due to IE6- PNG support, all browsers will use png except IE6- */
	background-image:url(../images/kent_map.gif);
	background-position:top;
	background-repeat:no-repeat;
}

#breadcrumb {
	color:#777777;
	text-align:right;
	padding-right:10px;
	font-size:85%;
	margin-bottom:8px;
	margin-top:2px;
}

#blue_grey_subset,
#blue_grey_subset_small {
	margin-top:7px;
	margin-bottom:7px;
	background-image:url(../images/bg_blue_grey_fade.gif);
	background-color:#D5DBE7;
	background-repeat:repeat-x;
	width:99%;
	width:567px;
	border:1px solid #CCCCCC;
	height:45px;

}
#blue_grey_subset_small {
	width:100px;
}
#thumbnails {
	margin-top:4px;
	clear:both;
}
#thumbnails div {
	width:81px;
	float:left;
	font-size:90%;
}
#arrow_left, 
#arrow_right {
	position:relative;
	top:-3px;
}

/* -- Useful ------------------------------------------ */
.green {
	color:#006600;
}
.bold {
	font-weight:bold;
}
.red {
	color:#FF0000;
}
.orange {
	color:#FF6600;
}
.maroon {
	color:#990000;
}
.darkgrey {
	color:#333333;
}
.mediumgrey {
	color:#888888;
}

.clear {
	clear:both;
	height:1px;
}
.valign {
	vertical-align:middle;
}
#blue_grey_subset .percent70 {
	margin:2px;
	float:left;
	line-height:1.5em;
	width:64%;

}
#blue_grey_subset .percent30 {
	margin:2px;
	float:left;
	width:34%;
}
.thumbnail {
	border:1px solid #CCCCCC;
	margin:0px 10px 10px 0px;
}

div.site a {
	text-decoration:none;
}
div.site a span {
	display: none;
	float:left;
	background-color:#FFFF99;
	color:#000000;
	background-image:url(../images/bg_tag.gif);
	background-repeat:repeat-x;
	background-position:top;
	width:auto;
	position:relative;
	z-index:300;
	top:-20px;
	left:20px;
	line-height:14pt;
	padding-left:10px;
	border:1px solid #FFFF66;
	border-color:#CCCCCC;
	
}

.bordered_area {
	text-align:center;
	padding:10px;
	width:507px;
	border:1px solid #CCCCCC;
}

#news_output img {
	border:1px solid #666666;
}

.add_new_button{
	text-align:right;
	padding-right:10px;
}

/* -- Lists ------------------------------------------ */
#top_bar ul, 
#side_nav ul, 
#blue_bar ul {
	margin:0px;
	padding:0px;
	list-style:none;
}

#blue_bar li {
	float:left;
	margin-left:5px;
}
#top_bar li {
	float:right;
}

ul.nobullet {
	margin:0px;
	padding:0px;
	list-style-type:none;
}
ul.nobullet li img {
	margin-right:5px;
}	

/* -- Anchors ------------------------------------------ */
a:link, a:visited {
	color:#0066CC;
}
a:hover, a:active {
	color:#990000;
	text-decoration:none;
}


a.ext:link, a.ext:visited, a.ext:hover, a.ext:active {
	padding-right:15px;
	background-image:url(../images/icon_new_window.gif);
	background-position:right;
	background-repeat:no-repeat;
}

#breadcrumb a:link, #breadcrumb a:visited {
	color:#777777;
	text-decoration:none;
}

#breadcrumb a:hover, #breadcrumb a:active {
	background-color:#F2F2F2;
}

#top_bar a:link, #top_bar a:visited {
	color:#333333;
}

#top_bar a:hover, #top_bar a:active {
	color:#990000;
}

#blue_bar a:link, #blue_bar a:visited {
	color:#FFFFFF;
	text-decoration:none;
}
#blue_bar a:hover, #blue_bar a:active{
	color:#FFFFCC;
	text-decoration:underline;
}

a.tab_link:link, a.tab_link:visited {
	text-decoration:none;
	font-weight:normal;
	color:#000000;
}
a.tab_link:hover, a.tab_link:active{
	text-decoration:underline;
}

#side_nav a:link, #side_nav a:visited {
	color:#FFFFFF;
	text-decoration:none;
	background-image:url(../images/bg_side_nav_link.gif);
	background-position:top;
	background-repeat:no-repeat;
	display:block;
	width:170px;
	height:25px;
	font-size:90%;
	margin:2px;
	line-height:220%;
	text-indent:10px;
}
#side_nav a:hover, #side_nav a:active{
	color:#FFFFCC;
	text-decoration:underline;
}

#side_nav #nav_selected {
	background-image:url(../images/bg_side_nav_link_selected.gif);
	font-weight: bold;
}

/* -- Misc  ------------------------------------------ */
#change_date {
	width:80px;
}
.grey_padded, 
#grey_padded {
	margin-top:10px;
	background-color:#EEEEEE;
	padding:10px 10px 10px 10px;
	font-size:90%;
}


/* -- Forms ------------------------------------------ */

.textfield {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:100%;
	width:355px;
}	
textarea {
	height:100px;
	overflow:auto;

}



/* -- Tabs ------------------------------------------ */
#tab_selected {
	border-bottom:1px solid #FFFFFF;
	background-color:#FFFFFF;
	font-weight:bold;
}
.tab_long, 
.tab_medium {
	position:relative;
	bottom:0px;
	width:100px;
	background-color:#F2F2F2;
	line-height:200%;
	float:left;
	border:1px solid #333333;
	text-align:center;
	margin-right:5px;
	font-size:90%;
}
.tab_long {
	width:130px;
}

.tab_long_wrapper,
.tab_medium_wrapper {
	background-image:url(../images/line_fade_600.gif);
	background-position:bottom right;
	background-repeat:no-repeat;
	width:568px;
	margin-bottom:20px;
	padding-left:5px;
}

.tab_long_wrapper {
	width:570px;

}

/* -- Tables ------------------------------------------ */
.table_data, 
.table_data_bold {
	border-top:1px solid #EEEEEE;
	border-left:1px solid #EEEEEE;
	font-size:100%;
}
.table_data th,
.table_data_bold th {
	text-align:left;
	background-color:#EEEEEE;
	color:#000000;
	font-size:90%;
}
.table_data td,
.table_data_bold td {
	border-bottom:1px solid #EEEEEE;
	border-right:1px solid #EEEEEE;
	font-size:90%;

}

.table_bottomborder td {
	border-bottom:1px solid #DDDDDD;
	padding-top:3px;
	padding-bottom:3px;
}

.table_bottomborder th {
	color:#000000;
	background-color:#EEEEEE;
	border-bottom:1px solid #DDDDDD;
	text-align:left;
}


/* -- FPC Box Styles ------------------------------------------ */
.fpc_kent_image {
	width:552px;
	border:1px solid #CCCCCC;
	margin-right:10px;
	float:left;
	height:280px;
	text-align:center;
	/*margin-bottom:10px;*/
	background-position:bottom; 
	background-repeat:no-repeat;	
}
.fpc_wrapper {
	width:570px;
}
.fpc_content_box {
	width:270px;
	border:1px solid #CCCCCC;
	margin-right:10px;
	float:left;
	text-align:left;
	margin-bottom:10px;
	margin-top:10px;
	background-image:url(../images/bg_fpc_box.jpg); 
	background-position:bottom; 
	background-repeat:no-repeat;	
	height:280px;
}
.fpc_content_box div, 
.fpc_kent_image div {
	padding:0px 8px 8px 8px;
}
.fpc_summary_box div {
	padding-top:12px;
}
.fpc_content_box h3 {
	margin-left:8px;
	margin-bottom:5px;
	margin-top:5px;
}
.fpc_content_box a {
	line-height:20pt;
	margin-left:8px;
	display:block;
	width:110px;
}


/* -- Summary Indicators ------------------------------------------ */
.td_low, 
.td_moderate, 
.td_high, 
.td_veryhigh {
	padding:3px;
	color:#CCCCCC;
	border:1px solid #FFFFFF;
}

.td_low {
	background-color:#009900;
}
.td_moderate {
	background-color:#FF9900;
}
.td_high {
	background-color:#FF0000;
}
.td_veryhigh {
	background-color:#990000;
}

/* -- Misc Layout ------------------------------------------ */
#wrapper_mapandkey {
	width:567px;
}
#wrapper_mapandkey #map {
	float:left;
	margin-right:10px;
}
#wrapper_500,
.wrapper_500 {
	width:500px;
}
#or_one {
	width:45%;
	float:left;
}
#or_two {
	width:45%;
	float:left;
	margin-left:5px;
}
#or_middle {
	background-image:url(../images/thinline.gif);
	background-position:center;
	background-repeat:repeat-y;
	width:5%;
	float:left;
	height:255px;
}
#or_middle span {
	margin-top:100px;
	display:block;
	background-color:#FFFFFF;
	font-weight:bold;
	padding-top:3px;
	padding-bottom:3px;
}
#twocol_one {
	float:left;
	width:45%;	
}
#twocol_two {
	float:left;
	width:45%;	
	margin-left:5px;
}