@charset "utf-8";
/* CSS Document 
   Author: Ayodeji Agun (AA) - June 2009
*/
/* Body and wrapper */
body {font-family: Arial, Helvetica, sans-serif; margin: 0px; background-color:#d4d0c8; }
div.wrapper {width: 820px; margin: 0 auto 0 auto; background-color: #fff; padding: 0px 25px;}
div.temp {width: 12px; position:absolute; top: 90px; left: 90px; margin: 0 auto 0 auto;}
#underline{text-decoration:underline;}

/* Header */
div.header {float: left; width: 100%; height: 95px; padding: 0px; margin: 0px; border-bottom: solid 2px #fff; text-align:right; vertical-align:bottom;}
div.floater{float:right; position:relative; top:8px; font-size:0.9em; color: #e4e4e4; }
.header p {font-size: 1.3em; font-weight: bold; padding-top: 50px; margin: 0px }
.header img {float: left; padding: 5px 0px}
div.topnav {float: left; width: 100%; padding: 0px 0px; margin: 0px; border-bottom: solid 0px #e4e4e4; background: #d3d3d3 url(/images/topnavbar.jpg) repeat-x;}
div.topnav p {text-align: center; word-spacing: 5px; margin-top:12px; margin-bottom:0px; font-size:0.95em; }

/*New Header bar added 26th March 2010 (AA)*/
.floatcurvesright {float: right;}
.floatcurvesleft {float: left;}
.breadcrumb{float:left; padding: 3px 5px 3px 5px; font-weight: bold; background-color: #fff; border: solid 0px #f37021; margin-top: 7px; color: #f37021; width: 810px; }
.breadcrumb a:link, .breadcrumb a:visited, .breadcrumb a:hover{color: #f37021; font-weight: bold;}

/*Left Nav added 14th April 2010 (AA)*/
div.leftnav {float: left; width: 140px; padding: 10px 20px 10px 0px; margin:0px; margin-bottom:0.5em; text-align:left; }
.leftnav p { border-bottom:1px dotted #cacaca; background: transparent url(/images/) repeat-y; padding: 3px 5px; margin: 0 0 0 0;}
div.rightnav {float: right; width: 140px; padding: 10px 40px 10px 0px; margin:0px; margin-bottom:0.5em; text-align:left; }
.rightnav p {border-bottom:1px dotted #cacaca; background: transparent url(/images/) repeat-y; padding: 3px 5px; margin: 0 0 0 0;}

/*Right Secondary Nav added 14th April 2010 (AA)*/
div.SecondNav{float: right; padding: 0px 0px 5px 0px; width: 170px; border-left: solid 5px white;}


/* Main page and footer */
div.container {float:left; width: 100%;}
div.text {float: left; width: 800px; padding: 10px 0px; margin:0px; }

div.backpages {float: right; width: 630px; padding: 10px 0px; margin:0px; }
div.adminpages {float:left; width: 600px; padding: 10px 10px; margin:0px; border: solid 1px black; }
div.lefttext {float: left; width: 500px; padding: 10px 0px; margin:0px; }
div.lefttext-homepage {float: left; width: 500px; padding: 10px 0px; margin:0px; position: relative; top: -24px;  }
div.spantext {float: left; width: 100%; padding: 10px 0px; margin:0px; }

/* right divs - Admin, Homepage, Erecruitment pages*/
div.righttext-news { float: right; width: 300px; padding: 0px; margin:-5px 0px 10px 0px; }
*:first-child+html div.righttext-news { float: right; width: 300px; padding: 0px; margin:10px 0px; }
div.righttext { float: right; width: 300px; padding: 0px; margin:10px 0px 10px 0px; }
div.righttext div.righttext-news, div.rightbox-top, div.rightbox-top2 { 	
    padding: 5px 10px 5px 10px;
    border: none;
    margin-top:10px;
    color: #ffffff; }
    
div.righttext-news-homepage { float: right; width: 225px; padding: 0px; margin:-5px 0px 10px 0px; font-size:0.95em; position: relative; top: -24px;}
div.rightbox-top2 { 	
    background-color: #efede7;
    border: solid 1px #bbb7ba;
    margin-top:13px;
    color: #7f7f7f; 
    height:140px;}

div.righttext div.righttext-news, div.rightbox-bottom {	
    background: #e5e3e4 url(/images/rightbox3.jpg) no-repeat left bottom;
    padding: 5px 10px 5px 10px;
    border: none;
    margin-top:10px;
    color: #000000; }
    
div.righttext div.righttext-news, div.rightbox-top p, div.righttext div.rightbox-bottom p, div.imagecaption p { margin-top:5px; margin-bottom:5px;}
* html div.righttext-news {margin-top:15px; margin-bottom:5px;}
div.righttext div.righttext-news, div.rightbox-top p a {color:#FFFFFF;}
div.righttext div.righttext-news, div.rightbox-bottom p a {color:#000000;}
div.righttext div.righttext-news, div#imagecaption {padding: 3px; border: none; margin:0px; font-size:0.8em; text-align:center; }


/*Footer New Deji 26th March 2010*/
div.footer {clear: both; width: 100%; height:38px; padding-top: 0px; margin-top: 30px; margin-bottom:30px; border-top: solid 1px #fff; background: #d3d3d3 url(/images/footerbar.jpg) repeat-x;}
div.footer p {font-size: .75em; text-align:center;}
.floatfooterright {float: right;}
.floatfooterleft {float: left;}
#credits {font-size: .75em; text-align:center; position: relative; top: -10px;}
#charity {font-size: .75em; text-align:center; position: relative; top: -10px;}

/* Header Tags */
h1 {font-size: 1.2em; }
h2 {font-size: 1.1em; color: #454033; border-bottom: solid 1px #B4A88C; }
h3 {font-size: 1em;  color: #454033; border-bottom: solid 1px #B4A88C; }
h4 {font-size: 1em;}

/* Page content */
#spacing{margin-left:30px;}
#special_link{color:#FFFFFF; font-weight:bold;}
.special_link a{color:#FFFFFF; font-weight:bold;}
#special_link2{text-decoration:underline;}
#table-top{ border-collapse:collapse;}
div.anothergreybox {border: solid 1px #8F8C8C; background:#EFEDE7; padding: 0px 10px}
li.anothergreybox{border: solid 1px #8F8C8C; background:#EFEDE7 url(/images/icons/pdf_icon.gif) no-repeat 5px 50%; padding: 10px 10px 10px 40px; list-style-type: none;}
ul li.anothergreybox{margin-left:-55px; width:75%;}
li.pdfbox, li.wordbox, li.videobox, li.emailbox {border: solid 1px #8F8C8C;padding: 10px 10px 10px 40px; list-style-type: none;}
li.wordbox {background:#EFEDE7 url(/images/icons/word_icon.gif) no-repeat 5px 50%;}
li.pdfbox {background:#EFEDE7 url(/images/icons/pdf_icon.gif) no-repeat 5px 50%;}
li.videobox {background:#EFEDE7 url(/images/icons/video_icon.gif) no-repeat 5px 50%;}
li.emailbox {background:#EFEDE7 url(/images/icons/email_icon.gif) no-repeat 5px 50%;}
ul li.pdfbox, ul li.wordbox, ul li.videobox, ul li.emailbox {margin-left:-55px; width:75%;}

div.orangebox {border: solid 1px #454033; background:#f37021; padding: 0px 5px}
div.orangeborderbox {border: solid 1px #f37021; background:#FFFFFF; padding: 5px 25px; width: 85%; margin-left: 20px;}
div.blueborderbox {border: solid 1px #427fb8; background:#FFFFFF; padding: 5px 25px; width: 85%; margin-left: 20px;}
div.bluebox {border: solid 1px #427fb8; background:#427fb8; padding: 5px 25px; width: 85%; margin-left: 20px;}
div.orangebox p, div.orangebox h1, div.orangebox h2 {color: #FFFFFF}
div.greybox {border: solid 1px #454033; background:#B4A88C; padding: 0px 5px}
div.greybox2 {border: solid 1px #454033; background:#eee; padding: 5px 25px; width: 85%; margin-left: 20px;}
div.whitebox {border: solid 1px #fff; padding: 0px 5px}
p {font-size: .9em;}
ol {margin-left:15px; font-size: .9em; }
ul {margin-left:15px; font-size: .9em; }
ul ul {margin-left:15px; font-size: 1em; }
ol ul {margin-left:15px; font-size: 1em; }
li {margin:5px 5px 10px 15px; }
ul.specialbullet li{list-style-type: square ;}


table {font-size: .9em; border: 1px; border-color: #ddd; border-collapse: collapse}
th {font-weight: bold; padding:5px; color: #000; background: #efede7; border: solid 1px #454033;}
td {border: solid 1px #ddd; padding:5px; }
img {border: 0px;}
hr {background: #ffffff; color: #ddd; height: 1px; margin: 0px}
#noborders {border:0px; border-color: #fff;}
#noborders td{border:solid 0px #fff;}

/*Images*/
img.TextImageRight{float: right; padding: 0px 0px 5px 7px;}
span.TextImageRight{float: right; padding: 0px 0px 5px 7px;}

/* for images 150px wide */
div.imagecaption {float: left; width: 100%; margin: 0px 0px 5px; padding: 0px; clear: both}
.imagecaption  p, .imagecaption h3, .imagecaption h4, .imagecaption li {margin: 1px 1px 1px 171px; padding: 3px 5px}
.imagecaption img {float:left; margin: 0px}

/* Page links*/

a {font-weight: bold; text-decoration: none;}
a:link {color: #2B5B84;}
a:visited {color: #2B5B84;}
a:hover {color: #cc0000; text-decoration: underline;}
a:active {color: #cc0000; text-decoration: underline;}
span.special_char{color:#fff; font-weight:bold;}
#special_link a:link{color: #FFFFFF; text-decoration: none;}
a.black_link:link{color: #454033;}
a.black_link:visited{color: #454033;}
a.black_link:hover{color: #454033;}
span.black_char{color:#454033; font-weight:bold;}
a.floater_link:link{color: #f37021;}
a.floater_link:visited{color: #f37021;}
a.floater_link:hover{color: #f37021;}
a.special_link:link{color: #FFFFFF;}
a.special_link:visited{color: #FFFFFF;}
a.special_link:hover{color: #FFFFFF;}
a.special_link2:link {color: #FFFFFF; text-decoration: underline;}
a.special_link2:hover {color: #FFFFFF; text-decoration: underline;}
a.special_link2:visited {color: #FFFFFF; text-decoration: underline;}
a.special_link3:link {color: #FFFFFF; text-decoration: none;}
a.special_link3:hover {color: #FFFFFF; text-decoration: underline;}
a.special_link3:visited {color: #FFFFFF; text-decoration: none;}
a.grey_link:link{color: #7f7f7f;}
a.grey_link:visited{color: #7f7f7f;}
a.grey_link:hover{color: #7f7f7f;}

/* Generic */
.floatright {float: right;}
.floatleft {float: left; }
.center {text-align: center}
.right {text-align: right} 
.underline {text-decoration: underline;}
.boxtext {margin:3px;}
input.button {color: #fff; background: #F26100; border-width: 2px; border-color: #ddd; font-weight: bold; padding: 2px; }
span.bold { font-weight:bold;}
div.centerPollTable{width: 200px; margin: 0 auto 0 auto;}


/*Flash Content Deji Oct 2009*/
div.flashcontainer {float: left; width: 92%; padding: 10px 0px; margin:0px; }
div.flashcontent{width:100%; border: 0px solid red;}
div.flashcontentvideo{float:left; border: 0px solid blue;}
div.flashcontenttext{float:right; padding-top: 40px; border: 0px solid green; width: 30%;}


/*SlideShow  Deji Dec 2009*/
div.spantext2 {float: left; width: 97.5%; padding: 7px 0px; margin:0px; }
div.flashcontentvideo2{float:left; border: solid 9px #f37021; margin-top: 20px;}
div.flashcontenttext2{float:right; width: 440px;}
div.lefttop {float:left; width: 340px; border: solid 0px red;}
div.righttop {float:right; width: 440px;}
div.widetext{float:left; width: 430px;}
div.widetext p {color: #fff; border: solid 8px #999999; background-color: #999999;}
* html div.widetext p{color: #fff; border: solid 8px #999999; background-color: #999999; margin-top:20px;}/*IE 6 Hack*/
*+html div.widetext p{color: #fff; border: solid 8px #999999; background-color: #999999; margin-top:20px;}/*IE 7 Hack*/

#slideshow {
	margin-bottom:1px;	
	width: 580px;   /*change overall width of slideshow size*/
	height: 150px;  /*change overall height of slideshow size*/
	overflow: hidden;
	position: relative;
	background-color:#0093d5;
}
#slideshow #slideshowloader {
	position: absolute;
	top: 101px;
	left: 340px;
	background: url(/images/jsSliding/loading.gif) no-repeat center center;
	z-index: 6;
	width: 32px;
	height: 0;
	padding: 32px 0 0 0;
	display: block;
	overflow: hidden;
}
#slideshow ul{padding:0; margin:0;}
#slideshow ul#imageviewer {
	width: 580px;   /*change overall width of slideshow size*/
	height: 150px;  /*change overall height of slideshow size*/
	overflow: hidden;
	z-index: 1;
	padding-left:0px;
}
#slideshow ul#imageviewer li {
	width: 580px;  /*change overall width of slideshow size*/
	height: 150px;  /*change overall height of slideshow size*/
	position: absolute;
	padding-left:0px;
	list-style-type: none;
}

#slideshow ul#imageviewer li  h2 { margin:0 0 0 0; padding:0; font-size:1.1em; padding:0 0 0 5px; color:#ffffff;}
#slideshow ul#imageviewer li  h2 a, #slideshow ul#imageviewer li  h2 a:link, #slideshow ul#imageviewer li  h2 a:visited
{
	text-decoration:none;
	color:#ffffff;
}
#slideshow ul#imageviewer li  h2 a:focus, #slideshow ul#imageviewer li  h2 a:active, #slideshow ul#imageviewer li  h2 a:hover
{
	text-decoration:underline;
	color:#ffffff;
}
#slideshow ul#imageviewer li  div.slideshowtext
{
	float:left;
	width:190px;
	padding:0;
	margin:0;
	padding-left: 0px;
	height:175px;
	color:#ffffff;
	margin-top: 5px;
}

#slideshow ul#imageviewer li  div.slideshowtext p
{
	font-size:1.0em; /*change font size*/
	padding:0 0 0 5px;
	color: #fff;
}
#slideshow ul#imageviewer li a:visited, #slideshow ul#imageviewer li a:link {color:#fff;}
#slideshow ul#imageviewer li  img { float: right; width:231px;}
#slideshow #controllers {
	width: 646px;
	height: 26px;
	position: absolute;
	top: 125px;  /*changey-axis position of slideshow controls*/
	left: 0;	
	z-index: 5;
	background: url(/images/jsSliding/bg_sprite2.gif) no-repeat 0 -128px;
}
#slideshow #controllers ul {
	list-style: none;
	float: left;
	position: absolute;
	left: 228px;
	top: 1px;
	padding-left:0px;
	visibility:hidden;
	
}
#slideshow #controllers ul li { float: left; padding: 0 2px; text-align: center; list-style-type: none;}
#slideshow #controllers ul li a {
	width: 25px;
	display: block;
	height: 17px;	
	padding-top: 4px;
	overflow: hidden;
	color: #002b54;	
	background: url(/images/jsSliding/bg_sprite2.gif) no-repeat -119px -102px;
	border-bottom:none;
}
#slideshow #controllers ul li a:hover,
#slideshow #controllers ul li a.active {text-decoration: none; color: #f25a31; background-position: -94px -102px;}
#slideshow #controllers a#previous, #slideshow #controllers a#next, #slideshow #controllers a#control 
{
	height: 0;
	width: 12px;
	padding: 13px 0 0 0;
	display: block;
	overflow: hidden;
	background-image: url(/images/jsSliding/bg_sprite2.gif);
	background-repeat: no-repeat;
	border-bottom:none;
}
#slideshow #controllers #previous {position: absolute; left: 240px; top: 5px; background-position: -70px -102px;}
#slideshow #controllers #next {position: absolute; left: 340px; top: 5px; background-position: -82px -102px;}
#slideshow #controllers #control {position: absolute; left: 290px; top: 5px;}
#slideshow #controllers .play { background-position: -46px -102px;}
#slideshow #controllers .pause { background-position: -58px -102px;}

/*Legacy Tabs to delete soon*/
ul.demolayout #tab-colour1 a.active{
    background-color:#504f4d ;
    color:#fff;
}
ul.demolayout #tab-colour2 a.active{
    background-color:#3c83bb ;
    color: #fff;
}
ul.demolayout #tab-colour3 a.active{
    background-color:#f26100 ;
    color:#fff;
}
ul.demolayout #tab-colour4 a.active{
    background-color:#b4a88c ;
    color:#fff;
}

/*Tabs Deji 26th March 2010*/
.tabs-container{padding:0px; border: solid 0px #fff;}
.km-def {padding: 8px;}
ul.demolayout #newtab-colour1 {width: 175px;}
ul.demolayout #newtab-colour2 {width: 245px; position: relative; left: 16px;}
ul.demolayout #newtab-colour3 {width: 159px; position: relative; left: 29px;}
ul.demolayout #newtab-colour4 {width: 165px; position: relative; left: 45px;}

ul.demolayout a {
	float: left;
	display: block;
	/*padding: 4px 8px;*/
	padding: 20px 8px 0px 8px;
	border: 2px solid #fff;
	/*border-bottom: 0;*/
	color: #60a2c8;
	width: 100%;
	height: 25px;
	text-decoration: none;
	font-weight: bold;
	position: relative;
    top: 0px;
    text-align: center;
}

ul.demolayout #newtab-colour1 a {color: #fff; background: #fff url(/images/nav-rollover-welcome.jpg) top center no-repeat; }
ul.demolayout #newtab-colour2 a {color: #fff; background: #fff url(/images/nav-rollover-leadership.jpg) top center no-repeat; }
ul.demolayout #newtab-colour3 a {color: #fff; background: #fff url(/images/nav-rollover-endorsement.jpg) top center no-repeat; }
ul.demolayout #newtab-colour4 a {color: #fff; background: #fff url(/images/nav-rollover-comm.jpg) top center no-repeat; }


 
ul.demolayout #newtab-colour1 a.link {width: 175px;}
ul.demolayout #newtab-colour2 a.link {width: 245px;}
ul.demolayout #newtab-colour3 a.link {width: 159px;}
ul.demolayout #newtab-colour4 a.link {width: 165px;}
ul.demolayout #newtab-colour1 a.link, ul.demolayout #newtab-colour2 a.link, ul.demolayout #newtab-colour3 a.link, ul.demolayout #newtab-colour3 a.link {color:#fff; float: left; display: block; padding: 20px 8px 0px 8px; border: 2px solid #fff; border-bottom: 0; font-weight: bold;}


ul.demolayout #newtab-colour1 a.visited, ul.demolayout #newtab-colour2 a.visited, ul.demolayout #newtab-colour3 a.visited, ul.demolayout #newtab-colour4 a.visited{
    border: solid 0px #726f5d; 
    background-color: #726f5d;
    color:#fff;
}



ul.demolayout a.link, ul.demolayout a.visited, ul.demolayout a.hover, ul.demolayout a.active {position: relative; top: 0px; padding-bottom:0px;}
ul.demolayout {
	list-style-type: none;
	width: 806px;
	float: left;
	background: none;
	margin: 0;
	padding: 0;
	margin-left: 0px;
}

ul.layout1 {
background:none repeat scroll 0 0 transparent;
float:left;
list-style-type:none;
margin:0 0 0 0;
padding:0;
}

ul.demolayout a:hover {}
ul.demolayout #newtab-colour1 a:hover {width: 175px; background: #fff url(/images/nav-rollover-welcome2.jpg) top center no-repeat;}
ul.demolayout #newtab-colour2 a:hover {width: 245px; background: #fff url(/images/nav-rollover-leadership2.jpg) top center no-repeat;}
ul.demolayout #newtab-colour3 a:hover {width: 159px; background: #fff url(/images/nav-rollover-endorsement2.jpg) top center no-repeat;}
ul.demolayout #newtab-colour4 a:hover {width: 165px; background: #fff url(/images/nav-rollover-comm2.jpg) top center no-repeat;}
ul.demolayout #newtab-colour1 a:hover, ul.demolayout #newtab-colour2 a:hover, ul.demolayout #newtab-colour3 a:hover, ul.demolayout #newtab-colour4 a:hover{color:#fff; float: left; display: block; padding: 20px 8px 0px 8px; border: 2px solid #fff; border-bottom: 0px solid #fff; font-weight: bold;}


ul.demolayout #newtab-colour1 a.active {width: 175px; background: #fff url(/images/nav-rollover-welcome2.jpg) top center no-repeat;}
ul.demolayout #newtab-colour2 a.active {width: 245px; background: #fff url(/images/nav-rollover-leadership2.jpg) top center no-repeat;}
ul.demolayout #newtab-colour3 a.active {width: 159px; background: #fff url(/images/nav-rollover-endorsement2.jpg) top center no-repeat;}
ul.demolayout #newtab-colour4 a.active {width: 165px; background: #fff url(/images/nav-rollover-comm2.jpg) top center no-repeat;}
ul.demolayout #newtab-colour1 a.active, ul.demolayout #newtab-colour2 a.active, ul.demolayout #newtab-colour3 a.active, ul.demolayout #newtab-colour4 a.active{color: #fff; float: left; display: block; padding: 20px 8px 0px 8px; border: 2px solid #fff; border-bottom: 0; font-weight: bold;}


