/* Début animation */
.title-creation {
  width: 500px;
  margin-left: 160px;
  margin-top: 180px;
  margin-bottom: 180px;
  animation-duration: 3s;
  animation-name: fadeInLeft;
}

/* boucles mini banderoles*/
.mini-banderole {
  height: 20px;
  animation-name: scroll-banderole-boucle;
  animation-duration: 40s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  background: url(../image/mini-banderole.png);
}

#banderole-bas {
  margin-top: -4px;
}

@keyframes scroll-banderole-boucle {
  0% {
    background-position-x: -1920px;
  }
  100% {
  background-position-x: 0;
  }
}

  /* slide flyer */
  .scroll-flyer {
   width: 595px;
   height: 794px;
   padding-bottom:4px;
   display: flex;
   overflow: hidden;
  }

  .groupe-flyer {
   animation: transition-droite-gauche 50s ease-in-out infinite;
   display: flex;
  }

  @keyframes transition-droite-gauche {
     0%, 100% {
        transform: translate3d(0,0,0);
      }
     50% {
        transform: translate3d(-82%,0,0);
      }
   }

/* slide banniere */
.banderole-banniere{
  float: right;
  height: 378px;
  width: 100%;
  margin-top: -798px;
  animation-name: scroll-banniere-boucle-haut;
  animation-duration: 60s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  background: url(../image/bannieres/bannieres.png);
  background-position: right;
}

@keyframes scroll-banniere-boucle-haut {
  0% {
    background-position-y: 2612px;
  }
  100% {
  background-position-y: 0;
  }
}

/* slide logo */
.banderole-logo {
  height: 416px;
  width: 405px;
  margin-top: -419px;
  margin-left: 595px;
  position: absolute;
  animation-name: scroll-logo-boucle-haut-bas;
  animation-duration: 50s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  background: url(../image/logos/logos.png);
}

@keyframes scroll-logo-boucle-haut-bas {
  0% {
    background-position-y: -1186px;
  }
  100% {
  background-position-y: 0;
  }
}

/* slide mignature */
.banderole-mignature {
  float: right;
  height: 415px;
  width: 100%;
  padding-bottom:0px;
  margin-top: -419px;
  animation-name: scroll-logo-boucle-droite;
  animation-duration: 50s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  background: url(../image/mignatures/mignatures.png);
}

@keyframes scroll-logo-boucle-droite {
  0% {
    background-position-x: -3566px;
  }
  100% {
  background-position-x: 0;
  }
}