/* 
Colors: 
gray: 	717171 (content background)
brown: 	4b2b03 (text, links)
red:		5b0f0a (highlight)
*/

/* reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:top;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}

/* typography */

body {font-size:75%;color:#4b2b03;background:#1a1a18;font-family:"Helvetica Neue", Arial, Helvetica, sans-serif;}
h1, h1 a {font-size:2.325em;line-height:1.25;margin-bottom:0.5em;color:#4b2b03;padding:0;background:none;}
/*h1 {font-size:2.325em;line-height:1.25;margin-bottom:0.5em;color:#fff;background:#5B0000;padding:5px;}*/
h1 span, h2 span { color:#ffffff;}
h2 {font-size:2em;margin-bottom:0.5em;}
h3 {font-size:1.5em;line-height:1;margin-bottom:1em;}
h3.sub { margin-top: -.6em;color:#666666;}
h4 {font-size:1.2em;line-height:1.25;margin-bottom:1.25em;}
h5 {font-size:1em;font-weight:bold;margin-bottom:1.5em;}
h6 {font-size:1em;font-weight:bold;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;}
p {margin:0 0 1.5em;}
a:focus, a:hover {color:#000000;}
a {color:#381f01;text-decoration:underline;}
.pullquote {margin:0 1.5em 1.5em 1.5em;padding:20px;
  color:#4b2b03;font-style:italic;
  font-size:1.5em;font-family: "Warnock Pro", "Goudy Old Style","Palatino","Book Antiqua", Georgia, serif;font-weight: normal;
  border-top:1px solid #a5865e;border-bottom:1px solid #a5865e;}
.pullquote p { margin-bottom:0;text-align:center;}
.pullquote p + p  { text-indent: 0; margin-top:1.5em; margin-bottom:0;} 
.pullquote p.credit { color:#4b2b03;text-align:right; font-size:1em;}
blockquote { padding: 0.5em 1.5em;font-style:italic; }
blockquote p.credit { color: #4b2b03; font-size: 1em;margin-bottom:1.5em; }

strong {font-weight:bold;}
#story #leftCol strong { color: #381f01; }
em, dfn {font-style:italic;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
abbr, acronym {border-bottom:1px dotted #666;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0;white-space:pre;}
pre, code, tt {font:1em 'andale mono', 'lucida console', monospace;line-height:1.5;}
li ul, li ol {margin:0 1.5em;}
ul, ol {margin:0 1.5em 1.5em 2.5em;}
ul {list-style-type:disc;}
ol {list-style-type:decimal;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}
table {margin-bottom:1.4em;width:100%;}
th {font-weight:bold;background:#c3d9ff;}
th, td, caption {padding:4px 10px 4px 5px;}
tr.even td {background:#e5ecf9;}
tfoot {font-style:italic;}
caption {background:#eee;}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide {display:none;}
.quiet {color:#666;}
.loud {color:#000;}
.highlight {background:#ff0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last {margin-right:0;padding-right:0;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}
.pullquoteRight, .pullquoteLeft { padding: 0 4px 0px 8px; float: right; width: 200px;  
margin: 10px 0 10px 20px; border: 1px solid #CBCBCB; border-left: 8px solid #CBCBCB; border: none; border-top: 3px double #CBCBCB; border-bottom: 3px double #CBCBCB; font-size: 1.2em; font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; 
line-height: 120%; text-align: center; }
.pullquoteLeft p,.pullquoteRight p, .pullquoteFull p {font-family: Georgia, "Times New Roman", Times, serif;font-size: 1.2em;line-height: 120%;margin:1.2em 0;}
.pullquoteLeft {float: left; margin: 10px 20px 10px 0; text-align: left; }
.quoteCredit {text-align: right;  font-style: normal; margin-bottom:0; }
.pullquoteFull {padding: 0px 4px 0px 8px; border: 3px double #CBCBCB; font-size: 1.3em; font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; line-height: 120%; margin: 10px 0; }
.note { font-style: italic; margin: 10px 0; }
hr {background:#ddd;color:#ddd;clear:both;float:none;width:100%;height:.1em;margin:0 0 1.45em;border:none;}
hr.space {background:#fff;color:#fff;}

/* icons */
/* gray icons (default)
a.pdf { background:url(../images/icons/pdf.gif) right 0 no-repeat;padding: 0 14px 0 0; }
li.audio {list-style:none;background:url(../images/icons/audio.gif) 0 3px no-repeat;margin-left:-1.5em;padding-left:1.5em;}
li.video {list-style:none;background:url(../images/icons/video.gif) 0 3px no-repeat;margin-left:-1.5em;padding-left:1.5em;}
li.slideshow {list-style:none;background:url(../images/icons/slideshow.gif) 0 3px no-repeat;margin-left:-1.5em;padding-left:1.5em;}
li.news {list-style: none;background:url(../images/icons/news.gif) 0 3px no-repeat;margin-left:-1.5em;padding-left:1.5em;}
 *//* red icons: <ul class="red"> */
ul.red li {list-style:none;background:url(../images/icons/dot-red.gif) 1px 5px no-repeat;margin-left:-1.5em;padding-left:1.5em;}
ul.red li.audio {background-image:url(../images/icons/audio-red.gif);background-position: -1px 3px;}
ul.red li.video {background-image:url(../images/icons/video-red.gif);background-position: -1px 3px;}
ul.red li.slideshow {background-image:url(../images/icons/slideshow-red.gif);background-position: -1px 3px;}
ul.red li.news {background-image:url(../images/icons/news-red.gif);background-position: -1px 3px;}

ul#mediaList li { margin-bottom: 20px; }
#home ul#mediaList li { margin-bottom: 10px; }

/* images */
p img.left, .imgLeft {float:left;margin:0.5em 1.5em 1.5em 0;padding:0;}
p img.right, .imgRight {float:right;margin:0.5em 0 1.5em 1.5em;}
p img.right, p img.left, .imgLeft img, .imgRight img,.imgFull img  {}
div.imgFull { width:550px; margin: 0 auto;margin-bottom:1.5em; }
div.imgRight, div.imgLeft {width: 300px;}
.enlarge { font-size:.8em;margin-top:0em;margin-bottom:0em;line-height:1.875em;color:#8F8F8F;text-align:right; }
.enlarge a { color:#8F8F8F;text-decoration:none;padding: 0 0 5px 14px;background: url(../images/icons/magnify-plus.gif) no-repeat 0 2px ; }
img.enlarge { float: right; border: none; }
#articleBody img { padding:3px;background:#4b2b03;}
#articleBody .imgRight,#articleBody .imgLeft,#articleBody .imgFull,
#home .imgRight,#home .imgLeft,#home .imgFull { padding:5px;background:#4b2b03; }
#articleBody div.imgRight,#articleBody div.imgLeft { width:305px; }
#articleBody div.imgFull { width:555px; }

p.moreinfo {font-weight: bold;text-align: right;}

#donateButton { float: right; margin: 25px 10px 0 0;}
#donateButtonSub { text-align:center; margin: 0px auto 20px auto; }
h1#donateTitle { float: left; width: 600px; }

/* layout */
#container { max-width: 950px; background: #c49f70;margin: 10px auto;
	width:950px; }
#pageHeader { display:relative;width:100%;background:#d33c29 url(../images/header.jpg) no-repeat; height:204px;}
#headerSpacer {  width: 300px; height: 202px; float: right; }
#printHeader {display:none;}
#pageHeader	img { display: inline; }
#msf-website {color:#ccc; margin: 0; padding: 0 0 6px 0;background:#1a1a18; height:20px; text-align:right; font-size:0.9em; }
#msf-website a {color:#ccc; background: url(../images/msf-logo-small.png) left -1px no-repeat; padding: 0 0 4px 27px; margin-left:-2px;  }

/*#pageTable, #pageTable td { padding:0;margin:0;	}
#pageBody { width: 710px; }*/
.pageContent { padding: 10px 50px 0 50px; } 
.oneCol { margin: 0 auto; width: 90%; }
#leftCol, #rightCol { width:42%; }
#leftCol { float:left;padding:10px 10px 10px 50px; }
#rightCol { float:right;padding:10px 50px 10px 10px; }
#container.oneCol { margin:auto; width:auto; }
#container.oneCol #rightCol { display:none; }
#container.oneCol #leftCol { width: auto;padding-right:100px;padding-left:100px; }
#photos #container.oneCol #leftCol { width: 908px;padding-left:19px;padding-right:0px; }

.credit { font-size:.8em;margin-top:.325em;margin-bottom:0em;line-height:1.325em;color:#4b2b03;text-align:right; }
.caption { font-size:1em;margin-bottom:0em;line-height:1.325em;color:#4b2b03;clear:both; }

#photosBig  { text-align: center; }
#photosBig h2  { text-align: left; margin-top: 40px; }
#photosBig p  { text-align: left;  }
#photosBig .photo { margin-bottom: 20px; background:#000;color:#ffffff;width:900px;text-align:left;padding:4px;text-align:center;}
#photosBig .photo .caption,#photosBig .photo .credit { color:#fff; text-indent:0;text-align:left;}
#photosBig .photo .credit { text-align:right;}
#photosBig .photo img { border: none;margin:0 auto;}
#photosBig .controls { margin:0;padding:0;font-size:.9em;text-align:right;}

#pageNav .subNav { padding: 0; margin: 0; list-style-type: none;border-bottom:1px solid #CECECE;}
#pageNav .subNav li { margin: 0; padding: 0;  }
#pageNav .subNav a { line-height: 12px; color: #CF0003; background:#DEDEDC;
	padding: 6px 10px 6px 24px; font-weight: normal; 
	border: none; font-size: 11px;  border-right: 1px solid #DEDEDC;}
#pageNav .subNav a:hover {background: #eee; color:#CF0003;}
#pageNav .subNav .on a {background: #FFFFFF;color:#000;}
#pageNav .subNav .on a:hover {background:#FFFFFF;color: #000;}

#pageOptions { width: 100px; float: right; }

#pageTitles h1 { margin: 0;}
#pageTitles h2 { font-size:1.325em;font-weight:bold;margin: .325em 0 .325em 0; line-height: 1em;font-style:italic; }
#pageTitles { margin:0 0 1.5em; }

/* misc */
.spacer 			{ clear: both;  visibility:hidden; height:0px; font-size:0px; line-height:0px; }			
.clearLeft { clear:left;visibility:hidden; height:0px; font-size:0px; line-height:0px; }
.clearRight { clear:left;visibility:hidden; height:0px; font-size:0px; line-height:0px; }
.leftHalf		{ float:left;	 	width:50%; 	position:relative;	}
.rightHalf		{ float:right; 	width:49%; 	position:relative; 	}

/* custom for this mini site */
#toptenList { text-align:center; }
#toptenList ul { margin:0 0 25px 0;padding:7px 0 0 0;list-style:none;text-align:center;}
#toptenList li { background:none;margin:0;padding:0;display:inline;line-height:normal;}
#toptenList a { color:#4b2b03;text-decoration:none;font-weight: bold;padding:0 7px;text-transform:uppercase; } 
/* last item in nav list */
#toptenList #hiv-tb a,#toptenList #neglected-diseases a  
{ border-right:none; } 

#pageFooter {color:#4b2b03;width:100%;background:url(../images/footer.jpg) no-repeat;margin:0;
	padding:213px 0 10px 0; }
#pageFooter p { margin: 10px;text-indent:0;text-align:left; }
#pageFooter a {	}

#toptenList.bottom { background:#53330c;}
#toptenList.bottom ul { padding:10px 5px;margin: 0px 0 10px 0;}
#toptenList.bottom a {color:#ffffff;text-decoration:none;font-weight: bold;padding:0 7px;text-transform:uppercase; }
#toptenList.bottom a:hover { color:#ffffff; }
#toptenList li.on a { color: #ffffff;}

#topNav { margin:174px 0 10px 10px;padding:0;list-style:none;float:left; }
#topNav li { float:left;margin:0 10px 0 0;padding:0 5px;}
#topNav li a { color:#ffffff;font-weight:bold;text-decoration:none;font-size:14px; }
#topNav li a:hover {text-decoration:none;color:#2ff1ef;}
#topNav li.on a {color:#04e2df;}

#toptenList a:hover { color:#FFFFFF; }
#toptenList li.on a { color: #FFFFFF;}

.toptenIntro .imgLeft { margin-right:.5em; }
.toptenIntro h2  { padding-top:.325em; }
.toptenIntro h2 a { font-size: 0.625em;color:#4b2b03;line-height:1.325em;font-weight:bold;text-decoration:none; }
.toptenIntro h2  a span { color:#ffffff; }
.toptenIntro h2 a:hover { color:#ffffff; }

#rightCol #photos  { }
#rightCol #photos img { border:2px solid #4b2b03;float:left;margin: 0 9px 8px 0; }
#photos img { border:4px solid #4b2b03;float:none;margin: 0; }
#rightCol #photos .credit, #photos .credit { margin-bottom:20px;}
.morephotos { text-align: right;margin:0 10px 4px 0; }

.slideshow, .map, .box { padding:15px 18px;background:url(../images/slideshow-border.png) no-repeat;margin-bottom:1.5em; }
.map { width: 364px; height:280px;}
.youtube { padding:18px 16px 20px 16px;background:url(../images/slideshow-border-youtube.png) no-repeat;margin-bottom:1.5em; }

.map-noborder { margin-bottom:1.5em; }

.relatedLink { padding:10px 20px;border-top:1px solid #a5865e;border-bottom:1px solid #a5865e;margin-bottom:1.5em; }
.relatedLink h2 { color:#5B3937;font-weight:bold;font-size:1.325em;margin-bottom: 0;line-height:1.325em;}
.relatedLink h6 { font-weight:normal;margin:.5em 0 0 0;}
.relatedLink h2 a { text-decoration:none;color:#5B0000; }
.relatedLink .imgLeft { margin-bottom:0;width:100px;}
.relatedLink img { border:1px solid #4b2b03; }
.relatedLink div.text { float:right;width:235px; }

.articleDate { text-transform:uppercase;font-size:.8em; }
#articleBody h2 { font-size:1.5em;margin-bottom:0.5em;} 
.articleSidebar { margin: 0 0 10px 15px; float: right;width: 200px; font-size: 11px; padding: 3px 10px; }
.articleSidebar h1 { font-size: 12px; margin: 0 0 10px 0; color: #fff; }
.articleSidebar h2 { font-size: 1em; font-weight:bold; margin: 0 0 10px 0; color: #fff; }
.articleSidebar h6 { margin-top: 15px; }
.articleSidebar p {  font-size: 11px ; line-height: 16px; margin: 6px 0; }
.articleSidebar ul { margin: 8px 0 15px 0 ; padding: 0 ; }
.articleSidebar li { margin: 0 0 7px 0 ; padding: 0 0 0 10px ; background: url(/images/global/bullet4x4.gif) 0 5px no-repeat ; font-size: 11px ; line-height: 16px; }
.articleSidebar ol { padding-left: 0px; }
.articleSidebar ol li { background: none  ; line-height: normal ; padding-left: 0px ; }
.articleSidebar ol.contents { margin: 8px 0 10px 21px ; }
.articleSidebar ol.contents ol { margin: 5px 0 6px 19px ; }
.articleSidebar ol.contents li {  line-height: normal; }
.articleSidebar ol.contents li a { text-decoration: none; color: #002BB8; }
.articleSidebar ol.contents li a:hover, .articleSidebar ol.contents li a:focus { text-decoration: underline; }
.articleSidebar img {  border: 1px solid #797979; margin: 0 0 0 0; }
.articleSidebar img.imgRight { margin: 3px 0 3px 3px }
.articleSidebar .dataTable { font-size: 11px; }

.more h2 { color:#4b2b03; }
.democratic-republic-of-congo .more h2 { font-size:1.5em; }
.more li { margin-bottom:0.5em; }

/* photo banner images */
#photoBanner { width:100%;background:none;height:25px; }
#story #photoBanner { height:161px;background:url(../images/banners/default.jpg) no-repeat;margin-bottom:-80px; }
#story.childhood-malnutrition #photoBanner 				{ background:url(../images/banners/childhood-malnutrition.jpg) no-repeat; }
#story.democratic-republic-of-congo #photoBanner 	{ background:url(../images/banners/democratic-republic-of-congo.jpg) no-repeat; }
#story.ethiopia #photoBanner 											{ background:url(../images/banners/ethiopia.jpg) no-repeat; }
#story.myanmar #photoBanner 											{ background:url(../images/banners/myanmar.jpg) no-repeat; }
#story.somalia #photoBanner 											{ background:url(../images/banners/somalia.jpg) no-repeat; }
#story.sudan #photoBanner 												{ background:url(../images/banners/sudan.jpg) no-repeat; }
#story.hiv-tb #photoBanner 												{ background:url(../images/banners/hivtb.jpg) no-repeat; }
#story.zimbabwe #photoBanner 											{ background:url(../images/banners/zimbabwe.jpg) no-repeat; }

#story.iraq #photoBanner 													{ background:url(../images/banners/iraq.jpg) no-repeat; }
#story.pakistan #photoBanner 											{ background:url(../images/banners/pakistan.jpg); no-repeat; }

 /******* 	GENERAL PAGE AREAS		*******/

.sidebar {float:right;margin:0  10px 10px 10px;width:220px; background: #777777; font-weight: bold;
	padding:8px; border:1px solid #808080; color: #fff; line-height: 18px; color: #eee;}
#home .sidebar { width: 160px; }
.sidebar ul { margin-top:1.0em;}
.sidebar a { text-decoration: none; }
.sidebar h2 { font-size: 1.0em; margin: 1em 0; color: #5b0f0a;  }

.morelink 			{ color:#FDBF56; text-decoration:underline;			}
.callout1 			{ float:right; border:1px solid #CCCCCC; margin:18px 18px 8px 28px; padding:10px 12px 12px 12px; width:185px;
				  	 	  color:#696969; font-size:11px; line-height:14px;	}
					  
.learnmore { font-family:Verdana, Arial, Helvetica, sans-serif; text-decoration:none; 
	font-weight:bold; background:url(rcbutton-red-right.gif) no-repeat 100% 50%; 
	height:24px; padding: 0px 0px 5px; text-align:center; margin:5px auto; }
.learnmorebg { background:url(rcbutton-red-left.gif) no-repeat 0% 50%; height:24px; display:block; padding: 5px 9px 0px; color:#fff; text-decoration:none; }
.learnmore a:hover { color:#fff; }
.learnmore span { color: #FFCC00; }

/* Flickr images */
#flickr_badge_wrapper td img { border: 1px solid #CBCBCB; margin: 0 5px 0 0; width: 100px;  }

#flickr img { float: left; margin: 0 5px 5px 0;  background:#3f4e4e; padding: 2px; width: 215px; height: 144px; }
#flickrSidebar { width: 168px; margin : 0 auto; }
#flickrSidebar img {margin: 0 2px 5px 2px;  background:#3f4e4e; padding: 2px; float: left; }

/* sIFR */
/* These are standard sIFR styles... do not modify */
.sIFR-flash {	visibility: visible !important;margin: 0;}
.sIFR-flash + div[adblocktab=true] { display: none !important;}
.sIFR-replaced {visibility: visible !important;}
span.sIFR-alternate {position: absolute;left: 0;top: 0;width: 0;height: 0;display: block;overflow: hidden;}
/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles*/
.sIFR-hasFlash #story h1 {	visibility: hidden;font-size:3em;letter-spacing:-6px;}
.sIFR-hasFlash #home h1 {	visibility: hidden;font-size:3em;letter-spacing:-6px;margin-top:0.5em;}
.sIFR-hasFlash h1 span {	color:#4b2b03; } 
.sIFR-hasFlash #story. h1 {font-size:3em;letter-spacing:-2px;}
.sIFR-hasFlash #story.democratic-republic-of-congo h1 {font-size:3.5em; margin-bottom:0px}
.sIFR-hasFlash #story.sudan h1 {font-size:3.4em; margin-bottom:-10px}
.sIFR-hasFlash #story.sri-lanka h1 {font-size:3em;}
.sIFR-hasFlash #story.malnutrition h1 {margin-bottom:0px}
.sIFR-hasFlash #story.aids h1 {font-size:3.5em;margin-bottom:0px}
.sIFR-hasFlash #story.afghanistan h1 {margin-bottom:-10px}
/*
.sIFR-hasFlash h2 {	visibility: hidden;letter-spacing: -9px;font-size: 55px;}
.sIFR-hasFlash h3 {	visibility: hidden;	letter-spacing: -6px;font-size: 25px;}
.sIFR-hasFlash h4 {visibility: hidden;	letter-spacing: -5px;font-size: 21px;}
.sIFR-hasFlash h5#pullquote {letter-spacing: -4px;visibility: hidden;font-size: 24px;}
*/

/* Share & Connect */
.sidebar-right {float:right;margin:0 0 10px 25px;width:220px;  color: #fff; line-height: 18px;}
.image-container{	margin:8px 0;text-align:center;}
.twitter_container {overflow:hidden;	width:220px;	color:#4b2b03;	background:#fff;	padding-bottom:10px;	margin-bottom:20px;
	}
.twitter_container p, .twitter_container h3 { margin: 10px; }
.twitter_container li { margin-bottom: 8px;  }
.tweet a { color: #666; } 
a.tweetthis { font-size: 11px; font-weight: bold; text-decoration: none;color:#5b0f0a; }
a.tweetthis:hover  { text-decoration: underline; }
h3.header-twitter_community{margin:0px;display:block;width:220px;	height:48px;text-indent:-9999em;text-align:left;background:url('../images/header-twittercommunity.png') no-repeat left top;	}
.image-container img { margin: 0 5px }
img.twitter-profile { float: left; margin: 0 2px 2px 0; border: 1px solid #CBCBCB; }
.button-twitter_sign_in {display:block;	width:153px;	height:24px;	text-indent:-9999em;	text-align:left;	background:url('../images/button-signinwithtwitter.png') no-repeat left top;	}
.twitter_container .button-twitter_sign_in{	margin-left:60px;	}	

/* WEB BANNERS */
#web-banners label { font-weight: bold; margin-right: 4px;  }
#web-banners img { float: left; margin-right: 10px; }
#web-banners input, #web-banners textarea {font-size: 11px;  }
#web-banners .banner { margin-bottom:25px; clear:left;}

