.interactive-map .map .DepartementOK {z-index: 500; fill:#FFED00;stroke:#000000;cursor:pointer; transition: 0.2s;}
.interactive-map .map .DepartementOK:hover {fill:#000000; transition: 0.2s;}

.interactive-map .map .st2 {z-index: 500; fill:#FFED00;cursor:pointer; transition: 0.2s;}
.interactive-map .map .st2:hover {fill:#000000; transition: 0.2s;}


.interactive-map .map .DepartementOK[data-opened=opened]{fill:#000;}
.interactive-map .map .region-detail{color:#FFF; top:-20rem;background:#000;border:none;padding:10px;position:absolute;z-index:10;display:none;pointer-events:none;width:100%;transition:all .3s ease-out}@media (min-width: 768px){.interactive-map .map .region-detail{width:auto}}
.interactive-map .map .region-detail.visible{display:block}
.interactive-map .map .region-detail.no-transition{transition:none}
.interactive-map .map .region-detail.opened{left:50%;top:50%;transform:translate(-50%, -50%);pointer-events:auto;padding:6rem 2rem 5rem 3rem;max-height:80vh;overflow:hidden}@media (min-width: 768px){.interactive-map .map .region-detail.opened{padding:6rem 3rem 5rem 5rem;min-width:40rem}}
.interactive-map .map .region-detail.opened .scrolling-menu{display:block;overflow:auto;max-height:40vh}@media (min-width: 768px){.interactive-map .map .region-detail.opened .scrolling-menu{max-height:50vh}}
.interactive-map .map .region-detail.opened .menu{display:block;overflow:hidden}
.interactive-map .map .region-detail.opened .region-link{display:block}
.interactive-map .map .region-detail.opened .title{text-align:left;}
.interactive-map .map .region-detail.opened .close{background:#fff;display:flex;align-items:center;justify-content:center;opacity:1}
.interactive-map .map .region-detail .close{position:absolute;right:1.5rem;top:.5rem;display:none;font-size:0;width:5rem;height:5rem}
.interactive-map .map .region-detail .menu{list-style:none;display:none;padding:1.5rem 0 0 0}
.interactive-map .map .region-detail .menu a{display:block;color:#464646;text-decoration:none;padding-bottom:1.5rem}
.interactive-map .map .region-detail .menu a:hover span{text-decoration:underline}
.interactive-map .map .region-detail .menu li:last-child a{padding-bottom:0}
.interactive-map .map .region-detail .region-link{display:none;margin-top:2rem;font-size:1.6rem;}
.interactive-map .map .region-detail .region-link:hover{text-decoration:underline}

.title {font-family: 'Khand', sans-serif;font-weight: 700; font-size: 1.5vw; letter-spacing: 1px; margin-bottom: 0px; text-decoration:none;text-align:center;display:block; color:#FFF; line-height:20px;}

#yvelines:hover {cursor: url("../img/carto/cursor-yvelines.svg") 60 60, auto}
#alsace-lorraine:hover {cursor: url("../img/carto/cursor-alsace-lorraine.svg") 60 60, auto}
#aisne:hover {cursor: url("../img/carto/cursor-aisne.svg") 60 60, auto}
#ardennes:hover {cursor: url("../img/carto/cursor-ardennes.svg") 60 60, auto}
#aube:hover {cursor: url("../img/carto/cursor-aube.svg") 60 60, auto}
#essonne:hover {cursor: url("../img/carto/cursor-essonne.svg") 60 60, auto}
#gironde:hover {cursor: url("../img/carto/cursor-gironde.svg") 60 60, auto}
#haute-garonne:hover {cursor: url("../img/carto/cursor-haute-garonne.svg") 60 60, auto}
#haute-vienne:hover {cursor: url("../img/carto/cursor-haute-vienne.svg") 60 60, auto}
#hauts-de-seine:hover {cursor: url("../img/carto/cursor-hauts-de-seine.svg") 60 60, auto}
#herault:hover {cursor: url("../img/carto/cursor-herault.svg") 60 60, auto}
#indre-et-loire:hover {cursor: url("../img/carto/cursor-indre-et-loire.svg") 60 60, auto}
#landes:hover {cursor: url("../img/carto/cursor-landes.svg") 60 60, auto}
#mayenne:hover {cursor: url("../img/carto/cursor-mayenne.svg") 60 60, auto}
#morbihan:hover {cursor: url("../img/carto/cursor-morbihan.svg") 60 60, auto}
#nievre:hover {cursor: url("../img/carto/cursor-nievre.svg") 60 60, auto}
#nord:hover {cursor: url("../img/carto/cursor-nord.svg") 60 60, auto}
#oise:hover {cursor: url("../img/carto/cursor-oise.svg") 60 60, auto}
#paris:hover {cursor: url("../img/carto/cursor-paris.svg") 60 60, auto}
#pas-de-calais:hover {cursor: url("../img/carto/cursor-pas-de-calais.svg") 60 60, auto}
#sarthe:hover {cursor: url("../img/carto/cursor-sarthe.svg") 60 60, auto}
#seine-et-marne:hover {cursor: url("../img/carto/cursor-seine-et-marne.svg") 60 60, auto}
#seine-maritime:hover {cursor: url("../img/carto/cursor-seine-maritime.svg") 60 60, auto}
#seine-saint-denis:hover {cursor: url("../img/carto/cursor-seine-saint-denis.svg") 60 60, auto}
#somme:hover {cursor: url("../img/carto/cursor-somme.svg") 60 60, auto}
#val-d-oise:hover {cursor: url("../img/carto/cursor-val-d-oise.svg") 60 60, auto}
#val-de-marne:hover {cursor: url("../img/carto/cursor-val-de-marne.svg") 60 60, auto}
#vienne:hover {cursor: url("../img/carto/cursor-vienne.svg") 60 60, auto}
#yonne:hover {cursor: url("../img/carto/cursor-yonne.svg") 60 60, auto}
#vaucluse:hover {cursor: url("../img/carto/cursor-vaucluse.svg") 60 60, auto}

#ile-de-france:hover {cursor: url("../img/carto/cursor-ile-de-france.svg") 60 60, auto}
#hauts-de-france:hover {cursor: url("../img/carto/cursor-hauts-de-france.svg") 60 60, auto}
#paca:hover {cursor: url("../img/carto/cursor-paca.svg") 60 60, auto}
#languedoc-roussillon:hover {cursor: url("../img/carto/cursor-languedoc-roussillon.svg") 60 60, auto}
#normandie:hover {cursor: url("../img/carto/cursor-normandie.svg") 60 60, auto}
#champagne-ardenne:hover {cursor: url("../img/carto/cursor-champagne-ardenne.svg") 60 60, auto}
#bourgogne-franche-comte:hover {cursor: url("../img/carto/cursor-bourgogne-franche-comte.svg") 60 60, auto}
#centre-touraine:hover {cursor: url("../img/carto/cursor-centre-touraine.svg") 60 60, auto}
#bretagne-pays-de-la-loire:hover {cursor: url("../img/carto/cursor-bretagne-pays-de-la-loire.svg") 60 60, auto}
#midi-pyrenees:hover {cursor: url("../img/carto/cursor-midi-pyrenees.svg") 60 60, auto}
#aquitaine:hover {cursor: url("../img/carto/cursor-aquitaine.svg") 60 60, auto}
#coa-limousin:hover {cursor: url("../img/carto/cursor-coa-limousin.svg") 60 60, auto}



	
.zoomDepartement h3 {color: #ffed00; margin-top: 0px; font-size: 1.75vw; margin-bottom: 10px;}
.zoomDepartement h3 span { background-color: #000; padding-left: 30px; padding-right: 15px; margin-left: -30px; border-radius: 0px 5px 5px 0px;}
@media screen and (max-width: 900px) {
.zoomDepartement h3 {
    font-size: 4vw;
    line-height: 5.75vw;
  }
}

.overlay { position: fixed;  top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.7); transition: opacity 500ms; visibility: hidden; opacity: 0; z-index: 900; }
.overlay:target { visibility: visible; opacity: 1; }

.zoomDepartement { margin: 250px auto; padding: 30px; background: #fff; border-radius: 5px; width: 50%; position: relative; transition: all 5s ease-in-out; }
.zoomDepartement .close { position: absolute; top: 20px; right: 30px; transition: all 200ms; font-size: 30px; font-weight: bold; text-decoration: none; color: #333; }
.zoomDepartement .close:hover { color: #939393; cursor: pointer;}
.zoomDepartement li a {color: #9f9200;}
.zoomDepartement ul li::marker {color:#675f00;}
	
.souslignage {text-decoration: underline; color:#000;}

@media screen and (max-width: 900px)
{
.zoomDepartement { margin: 100px auto; width: 75%; }
}