body {
    font-family: 'Poppins', sans-serif;
}

p {
    font-family: 'Quicksand', sans-serif;
}

nav a.after\:bg-gray-200:hover:after {
    opacity: 1;
    margin: 0 !important;
}

.mulai:hover i {
    margin-left: 16px;
    margin-right: -4px;
}

#header img {
    animation: floating 4s ease-in-out infinite;
}

footer {
    box-shadow: 0 -4px 6px -1px rgb(0 0 0 / 0.1), 0 -2px 4px -2px rgb(0 0 0 / 0.1);
}

@keyframes floating {
    0% {
        margin-top: 8px;
        margin-bottom: -8px;
    }
    50% {
        margin-top: -8px;
        margin-bottom: 8px;
    }
    100% {
        margin-top: 8px;
        margin-bottom: -8px;
    }
}


/* Custom Animate.css */

.animate  {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}

.fadeInDown2 {
    -webkit-animation-name: fadeInDown2;
    animation-name: fadeInDown2;
}

@keyframes fadeIn {
    from {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
}

@keyframes fadeInUp {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, 10%, 0);
      transform: translate3d(0, 10%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInDown {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -10%, 0);
      transform: translate3d(0, -10%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInDown2 {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -40%, 0);
      transform: translate3d(0, -40%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
}