/* COLOUR LEGEND
DARK BLUE - #002952
GOLD - #C69A2C
BEIGE - #CDBC92
LIGHT GREY - #EEE
*/

html, body {
height:100%;
}

body {
background:white url(images/body_bg.gif) repeat-x;
}

* {
margin:0;
list-style:none;
border:0;
padding:0;
font-family:verdana,arial,courier,sans-serif;
color:#444;
font-size:12px;
}

#wrap {
position:relative;
margin:auto;
width:760px;
min-height:100%;
background:white url(images/wrap_bg.gif) repeat-y;
border:1px solid #ddd;
border-top:0;
border-bottom:0;
}

* html #wrap {
height:100%;
}

#header {
width:760px;
height:126px;
}

#header li {
float:left;
height:126px;
}

#mainMenu {
width:180px;
float:left;
margin-left:20px;
position:relative;
z-index:1000;
}

* html #mainMenu {
margin-left:10px;
}

#mainMenu li {
width:160px;
padding-right:20px;
height:22px;
padding-top:3px;
background:#002952 url(images/mainMenu_bg.gif) no-repeat;
text-align:right;
}

#mainMenu li a {
color:white;
text-decoration:underline;
}

#mainMenu li a:hover {
text-decoration:none;
}

#mainMenu li#maintenanceGraphic {
background:transparent none;
margin-left:5px;
}

#mainMenu li#validCheck {
background:transparent none;
height:40px;
text-align:center;
margin-left:20px;
}


		li ul {
		display:none;
		position: absolute; 
		margin-top:-19px;
		margin-left: 180px;
		z-index:600;
		background:#ddd url(images/dropDown_bg.gif) repeat-y;
		border:1px solid #CDBC92;
		border-left:10px solid #CDBC92;
		}

		#mainMenu li li {
		background:transparent none;
		height:20px;
		padding-top:3px;
		border-bottom:1px dotted #eee;
		text-align:left;
		padding-left:10px;
		}

		#mainMenu li li a {
		color:#002952;
		}

		* + html li ul {
		margin-left:16px;
		margin-top:-5px;
		}

		* html li ul {
		margin-left:16px;
		margin-top:-5px;
		}

		li > ul {
		top: auto;
		left: auto;
		}
		
		li:hover ul, li.over ul { 
		display: block;
		}

#smallA a {
font-size:12px;
padding-left:20px;
}

#bigA a {
font-size:16px;
}
/* END MENU STYLES */

#inner-wrap {
background:none transparent;
margin:0 20px 0 210px;
padding-bottom:64px;
}


#footer {
position:absolute;
bottom:0;
width:760px;
height:44px;
background:white url(images/footer_bg.gif);
clear:both;
}

* html #footer {
position:relative;
}

#footer p {
font-size:10px;
color:#002952;
margin:0 0 0 200px;
text-align:center;
padding:5px 0 0 0;
line-height:13px;
}

#footer p a {
font-size:10px;
}

.rightBar {
float:right;
width:140px;
border-left:1px solid #ddd;
border-bottom:2px solid #d4d4d4;
margin-left:20px;
}


.rightBar p {
font-size:11px;
margin:5px;
}

.newsBar {
float:right;
width:200px;
border-left:1px solid #ddd;
border-bottom:2px solid #d4d4d4;
margin-left:20px;
font-size:11px;
background:white;
}

.newsBar p {
font-size:11px;
margin:5px;
color:#555;
}

.newsBar a {
font-size:11px;
}

.newsBar strong {
font-size:11px;
}

.newsBar h2 {
margin:3px;
text-decoration:underline;
}

.newsBar h3 {
margin:4px;
}

.newsBar img {
width:150px;
height:150px;
margin:5px 0 5px 25px;
padding:2px;
border:1px solid #ddd;
}

.clear {
clear:both;
margin-top:0;
height:1%;
width:100%;
overflow:hidden;
} 

/* TYPE STYLES */

h1 {
color:#C69A2C;
margin:5px 10px;
font-weight:bold;
font-size:14px;
border-bottom:1px solid #ddd;
padding:2px;
}

h2 {
font-size:13px;
font-weight:bold;
margin:5px 20px;
color:#002952;
padding:2px;
border-bottom:1px solid #C69A2C;
}

h2#Masson {
padding:10px;
background:#9acc00;
color:#222;
border:1px solid #222;
border-top:0;
border-right:0;
margin-bottom:0;
}

h3 {
font-size:12px;
color:#C69A2C;
margin:3px 25px;
padding:2px;
font-weight:bold;
}

p {
font-size:12px;
color:#333;
margin:5px 30px;
padding:5px;
line-height:18px;
}

a {
color:#002952;
text-decoration:underline;
}

a:hover {
text-decoration:none;
}

.mainList, .plainList, ol {
margin:5px 40px;
}

.mainList li {
background:white url(images/listCheck.gif) no-repeat left top;
padding-left:28px;
padding-top:5px;
margin:2px;
font-size:12px;
min-height:22px;
color:#333;
line-height:16px;
}

.plainList li {
list-style:disc inside;
margin:5px;
font-size:12px;
color:#333;
}

ol li { 
list-style:decimal outside;
font-size:18px;
color:#C69A2C;
font-weight:bold;
font-style:italic;
margin:5px;
}

ol li p { font-size:12px;margin:5px;font-weight:normal;font-style:normal; }

* html .mainList li {
height:22px;
}

.subMenu {
float:right;
background-color:white;
padding:4px;
border:1px solid #ddd;
border-right:0;
margin-top:5px;
margin-right:-1px;
}

.subMenu h3 {
margin:2px 10px
}

.subMenu p {
margin:4px 12px;
}

/* ACCORDION STYLING */
#basic-accordian{
	border:1px solid #EEE;
	padding:5px;
	width:450px;
	margin-right:30px;
	z-index:2;
	float:right;
}

* html #basic-accordian {
margin-right:15px;
}

* + html #basic-accordian {
clear:right;
}


.accordion_headings{
	padding:5px;
	background:#002952;
	color:#FFFFFF;
	border:1px solid #FFF;
	cursor:pointer;
	font-weight:bold;
}

.accordion_headings:hover{
	background:#C69A2C;
}

.accordion_child{
	padding:15px;
	background:#f5f5f5;
}

.header_highlight{
	background:#C69A2C;
}

/* FORM STYLES */


.cssform {
position:relative;
margin:10px 50px;
float:left;
}

* html .cssform {
margin:10px;
}

.cssform p {
width: 300px;
clear: left;
margin: 0;
border-top:1px solid #ccc;
padding: 5px 0;
padding-left: 155px; /*width of left column containing the label elements*/
height: 1%;
color:#444;
font-size:11px;
line-height:15px;
}

.cssform label{
float: left;
text-align:right;
margin-left: -155px; /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.cssform input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 180px;
padding:2px;
border:1px solid;
border-color:#ccc;
color:#002952;
}

* html .inputbox {
border:1px solid;
border-color:#ccc;
padding:2px;
width:180px;
}

.cssform select { /*width of text boxes. IE6 does not understand this attribute*/
width: 180px;
padding:2px;
border:1px solid;
border-color:#ccc;
color:#002952;
font-size:10px;
}

.cssform option {
font-size:10px;
padding:2px;
}

.cssform input[type="password"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 180px;
padding:2px;
border:1px solid;
border-color:#ccc;
color:#002952;
}
.cssform textarea{
width: 250px;
height: 50px;
border:1px solid;
border-color:#ccc;
font-size:11px;
color:#002952;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}

.submitbutton {
color:#444;
cursor:pointer;
background-color:#CDBC92;
font-weight:bold;
padding:2px;
float:right;
border:1px solid;
border-color:#e5e5e5 #bbb #bbb #e5e5e5;
font-size:11px;
}




.clickPic {
float:left;height:52px;width:62px;margin:0 10px 0 10px;padding-top:5px;
}

/* BEGIN LIGHTBOX STYLES */
#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 1000;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%	
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}


/* CONTACT FORM STYLES */
.contactForm {
position:relative;
margin:10px;
float:right;
border-left:1px solid #ccc;
}

* html .contactForm {
margin:10px;
}

.contactForm p {
width: 160px;
clear: left;
margin: 0;
padding: 5px 0;
padding-left: 130px;/* width of left column containing the label elements*/
border-top:1px solid #ccc;
height: 1%;
color:#444;
font-size:10px;
line-height:15px;
}

.contactForm label {
float: left;
text-align:right;
margin-left: -120px; /*width of left column*/
width: 120px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.contactForm input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 120px;
padding:2px;
border:1px solid;
border-color:#ccc;
color:#002952;
}

.contactForm textarea {
width: 120px;
height: 100px;
border:1px solid;
border-color:#ccc;
font-size:11px;
color:#002952;
}

/*
#galleryList {
width:400px;
margin:10px auto;
min-height:20px;
background:red;
}

#galleryList li {
float:left;
width:130px;
height:130px;
margin:10px;
padding:10px;
border:1px solid;
border-color:#ddd #bbb #bbb #ddd;
background-color:#eee;
}

* html #galleryList li {
margin:5px;
}

#galleryList li img {
border:1px solid;
border-color:#bbb #ddd #ddd #bbb;
}
*/

#galleryList {
width:516px;
margin:auto;
}

#galleryList li {
width:120px;
height:120px;
float:left;
margin:5px 20px;
border:1px solid #ccc;
padding:2px;
}

#galleryList li img {
vertical-align:bottom;
}

/* TABLE STYLES FOR ADMIN SECTION */

.tenderTable {
margin:5px;
width:520px;
}

* html .tenderTable {
margin:3px;
}

.tenderTable td {
font-size:10px;
padding:2px 4px;
border:1px solid #ddd;
margin:2px 0;
}

.tenderTable td a {
font-size:10px;
}

td.buttons {
width:30px;
text-align:center;
}


.titleRow td {
font-weight:bold;
border:0;
}

p.pagePar {
padding:6px;
background-color:#eee;
border:1px solid #ddd;
}

#emailList {
margin:10px 60px;
}

#emailList li {
background:white url(images/email_good.gif) no-repeat left;
padding-left:20px;
color:#555;
font-size:10px;
margin:4px;
}

#emailList li.bad {
color:#be1a1a;
background:white url(images/email_bad.gif) no-repeat left;
}

.tendersMenu {
text-align:center;border-bottom:1px solid #eee;
}

#earthHourBanner, #earthDayBanner {
float:left;
margin:10px 60px;
}

#earthHourBanner {
width:160px;
}

#earthDayBanner {
width:120px;
}

/* EVENTS CALENDAR STYLES */
/* CALENDAR STYLES */
table#calendar {
margin-top:5px;
width:482px;
padding:4px;
font-size:11px;
float:right;
margin-right:11px;
color:#555;
empty-cells: hide;
}

#calendar td {
width:62px;
margin:1px;
border:1px solid;
border-color:#ddd #ccc #ccc #ddd;
padding:2px;
background:#f5f5f5;
height:50px;
vertical-align:top;
}

#calendar th a { #color:#002952; }

#calendar td a {
display:block;
height:50px;
color:#fff;
text-decoration:none;
}

#calendar a:hover {
text-decoration:none;
}

#calHeader th {
text-align:center;
height:20px;
font-size:16px;
}

#calDays td {
font-weight:bold;
font-size:18px;
color:#C69A2C;
height:20px;
text-align:center;
}

/* TOOLTIP STYLE */
#dhtmltooltip{
position: absolute;
width: 400px;
border:1px solid;
font-size:11px;
line-height:16px;
border-color:#e5e5e5 #ccc #ccc #e5e5e5;
padding: 4px;
background-color: #f5f5f5;
color:#333;
visibility: hidden;
z-index: 2000;
margin-left:-160px;
}