.list-city {
    display: none;
}

li {
    list-style: none;
    padding: .4em;
}

.map {
    overflow: hidden;
    margin-bottom: 3em;
}

.map__image {
    min-width: 400px;
    min-height: 200px;
    float: left;
}

/*****************Agudelle************************/
.map__image .Bran,
.map__image .Bussac-Forêt,
.map__image .Chamouillac,
.map__image .Chartuzac,
.map__image .Chatenet,
.map__image .Chaunac,
.map__image .Chepniers,
.map__image .Corignac,
.map__image .Courpignac,
.map__image .Coux,
.map__image .Expiremont,
.map__image .Jussas,
.map__image .Le-Pin,
.map__image .Mérignac,
.map__image .Messac,
.map__image .Montendre,
.map__image .Polignac,
.map__image .Pommiers-Moulons,
.map__image .Rouffignac,
.map__image .Salignac-de-Mirambeau,
.map__image .Souméras,
.map__image .Sousmoulins,
.map__image .Tugéras-Saint-Maurice,
.map__image .Vanzac,
.map__image .Vibrac {
    fill: #F39200;
    stroke: #fff;
    stroke-width: 1px;
    transition: fill 0.3s;
}

.map__image .is-active .Bran,
.map__image .is-active .Bussac-Forêt,
.map__image .is-active .Chamouillac,
.map__image .is-active .Chartuzac,
.map__image .is-active .Chatenet,
.map__image .is-active .Chaunac,
.map__image .is-active .Chepniers,
.map__image .is-active .Corignac,
.map__image .is-active .Courpignac,
.map__image .is-active .Coux,
.map__image .is-active .Expiremont,
.map__image .is-active .Jussas,
.map__image .is-active .Le-Pin,
.map__image .is-active .Mérignac,
.map__image .is-active .Messac,
.map__image .is-active .Montendre,
.map__image .is-active .Polignac,
.map__image .is-active .Pommiers-Moulons,
.map__image .is-active .Rouffignac,
.map__image .is-active .Salignac-de-Mirambeau,
.map__image .is-active .Souméras,
.map__image .is-active .Sousmoulins,
.map__image .is-active .Tugéras-Saint-Maurice,
.map__image .is-active .Vanzac,
.map__image .is-active .Vibrac {
    fill: #7e4f08;
}

/**********************************************************************/

.map__list {
    display: flex;
}

.map__list a {
    color: inherit;
    transition: color 0.3s;
    font-family: 'Montserrat', 'Tahoma', 'Calibri', sans-serif;
    text-decoration: none;
    color: #575757;
    font-weight: 300;
}

.map__list a.is-active {
    background-color: #F39200;
    padding: .5em;
    color: #fff;
}

.second-list {
    position: absolute;
    left: 35em;
}

/******************************MEDIA QUERIES**************************/

@media only screen and (max-width: 1124px) {

    /* For mobile phones: */

    .map__list {
        width: 100%;
    }
}

@media only screen and (max-width: 1124px) {
    /* For mobile phones: */

    .map__image {
        min-width: 400px;
    }
}

@media only screen and (max-width: 660px) {

    /* For mobile phones: */

    .map__list {
        display: none;
    }
}

@media only screen and (max-width: 660px) {
    /* For mobile phones: */

    .map__image {
        width: 100%;
        min-width: 100px;
        min-height: 200px;
    }
}

@media only screen and (max-width: 660px) {
    /* For mobile phones: */

    .list-city {
        display: inline;
    }
}