@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

*{
    font-family:"Poppins",sans-serif;

}

html {
    scroll-behavior: smooth;
    overflow-x:hidden !important ;
}


body{

}

/* Loader start */

/**
 * ==============================================
 * Dot Pulse
 * ==============================================
 */
.dot-pulse {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #AE0E18;
    color: #AE0E18;
    box-shadow: 9999px 0 0 -5px;
    animation: dot-pulse 1.5s infinite linear;
    animation-delay: 0s;
}
.dot-pulse1::before, .dot-pulse2::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #AE0E18;
    color: #AE0E18;
}

.dot-pulse1::before {
    box-shadow: 9984px 0 0 -5px;

}

.dot-pulse2::after {
    box-shadow: 10014px 0 0 -5px;

}

@keyframes dot-pulse-before {
    0% {
        box-shadow: 9984px 0 0 -5px;
    }
    30% {
        box-shadow: 9984px 0 0 2px;
    }
    60%, 100% {
        box-shadow: 9984px 0 0 -5px;
    }
}
@keyframes dot-pulse {
    0% {
        box-shadow: 9999px 0 0 -5px;
    }
    30% {
        box-shadow: 9999px 0 0 2px;
    }
    60%, 100% {
        box-shadow: 9999px 0 0 -5px;
    }
}
@keyframes dot-pulse-after {
    0% {
        box-shadow: 10014px 0 0 -5px;
    }
    30% {
        box-shadow: 10014px 0 0 2px;
    }
    60%, 100% {
        box-shadow: 10014px 0 0 -5px;
    }
}

/* Loader end */


/* Social icons start */

[data-theme='dark'] .social-icons-color{
    background: linear-gradient(310.39deg, rgba(31, 35, 39, 0.45) 2.17%, rgba(31, 35, 39, 0.04) 100%);
    box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.26);
    backdrop-filter: blur(6px);
}

[data-theme='light'] .social-icons-color{
    background: linear-gradient(310.39deg, rgba(255, 255, 255, 0.63) 2.17%, rgba(255, 255, 255, 0.04) 100%);
    box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(6px);
}

/* Social icons end */


/* spyscroller */
[data-theme='light'] .menu__item .active {
    border-bottom: 2px solid #AE0E18;
    background-color:#FCFCFC;
    padding-left: 1.25rem/* 20px */;
    padding-right: 1.25rem/* 20px */;
    transition:all 300ms ease-in-out;
    color:black;
}

[data-theme='dark'] .menu__item .active {

  border-bottom: 2px solid #AE0E18;
  background-color:#1F2327;
  padding-left: 1.25rem/* 20px */;
    padding-right: 1.25rem/* 20px */;

    transition:all 300ms ease-in-out;
}
/* spyscroller */


.preloader{
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 1000;
}

[data-theme='dark'] .dark-theme{
    opacity: 100% !important;
}
[data-theme='light'] .light-theme{
    opacity: 100% !important;
}


.not-active-dark-light{
    opacity: 0 !important;
}

[data-theme='dark'] .active-dark-light{
    opacity: 100% !important;
}
[data-theme='light'] .active-dark-light{
    opacity: 100% !important;
}

[data-theme='dark'] .logo-display-dark{
    display: inline;
}

[data-theme='light'] .logo-display-light{
    display: inline;
}

#circlePop svg{
    opacity: 14%;
}

[data-theme='dark'] .hero-color{
    background: rgba(31, 35, 39, 0.60);

}

[data-theme='light'] .hero-color{
    background: rgba(31, 35, 39, 0.32);

}

/* Color of logos in dar and light */
[data-theme='dark'] .color_images-filter img{
    filter: invert(100%) sepia(100%) saturate(2%) hue-rotate(43deg) brightness(103%) contrast(101%);
}

[data-theme='light'] .color_images-filter img{
    filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(324deg) brightness(96%) contrast(104%);
}

/* Our clients end */
/* Navbar drawer start */

.drawer-toggle:checked ~ .drawer-content {
    transform:none;
}

.drawer-side{
    transform: translateX(0);
}

.drawer-toggle:checked ~ .drawer-side{
    transform: translateX(0);
}

.drawer-side .menu{
    height: 100vh;
    transform: translateX(0);
}
.drawer-toggle:checked ~ .drawer-side .menu{
    height: 100vh;
    transform: translateX(0);
}

.drawer-toggle~.drawer-side{
    transform: translateX(-100%)
}


/* Navbar drawer end */


/* For splide start */

.my-carousel-progress {
    background: #ccc;
}

.my-carousel-progress-bar {
    background: greenyellow;
    height: 2px;
    transition: width 400ms ease;
    width: 0;
}

.thumb .is-active{
    border:none !important;
    background-color: rgba(204, 204, 204, 0.3);
    border-radius: 10px;

}
/* For splide end */