// Media query variables.
@mobile:  ~"(max-width: 767px)";
@tablet:  ~"(min-width: 768px) and (max-width: 979px)";
@normal:  ~"(min-width: 980px) and (max-width: 1199px)";
@wide:    ~"(min-width: 1200px)";

// Bootstrap library.
@import 'bootstrap.less';
@import 'responsive.less';

// Base-theme overrides.
@import 'overrides.less';

// Theme specific.
@import 'header.less';
@import 'content.less';
@import 'footer.less';

//Country Pages
@import 'countrydata.less';
@import 'country-profile.less';

// Sidebars
.region-sidebar-first.well,
.region-sidebar-second,
.front .panels-flexible-region {
  background-color: @grayLighter;
  padding: 0;
  .block, .panel-pane {
    background-color: @grayLighter;
    color: @gray;
    border-radius: 4px;
    font-size: 12px;
    margin-bottom: 20px;
    padding: 1px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    h1,h2,h3,h4 {
      color: @gray;
      font-family: @sansAlt;
      font-weight: 400;
      margin-top: 0;
    }
    h2 {
      font-size: 20px;
      text-decoration: underline;
      a {
        color: @gray;
        text-decoration: underline;
        &:hover {
          color: @green;
        }
      }
    }
    .btn {
      background-color: @grayLight - #111;
      color: #fff;
      &:hover {
        background-color: @green;
      }
    }
  }
}



#block-menu-block-1 {
  padding: 1px 0 0;
  a {
    padding: 0 1px;
  }
  li {
    padding: 0 0 2px;
  }
  li a {
    padding: 3px 1px;
    &:hover {
      background-color: @grayLight + #111;
      color: @blueDark;
    }
    &.active {
    background-color: @blueLight;
      color: #fff;
    }
   }
  }
  li.dhtml-folder.collapsed,
  li.dhtml-folder.expanded {
    list-style:none !important;
 }
li#dhtml_menu-823.dhtml-menu-open > a,
li#dhtml_menu-823.dhtml-menu > a{
    font-style:normal;
    &.active-trail {
background-color: @blueLight;
      color: #fff;
 }
 li.dhtml-folder.collapsed a.dhtml-menu-icon {
   background:url("../bootstrap/img/glyphicons-halflings.png") no-repeat -403px -94px;
   float:right;
   left: 0 !important;
   margin-right: 0 !important;
   padding: 0;
   width:20px
 }
 li.dhtml-folder.collapsed.active-trail a.dhtml-menu-icon {
   background:url("../bootstrap/img/glyphicons-halflings-white.png") no-repeat -403px -94px;
   }
 li.dhtml-folder.expanded a.dhtml-menu-icon {
   background:url("../bootstrap/img/glyphicons-halflings.png") no-repeat -428px -94px;
   float:right;
   left: 0 !important;
   margin-right: 0 !important;
   padding: 0;
   width:20px
 }
 li.dhtml-folder.expanded.active-trail a.dhtml-menu-icon {
   background:url("../bootstrap/img/glyphicons-halflings-white.png") no-repeat -428px -94px;
   }
 li.dhtml-folder ul {
   margin-bottom: 0;
   a {
     padding-left: 0px
   }
 }
 li.dhtml-folder.expanded {
background-color: fade(@grayLight, 30%);
 }

}

li.expanded ul.menu.nav a{
margin-left:20px;
font-style:italic;


}

ul.menu.nav{
margin-bottom:5px;
}

// Main Content
.main-container section {
  h1,h2,h3,h4 {
    font-weight: 700;
  }
  h1 {
    font-size: 30px;
  }
  h2 {
    font-size: 20px;
  }
  h3 {
    font-size: 18px;
  }
}

// Indicator Pages

#indcontent{
  width:100%;
	float:left;
}

#indcontent table{
  width: 100% !important;
  max-width: 100% !important;
  margin-bottom: 20px;
}
th{
  background: #fff;
}
table .footnote, table .footnotes{
  font-size:10px !important;
}
table .mid{
  text-align:center !important;
}
.indName{
  display: none;
}
.footnotestable{
  display: none;
}
#footnotesinner{
  padding:20px 0px;
}
#buildcontent{
  clear:both;
}
#buildcontent table{
	width:100% !important;
}
#buildcontent table#years{
	clear:both;
}

#buildcontent table#countries{
	width:100%;
}

table#indcountries{
  width:97%;
}
button .ind{
	position:relative;
	z-index:100;
}
#indcontent table td.Rank{
  width: 5% !important; /*81*/
}
#indcontent table td.Country{
  width: 10% !important; /*95*/
}
.page-indicators table#years td,
.page-indicators-build table#years td,
.page-data table#years td{
	border-top:1px solid #ddd;
  border-bottom:0px;
  font-weight:bold;
	padding-top:3px;
	height:18px;
	padding-left:5px;
	padding-right:35px;
}
.page-indicators tr th,
.page-indicators-build tr th,
.page-data tr th,
.page-composite tr th{
  text-align:left;
  font-weight:normal !important;
  border:1px solid #ddd;
	height:25px;
	padding-left:5px;
	width: 200px;
}
.page-indicators td,
.page-indicators-build td,
.page-data td,
.page-composite td{
  border:1px solid #ddd;
	height:25px;
	padding-left:5px;
}
.page-composite td{
  font-family: @sansAlt;
  font-size: 12px;
}
.page-indicators tr.row-odd,
.page-indicators-build tr.row-odd,
.page-data tr.row-odd,
.page-composite tr.row-odd{
	background: #eee;
}
/* IE10+ styles */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .page-indicators tr th,
  .page-indicators-build tr th,
  .page-data tr th,
  .page-composite tr th{
    text-align:left;
    font-weight:normal !important;
    border:1px solid #ddd;
  	height:25px;
  	padding-left:5px;
  	width: 200px;
  }
  #indcontent table td.Rank{
    width: 66px !important;
  }
}
/* IE 9 */

/* Firefox styles */
@-moz-document url-prefix() {
  #indcontent table td.Rank{
    width: 84px !important;
  }
  #indcontent table td.Country{
    width: 95px !important;
  }
}
/* Microsoft Edge styles */
@supports (-ms-accelerator:true) {
  .page-indicators tr th,
  .page-indicators-build tr th,
  .page-data tr th,
  .page-composite tr th{
    text-align:left;
    font-weight:normal !important;
    border:1px solid #ddd;
  	height:25px;
  	padding-left:5px;
  	width: 200px;
    padding-right:33.65px;
  }
  #indcontent table td.Rank{
    width: 66px !important;
  }
}

.source{ //header source on indicator page-indicators
  font-size:12px;
}
#sparks{
	float:left;
	margin-top:23px;
	border-top:1px solid #ddd;
}
.nograph{
	display:none;
}
.sparkline{
	width:200px;
	height:27px;
	float:left;
	clear:both;
	border-bottom: 1px solid #ddd;
	border-right:1px solid #ddd;
}
.row-odd{
	background: #eee;
}
.axis text {
	font-family: @sansAlt;
	font-size: 13px;
	fill:#333;
}
.yaxisvalue{
  z-index: 1000000;
}
#barchart .x.axis .tick{
  display:none;
}
#buildgraph{
	width:1200px;
	height:440px;
}
#rank{
	margin-top:23px;
	float:left;
	width:3%;
}
#rank tr{
	text-align:right;
	font-weight: normal !important;
  border-top: 1px solid #ddd;
  border-left: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
	height:28px;
}
.footnote{
  color:steelblue;
  font-size:10px;
}
.page-indicators #header{
	font-size: 16px;
  clear: both;
  font-weight: normal;
  line-height: 21px;
}
.page-indicators #footnotes{
	clear:both;
	padding:30px 10px;
}
.page-indicators #footer{
	clear:both;
	padding:30px 10px;
}
.line {
  fill: none;
  stroke: #DBDBDB;
  stroke-width: 1.3;
  opacity: .7;
}
.unfocused {
    stroke-opacity: .3;
}
.line-hover {
  stroke: #000 !important;
	stroke-width:2.5px !important;
	opacity:1;
}
.line-hover-forever {
  stroke: #000 !important;
	stroke-width:2.5px !important;
	opacity:1;
}
.voronoi path {
  fill: none;
  pointer-events: all;
}
.focus text {
  text-anchor: left;
  text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
	font-size:14px;
}
div.tooltip  {
	color: #222;
	background: #fff;
	padding: .5em;
	text-shadow: #f5f5f5 0 1px 0;
	border-radius: 2px;
	box-shadow: 0px 0px 2px 0px #a6a6a6;
	opacity: 0.9;
	position: absolute;
}
div.tooltip .sep {
	color: #444;
	font-weight: 300;
}
path.country {
	fill: #e7eaef;
	stroke: none;
}
text.legend  {
	fill: #242930;
}
input#slider{
	width:600px;
	margin-left:20px;
}
#drop{
  width:100%;
  clear:both;
  height:60px;
}
#drop-line{
  width:100%;
  clear:both;
}
#tertiaryDrop p{
  margin:0;
}
h2.chart-title{
  margin-left: 200px;
  clear:right;
}
#indSelectors{
  position:relative;
  z-index:1000;
  float:left;
  #dimensions{
    margin-right: 7px;
  }
}
#barchart #indSelectors{
  position:relative;
  z-index:1000;
  float:left;
  margin-right:10px;
  label{
    display: block !important;
  }
  #dropStyle{
    margin-top:5px;
    margin-right: 7px;
  }
}
select.inds{
  z-index: 1000;
}
#secondaryDrop, #tertiaryDrop{
  float:left;
  margin-right:10px;
}
#bartip {
	position: absolute;
	width: auto;
	height: auto;
	padding: 4px 6px;
	fill: #fff;
	border:1px solid #eee;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	pointer-events: none;
  background: #fff;
  z-index: 1000000;
}
#bartip.hidden {
	display: none;
}
/* CHOROPLETH */
#choropleth{
	clear:both;
  padding: 20px 0px;
}
#chor{
  border-bottom: 1px solid #999;
  border-top: 1px solid #999;
	height:300px;
  overflow:hidden;
}
#choropleth ul#slideyears{
	margin:0px 0px 0px 20px;
	padding:0px;
}
#choropleth ul#slideyears li{
	list-style-type:none;
	list-style-image:none;
	display:inline;
	padding-right: 66px;
}
#choropleth ul#slideyears li.last{
	padding-right: 0px;
}
.chorlow{
	fill: #85d9ff;
}
.chormed{
	fill: #2da0e9;
}
.chormedhigh{
	fill: #2b4fec;
}
.chorhigh{
	fill: #02197d;
}
.page-indicators-build #leftcol{
 	width:30%;
	float:left;
	margin-right:3%;
}
.page-indicators-build #maincol{
	width:67%;
	float:left;
}
.page-indicators-build select[multiple]{
    height: 300px;
    width: 100%;
}
.axis path,
.axis line {
	fill: none;
	stroke: #cccccc;
	stroke-width: 2px;
}

.bar {
  fill: #0078a5;
}

.bar:hover {
  fill: #18b7f2;
}
.axis {
  font: 10px sans-serif;
}

.axis path,
.axis line {
  fill: none;
  stroke: #999;
  shape-rendering: crispEdges;
}
#legendContainer{
  display: block !important;
	position:absolute;
  margin-top:20px;
	overflow-y: auto;
  overflow-x: hidden;
	height:400px;
	width:220px;
	font-family:@sansAlt;
	font-size:11px;
	z-index: 100;
}
#buildcontent.hide{
  display: none !important;
}
#buildcontent.show{
  display:block !important;
}
.table-title.hide{
  display: none !important;
}
.table-title.show{
  display:block !important;
}
#legendContainer.hide{
  display: none !important;
}
#legendContainerBar{
  display: none !important;
}
#legendContainerBar.show{
  display: block !important;
  position:absolute;
  margin-top:20px;
	overflow: auto;
	height:375px;
	width:220px;
	font-family:@sansAlt;
	font-size:11px;
	z-index: 100;
}
#legend{
	width:210px;
}
#legendbar{
	width:210px;
}
.legend {
  font-size: 12px;
  font-weight: normal;
  text-anchor: left;
}
.legendcheckbox{
	cursor: pointer;
}
#chart{
  display: block !important;
}
#chart.hide{
  display: none !important;
}
#barchart{
  display: none !important;
}
#barchart.show{
  display: block !important;
}
#chart, #barchart{
    width: 100%;
}
#footnotes.show{
  display: block !important;
}
#footnotes.hide{
  display:none;
}
svg.linechart{
  margin-top:-25px;
}
#chartopts input, button#gotoind{
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  background: #b4b8c2;
  color: #fff;
  font-size: 11.9px;
  padding: 0.4em 0.9em;
  border:0px;
  float:left;
}
button#gotoind a{ color: #fff;}
#chartopts{
	clear:both;
	width:100%;
	height:40px;
}
#line, #bar{
	color:#fff;
	padding: 0.4em 0.9em;
	margin-right:6px;
	border-radius:2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
	float:left;
  font-size: 13px;
}
.lineclick, .barclick{
  background: #b4b8c2;
}
.current{
  background:#003399 !important;
}
.notcurrent{
  background:#b4b8c2 !important;
}
.notavailable{
  background:#eee !important;
  color: #aaa !important;
}
input#line.notavailable{
  cursor: not-allowed;
}
input#line.notavailable:focus{
    outline: none;
}
input#bar.notavailable{
  cursor: not-allowed;
}
input#bar.notavailable:focus{
    outline: none;
}
#line a, #bar a{
  color: #fff;
}
#bar{
  margin-top:-17px;
}
#tertiaryDrop{
  visibility: hidden;
}
#tertiaryDrop.show{
  visibility: visible;
}
.active{
	background:#fff !important;
	color:#000 !important;
}
#clearshow{
  float:right;
  clear:right;
  margin-top: 75px;
  margin-bottom: -100px;
}
#showAll{
	float: right;
	margin-left:10px;
}
#clearAll{
	float: right;
}
.page-data .country-profile-action-links{
  float:right;
}
#dlform{
	float: right;
  width: 135px;
  clear: both;
  margin: 13px 0px !important;
  padding: 0px !important;
	form{
		width: 100%;
    text-align: right;
    padding: 0px !important;
    margin: 0px !important;
	}
}
.leaflet-container{
	background: #b9cede !important;
}
/*
::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 0px;
}
::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background-color: #fff;
    -webkit-box-shadow: 0;
}
*/
body{
  scrollbar-base-color: #999;
  scrollbar-3dlight-color: #fff;
  scrollbar-highlight-color: #fff;
  scrollbar-track-color: #fff;
  scrollbar-arrow-color: #fff;
  scrollbar-shadow-color: #fff;
  scrollbar-dark-shadow-color: #fff;
  -ms-overflow-style: -ms-autohiding-scrollbar;

.pane-content p{
font-size: @baseFontSize+1.5;
font-weight:400;
line-height:1.70em;
};

.node-blog-article{
font-size: @baseFontSize+1.5;
font-weight:400;
line-height:1.70em;

li{
line-height:1.70em;
};

};



};

#downloaddata{
  background: #b4b8c2;
  padding: 0.5em 0.8em;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  z-index: 1000;
  width: 111px;
  margin-bottom: 20px;
  font-size: 11.9px;
}
#downloaddata a{
	text-decoration:none;
  font-weight:bold;
	color:#fff;
}
/* radar chart */
.radar-container{
	position: relative;
	width: 40%;
	float: right;
	top: -40px;

}
.radarhead{
	position:relative;
	width:50%;
	float:left;
	margin-top: -15px;
}
.radar-chart .area {
  fill-opacity: 0.7;
}
.radar-chart.focus .area {
  fill-opacity: 0.3;
}
.radar-chart.focus text {
	font-size:13px;
  text-shadow: 0px;
}
.radar-chart.focus .area.focused {
  fill-opacity: 0.9;
}
.area.average, .average .circle {
  fill: #00a0d5 !important;
  stroke: none;
}
.area.currentCountry, .currentCountry .circle {
  fill: #ADD8E6 !important;
  stroke: none;
}
svg#colors{
	float:right;
}
ul#radarleg{
	margin:0px;
	padding:0px;
	float:right;
  li{
		list-style-type: none;
    list-style-image: none;
    padding-right: 7px;
    text-align: right;
    line-height: 142%;
	}
}