/* details agence */
@keyframes slidy {

    0% { left: 0%; }
    28% { left: 0%; }
    33% { left: -100%; }
    61% { left: -100%; }
    66% { left: -200%; }
    95% { left: -200%; }
    100% { left: -300%; }
}
@keyframes slidy2 {
    0% {
        left: 0%;
    }
    40% {
        left: 0%;
    }
    50% {
        left: -100%;
    }
    90% {
        left: -100%;
    }
    100% {
        left: -200%;
    }
}
#hero-agence {
    overflow: hidden;
}
.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
#hero-agence .slides {
    position: absolute;
    top: 0;
    left: 0;
    width: 400%;
    height: 100%;
    animation-name: AutoSlide;
    animation: 15s slidy infinite;
    overflow: hidden;
}
.slide-agence-mobile {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#hero-agence .slides3 {
    position: absolute;
    top: 0;
    left: 0;
    width: 300%;
    height: 100%;
    animation-name: AutoSlide;
    animation: 10s slidy2 infinite;
    overflow: hidden;
}
#hero-agence .slides3 .slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 33.33%;
    height: 100%;
}
#hero-agence .slides .slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 25%;
    height: 100%;
}

/* Agence 7e */
.hero-details-agence-7 .slides-desktop #slide1 {
    background: url(../images/agences/7/1.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-7 .slides-desktop #slide2 {
    left: 25%;
    background: url(../images/agences/7/2.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-7 .slides-desktop #slide3 {
    left: 50%;
    background: url(../images/agences/7/3.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-7 .slides-desktop #slide4 {
    left: 75%;
    background: url(../images/agences/7/1.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}


/* Agence 9e */
.hero-details-agence-9 .slides-desktop #slide1 {
    background: url(../images/agences/9/1.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-9 .slides-desktop #slide2 {
    left: 25%;
    background: url(../images/agences/9/2.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-9 .slides-desktop #slide3 {
    left: 50%;
    background: url(../images/agences/9/3.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-9 .slides-desktop #slide4 {
    left: 75%;
    background: url(../images/agences/9/1.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}

.hero-details-agence-15 .slides-desktop #slide1 {
    background: url(../images/agences/15/2.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-15 .slides-desktop #slide2 {
    left: 33.33%;
    background: url(../images/agences/15/3.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-15 .slides-desktop #slide3 {
    left: 66.66%;
    background: url(../images/agences/15/2.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}

.hero-details-agence-16 .slides-desktop #slide1 {
    background: url(../images/agences/16/1.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-16 .slides-desktop #slide2 {
    left: 33.33%;
    background: url(../images/agences/16/2.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-16 .slides-desktop #slide3 {
    left: 66.66%;
    background: url(../images/agences/16/1.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}

.hero-details-agence-18 .slides-desktop #slide1 {
    background: url(../images/agences/18/2.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-18 .slides-desktop #slide2 {
    left: 33.33%;
    background: url(../images/agences/18/3.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}
.hero-details-agence-18 .slides-desktop #slide3 {
    left: 66.66%;
    background: url(../images/agences/18/2.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}

@media(max-width: 750px) {

    .hero-details-agence-7 .slides-desktop, .hero-details-agence-9 .slides-desktop, .hero-details-agence-15 .slides-desktop, .hero-details-agence-16 .slides-desktop, .hero-details-agence-18 .slides-desktop {
        display: none;
    }
    .slide-agence-mobile {
        display: block;
    }
    .slide-agence-mobile-7 {
        background: url(../images/agences/mobile/agence-7.jpg) no-repeat center;
        -webkit-background-size: cover;
        background-size: cover;
    }
    .slide-agence-mobile-9 {
        background: url(../images/agences/mobile/agence-9.jpg) no-repeat center;
        -webkit-background-size: cover;
        background-size: cover;
    }
    .slide-agence-mobile-11 {
        background: url(../images/agences/mobile/_agence-11.png) no-repeat center;
        -webkit-background-size: cover;
        background-size: cover;
    }
    .slide-agence-mobile-15 {
        background: url(../images/agences/mobile/agence-15.jpg) no-repeat center;
        -webkit-background-size: cover;
        background-size: cover;
    }
    .slide-agence-mobile-16 {
        background: url(../images/agences/mobile/agence-16.jpg) no-repeat center;
        -webkit-background-size: cover;
        background-size: cover;
    }
    .slide-agence-mobile-17 {
        background: url(../images/agences/mobile/agence-17.jpg) no-repeat center;
        -webkit-background-size: cover;
        background-size: cover;
    }
    .slide-agence-mobile-18 {
        background: url(../images/agences/mobile/agence-18.jpg) no-repeat center;
        -webkit-background-size: cover;
        background-size: cover;
    }
}