.carousel-item {

    max-width: 600px;

    width: 100%;

}



.carousel-img {

    width: 100%;

    height: 600px;

    background-position: center;

    background-size: cover;

    margin: 0 auto;

}



#galleryCarousel {

    max-width: 600px;

    margin: auto;

}



.bg-motif-1 {

  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 400' preserveAspectRatio='none'><path d='M-50,200 C200,100 400,300 600,200 C800,100 1000,300 1250,200' fill='none' stroke='%23e3eff9' stroke-width='300' opacity='1'/></svg>");

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center;

}



.bg-motif-2 {

  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 400' preserveAspectRatio='none'><path d='M-50,180 C120,160 260,170 380,180 C520,190 640,185 760,175 C900,165 1040,175 1160,185 C1260,190 1360,185 1250,180' fill='none' stroke='%23f5f5f5' stroke-width='300' opacity='1' stroke-linecap='round'/></svg>");

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center;

}



.bg-motif-3 {



background-color: #e3eff9;

}





.carousel-control-next, .carousel-control-prev {

    filter: invert(1);

}



.fade-in {

    animation: 1s fadeIn 0s ease forwards;

}



@keyframes fadeIn {

  from {

    opacity: 0;

    transform: translateX(-20px);

  }

  to {

    opacity: 1;

    transform: translateY(0);

  }

}



.fs-small {

    font-size: 0.875rem;

}



#contact {

    bottom: 160px;

}



@media (min-width: 576px) {

    .fs-small {

        font-size: 1.25rem;

    }

}



@media (max-width: 576px) {

  .carousel-img {

      height: 500px;

  }

}