  /* 60 ways - Media: screen */

/* New colours

Dark blue : #204da5
Dark grey : #333333
Medium grey : #666666
light blue : B0C5EB
very light blue: E6EDF9
beige : fdf5e4
brown : af7269

 */


/* Adds right scroll bar to avoid bouncing on short pages */
html {min-height: 100%; margin-bottom: 1px;} 

body {
	font-family: Arial, Helvetica, sans-serif;
	margin-top: 0;
	font-size: 76%;
		background-color: #B0C5EB;
	background-image: url(/es/un60/60ways/images/grad_bg.jpg);
	background-repeat: repeat-x;

}
.clear {clear:both;}
.note {font-size: 90%;}
acronym {cursor:help; border-bottom: 1px dotted #000000;}
abbr {border: none;}

	
 /* 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: #B0C5EB;}
#skiplink a:focus, div#skiplink a:active {color: #000000;}

/* MAIN CONTAINER - HOMEPAGE*/

#main {
	width: 60em;
	margin: 0 auto;
	border: 1px solid #204da5;
	background-color:#FFFFFF;
}

/* BRANDING BAR*/

#brandbar {
	width: 100%;
	background-image: url(/es/un60/60ways/images/brandbarbkgd.jpg);
	background-repeat: repeat-x;
	margin: 0 auto;
	padding: 0;
	/*height: 23px;*/
	height: 22px;
}
#brandbar a {
	font-size: 85%;
	color: #000000;
	display: block;
	padding: 0.4em 0 0.2em 0;
	float: left;
	width: 48%;
	margin: 0.1em 0 0 0 ;
}
#brandbar a:link, #brandbar a:visited {color: #000000; text-decoration: none;}
#brandbar a:hover, #brandbar a:active {color: #000000; text-decoration: underline;}

/* SEARCH BOX */
#brandbar #searchfrm {
	width: 48%;
	font-size: 85%;
	float: right;
	text-align: right;
	margin: 2px 2px 1px 0;
	padding: 0;
}
#brandbar #searchfrm label /*hidden*/ {
	position: absolute;
	overflow: hidden;
	top: -500px;
}
#brandbar #searchfrm .button, #brandbar #searchfrm .textbox {font-size: 85%;}

/* LANGUAGE BAR */

#lang {

	background-color: #204da5;
	padding: 0;
	margin: 0 auto;
	width: 100%;
	font-size: 87%;
	height: 1.6em;
}
#lang ul {
	float: right;
	text-align: right;
	font-weight:bold;
	color:#FFF;
	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: 120%;
	font-family: "Traditional Arabic", "Arabic Transparent", Tahoma;
}
#lang ul li#chinese {font-size: 110%;}
#lang ul li#spanish { color:#990000; font-weight:bold}
#lang ul li a {color:#fff; text-decoration:none; font-weight:normal}

/* TOP BANNER */

#banner {
	background-color: #204da5;
	width: 100%;
	background-image: url(/es/un60/60ways/images/banner_bg.jpg);
	background-repeat: repeat-x;
	background-position: left top;
}
#hiddentitle, #hiddentitle span {
	background-image: url(/es/un60/60ways/images/banner.jpg);
	background-repeat: no-repeat;
	height: 105px;
	margin: 0;
	padding: 0;
	background-position: left;
}
#hiddentitle span {margin-bottom: -95px;}
h1 {
	font-size: 1em;
	padding:0;
	margin:0;
	text-align: center;
	color: #000;
}
h1 span {
	display: block;
	position: relative;
	z-index: 1;	
}

/* LEFT MENU BAR: navigation links */

#leftmenu {
	float: left;
	width: 26.4%;
	background-color: #204da5;
	margin: 0em;
	padding: 0em;
}
	
#leftmenu ul {
	list-style-type:none;
	margin: 0;
	padding: 0;
	font-weight: bold;
}

#leftmenu ul li {
	border-bottom: #fff 1px dotted;
}
#leftmenu ul li.first {border-top: #fff 1px dotted;}
#leftmenu ul li a {
	text-decoration: none;
	padding: 4px 10px 4px 6px;
	display: block;
	text-decoration: none;

}
#leftmenu ul li a:link, #leftmenu ul li a:visited {
	color: #fff;

}
#leftmenu ul li a:hover, #leftmenu ul li a:active 
{color: #204da5;
background-color:#E6EDF9
}

	
/* PAGE CONTENT ATTRIBUTES */

#content {
	width: 70%;
	margin: 0;
	padding: 0 1em;
	float: right;
}
#content h2 {
	color: #204da5;
	font-size: 130%;
	padding: 0;
	margin: 1em 0;
	text-transform: uppercase;
}
#content h3 {
	font-size: 110%;
	color: #204da5;
	padding: 0;
	margin: 1em 0 0.8em 0;
}
#content p {
	padding: 0;
	margin: 0.8em 0;
}
#content a:link {color:#204da5;}
#content a:visited {color: #333333;}
#content a:hover, #content a:active {color:#204da5;}
#content ul {
	padding: 0;
	margin: 0.8em 0;
}
#content ul li {
	padding: 0.5em 0.8em 0 0.8em;
	margin: 0 0 0 1em;
	list-style: square;
	list-style-position: outside;
}

/*Quote on the main page*/
#content blockquote {
	background-color: #E6EDF9;
	border-top: #204da5 5px solid;
	border-bottom: #204da5 2px solid;
	margin: 2em 0 3em;
	padding: 0.2em 0.6em;
}

#content blockquote .credit {
	text-align: right;
	margin: 0;
	padding: 0 1em 0.5em 0;
}

#content p.focus
{background-color:#E6EDF9;
border:#204da5 1px solid;
padding:10px}

/* photos */

div.photoleft
{
	float:left;
	margin-right:10px;
	margin-bottom:10px;
	margin-top: 5px;
}

div.photoright
{
	float:right;
	margin-left:10px;
	margin-bottom:10px;
	margin-top: 0px;
}

div.photofull
{clear:both}

div.photocenter
{margin:auto}

#content div.photoleft p, #content div.photoright p, #content div.photofull p, #content div.photocenter p
{
	margin:0;
	padding:3px;
	background-color:#E6EDF9;
	clear:both;
	font-size: 90%;
}

/* FOOTER BAR */

#footer {
	text-align: center;
	clear: both;
	background-color: #204da5;
	color: #FFFFFF;
	width: 100%;
	font-size: 90%;
	padding: 0;
	margin: 0 auto;
}
.white a {
color:#FFFFFF;
text-decoration:none;
}
