@charset "utf-8";
/* CSS Document for the Water for Life Decade */


html {overflow: -moz-scrollbars-vertical;}

body {
	background-color: #fff;
	color: #000;
	font-family:Arial, Helvetica, sans-serif;
}
#main {
	background-color: #fff;
	width: 90%;
	min-width: 90%;
	border: none;
	margin-top: -10px;
	padding-top: 0;; 
	margin-left:auto; margin-right:auto
}
#brandbar {
	z-index: 100;
}
#languages {
	line-height: 180%;
	background-color: #002E63;
}
#languages ul li a:link, #languages ul li a:visited {
	color: #FFFFFF;
	text-decoration: underline;
}
#languages ul li a:hover {
	color: #FFFFFF;
	text-decoration: none;
}
#languages ul li#french {
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: none;
}
/* SKIP TO NAVIGATION AND SKIP TO TEXT*/
 
#skiplink, #skiplink a {
	color:#fff;
	font-size: 65%;
	z-index: -100;
}

/* TOP BANNER */

#topbanner {
	background-color: #fff;
	height: 161px;
	background-image: url(../images/bannerbkgd.jpg);
	background-repeat: repeat-x;
	vertical-align: top;
	margin: 0;
	padding: 0;
}
#topbanner #hiddentitle, #hiddentitle span {
	height: 37px;
	color: #002E63;
	background-image: url(../images/banner.jpg);
	background-repeat: no-repeat;
	text-align: center;
	background-color: #abc4ea;
	margin-bottom: -21px;
	display: block;
}
#banner #hiddentitle span {
	display:none;
}
#toplogos {
	background-color: #fff;
	height: 124px;
	background-image: url(../images/logosbkgd.jpg);
	background-repeat: no-repeat;
	vertical-align: top;
	margin-top: 16px;
	padding: 0;
}
#toplogos #unwaterlogo {
	float: right;
	width: 33%;
	height: 124px;
	text-align: right;
	margin: 0;
	padding: 0;
}
#toplogos #decadelogo {
	float: right;
	width: 34%;
	height: 124px;
	text-align: center;
	margin: 0;
	padding: 0;
}
/* HORIZONTAL MENU */
#hznav {
	width: 100%;
	margin: 0;
	background-color: #ABC4EA;
	border-bottom: 4px solid #002E63;
	padding: 0;
}
#hznav ul {
	line-height: 180%;
	padding: 0;
	margin: 0;
}
#hznav ul li {
	display: inline;
	border-right: #fff 1px solid;
	text-align: center;
	padding-left: 70px;
	padding-right: 70px;
	padding-top: 5px;
	padding-bottom: 5px;
	margin: 0;
}
#hznav ul li a {
	font-weight: bold;
	color: #002E63;
}
#hznav ul li a:link, #hznav ul li a:visited {
	text-decoration: none;
}
#hznav ul li a:active, #hznav ul li a:hover {
	text-decoration: underline;
}


/* BREADCRUMBS */
#breadcrumbs {
	width: 100%;
	display: block;
	background-color: #E2E3DF;
	border-bottom: 5px #fff solid;
	line-height: 180%;
}
#breadcrumbs ul {
	padding-left: 3px;
	padding-right: 3px;
	margin: 0;
}
#breadcrumbs ul li {
	display: inline;
	list-style: none;
	padding-right: 12px;
	font-size: 90%;
}
#breadcrumbs ul li a {
	color: #000;
}
#breadcrumbs ul li a:link, #breadcrumbs ul li a:visited {
	text-decoration: underline;
}
#breadcrumbs ul li a:hover, #breadcrumbs ul li a:active {
	text-decoration: none;
}

/* LEFT-SIDE MENU */
#mainnav {
	width:20%;
	float:left;
	margin-top: 5px;
	margin-left: 0;
	margin-right: 0;
	padding: 0;
	background-color: #E2E3DF;
}
#mainnav ul {
	padding: 0;
	margin: 0;
}
#mainnav ul li {
	padding: 0;
	margin: 0;
	display: block;
}
#mainnav ul li span.category {
	text-transform: uppercase;
	font-weight: bold;
	background-color: #B7B8AF;
	display: block;
	padding: 3px;
	font-size: 115%;
}
#mainnav ul ul {
	margin:0;
	padding: 0;
	text-transform: none;
	font-weight:normal;
	border-bottom: #fff 3px solid;
	border-top-style: solid;
	border-top-width: 3px;
}
#mainnav ul ul#about, #mainnav ul ul#progress {
	border-top-color: #00A8C6;
}
#mainnav ul ul#programmes {
	border-top-color: #FCA233;
}
#mainnav ul ul#themes {
	border-top-color: #944374;
}
#mainnav ul ul#regions {
	border-top-color: #FBC817;
}
#mainnav ul ul#resources {
	border-top-color: #8ED300;
}
#mainnav ul ul#multimedia {
	border-top-color: #5789D5;
}
#mainnav ul ul li {
	display: block;
	margin:0;
	padding: 0;
	line-height: 170%;
	border-bottom: #fff 1px solid;
}
#mainnav ul ul li a:link, #mainnav ul ul li a:visited {
	padding-left: 3px;
	text-decoration: none;
	color: #000;
}
#mainnav ul ul li a:active, #mainnav ul ul li a:hover, #mainnav ul ul li a:focus {
	text-decoration: underline;
	color: #000;
}
#mainnav ul ul li a:active, #mainnav ul ul li a:hover, #mainnav ul ul li a:focus {
	display: block;
}
#mainnav ul ul#about li a:active, #mainnav ul ul#about li a:hover, #mainnav ul ul#about li a:focus,
#mainnav ul ul#progress li a:active, #mainnav ul ul#progress li a:hover, #mainnav ul ul#progress li a:focus {
	background-color: #CCEEF4;
}
#mainnav ul ul#programmes li a:active, #mainnav ul ul#programmes li a:hover, #mainnav ul ul#programmes li a:focus {
	background-color: #FEE8CC;
}
#mainnav ul ul#themes li a:active, #mainnav ul ul#themes li a:hover, #mainnav ul ul#themes li a:focus {
	background-color: #E4D0DC;
}
#mainnav ul ul#regions li a:active, #mainnav ul ul#regions li a:hover, #mainnav ul ul#regions li a:focus {
	background-color: #FEF4D1;
}
#mainnav ul ul#resources li a:active, #mainnav ul ul#resources li a:hover, #mainnav ul ul#resources li a:focus {
	background-color: #E8F6CC;
}
#mainnav ul ul#multimedia li a:active, #mainnav ul ul#multimedia li a:hover, #mainnav ul ul#multimedia li a:focus {
	background-color: #DCE6F8;
}

/* PAGE CONTENT ATTRIBUTES */

#content {
	width: 79%;
	float: right;
	padding: 0;
	margin-left: 5px;
	margin-top: 5px;
}
#content p {
	padding-top: 6px;
	padding-bottom: 6px;
}
#content ul, #content ol {
	padding-bottom:12px;
	margin-top: 6px;
	margin-left: 30px;
}
#content ul li {
	padding: 3px 0 6px 12px;
	list-style:disc;
}
#content ol li {
	padding: 3px 0 6px 12px;
}
#content a, #content a:link {
	color:#002e63;
	text-decoration: underline
}
#content a:visited {
	color:#944374;
}
#content a:hover, #content a:active, #content a:focus {
	text-decoration: none;
	color:#5789d5;
}
#content a img {
	border: none;
}
#content img.left {
	float: left;
	margin-right: 7px;
	margin-bottom: 7px;
	margin-left: 0;
	margin-top: 0;
	padding: 0;
}

/* Note: since the color scheme of the pages varies according to the color attributed to the page in the menu, you will find the specific color schemes in separate style sheets. Here are only those styles that apply to all pages. */
#content h2 {
	font-size: 115%;
	display: block;
	padding: 3px;
	margin-top: 0;
	margin-bottom: 6px;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	text-transform: uppercase;
}
#content h3 {
	font-size: 110%;
	padding: 0;
	margin-top: 6px;
	margin-bottom: 6px;
	display: block;
}
#content h4 {
	font-size: 105%;
	font-weight: bold;
	padding: 0;
	margin-top: 6px;
	margin-bottom: 6px;
	display: block;
}
#content hr {
	height: 1px;
	width: 100%;
}

/* Right-side column - see all styles in the rightcolumn.css*/
#addres {
	display: none;
}

/* FOOTER */
#footer {
	background-image: url(../images/footer.gif);
	background-repeat: repeat-x;
	background-position:top;
	background-color: #CCDCF9;
	clear: both;
}
#footer ul {
	margin-top: 0;
	padding: 3px;
}
#footer ul li  {
	display: inline;
	margin-right: 0;
	margin-left: 0;
}
#footer ul li a {
	color: #000;
	text-decoration: none;
}
#footer ul li a:hover {
	color: #000;
	text-decoration: underline;
}

/* CREDIT */
#wsscredit {
	margin-top: 10px;
	font-size: 90%;
	color: #333;
	text-align: center;
}

/* BACK TO TOP Special alignment for large page */

.top {
	font-size: 0.85em;
	right: 0.1%;
}