body h1,
body h2,
body p {
  color: #010119;
}

header {
  height: 94vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
header .slogan .slogan-pte1 {
  display: flex;
  flex-direction: row;
  gap: 8px;
}
header .slogan .slogan-pte1 h1:first-child {
  opacity: 0%;
  animation: translation 0.5s 0.2s ease-out forwards;
}
@keyframes translation {
  0% {
    translate: 1500px 0px;
    opacity: 0%;
  }
  100% {
    translate: 0px 0px;
    opacity: 100%;
  }
}
header .slogan .slogan-pte1 h1:nth-child(2) {
  opacity: 0%;
  animation: translation 0.5s 0.8s ease-out forwards;
}
@keyframes translation {
  0% {
    translate: 1500px 0px;
    opacity: 0%;
  }
  100% {
    translate: 0px 0px;
    opacity: 100%;
  }
}
header .slogan .slogan-pte1 h1:nth-child(3) {
  opacity: 0%;
  animation: translation 0.5s 1.3s ease-out forwards;
}
@keyframes translation {
  0% {
    translate: 1500px 0px;
    opacity: 0%;
  }
  100% {
    translate: 0px 0px;
    opacity: 100%;
  }
}
header .slogan .slogan-pte2 h1 {
  font-size: 4rem;
  opacity: 0%;
  animation: opacity 1.2s 2.1s ease-in-out forwards;
}
@keyframes opacity {
  0% {
    opacity: 0%;
  }
  100% {
    opacity: 100%;
  }
}
header .creation-compte {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  gap: 20px;
}
header .creation-compte input {
  min-width: 100%;
  border-radius: 5px;
  border: 1px #010119 solid;
}
header .creation-compte a {
  color: #010119;
  text-decoration: none;
  background-color: #fff;
  border-radius: 5px;
  padding: 5px;
  transition: all 0.3s ease-in-out;
}
header .creation-compte a:hover {
  background-color: #010119;
  color: #fff;
}
header .presentation {
  animation: bonjour 2s 0.3s ease-in-out forwards;
  opacity: 0%;
}
@keyframes bonjour {
  0% {
    opacity: 0%;
  }
  100% {
    opacity: 100%;
  }
}
header .presentation img {
  margin-top: 200px;
  margin-bottom: 60px;
  width: 80px;
  height: 80px;
  animation: bouton 0.3s ease-in-out infinite alternate;
}
@keyframes bouton {
  0% {
    rotate: 5deg;
  }
  100% {
    rotate: -5deg;
  }
}

main .titre-tache h1 {
  padding-top: 100px;
  padding-bottom: 100px;
  display: flex;
  justify-content: center;
}
main .btn-tache {
  padding-top: 50px;
  padding-bottom: 50px;
  margin-top: 20px;
  display: flex;
  justify-content: center;
}
main .btn-tache a {
  display: flex;
  max-width: 50%;
  color: #010119;
  text-decoration: none;
  background-color: #fff;
  border-radius: 5px;
  padding: 5px;
  transition: all 0.3s ease-in-out;
}
main .btn-tache a:hover {
  background-color: #010119;
  color: #fff;
}/*# sourceMappingURL=style.css.map */