/* --- World Health Organization ----------------------------------------------------- */
/* --- CSS Framework: TDR Cobrand -------------------------------------- */
/* --- Versions: 1

 ======================================================================================*/

/*<![CDATA[*/
@media all {
	
p {
	font-size:13px;
}

/* -------------------------------------------------------------------------------------
 layout.css
 ======================================================================================*/

/* -------------------------------------------------------------------------------------
 branding
 ---------------------------------------------------------------------------------------*/
#header {
	/*height: 180px;*/
	padding: 10px 0;
	background: #fff url(/sysmedia/media/style/css/cobrand/tdr/tdr_banner_image.jpg) no-repeat right top;
}

#branding {
	height: 80px; /* height of branding area does not include lang. nav */
	padding-bottom:10px;
}
#header #branding a { 
	width: 560px; /* logo width */
	height: 70px; /* logo height */
	margin:10px 0 0px 20px; /* R&L padding = (980 - logo width) / 2 */
	background-image: url(logo_tdr.gif);
}

/* -------------------------------------------------------------------------------------
 navigation
 ---------------------------------------------------------------------------------------*/
#navigation {
	background-color: #91C5EA;
	height:auto;
	padding:0px;
	width: auto; 
 	margin-right: 64px;
  	float: none;
}

.search_results  #navigation {
	width: auto; 
}

#mobile-nav-icon {
  background: #91C5EA;
}

#page .search_results #navigation ul {
	width:100%;
}

#navigation ul li  {
	margin:0px;
	padding:0px;
	background-color: #91C5EA;
	border-right: solid 1px #fff;
}

#navigation ul li.last {
	x-border-right:none;
}

#navigation ul li a, search_results #navigation ul li a {
	padding: 6px 0;
	width: 100%;
	color: #004A8F;
	height: 37px;
	text-transform:uppercase;
	background-image:none;
	vertical-align:middle;
}
#navigation ul li a span, .#page search_results #navigation ul li a span {
	line-height:12px;
	text-align:center;
  padding: 0 4px;
}
#navigation ul li#navigation_home a span {
	background: url(/sysmedia/media/style/css/cobrand/tdr/tdr_navigation_home.gif) 7px -3px no-repeat;
	padding: 0px 15px;
} 
#navigation ul li#navigation_home {
  padding-left: 0;
}

#navigation ul li#navigation_home a:hover span, #navigation ul li#navigation_home.selected a span, #navigation ul li#navigation_home a:active span, #navigation ul li#navigation_home.selected a:hover span {
	background-position: 7px -117px;
} 

#navigation ul li#navigation_about a span {
	padding: 0px 4px;

}

#navigation ul li a:hover, #navigation ul li.selected a, #navigation ul li.selected a:hover {
	background-image:none;
	background-color:#badeff;
	text-decoration:none;
}


#navigation ul li.selected a span, #navigation ul li a:hover span, #navigation ul li.selected a:hover span {
	background-image:none;
	color:#036;
}

/* colors */
#subnavigation ul li a:visited {
	color: #004A8F;
}


/* -------------------------------------------------------------------------------------
 IE8 fixes
 ---------------------------------------------------------------------------------------*/

#header #navigation ul li {
  max-width/*\**/:170px\9;
  height/*\**/:55px\9;
}



#header #navigation ul li#navigation_home, #header #navigation ul li#navigation_home.selected a, #header #navigation ul li#navigation_home a:hover {
	width/*\**/:42px\9;
}

#header #navigation ul li#navigation_home a:hover {
	height:37px\9;
}


#header #navigation ul li a span {
	  padding/*\**/:0px 20px\9;
      padding-top/*\**/:5px\9;
}

#header #navigation ul li#navigation_home a, #header #navigation ul li#navigation_about a, #header #navigation ul li#navigation_research a, #header #navigation ul li#navigation_capacity_knowledge a, #header #navigation ul li#navigation_about a, #header #navigation ul li#navigation_grants a {
	x-padding-top: 18px\9;
	x-padding-bottom:2px\9;
}



/* -------------------------------------------------------------------------------------
 search
 ---------------------------------------------------------------------------------------*/
 #search {
   display: none;
   width: 100%;
   top: 165px;
   z-index: 10;
   position: absolute;
   background-color: #165b9a;
 }
 
.search_results #search {
	top:165px;
}

.search_results #search {
	top:160px\9; /*ie8*/
}
 
#search_submit {
	color:#004A8F;
	width: 10%;
}
#search_submit:hover {
	background-color:#badeff;
	color:#036;
}
#search_label label {

}
#search_input input {
  width: 88%;
}

#search.show {
  display: block;
}
#mobile-search-icon {
  display: block;
  cursor: pointer;
  width: 23px;
  border-left: 1px solid #fff;
  height: 29px;
  float: right;
  padding: 13px 20px;
  background-color: #91C5EA;
  position: relative;
  z-index: 1;
}

#mobile-search-icon {
 padding: 14px 20px\9; /*ie8*/
}

.mobile-search-icon i {
  background: url('../../../img/responsive-sprite.png') 0 -61px no-repeat;
  width: 24px;
  height: 24px;
  display: block;
}
#mobile-search-icon:hover,
#mobile-search-icon.mobile-icon-active,
#mobile-nav-icon:hover,
#mobile-nav-icon.mobile-icon-active {
  background-color: #165b9a;
}
/*fixing 1px margin between nav and search on safari (width rendering issue) */
#mobile-search-icon:before {
  content: '';
  position: absolute;
  top: 0px;
  left: -1px;
  width: 1px;
  height: 55px;
  background-color: #91C5EA;
  z-index: -1;
}

#main.search {
	margin-top: 38px;
}

#main.search {
	margin-top: 33px\9; /*ie8*/
}
/* -------------------------------------------------------------------------------------
 general.css
 ======================================================================================*/

/* text */
body {
	background: #CBCBCB url(/sysmedia/media/style/css/cobrand/tdr/tdr_bkg_gradient.png) 0 0 repeat-x;
	font-size:11px;
}

#wrapper {
	background-image:none;
	background:none;
	padding:0;
}

#page {
	background-image:none;
	background:none;
}

#wrapper #main, #main #content, #main #sidebar {
	background:#fff;
}

.meta p, .meta ul, .meta ol {
	font-size:13px;
}


/* -------------------------------------------------------------------------------------
 Navigation
 ------------------------------------------------------------------------------------- */

#subnavigation {
}
ul.subnavigation {
	border-bottom:none;
}


ul.subnavigation li {
	background-image:none;
	border-bottom: 1px solid #E2EAF1;
	font-weight:bold;
}

ul.subnavigation li a, ul.subnavigation li span {
	padding-left:15px;
}

ul.subnavigation li a:hover {
	text-decoration:underline;
	background-color: #E2EAF1;
	color: #036;
}
ul.subnavigation li a:visited {
	color:#004A8F;
}

/* -------------------------------------------------------------------------------------
 links
 ------------------------------------------------------------------------------------- */

/* link */
a {
color:#004A8F; /* main cobrand color */
}
a:visited {
color:#5C7994;
}
a:hover {
	color:#004A8F;
 text-decoration:underline;
 /* hover state */
}
a[name], a[name]:hover, a.anchor, a.anchor:hover {
color:#004A8F;
 text-decoration:underline;
}

ul.auto_archive li a {
	font-size:14px;
}

.pubmeta ul a, .pubmeta ul a.link_media {
	font-size:13px;
}


/* -------------------------------------------------------------------------------------
 HEADINGS
 ======================================================================================*/
/* headers */
h1, .headline, .headline_multipage {	
	color:#E6671F;
}

h3, h3.box_title, h3.section_head1 {
	font-size: 14px;
}
h3.teaser_headline {
	font-size:14px;
}

h2,#publication_doc h2 {
	line-height: 1.1em;
	padding-top: 5px;
}

/* section & page headings */
.section_head1 {
	color:#E6671F;
}
.section_head2 {
}
.page_heading {
	color:#E6671F;
}

h3.mbox_title{
	font-size:10px;
}
.box_title, .mbox_title, h3.mbox_title {
	color:#E6671F;
	font-size:14px;
}

#publication_doc h2, h2, .kicker, .kicker_multipage {
	font-style: italic;
	color: #666;
	font-size: 14px;
	font-weight: bold;
}

#billboard h2 {
	font-style: normal;
}

.news_entry h3 a {
	font-size:13px;
}
/* -------------------------------------------------------------------------------------
 MARGINAL CONTENT
 ---------------------------------------------------------------------------------------*/

.box, .colormbox, hr, .inlay hr, .inlay_small hr, .inlay_color hr, .inlay_small_color hr {
	background-image: url(/sysmedia/media/style/css/cobrand/tdr/icon_dotted_horizontal.gif);
	background-repeat:repeat-x;
	border: none;
}

.colormbox {
	background-color:#fff;
}

.colormbox .box {
	background-image: none;
}

.template_sidebar-marginal #pageactions {
	background:url(/sysmedia/media/style/css/cobrand/tdr/icon_dotted_horizontal.gif) repeat-x;
}

#pageactions #pageaction_share .custom_button, .addthis_toolbox .hover_menu a {
	font-size:12px;
	color:#004A8F;
}
#pageactions #pageaction_share .addthis_toolbox .custom_hover .custom_button.active {
	color:#004A8F;
	text-decoration:underline;
}

.addthis_toolbox .hover_menu a:hover {    
    color: #004A8F;
    text-decoration: underline;
}

.teaser_kicker {
	font-weight:bold;
}

/* -------------------------------------------------------------------------------------
 tabs
 ------------------------------------------------------------------------------------- */
/* tabs */
.ui-tabs-selected a {

}

.inlay_color, .inlay_small_color {
	background-color:#F1F1F1;
}

/* -------------------------------------------------------------------------------------
 elements.css
 ======================================================================================*/

.buffet_carousel, div.news {
	background-image: url(/sysmedia/media/style/css/cobrand/tdr/icon_dotted_horizontal.gif);
	background-repeat:repeat-x;
}

.infiniteCarousel ul li a.buffet_headline, .buffet_normal ul li a.buffet_headline {
	border: none;
	background-image: url(/sysmedia/media/style/css/cobrand/tdr/icon_dotted_horizontal.gif);
	background-repeat:repeat-x;
}



/* -------------------------------------------------------------------------------------
 LANGUAGE
 ---------------------------------------------------------------------------------------*/


/* visited */
#language ul li a:visited {

}

#language ul li a:hover{

}

/* disabled */
#language ul li.disabled a,
#language ul li.disabled a span,
#language ul li.disabled a:hover,
#language ul li.disabled a:hover span {
	color:#B2B2B2;
	cursor: default;
}

/* visited */
#language ul li.selected a {

}


/* -------------------------------------------------------------------------------------
 #THUMBNAIL GALLERY
 ---------------------------------------------------------------------------------------*/


/* -------------------------------------------------------------------------------------
 LIGHTBOX - WHO
 ---------------------------------------------------------------------------------------*/
a.lightbox_media span {
	/* change icon color and upload */
}



/* -------------------------------------------------------------------------------------
 BREADCRUMB
 ---------------------------------------------------------------------------------------*/

/* breadcrumb */
#breadcrumb {
	background-color:#f5f5f5;
}

#breadcrumb ul li a:hover {
	text-decoration:underline;
	color:#004A8F;
} 


/* -------------------------------------------------------------------------------------
 FOOTER
 ---------------------------------------------------------------------------------------*/

#footer {
	background:none;
	font-weight:bold;
}
#footer ul, #footer .ftr {
	float:right;
}
#footer .ftr {
	display:block;
	clear:both;
	font-size:11px;
	margin-top:5px;
}

#footer ul li {
	float:left;
	padding: 0 8px;
	background: url(/sysmedia/media/style/css/cobrand/tdr/footer_divider.gif) no-repeat right 2px;
}
#footer ul li.last {
	padding-right:0px;
	background:none;
}

#footer ul li a {
		font-size:13px;
		color: #036;
}


/* fonts */

#doormat ul li a {
	color: #036;
}
#doormat ul li a:hover, #foot a:hover {
	color: #036;
}
#doormat ul li span {
	
}

/* footer links */
#foot ul li a:hover, #foot ul li a.selected {
	color: #036;
}
#foot {
	left: 12px;
}

#wrapper #footer {
	background-image:none;
}
	
}
/*]]>*/

/* -------------------------------------------------------------------------------------
 RESPONSIVE
 ---------------------------------------------------------------------------------------*/

 /* top stories */
 #owl-story-carousel .owl-buttons .owl-next {
   background-position: -40px center;
 }
 #owl-story-carousel .owl-buttons .owl-prev {
   background-position: 0 center;
 }
.buffet_carousel .owl-theme .owl-controls .owl-buttons .owl-next {
  background-position: -82px -308px;
}
.buffet_carousel .owl-theme .owl-controls .owl-buttons .owl-prev {
  background-position: -49px -308px;
}
@media only screen and (max-width: 940px) {

#main.search {
	margin-top:0px;
}

.template_sidebar-marginal .search_results #content {
	margin-top:0;
	padding-top:10px;
}


}
@media only screen and (max-width: 890px) {
  p {
	font-size:14px;
}
  
  #header {
    background: #91C5EA;
    padding: 1px 0 0 0;
  }
  
  #content {
	background-color:#fff;
}
  #branding {
    padding-bottom: 0;
  }
  #header #branding a {
    width: 126px;
    background-image: url(tdr-logo-sm.gif);
    height: 43px;
    margin: 0 auto;
    background-size: auto;
  }
  #search, .search_results #search {
    top: 66px;
  }
  #navigation {
   display: none;
   margin-right: 0;
   background: #165b9a;
  }
  #navigation.show {
    display: block;
  }
  #navigation ul li a {
    padding: 0;
  }
  #navigation ul li, #navigation ul li#navigation_home {
    width: 100%;
    height: auto;
    background: #165b9a;
    border-bottom: 2px solid #114677;
  }
  #navigation ul li#navigation_home a,
  #navigation ul li#navigation_publications a, #navigation ul li#navigation_diseases-topics a, #navigation ul li#navigation_partnerships a, #navigation ul li#navigation_news a {
    padding: 0;
  }
  #navigation ul li#navigation_home a {
    height: 37px;
  }
  #navigation ul li#navigation_home a span {
    margin-top: 0;
    display: table-cell;
    padding: 0;
    height: 40px;
  }
  #mobile-nav-icon {
    display: block;
    width: 25px;
    height: 26px;
    padding: 20px;
    margin: 0;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
  }
  #navigation ul li a span {
    height: 40px;
    color: #fff;
    border-right: 2px solid #114677;
  }
  #navigation ul li a span:hover,
  #navigation ul li a:hover, #navigation ul li.selected a, #navigation ul li.selected a:hover {
    background: #114677;
    color: #fff;
  }
  #navigation ul li#navigation_home a span {
    background-image: none;
  }
  #mobile-nav-icon i {
    background: url('../../../img/responsive-sprite.png') -1px 0;
    width: 23px;
    height: 21px;
    display: block;
  }
  #mobile-search-icon {
    display: block;
    position: absolute;
    width: 25px;
    height: 26px;
    padding: 20px;
    border: 0;
    top: 0;
    right: 0;
  }
  .mobile-search-icon i {
    background: url('../../../img/responsive-sprite.png') 0 -61px no-repeat;
    width: 24px;
    height: 24px;
    display: block;
  }
  #branding {
    height: 55px;
    padding-top: 10px;
  }
  #wrapper #footer {
    padding: 20px;
  }
  #footer ul, #footer .ftr {
    display: block;
    margin: 0 auto;
    float: none;
    text-align: center;
  }
  #footer ul {
    width: 331px;
  }
  
  #main.search {
	margin-top: 0px;
}


}

@media only screen and (max-width: 890px) and (min-width: 480px) {
  #navigation ul li,
  #navigation ul li#navigation_home {
    width: 50%;
    float: left;
    border-right: 0;
  }
  #navigation ul li#navigation_home a span {
    font-size: inherit;
    width: 100%;
    text-indent: 0;
  }
  #navigation ul li a {
    width: 100%;
  }
  #navigation ul li#navigation_home {
    padding-left: 0;
  }
}

@media only screen and (max-width: 768px) {
	.template_sidebar-marginal .search #content {
	margin-top: 0px;
	min-height: 355px;
	padding-top: 20px;
}
}

@media only screen and (max-width: 720px) {
  #search_submit {
    width: 65px;
    float: right;
  }
  #search_input input {
    width: 97%;
  }
}
@media only screen and (max-width: 480px) {
  #navigation ul li a span {
    border-right: 0;
  }
}

@media only screen and (max-width: 620px) {
	.template_sidebar-marginal .search #content {
	margin-top: 0px;
	min-height: 355px;
	padding-top: 20px;
}
}
@media only screen and (min-width: 941px) {
	.search_results .mobile-search-icon i {
	background-image:none;
}
}

