body{
        overflow: auto !important;
}

.bounce-in-right {
    opacity: 0; /* Initially hidden */
    -webkit-transform: translateX(600px);
            transform: translateX(600px);
    transition: opacity 0.2s, transform 0.2s; /* Smooth transition */
  }
  
  .bounce-in-right.animated {
    opacity: 1;
    -webkit-animation: bounce-in-right 1.1s both;
            animation: bounce-in-right 1.1s both;
  }
  
/* ----------------------------------------------
 * Generated by Animista on 2024-10-10 12:59:16
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation bounce-in-right
 * ----------------------------------------
 */
 @-webkit-keyframes bounce-in-right {
  0% {
    -webkit-transform: translateX(600px);
            transform: translateX(600px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateX(68px);
            transform: translateX(68px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateX(32px);
            transform: translateX(32px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateX(8px);
            transform: translateX(8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@keyframes bounce-in-right {
  0% {
    -webkit-transform: translateX(600px);
            transform: translateX(600px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateX(68px);
            transform: translateX(68px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateX(32px);
            transform: translateX(32px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateX(8px);
            transform: translateX(8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}

  /* ----------------------------------------------
 * Generated by Animista on 2024-10-10 13:12:3
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation scale-in-center
 * ----------------------------------------
 */
 /* Initial state (hidden and scaled down) */
.slide-in-fwd-center {
    opacity: 0;
    transform: scale(0);
    transition: opacity 0.2s ease-in, transform 0.2s ease-in;
  }
  
  /* When the element is animated */
  .slide-in-fwd-center.animated {
    opacity: 1;
    -webkit-animation: slide-in-fwd-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-in-fwd-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  }
  
  /* Keyframes for the sliding forward animation */
  @-webkit-keyframes slide-in-fwd-center {
    0% {
      -webkit-transform: translateZ(-1400px) scale(0);
              transform: translateZ(-1400px) scale(0);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateZ(0) scale(1);
              transform: translateZ(0) scale(1);
      opacity: 1;
    }
  }
  
  @keyframes slide-in-fwd-center {
    0% {
      -webkit-transform: translateZ(-1400px) scale(0);
              transform: translateZ(-1400px) scale(0);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateZ(0) scale(1);
              transform: translateZ(0) scale(1);
      opacity: 1;
    }
  }
  /* For WebKit browsers (Chrome, Safari, etc.) */
::-webkit-scrollbar {
        width: 12px; /* Width of the scrollbar */
    }
    
    ::-webkit-scrollbar-track {
        background: linear-gradient(to bottom, rgb(54, 194, 245), #1557bb); /* Background of the scrollbar track */
    }
    
    ::-webkit-scrollbar-thumb {
        background-color: #091E3E;
        border-radius: 10px;
        border: 1px solid rgba(135, 116, 4, 0.718); 
    }
    
    ::-webkit-scrollbar-thumb:hover {
        background-color: black; /* Darker color on hover */
    }