#map-complet .leaflet-popup{
	font-family: 'Montserrat', sans-serif;	
}
#map-complet .leaflet-popup *{
	color:#222;
}
#map-complet .leaflet-popup address{
    color: #102e6f;
    font-weight: 500;
}
#map-complet .leaflet-popup-content p {
    margin: 12px 0;
    text-align: center;
}
#map-complet .leaflet-popup .message_site_infobulle{
	text-align: center;
    font-style: italic;
    border: 1px solid #a8c4d6;
    background-color: #7cadd4;
    color: #fff;
    border-radius: 7px 7px 7px 0px;
    padding: 5px;
	margin:10px 0;
}
.point-popup {
	display: flex;
	flex-direction: column;
	align-items:center;
}

.point-popup .measurements {
	display: flex;
	height: 5rem;
}
.point-popup .measurement {
	display: flex;
	flex-direction: column;
	align-items:center;
	justify-content: space-between;
	padding: 4px 7px;
}
.point-popup .measurement.belaqi * {
	color:#000;
}

.point-popup .measurement.selected{
	/*background-color: rgba(0,0,160,.2);*/
	border-radius: 5px;
    background-color: rgb(226, 226, 226);
}
.point-popup h4{
	text-decoration: underline;
	margin-bottom: 0.7rem;
    font-size: 1rem;
}
.point-popup address{
	margin:0;
	display:inline-block;
}
.point-popup address:first-letter{
	text-transform:uppercase;
}
.point-popup h5{
	font-weight: bold;
	font-size: .8rem;
	margin: 0;
}
.point-popup .value {
	font-size: 1.3em;
    background-color: transparent;
    font-weight: 500;
}

.point-popup .measurement.belaqi .value{
	font-size:1.5em;
}

.point-popup .unit{
	font-weight: bold;
	font-size: .6rem;
}

.point {
	height:15px !important;
	width:15px !important;
	border-radius: 100%;
	border: 1px solid #ffffffdd;
    box-shadow: 1px 1px 3px 1px #67676791;
	background-color: #adadad;
}

.spacer-belaqi{
	width: 100%;
    height: 4px;
}
.point-color{
    width: 100%;
    height: 4px;
	border-radius: 6px 0px;
}
.belaqi .point-color{
	height: 7px;
    margin: 3px 0px;
	box-shadow: 1px 1px 3px 1px #67676791;	
}
.lvl-1 .point-color,    .point.lvl-1.leaflet-marker-icon    {background-color: #0000FF;color: #0000FF;}
.lvl-2 .point-color,    .point.lvl-2.leaflet-marker-icon    {background-color: #0099FF;color: #0099FF;}
.lvl-3 .point-color,    .point.lvl-3.leaflet-marker-icon    {background-color: #009900;color: #009900;}
.lvl-4 .point-color,    .point.lvl-4.leaflet-marker-icon    {background-color: #00FF00;color: #00FF00;}
.lvl-5 .point-color,    .point.lvl-5.leaflet-marker-icon    {background-color: #FFFF00;color: #FFFF00;}
.lvl-6 .point-color,    .point.lvl-6.leaflet-marker-icon    {background-color: #FFBB00;color: #FFBB00;}
.lvl-7 .point-color,    .point.lvl-7.leaflet-marker-icon    {background-color: #FF6600;color: #FF6600;}
.lvl-8 .point-color,    .point.lvl-8.leaflet-marker-icon    {background-color: #FF0000;color: #FF0000;}
.lvl-9 .point-color,    .point.lvl-9.leaflet-marker-icon    {background-color: #CC0000;color: #CC0000;}
.lvl-10 .point-color,   .point.lvl-10.leaflet-marker-icon   {background-color: #990099;color: #990099;}
.default .point-color,  .point.default.leaflet-marker-icon  {background-color: #1A3989;color: #1A3989;}

.triangle.lvl-1 svg path    {fill: #0000FF;}
.triangle.lvl-2 svg path    {fill: #0099FF;}
.triangle.lvl-3 svg path    {fill: #009900;}
.triangle.lvl-4 svg path    {fill: #00FF00;}
.triangle.lvl-5 svg path    {fill: #FFFF00;}
.triangle.lvl-6 svg path    {fill: #FFBB00;}
.triangle.lvl-7 svg path    {fill: #FF6600;}
.triangle.lvl-8 svg path    {fill: #FF0000;}
.triangle.lvl-9 svg path    {fill: #CC0000;}
.triangle.lvl-10 svg path   {fill: #990099;}
.triangle.default svg path  {fill: #1A3989;}

.triangle svg.icon {
    width: 26px;
    height: 26px;
}

.triangle.lvl-1 svg.icon {--icon-color: #0000FF;}
.triangle.lvl-2 svg.icon {--icon-color: #0099FF;}
.triangle.lvl-3 svg.icon {--icon-color: #009900;}
.triangle.lvl-4 svg.icon {--icon-color: #00FF00;}
.triangle.lvl-5 svg.icon {--icon-color: #FFFF00;}
.triangle.lvl-6 svg.icon {--icon-color: #FFBB00;}
.triangle.lvl-7 svg.icon {--icon-color: #FF6600;}
.triangle.lvl-8 svg.icon {--icon-color: #FF0000;}
.triangle.lvl-9 svg.icon {--icon-color: #CC0000;}
.triangle.lvl-10 svg.icon {--icon-color: #990099;}
.triangle.default svg.icon {--icon-color: #1A3989;}


.leaflet-verticalcenter {
    position: absolute;
    top: 50%; /* possible because the placeholder's parent is the map */
    transform: translateY(-50%); /* using the CSS3 Transform technique */
    padding-top: 10px;
    z-index: 1000;
}

.leaflet-verticalcenter .leaflet-control {
    margin-bottom: 10px;
}

#infobulle_more_info{
	padding-top:10px;
}
#infobulle_more_info a:after{
	content:' ';
	background-color:#000;
	width:100%;
	height:1px;
}

/*********************************************
 ************ OVERLAYS ***********************
 ********************************************/
div.overlays{
    position: absolute;
    top: 0;
    left:0;
    height: 100%;
    width: 100%;
    display: flex;
    overflow: hidden;
    pointer-events: none; /* allow events to go down to leaflet map*/
}

div.dynamic-overlays{
    display: inline-block;
    position: relative;
    flex-grow: 1; /* fill all remaining width space */
    height: 100%;
    
    pointer-events: none; /* allow events to go down to leaflet map*/
}

div.modal-overlay{
    display: inline-block;
    z-index: 1024;
     
    width: 40%;
    height: 100%;
    position: relative;
    
    background: white;
    border-radius: 0px 15px 15px 0px;
    
    pointer-events: auto; /* catch events */
    transition: width 0.5s;
    
    overflow: auto;
}

/****************************************
***** Button modal **********************
****************************************/
.map-modal-toggle-button-container {
    position: absolute;
    z-index: 900;
    top: 60px;
    left: 0;
	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
	font-size:0px;
}

.map-modal-toggle-button {
    border: 0;
    border-radius: 0;
    font: inherit;
    list-style: none;
    margin: 0;
    outline: 0;
    overflow: visible;
    padding: 0;
    vertical-align: baseline;
	width: 23px;
    height: 48px;
    cursor: pointer;
	background: rgba(255,255,255,0.9) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAUCAQAAAAXDMSnAAAAi0lEQVR4AX3JQcqBURQG4O/+9WNG30D3vOfSDTuQsgcZyBakZANSzMVMBme3zsBI5/VMn4ZKLP5ki1E4tYejWpilxVUtzOEUD68odYmXR5BJNp/4zllXD2phllYvamHmirsayUkfJ5ruHzueTldC08kcT5YOY9xYujqQM03XKXuaLmEtNF1e1Nz89gbL+0do6OEwRwAAAABJRU5ErkJggg==) 7px center/7px 10px no-repeat;
    border-left: 1px solid #D4D4D4;
	pointer-events: auto;
}

/*****************************************
 ******* SEARCH INPUT ********************
 ****************************************/
div.search-location-container{
    display: inline-block;
    width: 200px;
    position: absolute;
    z-index: 1002;
    pointer-events: auto; /* catch events */
	/*left: 160px;
    bottom: 5px;*/
	left: 15px;
    top: 15px;
}
@media screen and (max-width: 800px) {
    div.search-location-container{
        left: 60px;
    }
}

div.location-input-container
{
    position: relative;
    width: 170px;
    height: 30px;
}

input.search_location{
    margin: 0;
    padding-left: 4px;
    width: 100%;
    height: 100%;
    border: 0;
    box-sizing: border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
	font-size:14px;
	box-shadow: 1px 1px 3px 0px #808080;
}

img.search_location_icon{
    position: absolute;
    bottom: 6px;
    right: 5px;
}

div.location_suggestions{
    position: absolute;    
    width: 200px;
    max-height: 300px;
    background: white;
    overflow-y: auto;
    z-index: 1025;
}

div.location-suggestion-item
{
    /*border: 1px solid black;*/
    padding: 2px;
}

div.location-suggestion-item:hover{
    background-color: #a1daf8;
}

/****************************************************
******************* CONTROL LAYER *******************
*****************************************************/
.control-layers-container{
	position: absolute;
	left:200px;
	top: 12px;
	font-size:13px;
}

/***************************************************
 ****************** LOADING LOGO *******************
 **************************************************/
div.loading-logo-container{
    position: absolute;
    width: 100%;
    height: 100%;
    
    z-index: 1003;
    background-color: rgba(220,220,220, 0.33);
}

img.loading-logo{
    margin: auto;
    
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

/***************************************************
 *************** LEGEND ****************************
 **************************************************/
#legend-container{
    z-index: 995;
    position: absolute;
    left: 0px;
    bottom: 0%;
    max-width: 130px;
	transition: left 0.5s;
	pointer-events: auto;
}
#legend-container.legend-hidden{
	left:-200px;
}
div.legend-layer{
	display:none;
    margin: 5px;
	padding: 5px;
    background: rgba(255, 255, 255, 0.69);
    box-shadow: 2px 0px 4px 0px #5555554d;
}
div.legend-layer > div{padding: 5px 2px;background-image:url('../img/legend-bg.jpg');background-position-x: 9px; background-repeat: repeat-y;}

div.legend-layer .legend-title{font-weight: 600; padding-left: 20%;}
div.legend-layer .legend-title span{padding-left:10px; font-style:italic;font-size:.9rem;}
div.legend-layer .legend-row{display:flex;padding-top: 5px;}
div.legend-layer .lvl {width:20%;align-self: center;}
div.legend-layer .lvl > div{
	color: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    font-size: 0.7rem;
    line-height: 1rem;
    text-align: center;
	}
div.legend-layer .value{width:80%;font-size: 0.8em;    align-self: center;    font-weight: 500;}

div.legend-layer .lvl.lvl-0  > div {background-color: #ADADAD;}
div.legend-layer .lvl.lvl-1  > div {background-color: #0000FF;}
div.legend-layer .lvl.lvl-2  > div {background-color: #0099FF;}
div.legend-layer .lvl.lvl-3  > div {background-color: #009900;}
div.legend-layer .lvl.lvl-4  > div {background-color: #00FF00;color: #000;}
div.legend-layer .lvl.lvl-5  > div {background-color: #FFFF00;color: #000;}
div.legend-layer .lvl.lvl-6  > div {background-color: #FFBB00;}
div.legend-layer .lvl.lvl-7  > div {background-color: #FF6600;}
div.legend-layer .lvl.lvl-8  > div {background-color: #FF0000;}
div.legend-layer .lvl.lvl-9  > div {background-color: #CC0000;}
div.legend-layer .lvl.lvl-10 > div {background-color: #990099;}

div.legend-layer.color_2 .lvl.lvl-1  > div {background-color: #000045;}
div.legend-layer.color_2 .lvl.lvl-2  > div {background-color: #000083;}
div.legend-layer.color_2 .lvl.lvl-3  > div {background-color: #0000c1;}
div.legend-layer.color_2 .lvl.lvl-4  > div {background-color: #1000ff;color: #fff;}
div.legend-layer.color_2 .lvl.lvl-5  > div {background-color: #3f3fff;color: #fff;}
div.legend-layer.color_2 .lvl.lvl-6  > div {background-color: #7e7eff;}
div.legend-layer.color_2 .lvl.lvl-7  > div {background-color: #bdbdff;}
div.legend-layer.color_2 .lvl.lvl-8  > div {background-color: #fcfcff;color: #000;}

div.legend-layer.color_3 .lvl.lvl-1  > div {background-color: #000045;}
div.legend-layer.color_3 .lvl.lvl-2  > div {background-color: #0000a2;}
div.legend-layer.color_3 .lvl.lvl-3  > div {background-color: #1000ff;}
div.legend-layer.color_3 .lvl.lvl-4  > div {background-color: #5454ff;color: #fff;}
div.legend-layer.color_3 .lvl.lvl-5  > div {background-color: #a8a8ff;color: #fff;}
div.legend-layer.color_3 .lvl.lvl-6  > div {background-color: #fcfcff;color: #000;}

.nbr_dizaine{ width: 16px; display: inline-block; text-align: right;}
.nbr_decimale{width: 16px; display: inline-block;}

div.legend2{
    display: inline-block;
    margin: 30px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.69);	
}

.legend-image{
    height: 100%;
}

#legend-container-prevision {
    left: 0%;
    width: 100px;
    top: 100px;
    border-radius: 0px 8px 8px 0px;
    box-shadow: 1px 1px 3px 0px #55555582;
    margin: 0;
    font-size: 0.8em;
    z-index: 995;
    position: absolute;
    /*margin-left: -125px;*/
    transition: top 0.5s;
    background: #fff;
    text-align: center;
    padding: 5px;
}
@media only screen and (min-width: 768px) {
    #legend-container-prevision{
        left: 50%;
        width: 250px;
        top: 15px;
        border-radius: 4px;
    }
    #legend-container {
        max-width: 160px;
    }
}

#legend-container-prevision.legend-hidden{	
	top:-100px;
}
div.legend-layer-prevision{
	display:none;
	pointer-events: auto;
}

/**********************************************************
 **************** MAP *************************************
 *********************************************************/
div.marker-popup-image{
    z-index: 1030;
    width: 540px;
    height: 395px;
}

div.marker-popup
{
    z-index: 1030;
    width: 550px ;
    max-height: 200px ;
}

div.marker-popup-content-image{
    width: 515px;
    height: 384px;
    margin: auto;
}

div.marker-popup-content{
    width: 530px ;
    height: 100% ;
}

h1.marker-popup-title{
    color: #009fe3 ;
    font-size: 14px ;
    text-align: center ;
}

table.popup-obs-table{
    width: 100% ;
}

p.obs-timestamp{
    margin-left: 20px !important ;
    font-style: italic ;
}

td.obs-icon{
    text-align: center ;
}

img.obs-icon
{
    max-width: 40px ;
    max-height: 40px ;
    margin: auto ;
}

td.obs-nb{
    text-align: center;
}

.ui-slider-horizontal.ui-slider-pips {
  margin-bottom: -0.6em !important;
}

#ui-datepicker-div
{
    z-index: 1200 !important;
}

input.picker-date{
    width: 10ch ;
}

input.picker-hour{
    width: 6.5ch;
}

/**************************************************
 ************ BELAQI - Pollen (Encart) ************
 **************************************************/
 
.belaqi-pollen-container{
	/*width:301px;*/
	display:flex; position: absolute; z-index:999; pointer-events: auto; right: 50px; bottom: 24px; overflow:hidden;
	background-image: url('../img/couleur-pollen.png');
	background-repeat: no-repeat;
	background-position-y: bottom;
	background-size: contain;
	}
	
/*BELAQI*/
.belaqi-pollen-container .bel-aqi{width:161px;position:relative; right:0; display: flex; flex-wrap: wrap; background: white; border-radius: 5px 5px 0 0px; padding: 2px 7px 0; transition: right 0.5s;     margin: 0px 0px 3px 0px;}
.bel-aqi .title{flex: 0 0 100%;    max-width: 100%; text-align:center;    font-size: 13px;    font-weight: 600;}
.bel-aqi .title a{color:#333; text-decoration:none;}
.bel-aqi .title span{    text-align: center;    font-size: 11px;    font-weight: 400;    margin-top: -4px;    display: block;}
.bel-aqi .indice{    padding: 0px 25px;   margin: 9px auto; color:white; box-shadow: 0px 0px 7px 1px #dadada;}
.bel-aqi .station{font-size: 10px;    height: 29px;    text-align: center; margin: auto;    min-width: 95px; }
.bel-aqi .station-name{}

.indice.lvl--9999  {background-color: #FFF;color: #333;}
.indice.lvl-0  {background-color: #0000FF;}
.indice.lvl-1  {background-color: #0000FF;}
.indice.lvl-2  {background-color: #0099FF;}
.indice.lvl-3  {background-color: #009900;}
.indice.lvl-4  {background-color: #00FF00;color: #000;}
.indice.lvl-5  {background-color: #FFFF00;color: #000;}
.indice.lvl-6  {background-color: #FFBB00;}
.indice.lvl-7  {background-color: #FF6600;}
.indice.lvl-8  {background-color: #FF0000;}
.indice.lvl-9  {background-color: #CC0000;}
.indice.lvl-10 {background-color: #990099;}


/*POLLEN*/
.belaqi-pollen-container .pollen{ width:140px;position:relative; right:0; display: flex; flex-wrap: wrap; background: white; border-radius: 0px 5px 0 0px; padding: 2px 7px 0; /*box-shadow: -2px -1px 7px 0px #b5b5b5;*/ transition: right 0.5s;     margin: 0px 0px 5px 0px;border-left: 1px solid #dedede; display:none;}
.pollen .title{flex: 0 0 100%;    max-width: 100%; text-align:center;    font-size: 13px;    font-weight: 600;}
.pollen .logo-container{margin:auto;display:flex;}
.pollen .logo{width: 34px; }
.pollen .info{}
.pollen .ville{flex: 0 0 100%; max-width: 100%; text-align:center; font-size: 11px;    font-weight: 600;}
.pollen .info .level{font-size: 35px;    font-weight: 600;    display: inline-block;    margin: 0 4px;    line-height: 34px;}
.pollen .info .text{font-size: 16px;    font-weight: bold;    display: inline-block;    vertical-align: top;    line-height: 20px;}

.pollen svg.svg-pollen{	opacity:1;width:34px;height:34px;}
.pollen.level-00 svg.svg-pollen{	fill:#adadad;}
.pollen.level-0 svg.svg-pollen{	fill:#3bc0ec;}
.pollen.level-1 svg.svg-pollen{	fill:#0ba800;}
.pollen.level-2 svg.svg-pollen{	fill:#f7931e;}
.pollen.level-3 svg.svg-pollen{	fill:#d93c49;}

.pollen.level-00 .text, .pollen.level-00 .level{color:#adadad;}
.pollen.level-0 .text, .pollen.level-0 .level{color:#3bc0ec;}
.pollen.level-1 .text, .pollen.level-1 .level{color:#0ba800;}
.pollen.level-2 .text, .pollen.level-2 .level{color:#f7931e;}
.pollen.level-3 .text, .pollen.level-3 .level{color:#d93c49;}

.pollen.level-00 .text{font-size:14px;}

/*MARKER - VERSION express*/

.citymarker{
	width: 102px!important;
    height: 30px!important;
	margin-left:-41px!important;
}
.citymarker div.point{
	background-color:#fff;
	border-color:#000;
	margin: auto;
}
.citymarker div.city{
	color: #232323;
    font-size: 12px;
    text-align: center;
    text-shadow: 0px 1px 0px #efe9e1;
    font-weight: 500;
}
.citymarker div.bigpoint{
	white-space: nowrap;
    /* text-shadow: 0 0 0.1em black, 0 0 0.1em black, 0 0 0.1em black, 0 0 0.1em black, 0 0 0.1em; */
    color: white;
    background-color: #aaaaaa;
    border-radius: 50%;
    width: 32px!important;
    height: 32px!important;
    text-align: center;
    line-height: 24px;
    font-size: 16px;
    border: 4px #aaaaaa solid;
    transition: all 0.3s ease;
	margin: auto;
	box-shadow: 1px 1px 3px 1px #00000030;
	font-family: 'Montserrat', sans-serif;
}
.citymarker:hover div.bigpoint{
	width: 36px!important;
    height: 36px!important;
	font-size: 19px;
	line-height:27px;
}

/*Herstal*/
.citymarker.station_10{position: relative;    left: 35px;    width: 60px!important;}
.citymarker #station_10{}
.citymarker #station_10 .point{margin-left: 10px;}
/*Louvain la Neuve*/
.citymarker #station_4 .city{width:115px;margin-left:-10px;}
/*Andenne*/
.citymarker.station_24{   left: 20px;    width: 65px!important;}
.citymarker #station_24{}
.citymarker #station_24 .point{margin-left: 24px;}
/*Marche-en-famenne*/
.citymarker #station_23 .city{width: 140px;   margin-left: -18px;}

.citymarker div.bigpoint.lvl-0  {border-color: #bebab3;background-color: #bebab3;}
.citymarker div.bigpoint.lvl-1  {border-color: #0000FF;background-color: #0000FF;}
.citymarker div.bigpoint.lvl-2  {border-color: #0099FF;background-color: #0099FF;}
.citymarker div.bigpoint.lvl-3  {border-color: #009900;background-color: #009900;}
.citymarker div.bigpoint.lvl-4  {border-color: #00FF00;background-color: #00FF00;color: #000;}
.citymarker div.bigpoint.lvl-5  {border-color: #FFFF00;background-color: #FFFF00;color: #000;}
.citymarker div.bigpoint.lvl-6  {border-color: #FFBB00;background-color: #FFBB00;}
.citymarker div.bigpoint.lvl-7  {border-color: #FF6600;background-color: #FF6600;}
.citymarker div.bigpoint.lvl-8  {border-color: #FF0000;background-color: #FF0000;}
.citymarker div.bigpoint.lvl-9  {border-color: #CC0000;background-color: #CC0000;}
.citymarker div.bigpoint.lvl-10 {border-color: #990099;background-color: #990099;}

#map-express .leaflet-popup{}
#map-express .leaflet-popup-content-wrapper{padding:0;}
#map-express .leaflet-popup-tip{background-color:#2b353f;}
#map-express .leaflet-popup-content{margin:0;font-family: 'Montserrat', sans-serif;}
#map-express .belaqi_title{font-size: 16px; font-weight: 600; text-align:center; padding:5px;}
#map-express .belaqi_title a{position: absolute;    top: 4px;    right: 4px;    font-size: 14px;    background: #2b353f;    color: #fff;    border-radius: 50%;    display: block;    width: 20px;}
#map-express .belaqi_title a:hover{background-color:#aaa;text-decoration:none;}
#map-express .belaqi_polluant {display: flex; flex-direction: row; flex-wrap: wrap;}
#map-express .belaqi_polluant {color:#fff;padding: 5px;}
#map-express .belaqi_polluant > div{width:100%;text-align: center; }
#map-express .belaqi_polluant .indice{font-size: 27px; font-weight: 600;line-height:22px;}
#map-express .belaqi_polluant .indice span{padding-left:5px; font-size: 12px; font-weight: 600;}
#map-express .belaqi_polluant .polluant{font-size: 27px; font-weight: 600;line-height:22px;}
#map-express .belaqi_polluant .polluant span{padding-left:5px; font-size: 12px; font-weight: 600;}
#map-express .belaqi_txt{    text-align: center;    padding: 10px; max-width:336px;    font-style: italic;}
#map-express .belaqi_picto .svg-picto{width:34px; height:28px;margin:auto 0;}
#map-express .belaqi_picto > div{padding: 0px 10px 10px; display:flex;justify-content: flex-start;}
#map-express .belaqi_picto .sport{}
#map-express .belaqi_picto .fenetre{}
#map-express .belaqi_picto > div > div{display:inline-block;    max-width: 300px;margin-left:10px;    font-weight: 600;    font-size: 0.95em;}
#map-express .belaqi_link{background: #2b353f; padding: 5px 50px; border-radius: 0 0 12px 12px; color:#fff;    text-align: center;}
#map-express .belaqi_link a {color:#fff;font-size:10px;}

#map-express .belaqi_polluant.lvl-0   {background-color: #bebab3;}
#map-express .belaqi_polluant.lvl-1   {background-color: #0000FF;}
#map-express .belaqi_polluant.lvl-2   {background-color: #0099FF;}
#map-express .belaqi_polluant.lvl-3   {background-color: #009900;}
#map-express .belaqi_polluant.lvl-4   {background-color: #00FF00;color: #2b353f;}
#map-express .belaqi_polluant.lvl-5   {background-color: #FFFF00;color: #2b353f;}
#map-express .belaqi_polluant.lvl-6   {background-color: #FFBB00;}
#map-express .belaqi_polluant.lvl-7   {background-color: #FF6600;}
#map-express .belaqi_polluant.lvl-8   {background-color: #FF0000;}
#map-express .belaqi_polluant.lvl-9   {background-color: #CC0000;}
#map-express .belaqi_polluant.lvl-10  {background-color: #990099;}

#map-express .belaqi_polluant.lvl-0 .indice {width:100%}
#map-express .belaqi_polluant.lvl-0 .polluant {display:none;}

#map-express .belaqi_picto.lvl-0 {display :none;}

#map-express .belaqi_picto.lvl-1 .svg-picto,
#map-express .belaqi_picto.lvl-2 .svg-picto,
#map-express .belaqi_picto.lvl-3 .svg-picto,
#map-express .belaqi_picto.lvl-4 .svg-picto,
#map-express .belaqi_picto.lvl-5 .svg-picto {  fill: #009900;}

#map-express .belaqi_picto.lvl-6 .svg-picto,
#map-express .belaqi_picto.lvl-7 .svg-picto {  fill: #f09611;}

#map-express .belaqi_picto.lvl-8 .svg-picto,
#map-express .belaqi_picto.lvl-9 .svg-picto,
#map-express .belaqi_picto.lvl-10 .svg-picto {  fill: #cd0020;}



/*****************************************************************************************************************************************/
/*RESPONSIVE*/
/*****************************************************************************************************************************************/
@media screen and (max-height:950px){

}

@media screen and (max-height:900px){


	.cbx-container > div{
		margin-left: 4px;
	}
	#slct-day-prevision{
		margin-left: 4px;
		width: 112px;
	}
	.toggle-cbx{
		width:92px;
	}
	.toggle-cbx:before{
		left: 16px;
	}
	.toggle-cbx span{
		left: 18px;
	}
	#map-complet #map{
		height: 100vh;
	}
	#map-complet #legend-container{
		/*max-width: 120px;*/
	}
	#map-complet #legend-layer img{ width:100%;}
}

@media screen and (max-width:1440px){
	div.map-modal-overlay{
		width:500px;		
	}
	input[type=checkbox].css-checkbox + label.css-label{
		font-size:0.8em;
	}
}
@media screen and (max-width:1024px){
	
}