@charset "utf-8";

body,html {
	margin: 0 0 5px 0;
	padding: 0;
	font-family: myriad,'myriad web',futura,'futura bk',verdana, arial, Helvetica, sans-serif;
	background: #FFF;
}
a {color: #008DA5;text-decoration: none;}
a:hover {text-decoration: underline}
a , a:hover, a:active {outline: none;}
img {border: 0px;}

#mainContainer {
position: relative;
margin: 0 auto;
padding: 0;
border: 0;
width: 990px;
background: transparent url(../resources/colour_bar2.png) no-repeat top right;
z-index: 0;
}
 
/*----------------------------------------- top bits n bats ------------------*/

#banner {
margin: 0;
padding: 0;
border: 0;
width: 100%;
height: 200px;
background: #FFF;
display: block;
}

#banner div.box {
margin: 0;
padding: 0;
border: 0;
width: 10%;
height: 200px;
display: block;
float: left;
}

#banner div.gold {background: #FFCC00}
#banner div.yellow {background: #FFF27C}
#banner div.red {background: #FC4128}
#banner div.coral {background: #FB745C}
#banner div.fuxia {background: #B0003F}
#banner div.pink {background: #E9326C}
#banner div.dgreen {background: #00563B}
#banner div.lgreen {background: #4DB264}
#banner div.pastel {background: #C1D8CD}
#banner div.petrol {background: #008DA5}

.logo 
{
position: absolute;
top: 88px;
left: 36px;
margin: 0;
padding: 0;
border: 0;
width: 309px;
height: 99px;
display: block;
z-index: 100;
}



form {
margin: 0;
padding: 0;
border: 0;
}

#loginLabel {
position: absolute;
top: 0;
right: 315px;
margin: 0;
padding: 8px;
border: 0;
width: 260px;
height: 24px;
background: url(../resources/log_bg.png) repeat-x;
display: block;
font-size: 12px;
font-weight: 200;
color: #000;
text-align: left;
}

#passLabel {
position: absolute;
top: 0;
right: 90px;
margin: 0;
padding: 8px;
border: 0;
width: 200px;
height: 24px;
background: url(../resources/log_bg.png) no-repeat;
display: block;
font-size: 12px;
font-weight: 200;
color: #000;
text-align: left;
}

input.logInput {
border: 1px solid #AAA;
width: 110px;
background: #FFFFE0;
}

#together {
position: absolute;
top: 95px;
right: 100px;
margin: 0;
padding: 0;
border: 0;
width: 239px;
height: 106px;
background: url(../resources/dolls.png) no-repeat;
display: block;
}

#heading {
position: relative;
margin: 0;
padding: 0;
border: 0;
width: 90%;
height: 50px;
display: block;
background: transparent;
}

#heading h1 {
margin: 0;
padding: .75em 0 .75em 36px;
border: 0;
background: #FFF;
font-size: 1em;
font-weight: 600;
color: #666;
}

#headingImage {
position: absolute;
top: 0;
left: 0;
width: 800px;
height: 50px;
display:block;
background: url(../resources/subtitle1.png) no-repeat;
z-index: 50;
}  



/*----------------------------------------- left side ------------------*/


#leftPanel {
margin: 0;
padding: 0;
border: 0;
width: 200px;
height: 100%;
background: #FFF;
display: block;
float: left;
}

ul#menu {
margin: 0;
padding: 0;
border: 0;
list-style: none;
width: 100%;
}

ul#menu li {
margin: 0;
padding: 0;
border: 0;
width: 200px;
height: 34px;
display: block;
}

li.petrol {background: #008DA5}
li.pastel {background: #C1D8CD}
li.lgreen {background: #4DB264}
li.dgreen {background: #00563b}
li.pink {background: #E9326C}
li.fuxia {background: #B0003F}
li.coral {background: #FB745C}
li.red {background: #FC412B}
li.yellow {background: #FFF27C}
li.gold {background: #FFCC00}

.petrol_left {padding: 0px 0 130px 0px;border-left: 3px solid #008DA5; min-height: 278px;}
.pastel_left {padding: 0px 0 130px 0px;border-left: 3px solid #C1D8CD; min-height: 278px;} /* background: #C1D8CD;*/
.lgreen_left {padding: 0px 0 130px 0px;border-left: 3px solid #4DB264; min-height: 278px;} 
.dgreen_left {padding: 0px 0 130px 0px;border-left: 3px solid #00563b; min-height: 278px;}
.pink_left {padding: 0px 0 130px 0px;border-left: 3px solid #E9326C; min-height: 278px;} 
.fuxia_left {padding: 0px 0 130px 0px;border-left: 3px solid #B0003F; min-height: 278px;} 
.coral_left {padding: 0px 0 130px 0px;border-left: 3px solid #FB745C; min-height: 278px;} 
.red_left {padding: 0px 0 130px 0px;border-left: 3px solid #FC412B; min-height: 278px;} 
.yellow_left {padding: 0px 0 130px 0px;border-left: 3px solid #FFF27C; min-height: 278px;} 
.gold_left {padding: 0px 0 130px 0px;border-left: 3px solid #FFCC00; min-height: 278px;}
.admin_left {padding: 0px 0 130px 0px;border-left: 3px solid #EFC695; min-height: 278px;}

.application { padding-left: 10px;}
.forum, .document { padding-left: 10px;}
/* .application h2 {margin: 0; padding: 10px 0 10px 0; border: 0; color: #B0003F; font-size: .85em; text-align: justify;} */
.application, .forum table {border-top: solid 2px #E9326C; width: 100%; margin-top: 10px; color: #000; font-size: .73em; text-align: justify;}
.application input { height: 20px;}
.application, .forum a img { border: none;}

.forum #modalpage table {border: none; width: 100%; margin-top: 0px; color: #000; font-size: .73em; text-align: justify;}
.forum #modalpage h2 {margin: 0; padding: 0; border-bottom: solid  2px #EFC695; color: #EFC695; }

.document table {width: 100%; margin-top: 10px; color: #000; font-size: .73em; text-align: justify; line-height: 20px;}
.document table.documenttbl {font-size: 1em; padding: 20px;}

ul#menu a {
margin: 0;
padding: 10px 0 0 5px;
border: 0;
width: 165px;
height: 24px;
background: #FFF;
text-align: left;
text-decoration: none;
display: block;
float: right;
font-size: 13px;
font-weight: 600;
color: #444;
}

ul#menu a:hover {color: #AAA}

#contact {
margin: 50px 0 50px 10px;
padding: 0;
border: 0;
width: 180px;
background: transparent;
display: block;
}

#contact p {
margin: 0;
padding: 0 0 0 25px;
border: 0;
font-size: 11px;
font-weight: 100;
color: #444;
}






/*----------------------------------------- right side ------------------*/

#rightPanel {
margin: 0;
padding: 20px 30px 20px 15px;
border: 0;
width: 255px;
height: 100%;
background: transparent;
float: right;
}


#newsHeading {
position: relative;
margin: 0;
padding: 0;
border: 0;
width: 270px;
height: 50px;
display: block;
background: transparent;
}


#newsHeading h2 {
margin: 0 0 0 5px;
padding: 0;
border: 0;
font-size: 1.0em;
font-weight: 600;
text-align: left;
text-transform: uppercase;
color: #666;
}

#newsHeadingImage {
position: absolute;
top: 0;
left: 0;
width: 270px;
height: 50px;
display: block;
background: url(../resources/news.png) no-repeat;
z-index: 50;
}  

#rightPanel p {
clear: right;
margin: 20px 0 5px 0;
padding: 0;
border: 0;
font-size: .75em;
text-align: justify;
color: #666;
}

#rightPanel a.readMore {
margin: 0 0 20px 0;
padding: 0;
border: 0;
width: 80px;
font-size: .7em;
text-align: right;
float: right;
}



/* ------------------------------------------------------- middle panel ----------------*/

#middlePanel {
margin: 0 300px 0 200px;
display: block;
}

#middlePanel p {
margin: 0;
padding: 5px 10px;
border: 0;
font-size: .75em;
text-align: justify;
color: #000;
}

#middlePanel .listItem {background-color:#fff; padding: 10px; padding-bottom: 20px; border-bottom: solid 2px #EFC695; margin: 0 0 10px 10px;}
#middlePanel h2 { font-size: 14px;}
#middlePanel h3 { font-size: 12px; color: #000; font-weight: normal; font-style: italic; margin:0px; padding:0px;}
#middlePanel p.readMore { text-align: right;}

	#bigPanel {
	margin: 0 30px 0 200px; padding: 0 0 100px 0px;
	border: 0;
	min-height: 210px;
	background: #FFF;
	display: block;
	}
	
	#bigPanel p {
	margin: 0;
	padding: 5px 10px;
	border: 0;
	color: #000;
	font-size: .75em;
	text-align: justify;
	}
	
	#bigPanel h2, h3 {
	margin: 0;
	padding: 5px 10px;
	border: 0;
	font-size: 1.5em;
	text-align: justify;
	font-weight: bold;
	}
		
	
#bigPanel .listItem {background-color:#fff;}

.new-member-box { border-bottom: solid 2px #B0003F; padding: 0 10px 10px 0; margin: 10px 0 20px 20px; background-color: #fff;}

#ambientImage {
margin: -10px 0 10px 10px;
padding: 0;
border: 0;
width: 200px;
height: 200px;
background: url(../resources/pic.png) no-repeat;
float: right;
}

/*----------------------------------------- footer ------------------*/

#footer {
clear: both;
margin: 5px 0 0 0;
padding-top: 5px;
border-top: solid 2px #ccc;
width: 100%;
height: 10px;
background: transparent;
display: block;
font-size: 14px;
}
#footer .jdrg { font-size: 12px;float: left;}
#footer .dataphiles { font-size: 12px;float: right;}
#footer .dataphilesLogo { font-size: 12px;float: right;}
#footer img { border: 0px; }

.textIncrease { line-height: 20px;}