select {
    width: 100%;
}

h3 {
    margin-top: 30px;
}

.indicators-row > div {
    padding: 8px;
}

.indicator-container {
    color: #091d23;
    background-color: #f6f6f6;
    border-radius: 8px;
    padding: 10px 15px;
    min-height: 200px;
}

.indicator-container .row {
    margin: 0;
}

.indicator-container .content-col {
    padding: 0;
}
.wrapper-label{
    margin-left: -5px;
    margin-top: -5px;
}
.indicator-icon { 
    width: 60px;
}

.indicator-value-container {
    overflow: hidden;
    margin-top:10px; 

}

.indicator-value, .indicator-year, .indicator-ranking {
    font-family: 'Soho W01 Medium', sans-serif;
}

.indicator-value {
    display:inline-block;
    font-size: 22px;
}

.indicator-arrow-container {
    display:inline-block;
    height: 24px;
    
}

.indicator-arrow {
    height: 100%;
    vertical-align: text-bottom;
    padding-left:5px;
    padding-bottom:4px;
}

.arrow-groen {
    filter: invert(45%) sepia(86%) saturate(363%) hue-rotate(44deg) brightness(97%) contrast(95%);
}

.arrow-rood {
    filter: invert(45%) sepia(84%) saturate(6984%) hue-rotate(349deg) brightness(96%) contrast(87%);
}

.arrow-grijs {
    filter: invert(58%) sepia(3%) saturate(19%) hue-rotate(327deg) brightness(92%) contrast(87%);
}

.indicator-ranking-container {
    margin: 0;
}
.indicator-ranking-container > .cbs-chart {
    margin-bottom: 10px;
}

.indicator-ranking {
    text-align: right;
    float:right;
}
.ranking-number {
    font-size: 24px;
    font-weight: 200;
}
.ranking-extra {
    font-size: 12px;
    margin-top: -4px;
    height: 36px;
}
.ranking-rood {
    color: #e6382c;
}

.ranking-groen {
    color: #79b729;
}

.ranking-grijs {
    color: #878787;
}



/* definition */
input[type='checkbox'] {
    display: none;
}

.indicator-definitie-label {
    display: inline-block;
    cursor: pointer;
    max-width: 320px;
}

.indicator-definitie-label:hover {
    text-decoration: underline;
}
 
/* .indicator-definitie-label::after {
    content: ' <i class="fa fa-chevron-down label-chevron" aria-hidden="true"></i>';
    display: inline-block;
   border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid currentColor;
  
    vertical-align: middle;
    margin-left: .5rem; 
  
     transition: transform .2s ease-out; 
}  */

.indicator-definitie-text {
  max-height: 0;
  overflow: hidden;
  transition: max-height .25s ease-in-out;  
}

.indicator-definitie-toggle:checked + .indicator-definitie-label + .indicator-definitie-text {
    max-height: 100vh;
}

.indicator-definitie-toggle:checked + .indicator-definitie-label .label-chevron {
    transform: rotate(180deg);
}

.indicator-definitie-text > p {
    margin: 0;
}

/* chart */
.highcharts-background {
    fill: none;
}

.highcharts-point {
    fill: #c9c9c9;
    stroke-width: 0;
}

.column-rood rect {
    fill: #e6382c;
}

.column-groen rect {
    fill: #79b729;
}

.column-grijs rect {
    fill: #878787;
}

.highcharts-area-series {
    fill: #c9c9c9;
    stroke: #e5e5e5;
    stroke-width: 2;
}