:root {
  --pin-color: #9f010a;
}
body {
	padding: 0;
	margin: 0;
}
body.indicator-selector-ui--checkbox,
body.indicator-selector-ui--radio {
	display: flex;
	flex-direction: row;
}
.plethoramap-wrapper {
	width: 100%;
	height: 100vh;
}

.plethoramap--block {
	height: 100%;
}
#map_user_controls > :not(:last-child) {
	margin-bottom: 2px;
}
@media all and (min-width: 768px){
	#map_user_controls > :not(:last-child) {
		margin-bottom: .5em;
	}
}
#map_user_controls fieldset {
	display: flex;
    justify-content: right;
}
#map_user_controls  fieldset#indicators {
    flex-direction: column;
}
body.chart-ui--modal #map_user_controls fieldset {
    justify-content: space-between;
}
body.indicator-selector-ui--checkbox #indicators,
body.indicator-selector-ui--radio #indicators  {
	border: none;
	max-height: 100vh;
	overflow: auto;
}
#lang_selector {
	width: 10rem;
}
.leaflet-popup.has-dragged {
    position: absolute !important;
    transform: none !important;
	height: auto !important;
}
.leaflet-popup.has-dragged.has-dragged .leaflet-popup-content-wrapper,
.leaflet-popup.has-dragged.has-dragged .leaflet-popup-close-button {
    transform: none !important;
}
#indicators_legend_suffix button.btn {
    padding: 0;
    margin-left: 1rem;
	position: relative;
	z-index: 1;
}
#indicators .user-control-wrapper .select2-container {
    min-width: 100%;
}
#indicators  .user-control-wrapper.indicator-select-wrapper,
#indicators  .user-control-wrapper.dimension-select-wrapper {
	width: 100%;
}
#indicators legend {
    font-size: 1rem;
    font-weight: bold;
    text-align: right;
}
#map_user_controls {
    position: absolute;
	border: none;
    top: 0;
    right: 0;
    z-index: 1050;
    background: rgba(255,255,255, .75);
    border-radius: 0;
    margin: 0;
	padding: 2vw;
	max-width: 100%;
}

@media all and (max-width: 768px){
	.leaflet-control-zoom {
		display: none;
	}
}
@media all and (max-width: 550px){
    #map_user_controls {
        width: 100%;
    }
    #map_user_controls .indicator-select-wrapper, 
    #map_user_controls .indicator-select-wrapper .select2-container,
    #map_user_controls .dimension-select-wrapper, 
    #map_user_controls .dimension-select-wrapper .select2-container  {
        width: 100% !important;
        max-width: 100% !important;
    }
}
@media all and (max-width: 768px){
	label[for="indicator_select"],
	label[for="dimension_select"] {
		display: none !important;
	}
}
@media all and (min-width: 768px){
	#map_user_controls {
		padding: 1rem;
	}
}
.draghandle,
button.btn.draghandle {
  cursor: move;
}
.no-drag {
	cursor: initial;
}
button.btn.draghandle {
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    color: #333;
    display: block;
    line-height: 1;
}
#charts {
	position: absolute;
	top: 10px;
	left: 50px;
    z-index: 1050;
	
}
#charts_inner {
	border: 1px solid #ccc;
    background: rgba(255,255,255, .75);
	padding: 1rem;
}
/*
#chart_controls select {
    width: 100%;
} */
#chart_controls > :not(:last-child) {
    margin-bottom: 1rem;
}
#chart_controls .user-control-wrapper.country-control-wrapper select {
    width: 100%;
}
#chart_indicator_info {
	margin-top: 1rem;
}
.dimension-and-indicator-select {
    display: flex;
    gap: 1rem;
	flex-direction: column;
}
@media all and (min-width: 768px){
	.dimension-and-indicator-select {
		flex-direction: row;
	}
}
#filter_map_dates {
	display: none !important;
	border: none;
	padding: 0;
	margin: 0;
	margin-bottom: 1rem;
	
}

#indicators ul,
#indicators li {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
.indicator-marker-color > span {
	width: 1rem;
	height: 1rem;
	display: inline-block;
	margin-left: 1rem;
}  
label.indicator-label {
    display: flex;
}
.indicator-text {
    flex-grow: 1;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

.plethoramap--popup .leaflet-popup-content-wrapper .pagination a {
	text-decoration: none;
}
section.country-tooltip table.tooltip-indicators-table td, 
section.country-tooltip table.tooltip-indicators-table th {
    padding: 2px;
    font-size: .8rem;
}
.country-tooltip * {
	font-size: .9rem;
}
.country-tooltip h2 {
	font-size: 1.1rem;
}
.country-tooltip h3 {
	font-size: 1rem;
}
p.country-tooltip-help {
	max-width: 20rem;
	white-space: normal;
}
.tooltip, 
.popover {
    z-index: 999999;
}
#indicators_all_countries {
    display: flex;
    justify-content: right;
}
#map_user_controls .select2-selection__rendered {
    text-align: right;
}
#map_user_controls {
    max-height: 100vh;
    overflow: auto;
}
table.indicators-all-countries-table caption {
    caption-side: top;
	text-align: right;
	color: #333;
}
table.indicators-all-countries-table th.label {
    text-align: right;
    padding-right: .5em;
	white-space: nowrap;
}
table.indicators-all-countries-table thead th {
	font-size: 1.2rem;
}
table.indicators-all-countries-table .unit {
    font-weight: normal;
    font-size: .8em;
    max-width: 10em;
}
table.indicators-all-countries-table thead th {
	vertical-align: top;
}
thead.indicators-all-countries-table th {
    border-bottom: 1px solid #bbb;
}

table.alternating-column-colors th {
    background: #cccccc;
}
table.alternating-column-colors th:nth-child(even) {
    background: #efefef;
}
.country-tooltip h2 {
    background: var(--pin-color);
    color: white;
    padding: .75em;
    text-align: center;
}
.country-tooltip h3 {
    background: #838383;
    color: white;
    padding: .5em;
    text-align: center;
    margin-bottom: 0;
}
.country-tooltip th {
    font-weight: normal;
}

table.alternating-column-colors td {
    background: #efefef;
}
table.alternating-column-colors td:nth-child(even) {
    background: #FFFFFF;
}
button.country-info-button.btn-link {
	padding: 0;
}
label[for="indicator_select"],
label[for="dimension_select"] {
    display: block;
    text-align: right;
    font-weight: bold;
}
.country-popup--header {
	margin-bottom: 1rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.select2-container {
    min-width: 15rem;
}
.lang-select-wrapper .select2-container {
    min-width: 0;
}

.select2-dropdown {
    z-index: 99999;
}
.modal-backdrop {
	z-index: 1050;
}
.country-popup-content {
	overflow: auto;
	padding: 0 1rem;
}

.country-popup-content table.country-indicator-table--single-indicator {
    min-width: 70rem;
}
	
.country-popup--header label {
	display: block;
}
@media all and (min-width: 768px){
	.country-popup--header label {
		display: inline-block;
	}
	.country-popup--header {
		flex-direction: row;
	}
}
table.country-indicator-table {width: auto;margin: 0 auto;}

.country-indicator-table td, .country-indicator-table th {
    padding: .5rem;
}

.country-indicator-table.all-countries.single-indicator tr > :first-child {
    text-align: right;
}
.btn.remove-filter-button {
    padding: 0 .4em;
    margin: 0;
}
/*
.btn-all-indicators-for-country {
    padding: 0;
    margin-left: .5rem;
} */
.remove-filter-button[disabled] {
    visibility: hidden;
}
#popup_country_select {
	width: 12rem;
}
#popup_indicator_select {
	width: 20rem;
}
.country-popup .user-control-wrapper > * {
    margin-right: .5rem;
}
#chart_div {
    width: 48rem;
	width: 100%;
}
.modal #chart_div {
	width: 100%;
}
.modal {
  overflow-y:auto;
}
.circle.highlight {
    background: black !important;
    color: white !important;
    border-color: black !important;
    font-weight: bold !important;
}

.plethoramap .leaflet-tooltip-right:before {
    border-width: 12px;
    margin-top: -12px;
    margin-left: -24px;
}
.plethoramap .leaflet-tooltip-left:before {
    border-width: 12px;
    margin-top: -12px;
    margin-right: -24px;
}
table button.btn.btn-link {
    text-align: left;
}
dl.indicator-dl {
    display: grid;
    grid-template-columns: min-content 2fr;
}

dl.indicator-dl dt {
    text-align: right;
    padding-right: .5rem;
}

dl.indicator-dl dt:after {content: ":";}
dl.indicator-dl dt, dl.indicator-dl dd {
    margin-bottom: 1rem;
}
th.sorting:not(.sorting_asc):not(.sorting_desc), 
th.sorting_disabled {
    font-weight: normal;
}
.btn.dropdown-toggle {
    color: #444;
    background-color: #fff;
    border-color: #aaa;
}
th.info-box .btn {
    padding: 0;
    margin: 0;
}
table.dataTable.hide-sorting-icons > thead > tr > th[class*="sort"]:before,
table.dataTable.hide-sorting-icons > thead > tr > th[class*="sort"]:after {
    content: "" !important;
}

table.dataTable.hide-sorting-icons>thead>tr>th:not(.sorting_disabled),
table.dataTable.hide-sorting-icons>thead>tr>td:not(.sorting_disabled) {
    padding-right: .5em;
}
table thead th {
    white-space: nowrap;
}
.dataTables_wrapper {
    padding-top: 2px;
}
@media all and (max-width: 1000px) {
	.modal-dialog.modal-xl {
		max-width: Calc(100vw - 2vw);
	}
}
@media all and (min-width: 992px) {
	.modal-dialog.modal-lg, 
	.modal-dialog.modal-xl {
		max-width: 800px;
	}
}
@media all and (min-width: 1300px) {
	.modal-dialog.modal-xl {
		max-width: 1240px;
	}
}
@media all and (min-width: 1400px) {
	.modal-dialog.modal-xl {
		max-width: 1340px;
	}
}
@media all and (min-width: 1500px) {
	.modal-dialog.modal-xl {
		max-width: 1440px;
	}
}
@media all and (min-width: 1600px) {
	.modal-dialog.modal-xl {
		max-width: 1540px;
	}
}
.dt-buttons {
	float: left;
}
.dataTables_filter {
	float: right;
}
table.dataTable  {
	clear: both;
}
#sitelogos {
	position: absolute;
	bottom: 15px;
	left: 0;
	padding: 2px;
	z-index: 500;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 2px;
}
#sitelogos img {
	width: 160px;
	height: auto;
}
#sitelogos .jubileelogo img {
    width: 142px;
    position: relative;
    top: 4px;
    margin-right: 1rem;
}
#disclaimers {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
#disclaimers_text {
    max-width: 18rem;
    line-height: normal;
	text-align: right;
}
@media all and (min-width: 1024px) {
	#sitelogos {
		bottom: 0;
	}
}