@import url('https://fonts.googleapis.com/css2?family=Sansation:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');

body {
    font-family: 'Sansation', sans-serif;
}

body,
p,
h1,
h2,
h3,
h4,
h5,
h6,
a,
li,
td,
th,
span,
label,
marquee {
    font-family: 'Sansation', sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Sansation', sans-serif !important;
    color: #fff;
}

h1 {
    font-size: 2.5rem !important;
}

h2 {
    font-size: 2rem !important;
}

h3 {
    font-size: 1.75rem !important;
}

h4 {
    font-size: 1.5rem !important;
}

h5 {
    font-size: 1.25rem !important;
}

h6 {
    font-size: 1rem !important;
}

p {
    font-size: 1rem !important;
    color: #fff !important;
}

a {
    color: #fff;
    text-decoration: none !important;
}
  .colorOrange {
     color: #EB6F08 !important;
  }

  .bgOrange {
     background-color: #EB6F08 !important;
  }

  .btn-custom {
    background-color: #EB6F08 !important;
    color: white !important;
    border: none !important;
}

.btn-custom:hover {
    background-color: rgb(238, 160, 96) !important;
    color: white !important;
    border: none !important;
}

  .text-orange {
    color: #fd7e14 !important;
  }
  .border-orange {
    border-color: #fd7e14 !important;
  }
  .btn-outline-orange {
    border-color: #fd7e14 !important;
    color: #fd7e14 !important;
  }
  .btn-outline-orange:hover {
    background-color: #fd7e14 !important;
    color: white !important;
  }
  .animate-slide {
    animation: slide 20s linear infinite !important;
  }
  @keyframes slide {
    0% { transform: translateX(0%) !important;}
    100% { transform: translateX(-50%) !important;}
  }
.nav-link {
    transition: all 0.3s ease-in-out !important;
}

.nav-link:hover {
    color: #fd7e14 !important;
    transform: translateY(-2px) !important;
}

.text-gradient {
    background: linear-gradient(to right, #3b82f6, #9333ea) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
    .btn-custom {
    background-color: #EB6F08 !important;
    color: white !important;
    border: none !important;
}

.btn-custom:hover {
    background-color: rgb(238, 160, 96) !important;
    color: white !important;
    border: none !important;
}
.hover-shadow:hover {
    box-shadow: 0 0 15px rgba(255, 165, 0, 0.5) !important;
    transition: box-shadow 0.3s ease-in-out !important;
}
    .btn-custom {
    background-color: #EB6F08 !important;
    color: white !important;
    border: none !important;
}

.btn-custom:hover {
    background-color: rgb(238, 160, 96) !important;
    color: white !important;
    border: none !important;
}

    .hover-grow {
        transition: flex 0.5s ease-out !important;
    }

    .hover-grow:hover {
        flex: 6 !important;
    }

    .btn-custom {
    background-color: #EB6F08 !important;
    color: white !important;
    border: 2px solid #EB6F08 !important;
}

.btn-custom:hover {
    background-color: rgb(238, 160, 96) !important;
    color: white !important;
    border: none !important;
}

.pagination .page-link {
    color: #EB6F08 !important;
    border-color: #EB6F08 !important;
}

.pagination .page-link:hover {
    background-color: #EB6F08 !important;
    color:  white !important;
}

.pagination .page-item.active .page-link {
    background-color: #EB6F08 !important;
    border-color: #EB6F08 !important;
    color: white !important;
}

.bg-warn {
    background-color: #EB6F08 !important;
}

.float-animation-slow {
    animation: float 6s ease-in-out infinite !important;
}

.float-animation-fast {
    animation: float 3s ease-in-out infinite !important;
}

.float-animation-medium {
    animation: float 4s ease-in-out infinite !important;
}

@keyframes float {

    0%,
    100% {
        transform: translateY(0) !important;
    }

    50% {
        transform: translateY(-10px) !important;
    }
}

.text-gradient {
    background: linear-gradient(to right, #3b82f6, #8b5cf6) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.border-orange {
    border: 2px solid #f5872c !important;
}

.marquee-style {
    font-size: 4vw !important; 
    color: #FFC393 !important; 
    text-shadow: 2px 2px 4px #FF6900 !important;
}

.line{
    width: 40px !important; 
    height: 2px !important; 
    background-color: #fd7e14 !important;
}