/* Style sheet for MDG's */

/* Colors used:
	#000000 (black) - text
	#474F5C (dark blue/grey) - body default bg color
	#333333 (dark grey) - bg skiplinks and horizbar, border main div + brandbar + blockquote, links in brandbar, leftmenu border, leftmenu items border, h3 (text & line), content a:hover,  + a:active, rightbox border
	#EBEBEB (light grey) - bg color for brandbar
	#cccccc (lightly reddish light grey) - bg color for lang, banner and rightbox h2
	#B8161B (red) - right menu
	#FAF2DA (light pink) - bg blockquote
	#ffffff (white) - skiplink a:focus + a:active, bg main, text horizbar + footer
*/

body {
	font-family: Arial, Helvetica, sans-serif;
	margin-top: 0;
	background-repeat: repeat-x;
	background-color: #474F5C;
	background-image: url(images/grad3.jpg);
	font-size: 76%;
	color: #000000;
}
.clear {clear:both;}
.note {font-size: 90%;font-weight: normal;}
	
 /* SKIP TO NAVIGATION AND SKIP TO TEXT*/
 
#skiplink {
	padding: 0;
	margin: 0;
	font-size: 90%;}
#skiplink ul {
	padding: 0;
	margin: 0;
	display: inline;}
#skiplink ul li {
	padding: 0;
	margin: 0;
	display: inline;
	list-style: none;
}
#skiplink a {color: #A1A8B2}
#skiplink a:focus, div#skiplink a:active {
	color:#FFFFFF;
	background-color: #333333;
}

/* MAIN CONTAINER - HOMEPAGE*/

#main {
	width: 65em;
	background-color: #ffffff;
	margin: 0 auto;
	border: 1px solid #333333;
}

/* BRANDING BAR*/
#brandbar {
	height: 23px;
	background: #C2C6CF url(/common/images/brandbarbkgd.jpg) repeat-x;
}

#brandbar .unicon { /* *** latin conventions *** */
	padding-top: .2em;
	padding-right: .4em;
}

#brandbar .welcome { /* *** latin conventions *** */
	color: #333;
	display: block;
	float: left;
	font-size: .9em;
	padding-top: .5em;
}

#brandbar .welcome a {
	text-decoration: none;
	color: #1e1e1e;
}

#brandbar a:hover {
	text-decoration: underline;
	color: #1e1e1e;
}

#brandbar #searchfrm { /* *** latin conventions *** */
	float: right;
	text-align: right;
	margin-top: 0;
	margin-bottom: 0;
}

#brandbar #searchfrm label { /*hidden*/
	position: absolute;
	overflow: hidden;
	font-size: 88%;
	top: -500px;
}

#brandbar #searchfrm .button {font-size: 78%;}

#brandbar #searchfrm .textbox {	font-size: 80%;}

/* Brandbar */
#brandbar .unicon     /*position of the image*/
{margin-left:0.15em;
margin-top:0.1em;}

#brandbar #searchfrm{
	margin-top: 1px;
	margin-right: 2px}
/* LANGUAGE BAR */

#lang {
	background-color: #D4D8DB;
	padding: 0;
	margin: 0 auto;
	width: 100%;
	font-size: 87%;
}
#lang ul {
	float: right;
	text-align: right;
	color: #000000;
	padding: 0;
	margin: 0;
}
#lang ul li {
	list-style-type: none;
	font-weight: bold;
	text-align: right;
	display: inline;
	padding: 0 8px;
	margin: 0;
}
#lang ul li#arabic {direction: rtl; font-size: 110%;}
#lang ul li#chinese {font-size: 110%;}
#lang ul li#french {color:#385470; font-weight: bolder;}
#lang ul li a:link, #lang ul li a:visited {color:#000000; text-decoration:none;}
#lang ul li a:hover, #lang ul li a:active {color:#385470; text-decoration:none;}

/* TOP BANNER */

#banner {
	background-image: url(images/bannergrad.jpg);
	background-repeat: repeat-x;
	background-position: top;
	background-color: #cccccc;
	width: 100%;
}
#hiddentitle, #hiddentitle span {
	background-image: url(/fr/millenniumgoals/images/banner.jpg);
	background-repeat: no-repeat;
	height: 150px;
	margin: 0;
	padding: 0;
}
#hiddentitle span {margin-bottom: -95px;}
h1 {
	font-size: 1em;
	padding:0;
	margin:0;
	text-align: center;
	color: #7E030A;
}
h1 span {
	display: block;
	position: relative;
	z-index: 1;	
}


/* HORIZONTAL MENU*/
#horizontalmenu {
	width: 100%;
	background-color: #333333;
	height: 1.7em;
	float: left;}
	
#horizontalmenu  ul  {
	list-style-type: none;
	margin-top: 0.25em;
	margin-bottom: 0.25em;
	margin-left: 0em;
	margin-right: 0em;
	padding: 0px;
	text-align: center;}
	
#horizontalmenu ul li {display: inline;}
	
#horizontalmenu ul li  a, #horizontalmenu ul li a:link{
	border: 1px solid #666666;
	color: #FFFFFF;
	background-color: #333;
	text-decoration: none;
	padding-right: 0.5em;
	padding-left: 0.5em;
	margin-top: 0.2em;
	margin-right: 0.2em;
	margin-bottom: 0.2em;
	margin-left: 0.2em;
}
	
#horizontalmenu ul li a:visited {
	color: #FFFFFF;
	background-color: #525252;}
#horizontalmenu ul li a:active, #horizontalmenu ul li a:hover    {
	color: #333333;
	background-color: #D4D8DB;}
	
#horizontalmenu  ul li#bkgd a {margin-left: 0.1em;}
	

/* LEFT MENU BAR */
#leftmenu h3{
	color: #000000;
	font-weight: bold;
	background-color: #CCCCCC;
	padding: 0.25em 0.5em 0.1em;
	font-size: 1em;
	margin: 0px;}

#leftmenu {
	float: left;
	width: 21%;
	border-right: 1px solid #CCC;
	margin-top: 1em;
	padding: 0px;
	margin-bottom: 0px;
}

#leftmenu ul {
	list-style-type:none;
	margin: 0;
	padding: 0;}

#leftmenu ul li {
	border-bottom: 1px dotted #CCCCCC;
	text-decoration: none;
	padding: 0.3em 0.2em 0.2em 0.4em;
	font-weight: bold;
	text-align: left;
	display: block;
	margin: 0px;
}

#leftmenu ul li a, #leftmenu ul li a:link, #leftmenu ul li a:visited   {
	color: #333333;
	text-decoration: none;
	font-size: 0.8em;
	margin-bottom: 0px;
	padding-bottom: 0px;}

#leftmenu ul li .acronym
{
	font-size: 1.1em;
	color: #7e030a;
	font-weight: bold;
}


/* RIGHT NAVIGATION */
#rightnav {
	float: right;
	width: 20%;
	padding: 0px;
	margin-right: 0.2em;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-top: 1em;
	background-color: #F4F4F4;
}
	
#rightnav #box {
	border: 1px solid #333333;
	background-color: #B8161B;
	margin: 0em auto 0.2em;}
	
#rightnav #box h3 {
	font-weight: bold;
	color: #FFFFFF;
	background-color: #333333;
	padding-bottom: 0.4em;
	padding-top: 0.3em;
	margin: 0px;
	padding-right: 0.1em;
	padding-left: 0.1em;
	text-transform: uppercase;
	font-size: 1em;
	text-align: center;
}
	
#rightnav #box ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;}
	
#rightnav #box ul li {
	border-bottom: 1px solid #7E030A;
	padding: 0.4em 0.1em 0.4em 0em;}

#rightnav #box ul li a, #rightnav #box ul li a:link {
	color: #FFFFFF;
	display: block;
	font-weight: bold;
	text-decoration: none;
	background-repeat: no-repeat;
	padding-left: 4.1em;
	padding-top: 0.5em;
	padding-right: 0px;
	padding-bottom: 0px;
}
	
#rightnav #box ul li a:visited, #rightnav #box ul li a:hover {color: #EBDEB4;}

#rightnav  #box ul li#poverty  a  {
	background-image: url(images/hunger.gif);
	background-position: 8px 5px;}
	
#rightnav  #box ul li#education a {
	background-image: url(images/education.gif);
	background-position: 7px 8px;}
	
#rightnav #box ul li#gender a {
	background-image: url(images/gender.gif);
	background-position: 11px 7px;}
	
#rightnav  #box  ul  li#child a {
	background-image: url(images/childhealth.gif);
	background-position: 9px 4px;}
	
#rightnav  #box  ul  li#maternal a {
	background-image: url(images/maternal.gif);
	background-position: 14px 4px;}
	
#rightnav  #box  ul  li#aids a {
	background-image: url(images/aids.gif);
	background-position: 9px 7px;}
	
#rightnav  #box  ul  li#environ a {
	background-image: url(images/environment.gif);
	background-position: 4px 5px;}
	
#rightnav  #box  ul  li#global a {
	background-image: url(images/globalpartnership.gif);
	background-position: 4px 5px;}


div#blog {
	text-align: center;
	padding-bottom: 0.3em;
	margin-top: 0em;
	padding-top: 1px;
}

#rightnav #blog a, #rightnav #blog a:link {
	font-weight: bold;
	text-decoration:underline;
	color: #333333;
}

#rightnav #blog a:visited {color: #a61214;}

#rightnav #blog img{
	padding-top: 0.1em;
	padding-bottom: 0em;
	padding-left: 0px;
	padding-right: 0.2em;
	border:none;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
}

#rightnav #newsbox ul li    {
	border-bottom: 1px solid #999999;
	padding-bottom: 0.5em;
	list-style-image: none;
	list-style-type: none;
	padding-top: 0px;
	display: block;
	font-size: 0.8em;
	margin-top: 0;
	margin-right: 0.7em;
	margin-bottom: 0.5em;
	margin-left: -3em;
}
	
#rightnav  #newsbox  a, #rightnav  #newsbox .actu a:link {color: #330000; text-decoration:underline}
#rightnav  #newsbox  a:visited {color: #7E030A;}
#rightnav  #newsbox  a:hover {color: #7E030A;}

#rightnav #newsbox h3 {
	background-color: #333333;
	color: #FFFFFF;
	display: block;
	text-align: center;
	width: 100%;
	margin: 0 auto 0px;
	font-size: 0.92em;
	padding-bottom: 0px;
	text-transform: uppercase;
}

/* PAGE CONTENT ATTRIBUTES */

#content {
	width: 55%;
	margin: 1em 0 0;
	float: left;
	padding-top: 0;
	padding-bottom: 0em;
	padding-left: 1em;
	padding-right: 0.5em;
}
#content h2 {
	color: #7E030A;
	font-size: 1.4em;
	font-weight: bold;
	padding: 0;
	margin: 1em 0;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #7E030A;
}
#content h3 {
	font-size: 110%;
	font-weight: bold;
	color: #333333;
	padding: 0 0 0.1em 0.3em;
	margin: 1.3em 0 0.8em;
	background-color: #CCCCCC;
}
#content h4 {
	font-size: 100%;
	font-weight: bold;
	color: #385470;
	padding: 0;
	margin: 1.2em 0 0.8em;
}
#content p {
	padding: 0;
	margin: 0.8em 0;
}
#content a:link {color:#7E030A;}
#content a:visited {color: #385470;}
#content a:hover, #content a:active {color:#333333;}
#content ul {
	padding: 0;
	margin-top: 0.5em;
	margin-right: 0;
	margin-bottom: 0.5em;
	margin-left: 0;
}
#content ul li {
	padding: 0.5em 0.8em 0 1.2em;
	margin: 0 0 0 1em;
	background-image: url(images/bullet.gif);
	background-position: 2px 10px;
	background-repeat: no-repeat;
	list-style-image: none;
	list-style-type: none;}

#content ul li ul li{
	list-style:circle;
	background-image: none;
	padding-left: 0px;
	margin-left: 2em;}

#content ol li{
	list-style-type: none;
	padding: 0.2em 0.1em;}

/*Highligh box on the main page*/
#content #rightbox {
	float: right;
	width: 32%;
	border: 1px solid #333333;
	margin-top: 1em;
	margin-right: 0;
	margin-bottom: 1em;
	margin-left: 0px;
	padding: 0px;}

#content #rightbox ul li{
	margin-left: 0.3em;
	margin-right: 0px;
	padding-top: 0px;}

#content #rightbox h2 {
	font-size: 110%;
	color: #000000;
	font-weight: bold;
	background-color: #cccccc;
	margin: 0;
	padding: 0.3em;
	text-align: center;}
#content #rightbox p {
	padding: 0.3em;
	margin: 0;}
	
/* Reduce paragraphe size whith rightbox */
#content p.rightbox {
	padding: 0;
	margin: 0em 0 1.2em;
	width: 62%;
	float: left;
	line-height: 1.4em;
}
	
/* Quote on the main page */
#content  blockquote,  #content  #focus    {
	background-color: #FAF2DA;
	margin: 1.6em 0 0;
	border-bottom: 3px solid #EBDEB4;
	clear: both;}

#content  blockquote p, #content  #focus p  {
	line-height: 1.4em;
	padding: 0.5em 1.1em 0.3em;
	margin: 0px;}

#content  blockquote p.credit, #content  #focus p.credit  {
	text-align: right;
	display: block;
	font-style: italic;
	margin: 0px;
	padding: 0em;}

#content  blockquote  h2, #content  #focus h2 {
	background-color: #EBDEB4;
	display: block;
	color: #000000;
	margin: 0px;
	padding: 0.2em 0px 0.2em 1em;
	font-size: 1em;
	font-weight: bold;
	border-bottom-style: none;}

#content img{
	float: right;}

#content img.pdf{
	float: none;
	vertical-align:bottom;
	padding:0;
	border:none
}

#content p.indicator{
	font-style: italic;
}

.en

{font-size: 80%;
vertical-align: middle;
color: #ffffff;
background-color:#666666;
padding: 0pt;
margin: 0pt;}

/* FOOTER BAR */

#footer {
	text-align: center;
	clear: both;
	background-color: #333333;
	color: #ffffff;
	width: 100%;
	font-size: 90%;
	padding: 0;
	margin: 0 auto;}

acronym{
cursor:help;
border-bottom: 1px dotted #666666}

/*Homepage*/
div.light{background-color:#FCF9ED}

div.beige{background-color:#FAF2DA;
}

#content div.beige p, #content div.light p{padding-bottom:0.5em}

div.beige img, div.light img{
padding-left:0.5em;
padding-bottom:0.5em;}

.info{
	font-size: 0.8em;
	padding-top: 0.2em;
	padding-right: 0.3em;
	padding-bottom: 0.2em;
	padding-left: 0.3em;
	padding-right: 0.3em;
	border: 1px dotted #CCCCCC;
}

#quiz img{
	float:left;
	padding-left:0.5em
}
#quiz p{
	font-size:0.8em;
	padding-top: 0.5em;
	text-align: left;
}