@charset "utf-8";
@import url('reset.css');
@import url('form_elements.css');
@import url('form_styles.css');
@import url('layout.css');

body {
	font-family: Arial, Verdana, Geneva, helvetica, sans-serif;}

#container {
	max-width: 960px;
	min-width: 550px;
	margin: 0 auto;}
	
img {
	border:0;
	}
	
a {
	color: #004A40;
	text-decoration:none;
	}
	
a:hover {
	color:#002520;
	text-decoration:underline;
	}
	
a:focus, a:active {
	color:#002520;
	background:#FFDB7F;
	text-decoration:underline;
	}
	
input {
	font-size: 100%;
	font-family: Arial, Verdana, Geneva, helvetica, sans-serif;}
	
select {
	font-size: 100%;
	font-family: Arial, Verdana, Geneva, helvetica, sans-serif;}
	
h1 {
	font-size: 240%;
	font-weight: bold;
	margin: 0.5em 0 0.7em 0;
	color: #004A40;
	line-height:1em;}
	
h2 {
	font-size: 160%;
	margin: 0.7em 0;
	color: #004A40;
	line-height:1.2em;
	}
	
h3 {
	font-size: 140%;
	margin: 1em 0;}
	
h4 {
	font-size: 120%;
	margin: 1em 0;}
	
h5 {
	font-size: 110%;
	margin: 1em 0;}
	
h6 {
	font-size: 100%;
	margin: 1em 0;}
	
p {
	margin: 1em 0;
}

p img {
	margin: 10px;
}
	
blockquote {
	padding: 0.5em 1em;
	background:#FEFEFE;
	margin: 0.5em 2em;
	color:#333333;
	border:#999999 1px dotted;
	}
	
#acc-bar {
	text-align: right;
	background-color: #004A40;
	background-image: url(../images/acc_bar_bgd.gif);
	background-position: top;
	background-repeat: repeat-x;
	color: #FFFFFF;
	font-weight: bold;
	padding: 8px 3% 3px 3%;}
	
#acc-bar ul {
	padding:0;
	margin:0;}
	
#acc-bar ul li {
	display: inline;
	padding: 0 2px;
	white-space: nowrap;}
	
#acc-bar ul li a {
	color: #FFFFFF;
	text-decoration: none;}

#acc-bar ul li a:active, #acc-bar ul li a:focus {
	color: #000000;}
	
.acc-bar-line {
	border-right: 1px solid #FFFFFF;}
	
#acc-bar form {
	display: inline;
	white-space: nowrap;}
	
#header {
	background-color: #F4F3F1;
	background-image: url(../images/header_bgd.gif);
	background-position: top;
	background-repeat: repeat-x;
	padding: 10px 3% 8px 3%;
	overflow: hidden;
	}
	
#logo {
	float: left;
	padding: 0 0 0 30px;}
	
#translations {
	float: right;
	padding: 11px 20px 0 0;}
	
#search {float: right;}

#search form {padding: 0;}
	
#search label {
	color: #000000;
	font-size: 100%;
	font-weight: bold;}
	
#top-menu {
	clear: both;
	background-color: #CFE2DF;
	padding: 22px 3% 0 3%;
	font-size: 110%;}
	
#top-menu ul {
	text-align: center;
	margin-bottom:0;
	}

#top-menu ul li {
	padding: 6px 0;
	background-color: #FFFFFF;
	background-image: url(../images/top_menu_l.gif);
	background-position: top left;
	background-repeat: no-repeat;
	display: inline;
	margin-right: 1px;
	margin-bottom:0;}
	
#top-menu ul li a {
	padding: 6px 10px;
	background-image: url(../images/top_menu_r.gif);
	background-position: top right;
	background-repeat: no-repeat;
	color: #000000;
	text-decoration: none;
	white-space: nowrap;
	margin-bottom:0;
	}
	
#top-menu ul li a:hover {
	text-decoration:underline;
	color: #004A40;
	}

#top-menu ul li a:focus, #top-menu ul li a:active {
	background: none;
	background-image: url(../images/top_menu_r.gif);
	background-position: top right;
	background-repeat: no-repeat;
	text-decoration:underline;
	color: #004A40;
	}
	
#top-menu ul li a.selected {
	font-weight: bold;
	color: #004A40;
	}
	
.top-menu-pad {
	padding: 5px 0;
	}

#container {
	position: relative;
	overflow: hidden;
	background-color: #FFFFFF;}
	
#lhs {
	position: relative;
	float: left;
	width: 18%;
	margin: 25px 2% 1em 2%;
	overflow: hidden;}
	
#rhs {
	position: relative;
	float: right;
	width: 20%;
	margin: 25px 2% 1em 2%;
	padding: 2.4em 0 0 0;
	overflow: hidden;}
	
#rhs-home {
	margin: 10px 0 1em 0;
	overflow: hidden;
	padding:0;}
	
#content {
	padding-top: 25px;
	line-height: 1.4em;
	overflow: hidden;}
	
/*#content-no-rhs {
	padding: 25px 2% 1em 0;
	line-height: 1.4em;
	overflow: hidden;}
	
#content-no-lhs {
	padding: 25px 0 1em 2%;
	line-height: 1.4em;
	overflow: hidden;}

#content-no-lhs-no-rhs {
	padding: 25px 2% 1em 2%;
	line-height: 1.4em;
	overflow: hidden;}
	
#content ul {
	margin: 1em 1em;}
	
#content ul li {
	margin-left: 0.5em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/bullet.gif);}
	
#content ul li li {
	margin-left: 1em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/bullet2.gif);}
	
#content ul li li li {
	margin-left: 1em;
	padding-bottom: 0.2em;
	list-style-type: none;
	list-style-image: url(../images/bullet2.gif);}
	*/
	
#content ol {
	list-style-type: decimal;
	margin: 1em 2em;}
	
#content ol li {
	margin-left: 1em;
	padding-bottom: 0.5em;}

	
/*#content-no-rhs ul {
	margin: 1em 1em;}*/
	
.layout_1_0 ul, 
.layout_0_1 ul,
.layout_1_1 ul {
	margin: 1em 1em;
}
	
/*#content-no-rhs ul li {
	margin-left: 0.5em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}*/

.layout_1_0 ul li, 
.layout_0_1 ul li,
.layout_1_1 ul li {
	margin-left: 0.5em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
}
	
/*#content-no-rhs ul li li {
	margin-left: 1em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}*/
	
.layout_1_0 ul li li, 
.layout_0_1 ul li li,
.layout_1_1 ul li li {
	margin-left: 1em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
}
	
/*#content-no-rhs ul li li li {
	margin-left: 1em;
	list-style-type: none;
	padding-bottom: 0.2em;
	list-style-image: url(../images/yell-bullet.gif);
	}*/
	
.layout_1_0 ul li li li, 
.layout_0_1 ul li li li,
.layout_1_1 ul li li li {
	margin-left: 1em;
	list-style-type: none;
	padding-bottom: 0.2em;
	list-style-image: url(../images/yell-bullet.gif);
}
	
/*#content-no-rhs ol {
	list-style-type: decimal;
	margin: 1em 2em;}*/
	
.layout_1_0 ol,
.layout_0_1 ol,
.layout_1_1 ol {
	list-style-type: decimal;
	margin: 1em 2em;
}
	
/*#content-no-rhs ol li {
	margin-left: 1em;
	padding-bottom: 0.5em;}*/

.layout_1_0 ol li,
.layout_0_1 ol li,
.layout_1_1 ol li {
	margin-left: 1em;
	padding-bottom: 0.5em;
}

/*#content-no-lhs ul {
	margin: 1em 1em;}
	
#content-no-lhs ul li {
	margin-left: 0.5em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}
	
#content-no-lhs ul li li {
	margin-left: 1em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}
	
#content-no-lhs ul li li li {
	margin-left: 1em;
	list-style-type: none;
	padding-bottom: 0.2em;
	list-style-image: url(../images/yell-bullet.gif);
	}
	
#content-no-lhs ol {
	list-style-type: decimal;
	margin: 1em 2em;}
	
#content-no-lhs ol li {
	margin-left: 1em;
	padding-bottom: 0.5em;}


#content-no-lhs-no-rhs ul {
	margin: 1em 1em;}
	
#content-no-lhs-no-rhs ul li {
	margin-left: 0.5em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}
	
#content-no-lhs-no-rhs ul li li {
	margin-left: 1em;
	padding-bottom: 0.5em;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}
	
#content-no-lhs-no-rhs ul li li li {
	margin-left: 1em;
	list-style-type: none;
	padding-bottom: 0.2em;
	list-style-image: url(../images/yell-bullet.gif);
	}
	
#content-no-lhs-no-rhs ol {
	list-style-type: decimal;
	margin: 1em 2em;}
	
#content-no-lhs-no-rhs ol li {
	margin-left: 1em;
	padding-bottom: 0.5em;}
*/
	
#footer {
	clear: both;
	background-color: #FFFFFF;
	border-top: 25px solid #FFDB7F;
	padding: 0.2em 3%;
	overflow: hidden;}
	
#footer-l {
	float: left;
	width: 59%;}
	
#footer-r {
	float: right;
	width: 40%;
	text-align: right;}
	
.b {
	font-weight: bold;}
	
.no-m {
	padding: 0;
	margin: 0;}
	
.no-u {
	text-decoration: none;}
	
.a-m {
	vertical-align: middle;}
	
.img-left {
	padding-right: 0.8em;}
	
.img-right {
	padding-left: 0.8em;}
	
.space10 {
	clear: both;
	height: 10px;
	font-size: 1%;
	line-height: 0;}
	
.skip_nav {
	display: none;}

.invis {
	visibility: hidden;}
	
.cl {
	clear: both; 
	font-size: 0%;}
	
label {
	color: #000;}


/*** LHS navigation ***/
	
.menu {
	/*font-size:95%;*/
	color:#004A40;
	border-left:#CFCFCF solid 1px;
	border-right:#CFCFCF solid 1px;
	margin:6px 0 6px 0;
	padding:0.5em;
	}

.menu ul {
	margin: 0;
	padding: 0 0.5em 0 0.5em;
	}
	
.menu ul li {
	display:inline;
	line-height:1em;
	color:#004A40;
	padding: 0;
	}
	
.menu ul ul {
	padding:0;
	margin:0;
	}
	
.menu ul ul li {
	padding:0;}
	
.menu ul li a {
	font-weight:normal;
	display:block;
	color:#004A40;
	text-decoration:none;
	border-bottom:1px solid #CFCFCF;
	padding:0.5em 0 0.5em 0;
	}
	
.menu ul ul li a {
		color:#004A40;
		border-bottom:1px dotted #CFCFCF;
		background:#F9F7F1;
		padding-left:0.5em;
		}
	
.menu a:hover {
	color:#002520;
	text-decoration:underline;
	}

.menu a:active, .menu a:focus {
	background-color: #FFDB7F;
	color:#002520;
	text-decoration:underline;
	padding-left:0.5em;
	}
	
.menu li.closed ul {
	display:none;
	}
	
.menu li.selected {
	text-decoration: underline;
	font-weight:bold;
	}
	
	
/*** Placeholder ***/

/** image holder **/

.img-holder{
	float: left;
	position: relative; 
	border-right: 5px solid #fff; 
	overflow: hidden;}
	
.img-type1, .img-type2, .img-type3 { 
	width: 167px; 
	height: 167px; 
	position: absolute; 
	background-repeat: no-repeat; 
	background-color: transparent; 
	z-index: 9999 !important;
	top:0; 
	left:0; }

.img-holder .img-type1 { 
	background-image: url(../images/img_type1.gif);}
.img-holder .img-type2 { 
	background-image: url(../images/img_type2.gif);}
.img-holder .img-type3 { 
	background-image: url(../images/img_type3.gif);}

/** Main column placeholders: yellow tops, index page **/


/*----------- Placeholders: common bottom divs -----------*/

.ph-bott-l {
	background: url(../images/ph-yell/ph-yell-bott-l.gif) no-repeat bottom left;
	margin-bottom: 15px;
	}
	
.ph-bott-r {
	background: url(../images/ph-yell/ph-yell-bott-r.gif) no-repeat bottom right;
	overflow:hidden !important;
	padding:0 0 7px 0;
	}
	
/*----------- Placeholders: common central body div -----------*/
/*----------- The col-body style delivers the right and left borders in the Placeholders ---------*/	

.col-body {
	border-left: 1px #CFCFCF solid;
	border-right: 1px #CFCFCF solid;
	padding: 10px;
	margin: 0;
	overflow: hidden
	}
	
.col-body p {
	margin: 0.5em 0;
	}
	
#content .col-body ul {
	margin: 0 1em;
	padding: 0;
	}
	
#content .col-body ul li {
	margin: 0 0 0 1em;
	padding: 0 0 0.3em 0;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}

#content-no-rhs .col-body ul {
	margin: 0 1em;
	padding: 0;
	}
	
#content-no-rhs .col-body ul li {
	margin: 0 0 0 1em;
	padding: 0 0 0.3em 0;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}

#content-no-lhs .col-body ul {
	margin: 0 1em;
	padding: 0;
	}
	
#content-no-lhs .col-body ul li {
	margin: 0 0 0 1em;
	padding: 0 0 0.3em 0;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}
	
#content-no-lhs-no-rhs .col-body ul {
	margin: 0 1em;
	padding: 0;
	}
	
#content-no-lhs-no-rhs .col-body ul li {
	margin: 0 0 0 1em;
	padding: 0 0 0.3em 0;
	list-style-type: none;
	list-style-image: url(../images/yell-bullet.gif);
	}

/*----------- Columns holding Yellow Placeholders -----------*/

.col-1-3 {
	float: left;
	margin: 1em 0 0 0;
	width: 33%;
	}
	
.col-2-3 {
	float: left;
	margin: 1em 4% 0 0;
	width: 63%;
	}


/*----------- Yellow Placeholder Tops -----------*/

.ph-yell-top-r h2 {
	color:#000000;
	background: url(../images/ph-yell/ph-yell-top-r.gif) no-repeat top right;
	line-height:2em;
	padding:0 0.5em 0 0.5em;
	margin:0;
	}

.ph-yell-top-l {
	background: url(../images/ph-yell/ph-yell-top-l.gif) no-repeat top left;
	padding:0;
	margin:0;
	}
	
.ph-yell-top-r {
	background: #FFC739 url(../images/ph-yell/ph-yell-top.gif) repeat-x top;
	padding:0;
	margin:0;
	}
	

/** Main column placeholders: green tops, index page **/

/*----------- Green PLaceholders Tops ------------*/

.ph-green-top-l {
	background: url(../images/ph-green/ph-green-top-l.gif) no-repeat top left;
	padding:0;
	margin:0;
	}
	
.ph-green-top-r {
	background: #004A40 url(../images/ph-green/ph-green-top.gif) repeat-x top;
	padding:0;
	margin:0;
	}

.ph-green-top-r h2 {
	color: #FFFFFF;
	background: url(../images/ph-green/ph-green-top-r.gif) no-repeat top right;
	line-height:1.8em;
	padding: 0 0.5em;
	margin:0.9em 0 0 0;
	}
	
/* ---------- The col style split the div into two to enable the two columns -------------*/
	
.ph-green-col {
	float: left;
	width: 48%;
	padding: 0;
	margin: 0 0 0 4px;
	}
	
.ph-green-col-left ul {
	margin:0;
	padding:0;
	}
	
/*-------------- These styles deliver the icons within the col style ------------*/
	
#rhs-home ul {
	padding:0;
	margin:0;
	list-style-type:none;
	list-style:none
	}
	
#rhs-home .housing {
	background: url(../images/quick-links/apply-for-housing.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .faq {
	background: url(../images/quick-links/faq.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .rent {
	background: url(../images/quick-links/pay-rent.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .repair {
	background: url(../images/quick-links/report-repair.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .garage {
	background: url(../images/quick-links/garage.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .res-faq {
	background: url(../images/quick-links/residents-faq.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .abs {
	background: url(../images/quick-links/report-abs.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .feedback {
	background: url(../images/quick-links/feedback.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .complain {
	background: url(../images/quick-links/formal-complaint.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .keyfobs {
	background: url(../images/quick-links/key-fobs.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}

#rhs-home .whatson {
	background: url(../images/quick-links/whatson.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}
	
#rhs-home .residentsinvolvement {
	background: url(../images/quick-links/residentsinvolvement.gif) no-repeat left center;
	padding: 1em 0 0 50px;
	margin: 0;
	min-height: 42px;
	}		
	
/** Right Hand Side (RHS) placeholder: 'box', index page **/

.box-tr h2 {
	color: #004A40;
	text-decoration: none;
	border-left:1px #CFCFCF solid;
	border-right:1px #CFCFCF solid;
	line-height:1.2em;
	margin:5px 0 5px 0;
	padding:0.2em 0.5em 0.2em 0.5em;
	}
	
.box-tl {
	background: url(../images/box/box-tl.gif) no-repeat top left;
	margin-bottom: 15px;
	}
	
.box-tr {
	background: url(../images/box/box-tr.gif) no-repeat top right;
	padding: 1px 0 0 0;
	}
	
.box-bl {
	background: url(../images/box/box-bl.gif) no-repeat bottom left;
	}
	
.box-br {
	background: url(../images/box/box-br.gif) no-repeat bottom right;
	padding: 0 0 1px 0;
	}

/*--------------- This placeholder is used in e.g. FAQs ---------------*/
.ph-bottom {
	background: #EFEFEF;
	padding: 0.3em 2% 1em 2%;
	overflow: hidden;
	}
	
/*--------- Breadcrumbs -----------*/

.breadcrumbs {
	background:#FFFFFF;
	margin:0 0 1.5em 0;
	font-size: 95%;
	}

/*--------------- Clearfloat ensures that floated elements are cleared by those below them ---------------*/

.clearfloat {
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
	}

/*--------------- Form styles ---------------*/

div.row {
	width: 100%;
	overflow: hidden;
	background-color: #EFEFEF;
	border-bottom: 1px solid #FFFFFF;
	}

div.row div.label {
	float:left;
	width: 28%;
	padding: 0 1%;
	}
	
div.row div.label2 {
	float:left;
	width: 98%;
	padding: 0 1%;
	}

div.row div.label3 {
	float:left;
	width: 48%;
	padding: 0 1%;
	}

div.row div.field {
	float: right;
	width: 67%;
	padding: 0 1%;
	}

div.row div.field3 {
	float: left;
	width: 48%;
	padding: 0 1%;
	}
	
div.row div.desc {
	float: left;
	width: 93%;
	padding: 0 1%;
	}
	
div.row div.space {
	float: left;
	width: 100%;
	height: 0.5em;
	background-color: #FFFFFF;
	}
	
div.row p {
	margin: 0.5em 0;
	}
	
/*--------------- News styles --------------*/

.ph-bottom img {
	border: 1px solid #333333;
	float:left;
	margin: 0 1.5em 0.5em 0;
	padding:0;
	}
	
.ph-top {
	padding: 0.5em 2% 0.5em 2%;
	background:#F6F1E6;
	color:#FFFFFF;
	border-bottom: 2px solid #FFFFFF;
	}

.ph-top h2 {
	font-size:140%;
	margin: 0;
	padding: 0;}
	
	
.news-item-headline {
	color:#000000;
	font-size:160%;
	font-weight: normal;
	margin:0;
	padding:0;
	}
	
.news-item-date p {
	color:#444444;
	font-size:90%;
	font-style:italic;
	line-height:1em;
	padding:0;
	margin:0;
	}
	
.news-item img {
	border: 1px solid #333333;
	float:left;
	margin: 0 1.5em 0.5em 0;
	padding:0;
	}
	
/* for data table displays */

.datatable {
	border: 1px solid #ccc;
	border-collapse: collapse;
}

.datatable th {
	text-align: left;
	border: 1px solid #CCC;
	padding: 0.1em .5em 0.1em .5em;
	background: #d9e8e8;
}

.datatable tr.altrow {
	background: #e6f0f0;
}

.datatable td {
	text-align: center;
	border: 1px solid #CCC;
}

/* added in by AD 20/08/2008 for photo gallery */

.photolib-container {
	float: left;
	width: 180px;
	margin: 0 10px 2em 0;
	border: 1px solid #ccc;}
	
.photolib-img {
	height: 180px;
	text-align: center;
	overflow: hidden;}
	
.photolib-desc {
	padding: 5px;
	height: 3em;
	text-align: center;
	overflow: hidden;
	border-top: 1px solid #ccc;}