body .bodier .container #mapa-fases-desescalada * {font-family: 'Roboto', sans-serif;}
#mapa-fases-desescalada {position:relative;background: #fff;}
#mapa-fases-desescalada .title {font-size: 2.4rem;line-height: 3rem;font-weight: 900;color: #313131;display: block;position: relative;text-align: center;text-transform: uppercase;padding-top:1rem}
#mapa-fases-desescalada p.subtitle {text-align:center;font-size:1.8rem;line-height: 2.2rem;font-weight:300;position:relative;display:block;margin-bottom:0;padding-bottom:1rem;min-height:5.4rem;}

/* mapa */
#mapa-fases-desescalada .mapBox {display:block;width:100%;margin: 0 auto;padding-top: 100%;position: relative;vertical-align: top;margin-bottom:-10%}
#mapa-fases-desescalada .mapBox svg {width: 100%;height: 100%;position: absolute;top: 0;left: 0;opacity: 0.75;/*background: #fff;*/margin-top:-3%}
#mapa-fases-desescalada .mapBox svg *, #mapa-fases-desescalada .list-area * {font-family: 'Roboto', arial, serif;color: #313131}
#mapa-fases-desescalada .mapBox svg > g path {cursor: pointer;}
#mapa-fases-desescalada .mapBox svg > g path:hover {opacity: .85;}

/* fechas */
#mapa-fases-desescalada .fecha-status {display: block;background: #f2f2f2;font-size: 0;margin: 0;padding: 0;width:100%;position:absolute;top:0;}
#mapa-fases-desescalada .fecha-status > ul > li {display: inline-block;width: 12.5%;text-align: center;padding: 3rem 0 2rem 0;border:none}
#mapa-fases-desescalada .fecha-status > ul > li > span {font-size: 1.4rem;line-height: 2rem;font-weight: 400;position:relative;width: 100%;display: block;}
#mapa-fases-desescalada .fecha-status > ul > li > span:before {content: "";width: 2rem;height: 2rem;display: block;background: #DEDEDE;border-radius: 100%;margin: 0 auto;position: relative;top: -1rem;z-index:1;cursor:pointer}
#mapa-fases-desescalada .fecha-status > ul > li:not(:last-child) > span:after {content: "";width: 100%;height: .1rem;position: absolute;top: 0;left: 50%;background: #DEDEDE;display: block;}

#mapa-fases-desescalada .fecha-status ul.num_elem_9 > li  {width: 11.11111111111111%;}
#mapa-fases-desescalada .fecha-status ul.num_elem_10 > li {width: 10%;}

#mapa-fases-desescalada .fecha-status > ul > li.active > span,
#mapa-fases-desescalada .fecha-status > ul > li:hover > span {font-weight:700;}
#mapa-fases-desescalada .fecha-status > ul > li.active > span:before,
#mapa-fases-desescalada .fecha-status > ul > li:hover > span:before {background: #5D5D5D;}

/* fases leyenda */
#mapa-fases-desescalada .mapBox path[class*='fase_0'], #mapa-fases-desescalada .mapBox .fase_0,#mapa-fases-desescalada  #fases > .st3{fill:#BF2C37;}
#mapa-fases-desescalada .mapBox .fase_1, #fases > .st2{fill:#EF8F41;}
#mapa-fases-desescalada .mapBox .fase_2, #fases > .st1{fill:#FFCE31;}
#mapa-fases-desescalada .mapBox .fase_3, #fases > .st0{fill:#7CA55B;}
#mapa-fases-desescalada .mapBox .fase_4 {fill:#BFDBA7;}


/** fichas **/
#mapa-fases-desescalada .list-areas * {font-family: 'Roboto', arial, serif;color: #313131}
#mapa-fases-desescalada .list-areas {display: block;width: 100%;height: 100%;}

/* ficha active */
#mapa-fases-desescalada .list-areas > li {position:relative;display: inline-block;width: auto;clip:rect(0,0,0,0);opacity:0;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  transition: all .3s ease-out;}

#mapa-fases-desescalada .list-areas > li.active{clip: auto;opacity: 1;overflow: visible;transform: scale(1);}
/* */

/* estructura */
#mapa-fases-desescalada .list-areas > li {box-shadow: 0 0 .2rem .2rem #ccc;width: 25%;position: absolute;/*top: 40%;left: 20%;*/text-align: left;padding: 1rem 1.5rem;background:#fff}
#mapa-fases-desescalada .list-areas header h4 {border-bottom: .01rem solid #ccc;}
#mapa-fases-desescalada .list-areas header h4 span {font-size: 1.8rem;line-height: 2.4rem;font-weight: 900;padding: 0 2rem 1rem 0;display: block;text-transform: uppercase;}
#mapa-fases-desescalada .list-areas header .ico.closed {position: absolute;top: 0;right: 0;left: auto;cursor: pointer;}
#mapa-fases-desescalada .list-areas header .ico.closed img {background: url(i/close_desktop.png) center center no-repeat;width: 4rem;height: 4rem;position: relative;display: inline-block;vertical-align: middle;}

#mapa-fases-desescalada .list-areas section {margin-top: 1rem;}
#mapa-fases-desescalada .list-areas section * {font-size: 1.4rem;line-height: 1.8rem;font-weight: 400;}
#mapa-fases-desescalada .list-areas section li strong {font-weight: 700;}

#mapa-fases-desescalada .list-areas section > ul > li[class*="fase"]:after {content: "";width: 1rem;height: 1rem;display: inline-block;margin-left: 1rem;}

/* fases */
#mapa-fases-desescalada .list-areas section > ul > li.fase_0:after{background:#BF2C37;}
#mapa-fases-desescalada .list-areas section > ul > li.fase_1:after{background:#EF8F41;}
#mapa-fases-desescalada .list-areas section > ul > li.fase_2:after{background:#FFCE31;}
#mapa-fases-desescalada .list-areas section > ul > li.fase_3:after{background:#7CA55B;}
#mapa-fases-desescalada .list-areas section > ul > li.fase_4:after{background:#BFDBA7;}

/* ocultar provincia */
#mapa-fases-desescalada .list-areas [data-name="ceuta"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="melilla"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="santa_cruz_de_tenerife"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="la_palma"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="tenerife"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="gran_canaria"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="fuerteventura"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="lanzarote"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="la_gomera"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="el_hierro"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="la_graciosa"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="ibiza"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="menorca"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="mallorca"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="formentera"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="baleares"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="islas_santa_cruz_de_tenerife"] section li:first-child strong,
#mapa-fases-desescalada .list-areas [data-name="islas_las_palmas"] section li:first-child strong {display:none}

#mapa-fases-desescalada p.footer {font-size: 1.4rem;line-height: 2rem;display:block;}

/*reset summary */
.article .summary #mapa-fases-desescalada li:before,
#mapa-fases-desescalada .list-areas li:before {content:none !important;}
#mapa-fases-desescalada .list-areas >li{border-width: 0;padding: 1rem 1.5rem;text-indent: 0;}
#mapa-fases-desescalada .list-areas section li {border: none;}

@media only screen and (max-width:900px){
  #mapa-fases-desescalada .title {font-size:1.8rem;line-height: 2.2rem;}
  #mapa-fases-desescalada p.subtitle {font-size:1.4rem;line-height: 1.8rem;}
  #mapa-fases-desescalada .mapBox svg{margin-top:5%;}
}