/* CSS Varibales */
:root {
  /*Font */
  --font: "Poppins", sans-serif;

  /* Font Weights */
  /* ****NOT USED**** */
  --light: 300; /* light */

  /* ****USED**** */
  --regular: 400; /* regular */
  --medium: 500; /* medium */
  --semi-bold: 600; /* semi-bold */
  --bold: 700; /* bold */
  --extra-bold: 800; /* extra-bold */

  /* Theme Color Pallet */
  --transparent: transparent;

  /* POISON/PURPLE */
  --blue-10: #e7d8ff; /* Primary Pasetl */
  --blue-20: #7a2cff; /* Primary Hover */
  --blue-30: #5a3795; /* Primary Active */
  --blue-40: #301e50; /* Primary Pressed */

  /* BLOOD/RED */
  --red-10: #f8b0b4; /* Secondary Pasetl */
  --red-20: #f54952; /* Secondary Active */
  --red-30: #ea0000; /* Danger Pasetl */
  --red-40: #ffdbdb; /* Danger Active */

  /* GRASS/GREEN */
  --green-10: #2dbf79; /* Success Pasetl */
  --green-20: #cfffe8; /* Success Active */

  /* WARNING/YELLOW */
  --yellow-10: #ff8a00; /* warning Pasetl */
  --yellow-20: #ffecd6; /* warning Active */

  /* NEUTRAL */
  /* White */
  --neutral-00: #ffffff;
  --neutral-20: #f8faff;
  --neutral-30: #f3ecfe;
  /* Grey */
  --neutral-40: #cacaca;
  --neutral-50: #c0c0c0; /* USED FOR GRADIENT & SHADOW*/
  --neutral-60: #7a7a7a;
  --neutral-70: #282828; /* ONLY USED FOR TEXT */
}

@property --rotate {
    syntax: "<angle>";
    initial-value: 132deg;
    inherits: false;
}

.active .z-list .card:before,
.active .z-list .card:after,
.z-list:hover .card:before,
.z-list:hover .card:after {
    background-image: linear-gradient(
        var(--rotate),
        var(--blue-30),
        var(--red-20) 43%,
        var(--blue-30)
    );
    -webkit-animation: spin 1.5s linear infinite;
}
 
.about-skew .z-list:hover .card:before,
.about-skew .z-list:hover .card:after {
    background-image: linear-gradient(
        var(--rotate),
        var(--blue-30),
        var(--red-20) 43%,
        var(--blue-30)
    );
    -webkit-animation: unset;
}
.active .z-list .card .card-body,
.z-list .card .card-body {
    background: linear-gradient(
        359.57deg,
        var(--neutral-00) 2.77%,
        var(--neutral-50) 99.71%
    );
} 

.z-list .card::before {
    background-image: linear-gradient(
        var(--rotate),
        var(--transparent),
        var(--transparent) 43%,
        var(--transparent)
    );
}
.active .z-list .card::after,
.z-list .card::after {
    background-image: linear-gradient(
        var(--rotate),
        var(--transparent),
        var(--transparent) 43%,
        var(--transparent)
    );
}

@keyframes spin {
    0% {
        --rotate: 0deg;
    }
    100% {
        --rotate: 360deg;
    }
}

@keyframes blog-slide-up {
    0% {
        top: 75%; 
    }
    100% {
        top: 25%;
    }
}

[data-aos][data-aos][data-aos-duration="50"],
body[data-aos-duration="50"] [data-aos] {
    transition-duration: 50ms;
}
[data-aos][data-aos][data-aos-delay="50"],
body[data-aos-delay="50"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="50"].aos-animate,
body[data-aos-delay="50"] [data-aos].aos-animate {
    transition-delay: 50ms;
}
[data-aos][data-aos][data-aos-duration="100"],
body[data-aos-duration="100"] [data-aos] {
    transition-duration: 0.1s;
}
[data-aos][data-aos][data-aos-delay="100"],
body[data-aos-delay="100"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="100"].aos-animate,
body[data-aos-delay="100"] [data-aos].aos-animate {
    transition-delay: 0.1s;
}
[data-aos][data-aos][data-aos-duration="150"],
body[data-aos-duration="150"] [data-aos] {
    transition-duration: 0.15s;
}
[data-aos][data-aos][data-aos-delay="150"],
body[data-aos-delay="150"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="150"].aos-animate,
body[data-aos-delay="150"] [data-aos].aos-animate {
    transition-delay: 0.15s;
}
[data-aos][data-aos][data-aos-duration="200"],
body[data-aos-duration="200"] [data-aos] {
    transition-duration: 0.2s;
}
[data-aos][data-aos][data-aos-delay="200"],
body[data-aos-delay="200"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="200"].aos-animate,
body[data-aos-delay="200"] [data-aos].aos-animate {
    transition-delay: 0.2s;
}
[data-aos][data-aos][data-aos-duration="250"],
body[data-aos-duration="250"] [data-aos] {
    transition-duration: 0.25s;
}
[data-aos][data-aos][data-aos-delay="250"],
body[data-aos-delay="250"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="250"].aos-animate,
body[data-aos-delay="250"] [data-aos].aos-animate {
    transition-delay: 0.25s;
}
[data-aos][data-aos][data-aos-duration="300"],
body[data-aos-duration="300"] [data-aos] {
    transition-duration: 0.3s;
}
[data-aos][data-aos][data-aos-delay="300"],
body[data-aos-delay="300"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="300"].aos-animate,
body[data-aos-delay="300"] [data-aos].aos-animate {
    transition-delay: 0.3s;
}
[data-aos][data-aos][data-aos-duration="350"],
body[data-aos-duration="350"] [data-aos] {
    transition-duration: 0.35s;
}
[data-aos][data-aos][data-aos-delay="350"],
body[data-aos-delay="350"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="350"].aos-animate,
body[data-aos-delay="350"] [data-aos].aos-animate {
    transition-delay: 0.35s;
}
[data-aos][data-aos][data-aos-duration="400"],
body[data-aos-duration="400"] [data-aos] {
    transition-duration: 0.4s;
}
[data-aos][data-aos][data-aos-delay="400"],
body[data-aos-delay="400"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="400"].aos-animate,
body[data-aos-delay="400"] [data-aos].aos-animate {
    transition-delay: 0.4s;
}
[data-aos][data-aos][data-aos-duration="450"],
body[data-aos-duration="450"] [data-aos] {
    transition-duration: 0.45s;
}
[data-aos][data-aos][data-aos-delay="450"],
body[data-aos-delay="450"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="450"].aos-animate,
body[data-aos-delay="450"] [data-aos].aos-animate {
    transition-delay: 0.45s;
}
[data-aos][data-aos][data-aos-duration="500"],
body[data-aos-duration="500"] [data-aos] {
    transition-duration: 0.5s;
}
[data-aos][data-aos][data-aos-delay="500"],
body[data-aos-delay="500"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="500"].aos-animate,
body[data-aos-delay="500"] [data-aos].aos-animate {
    transition-delay: 0.5s;
}
[data-aos][data-aos][data-aos-duration="550"],
body[data-aos-duration="550"] [data-aos] {
    transition-duration: 0.55s;
}
[data-aos][data-aos][data-aos-delay="550"],
body[data-aos-delay="550"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="550"].aos-animate,
body[data-aos-delay="550"] [data-aos].aos-animate {
    transition-delay: 0.55s;
}
[data-aos][data-aos][data-aos-duration="600"],
body[data-aos-duration="600"] [data-aos] {
    transition-duration: 0.6s;
}
[data-aos][data-aos][data-aos-delay="600"],
body[data-aos-delay="600"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="600"].aos-animate,
body[data-aos-delay="600"] [data-aos].aos-animate {
    transition-delay: 0.6s;
}
[data-aos][data-aos][data-aos-duration="650"],
body[data-aos-duration="650"] [data-aos] {
    transition-duration: 0.65s;
}
[data-aos][data-aos][data-aos-delay="650"],
body[data-aos-delay="650"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="650"].aos-animate,
body[data-aos-delay="650"] [data-aos].aos-animate {
    transition-delay: 0.65s;
}
[data-aos][data-aos][data-aos-duration="700"],
body[data-aos-duration="700"] [data-aos] {
    transition-duration: 0.7s;
}
[data-aos][data-aos][data-aos-delay="700"],
body[data-aos-delay="700"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="700"].aos-animate,
body[data-aos-delay="700"] [data-aos].aos-animate {
    transition-delay: 0.7s;
}
[data-aos][data-aos][data-aos-duration="750"],
body[data-aos-duration="750"] [data-aos] {
    transition-duration: 0.75s;
}
[data-aos][data-aos][data-aos-delay="750"],
body[data-aos-delay="750"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="750"].aos-animate,
body[data-aos-delay="750"] [data-aos].aos-animate {
    transition-delay: 0.75s;
}
[data-aos][data-aos][data-aos-duration="800"],
body[data-aos-duration="800"] [data-aos] {
    transition-duration: 0.8s;
}
[data-aos][data-aos][data-aos-delay="800"],
body[data-aos-delay="800"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="800"].aos-animate,
body[data-aos-delay="800"] [data-aos].aos-animate {
    transition-delay: 0.8s;
}
[data-aos][data-aos][data-aos-duration="850"],
body[data-aos-duration="850"] [data-aos] {
    transition-duration: 0.85s;
}
[data-aos][data-aos][data-aos-delay="850"],
body[data-aos-delay="850"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="850"].aos-animate,
body[data-aos-delay="850"] [data-aos].aos-animate {
    transition-delay: 0.85s;
}
[data-aos][data-aos][data-aos-duration="900"],
body[data-aos-duration="900"] [data-aos] {
    transition-duration: 0.9s;
}
[data-aos][data-aos][data-aos-delay="900"],
body[data-aos-delay="900"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="900"].aos-animate,
body[data-aos-delay="900"] [data-aos].aos-animate {
    transition-delay: 0.9s;
}
[data-aos][data-aos][data-aos-duration="950"],
body[data-aos-duration="950"] [data-aos] {
    transition-duration: 0.95s;
}
[data-aos][data-aos][data-aos-delay="950"],
body[data-aos-delay="950"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="950"].aos-animate,
body[data-aos-delay="950"] [data-aos].aos-animate {
    transition-delay: 0.95s;
}
[data-aos][data-aos][data-aos-duration="1000"],
body[data-aos-duration="1000"] [data-aos] {
    transition-duration: 1s;
}
[data-aos][data-aos][data-aos-delay="1000"],
body[data-aos-delay="1000"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1000"].aos-animate,
body[data-aos-delay="1000"] [data-aos].aos-animate {
    transition-delay: 1s;
}
[data-aos][data-aos][data-aos-duration="1050"],
body[data-aos-duration="1050"] [data-aos] {
    transition-duration: 1.05s;
}
[data-aos][data-aos][data-aos-delay="1050"],
body[data-aos-delay="1050"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1050"].aos-animate,
body[data-aos-delay="1050"] [data-aos].aos-animate {
    transition-delay: 1.05s;
}
[data-aos][data-aos][data-aos-duration="1100"],
body[data-aos-duration="1100"] [data-aos] {
    transition-duration: 1.1s;
}
[data-aos][data-aos][data-aos-delay="1100"],
body[data-aos-delay="1100"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1100"].aos-animate,
body[data-aos-delay="1100"] [data-aos].aos-animate {
    transition-delay: 1.1s;
}
[data-aos][data-aos][data-aos-duration="1150"],
body[data-aos-duration="1150"] [data-aos] {
    transition-duration: 1.15s;
}
[data-aos][data-aos][data-aos-delay="1150"],
body[data-aos-delay="1150"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1150"].aos-animate,
body[data-aos-delay="1150"] [data-aos].aos-animate {
    transition-delay: 1.15s;
}
[data-aos][data-aos][data-aos-duration="1200"],
body[data-aos-duration="1200"] [data-aos] {
    transition-duration: 1.2s;
}
[data-aos][data-aos][data-aos-delay="1200"],
body[data-aos-delay="1200"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1200"].aos-animate,
body[data-aos-delay="1200"] [data-aos].aos-animate {
    transition-delay: 1.2s;
}
[data-aos][data-aos][data-aos-duration="1250"],
body[data-aos-duration="1250"] [data-aos] {
    transition-duration: 1.25s;
}
[data-aos][data-aos][data-aos-delay="1250"],
body[data-aos-delay="1250"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1250"].aos-animate,
body[data-aos-delay="1250"] [data-aos].aos-animate {
    transition-delay: 1.25s;
}
[data-aos][data-aos][data-aos-duration="1300"],
body[data-aos-duration="1300"] [data-aos] {
    transition-duration: 1.3s;
}
[data-aos][data-aos][data-aos-delay="1300"],
body[data-aos-delay="1300"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1300"].aos-animate,
body[data-aos-delay="1300"] [data-aos].aos-animate {
    transition-delay: 1.3s;
}
[data-aos][data-aos][data-aos-duration="1350"],
body[data-aos-duration="1350"] [data-aos] {
    transition-duration: 1.35s;
}
[data-aos][data-aos][data-aos-delay="1350"],
body[data-aos-delay="1350"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1350"].aos-animate,
body[data-aos-delay="1350"] [data-aos].aos-animate {
    transition-delay: 1.35s;
}
[data-aos][data-aos][data-aos-duration="1400"],
body[data-aos-duration="1400"] [data-aos] {
    transition-duration: 1.4s;
}
[data-aos][data-aos][data-aos-delay="1400"],
body[data-aos-delay="1400"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1400"].aos-animate,
body[data-aos-delay="1400"] [data-aos].aos-animate {
    transition-delay: 1.4s;
}
[data-aos][data-aos][data-aos-duration="1450"],
body[data-aos-duration="1450"] [data-aos] {
    transition-duration: 1.45s;
}
[data-aos][data-aos][data-aos-delay="1450"],
body[data-aos-delay="1450"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1450"].aos-animate,
body[data-aos-delay="1450"] [data-aos].aos-animate {
    transition-delay: 1.45s;
}
[data-aos][data-aos][data-aos-duration="1500"],
body[data-aos-duration="1500"] [data-aos] {
    transition-duration: 1.5s;
}
[data-aos][data-aos][data-aos-delay="1500"],
body[data-aos-delay="1500"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1500"].aos-animate,
body[data-aos-delay="1500"] [data-aos].aos-animate {
    transition-delay: 1.5s;
}
[data-aos][data-aos][data-aos-duration="1550"],
body[data-aos-duration="1550"] [data-aos] {
    transition-duration: 1.55s;
}
[data-aos][data-aos][data-aos-delay="1550"],
body[data-aos-delay="1550"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1550"].aos-animate,
body[data-aos-delay="1550"] [data-aos].aos-animate {
    transition-delay: 1.55s;
}
[data-aos][data-aos][data-aos-duration="1600"],
body[data-aos-duration="1600"] [data-aos] {
    transition-duration: 1.6s;
}
[data-aos][data-aos][data-aos-delay="1600"],
body[data-aos-delay="1600"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1600"].aos-animate,
body[data-aos-delay="1600"] [data-aos].aos-animate {
    transition-delay: 1.6s;
}
[data-aos][data-aos][data-aos-duration="1650"],
body[data-aos-duration="1650"] [data-aos] {
    transition-duration: 1.65s;
}
[data-aos][data-aos][data-aos-delay="1650"],
body[data-aos-delay="1650"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1650"].aos-animate,
body[data-aos-delay="1650"] [data-aos].aos-animate {
    transition-delay: 1.65s;
}
[data-aos][data-aos][data-aos-duration="1700"],
body[data-aos-duration="1700"] [data-aos] {
    transition-duration: 1.7s;
}
[data-aos][data-aos][data-aos-delay="1700"],
body[data-aos-delay="1700"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1700"].aos-animate,
body[data-aos-delay="1700"] [data-aos].aos-animate {
    transition-delay: 1.7s;
}
[data-aos][data-aos][data-aos-duration="1750"],
body[data-aos-duration="1750"] [data-aos] {
    transition-duration: 1.75s;
}
[data-aos][data-aos][data-aos-delay="1750"],
body[data-aos-delay="1750"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1750"].aos-animate,
body[data-aos-delay="1750"] [data-aos].aos-animate {
    transition-delay: 1.75s;
}
[data-aos][data-aos][data-aos-duration="1800"],
body[data-aos-duration="1800"] [data-aos] {
    transition-duration: 1.8s;
}
[data-aos][data-aos][data-aos-delay="1800"],
body[data-aos-delay="1800"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1800"].aos-animate,
body[data-aos-delay="1800"] [data-aos].aos-animate {
    transition-delay: 1.8s;
}
[data-aos][data-aos][data-aos-duration="1850"],
body[data-aos-duration="1850"] [data-aos] {
    transition-duration: 1.85s;
}
[data-aos][data-aos][data-aos-delay="1850"],
body[data-aos-delay="1850"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1850"].aos-animate,
body[data-aos-delay="1850"] [data-aos].aos-animate {
    transition-delay: 1.85s;
}
[data-aos][data-aos][data-aos-duration="1900"],
body[data-aos-duration="1900"] [data-aos] {
    transition-duration: 1.9s;
}
[data-aos][data-aos][data-aos-delay="1900"],
body[data-aos-delay="1900"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1900"].aos-animate,
body[data-aos-delay="1900"] [data-aos].aos-animate {
    transition-delay: 1.9s;
}
[data-aos][data-aos][data-aos-duration="1950"],
body[data-aos-duration="1950"] [data-aos] {
    transition-duration: 1.95s;
}
[data-aos][data-aos][data-aos-delay="1950"],
body[data-aos-delay="1950"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="1950"].aos-animate,
body[data-aos-delay="1950"] [data-aos].aos-animate {
    transition-delay: 1.95s;
}
[data-aos][data-aos][data-aos-duration="2000"],
body[data-aos-duration="2000"] [data-aos] {
    transition-duration: 2s;
}
[data-aos][data-aos][data-aos-delay="2000"],
body[data-aos-delay="2000"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2000"].aos-animate,
body[data-aos-delay="2000"] [data-aos].aos-animate {
    transition-delay: 2s;
}
[data-aos][data-aos][data-aos-duration="2050"],
body[data-aos-duration="2050"] [data-aos] {
    transition-duration: 2.05s;
}
[data-aos][data-aos][data-aos-delay="2050"],
body[data-aos-delay="2050"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2050"].aos-animate,
body[data-aos-delay="2050"] [data-aos].aos-animate {
    transition-delay: 2.05s;
}
[data-aos][data-aos][data-aos-duration="2100"],
body[data-aos-duration="2100"] [data-aos] {
    transition-duration: 2.1s;
}
[data-aos][data-aos][data-aos-delay="2100"],
body[data-aos-delay="2100"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2100"].aos-animate,
body[data-aos-delay="2100"] [data-aos].aos-animate {
    transition-delay: 2.1s;
}
[data-aos][data-aos][data-aos-duration="2150"],
body[data-aos-duration="2150"] [data-aos] {
    transition-duration: 2.15s;
}
[data-aos][data-aos][data-aos-delay="2150"],
body[data-aos-delay="2150"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2150"].aos-animate,
body[data-aos-delay="2150"] [data-aos].aos-animate {
    transition-delay: 2.15s;
}
[data-aos][data-aos][data-aos-duration="2200"],
body[data-aos-duration="2200"] [data-aos] {
    transition-duration: 2.2s;
}
[data-aos][data-aos][data-aos-delay="2200"],
body[data-aos-delay="2200"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2200"].aos-animate,
body[data-aos-delay="2200"] [data-aos].aos-animate {
    transition-delay: 2.2s;
}
[data-aos][data-aos][data-aos-duration="2250"],
body[data-aos-duration="2250"] [data-aos] {
    transition-duration: 2.25s;
}
[data-aos][data-aos][data-aos-delay="2250"],
body[data-aos-delay="2250"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2250"].aos-animate,
body[data-aos-delay="2250"] [data-aos].aos-animate {
    transition-delay: 2.25s;
}
[data-aos][data-aos][data-aos-duration="2300"],
body[data-aos-duration="2300"] [data-aos] {
    transition-duration: 2.3s;
}
[data-aos][data-aos][data-aos-delay="2300"],
body[data-aos-delay="2300"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2300"].aos-animate,
body[data-aos-delay="2300"] [data-aos].aos-animate {
    transition-delay: 2.3s;
}
[data-aos][data-aos][data-aos-duration="2350"],
body[data-aos-duration="2350"] [data-aos] {
    transition-duration: 2.35s;
}
[data-aos][data-aos][data-aos-delay="2350"],
body[data-aos-delay="2350"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2350"].aos-animate,
body[data-aos-delay="2350"] [data-aos].aos-animate {
    transition-delay: 2.35s;
}
[data-aos][data-aos][data-aos-duration="2400"],
body[data-aos-duration="2400"] [data-aos] {
    transition-duration: 2.4s;
}
[data-aos][data-aos][data-aos-delay="2400"],
body[data-aos-delay="2400"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2400"].aos-animate,
body[data-aos-delay="2400"] [data-aos].aos-animate {
    transition-delay: 2.4s;
}
[data-aos][data-aos][data-aos-duration="2450"],
body[data-aos-duration="2450"] [data-aos] {
    transition-duration: 2.45s;
}
[data-aos][data-aos][data-aos-delay="2450"],
body[data-aos-delay="2450"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2450"].aos-animate,
body[data-aos-delay="2450"] [data-aos].aos-animate {
    transition-delay: 2.45s;
}
[data-aos][data-aos][data-aos-duration="2500"],
body[data-aos-duration="2500"] [data-aos] {
    transition-duration: 2.5s;
}
[data-aos][data-aos][data-aos-delay="2500"],
body[data-aos-delay="2500"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2500"].aos-animate,
body[data-aos-delay="2500"] [data-aos].aos-animate {
    transition-delay: 2.5s;
}
[data-aos][data-aos][data-aos-duration="2550"],
body[data-aos-duration="2550"] [data-aos] {
    transition-duration: 2.55s;
}
[data-aos][data-aos][data-aos-delay="2550"],
body[data-aos-delay="2550"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2550"].aos-animate,
body[data-aos-delay="2550"] [data-aos].aos-animate {
    transition-delay: 2.55s;
}
[data-aos][data-aos][data-aos-duration="2600"],
body[data-aos-duration="2600"] [data-aos] {
    transition-duration: 2.6s;
}
[data-aos][data-aos][data-aos-delay="2600"],
body[data-aos-delay="2600"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2600"].aos-animate,
body[data-aos-delay="2600"] [data-aos].aos-animate {
    transition-delay: 2.6s;
}
[data-aos][data-aos][data-aos-duration="2650"],
body[data-aos-duration="2650"] [data-aos] {
    transition-duration: 2.65s;
}
[data-aos][data-aos][data-aos-delay="2650"],
body[data-aos-delay="2650"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2650"].aos-animate,
body[data-aos-delay="2650"] [data-aos].aos-animate {
    transition-delay: 2.65s;
}
[data-aos][data-aos][data-aos-duration="2700"],
body[data-aos-duration="2700"] [data-aos] {
    transition-duration: 2.7s;
}
[data-aos][data-aos][data-aos-delay="2700"],
body[data-aos-delay="2700"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2700"].aos-animate,
body[data-aos-delay="2700"] [data-aos].aos-animate {
    transition-delay: 2.7s;
}
[data-aos][data-aos][data-aos-duration="2750"],
body[data-aos-duration="2750"] [data-aos] {
    transition-duration: 2.75s;
}
[data-aos][data-aos][data-aos-delay="2750"],
body[data-aos-delay="2750"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2750"].aos-animate,
body[data-aos-delay="2750"] [data-aos].aos-animate {
    transition-delay: 2.75s;
}
[data-aos][data-aos][data-aos-duration="2800"],
body[data-aos-duration="2800"] [data-aos] {
    transition-duration: 2.8s;
}
[data-aos][data-aos][data-aos-delay="2800"],
body[data-aos-delay="2800"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2800"].aos-animate,
body[data-aos-delay="2800"] [data-aos].aos-animate {
    transition-delay: 2.8s;
}
[data-aos][data-aos][data-aos-duration="2850"],
body[data-aos-duration="2850"] [data-aos] {
    transition-duration: 2.85s;
}
[data-aos][data-aos][data-aos-delay="2850"],
body[data-aos-delay="2850"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2850"].aos-animate,
body[data-aos-delay="2850"] [data-aos].aos-animate {
    transition-delay: 2.85s;
}
[data-aos][data-aos][data-aos-duration="2900"],
body[data-aos-duration="2900"] [data-aos] {
    transition-duration: 2.9s;
}
[data-aos][data-aos][data-aos-delay="2900"],
body[data-aos-delay="2900"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2900"].aos-animate,
body[data-aos-delay="2900"] [data-aos].aos-animate {
    transition-delay: 2.9s;
}
[data-aos][data-aos][data-aos-duration="2950"],
body[data-aos-duration="2950"] [data-aos] {
    transition-duration: 2.95s;
}
[data-aos][data-aos][data-aos-delay="2950"],
body[data-aos-delay="2950"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="2950"].aos-animate,
body[data-aos-delay="2950"] [data-aos].aos-animate {
    transition-delay: 2.95s;
}
[data-aos][data-aos][data-aos-duration="3000"],
body[data-aos-duration="3000"] [data-aos] {
    transition-duration: 3s;
}
[data-aos][data-aos][data-aos-delay="3000"],
body[data-aos-delay="3000"] [data-aos] {
    transition-delay: 0;
}
[data-aos][data-aos][data-aos-delay="3000"].aos-animate,
body[data-aos-delay="3000"] [data-aos].aos-animate {
    transition-delay: 3s;
}
[data-aos][data-aos][data-aos-easing="linear"],
body[data-aos-easing="linear"] [data-aos] {
    transition-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
[data-aos][data-aos][data-aos-easing="ease"],
body[data-aos-easing="ease"] [data-aos] {
    transition-timing-function: ease;
}
[data-aos][data-aos][data-aos-easing="ease-in"],
body[data-aos-easing="ease-in"] [data-aos] {
    transition-timing-function: ease-in;
}
[data-aos][data-aos][data-aos-easing="ease-out"],
body[data-aos-easing="ease-out"] [data-aos] {
    transition-timing-function: ease-out;
}
[data-aos][data-aos][data-aos-easing="ease-in-out"],
body[data-aos-easing="ease-in-out"] [data-aos] {
    transition-timing-function: ease-in-out;
}
[data-aos][data-aos][data-aos-easing="ease-in-back"],
body[data-aos-easing="ease-in-back"] [data-aos] {
    transition-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
}
[data-aos][data-aos][data-aos-easing="ease-out-back"],
body[data-aos-easing="ease-out-back"] [data-aos] {
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
[data-aos][data-aos][data-aos-easing="ease-in-out-back"],
body[data-aos-easing="ease-in-out-back"] [data-aos] {
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
[data-aos][data-aos][data-aos-easing="ease-in-sine"],
body[data-aos-easing="ease-in-sine"] [data-aos] {
    transition-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
}
[data-aos][data-aos][data-aos-easing="ease-out-sine"],
body[data-aos-easing="ease-out-sine"] [data-aos] {
    transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
}
[data-aos][data-aos][data-aos-easing="ease-in-out-sine"],
body[data-aos-easing="ease-in-out-sine"] [data-aos] {
    transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
[data-aos][data-aos][data-aos-easing="ease-in-quad"],
body[data-aos-easing="ease-in-quad"] [data-aos] {
    transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
[data-aos][data-aos][data-aos-easing="ease-out-quad"],
body[data-aos-easing="ease-out-quad"] [data-aos] {
    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
[data-aos][data-aos][data-aos-easing="ease-in-out-quad"],
body[data-aos-easing="ease-in-out-quad"] [data-aos] {
    transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
[data-aos][data-aos][data-aos-easing="ease-in-cubic"],
body[data-aos-easing="ease-in-cubic"] [data-aos] {
    transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
[data-aos][data-aos][data-aos-easing="ease-out-cubic"],
body[data-aos-easing="ease-out-cubic"] [data-aos] {
    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
[data-aos][data-aos][data-aos-easing="ease-in-out-cubic"],
body[data-aos-easing="ease-in-out-cubic"] [data-aos] {
    transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
[data-aos][data-aos][data-aos-easing="ease-in-quart"],
body[data-aos-easing="ease-in-quart"] [data-aos] {
    transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
[data-aos][data-aos][data-aos-easing="ease-out-quart"],
body[data-aos-easing="ease-out-quart"] [data-aos] {
    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
[data-aos][data-aos][data-aos-easing="ease-in-out-quart"],
body[data-aos-easing="ease-in-out-quart"] [data-aos] {
    transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
[data-aos^="fade"][data-aos^="fade"] {
    opacity: 0;
    transition-property: opacity, transform;
}
[data-aos^="fade"][data-aos^="fade"].aos-animate {
    opacity: 1;
    transform: translateZ(0);
}
[data-aos="fade-up"] {
    transform: translate3d(0, 100px, 0);
}
[data-aos="fade-down"] {
    transform: translate3d(0, -100px, 0);
}
[data-aos="fade-right"] {
    transform: translate3d(-100px, 0, 0);
}
[data-aos="fade-left"] {
    transform: translate3d(100px, 0, 0);
}
[data-aos="fade-up-right"] {
    transform: translate3d(-100px, 100px, 0);
}
[data-aos="fade-up-left"] {
    transform: translate3d(100px, 100px, 0);
}
[data-aos="fade-down-right"] {
    transform: translate3d(-100px, -100px, 0);
}
[data-aos="fade-down-left"] {
    transform: translate3d(100px, -100px, 0);
}
[data-aos^="zoom"][data-aos^="zoom"] {
    opacity: 0;
    transition-property: opacity, transform;
}
[data-aos^="zoom"][data-aos^="zoom"].aos-animate {
    opacity: 1;
    transform: translateZ(0) scale(1);
}
[data-aos="zoom-in"] {
    transform: scale(0.6);
}
[data-aos="zoom-in-up"] {
    transform: translate3d(0, 100px, 0) scale(0.6);
}
[data-aos="zoom-in-down"] {
    transform: translate3d(0, -100px, 0) scale(0.6);
}
[data-aos="zoom-in-right"] {
    transform: translate3d(-100px, 0, 0) scale(0.6);
}
[data-aos="zoom-in-left"] {
    transform: translate3d(100px, 0, 0) scale(0.6);
}
[data-aos="zoom-out"] {
    transform: scale(1.2);
}
[data-aos="zoom-out-up"] {
    transform: translate3d(0, 100px, 0) scale(1.2);
}
[data-aos="zoom-out-down"] {
    transform: translate3d(0, -100px, 0) scale(1.2);
}
[data-aos="zoom-out-right"] {
    transform: translate3d(-100px, 0, 0) scale(1.2);
}
[data-aos="zoom-out-left"] {
    transform: translate3d(100px, 0, 0) scale(1.2);
}
[data-aos^="slide"][data-aos^="slide"] {
    transition-property: transform;
}
[data-aos^="slide"][data-aos^="slide"].aos-animate {
    transform: translateZ(0);
}
[data-aos="slide-up"] {
    transform: translate3d(0, 100%, 0);
}
[data-aos="slide-down"] {
    transform: translate3d(0, -100%, 0);
}
[data-aos="slide-right"] {
    transform: translate3d(-100%, 0, 0);
}
[data-aos="slide-left"] {
    transform: translate3d(100%, 0, 0);
}
[data-aos^="flip"][data-aos^="flip"] {
    backface-visibility: hidden;
    transition-property: transform;
}
[data-aos="flip-left"] {
    transform: perspective(2500px) rotateY(-100deg);
}
[data-aos="flip-left"].aos-animate {
    transform: perspective(2500px) rotateY(0);
}
[data-aos="flip-right"] {
    transform: perspective(2500px) rotateY(100deg);
}
[data-aos="flip-right"].aos-animate {
    transform: perspective(2500px) rotateY(0);
}
[data-aos="flip-up"] {
    transform: perspective(2500px) rotateX(-100deg);
}
[data-aos="flip-up"].aos-animate {
    transform: perspective(2500px) rotateX(0);
}
[data-aos="flip-down"] {
    transform: perspective(2500px) rotateX(100deg);
}
[data-aos="flip-down"].aos-animate {
    transform: perspective(2500px) rotateX(0);
}

@media (min-width: 992px) {
    .dropdown-menu-lg-start[data-bs-popper] {
        right: 0 !important;
        left: unset !important;
    }

    .dropdown-menu-lg-center[data-bs-popper] {
        left: -50% !important;
        transform: translateX(-50%) !important;
    }
}

.e-com .card .card-header a.active {
    background-color: #f54952;
}

.e-com .card .card-header a.active img:first-child {
    display: none;
}
.e-com .card .card-header a.active img:last-child {
    display: block;
}

.e-com .card .card-header a.active:hover {
    background-color: #fff;
}
.e-com .card .card-header a.active:hover img:first-child {
    display: block;
}
.e-com .card .card-header a.active:hover img:last-child {
    display: none;
}
.e-com .card.e-card {
  overflow: hidden
}
  
.e-com .card.e-card .offer,.tyre-detail-offer-percentage {
  background-color: #5a3795;
  color: #fff
}
  
.e-com .card.e-card:hover {
  border: 2px solid #5a3795
}

.user-customise a.active {
    background-color: #f54952;
}

.user-customise a.active img:first-child {
    display: none;
}
.user-customise a.active img:last-child {
    display: block;
}

.user-customise a.active:hover {
    background-color: #fff;
}
.user-customise a.active:hover img:first-child {
    display: block;
}
.user-customise a.active:hover img:last-child {
    display: none;
}

.product-tyre-finder {
    background-image: url(/images/tyre-finder-bg.jpg?1b8fe26f9231d58cd9b86a1bc7621535);
    background-size: auto;
    background-repeat: no-repeat;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    width: 100%;
}

.overflow-auto-x {
    overflow-x: auto !important;
}

#productcards::before {
    content: "";
    display: block;
    height: 25px;
    margin-top: -25px;
    visibility: hidden;
}

.blog-details img {
    max-width: 100%;
    height: auto;
}

.cart-count {
    position: absolute;
    top: -9px;
    right: -14px;
    z-index: 2;
    font-size: 11px;
    border-radius: 50%;
    background: var(--blue-30);
    width: 16px;
    height: 16px;
    line-height: 16px;
    display: block;
    text-align: center;
    color: white;
    font-family: "Roboto", sans-serif;
    font-weight: bold;
}

.compare-count {
    position: absolute;
    top: 6px;
    right: 10px;
    z-index: 2;
    font-size: 11px;
    border-radius: 50%;
    background: red;
    width: 16px;
    height: 16px;
    line-height: 16px;
    display: block;
    text-align: center;
    color: white;
    font-family: "Roboto", sans-serif;
    font-weight: bold;
}

.compare-battery-button {
    bottom: 30%;
    z-index: 99;
}

.compare-tyre-button {
    bottom: 40%;
    z-index: 99;
}

.btn-group-xs > .btn,
.btn-group-xs > .btn,
.btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}
@media (max-width: 767px) {
    .service_cards {
        transform: scale(0.6);
        height: 90px !important;
    }
    .skewed_card {
        left: -14px;
    }
}
@media (min-width: 768px) and (max-width: 992px) {
    .service_cards {
        height: 120px !important;
        transform: scale(0.6);
    }
}

@media (min-width: 993px) and (max-width: 1200px) {
    .service_cards {
        transform: scale(0.7);
        height: 150px;
    }
}
@media (max-width: 767px) {
    .e-com .service-offer::before {
        font-size: 12px !important;
    }
}
@media (min-width: 768px) {
    .map_locaitons {
        position: absolute;
    }
}

.show_image {
    width: 400px;
    height: 400px;
}

.small-img {
    width: 350px;
    height: 70px;
    margin-top: 10px;
    position: relative;
    left: 25px;
}

.small-img .icon-left,
.small-img .icon-right {
    width: 12px;
    height: 24px;
    cursor: pointer;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
}

.small-img .icon-left {
    transform: rotate(180deg);
}

.small-img .icon-right {
    right: 0;
}

.small-img .icon-left:hover,
.small-img .icon-right:hover {
    opacity: 0.5;
}

.small-container {
    width: 310px;
    height: 70px;
    overflow: hidden;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.small-container div {
    width: 800%;
    position: relative;
}

.small-container .show-small-img {
    width: 70px;
    height: 70px;
    margin-right: 6px;
    cursor: pointer;
    float: left;
    border: 1px solid #cacaca;
}

.small-container .show-small-img:last-of-type {
    margin-right: 0;
}

.second_offer {
    bottom: -10%;
}

@media (max-width: 767px) {
    .second_offer_text {
        font-size: 12px !important;
    }

    .fs-sm-10 {
        font-size: 10px !important;
    }
    .fs-sm-12 {
        font-size: 12px !important;
    }

    .call_avail_button {
        padding: 10px 13px 10px 13px;
    }
}

.fs-12 {
    font-size: 12px !important;
}

.warranty_text {
    top: -12px;
}

.warranty_text_battery {
    bottom: 180px;
    right: 15px;
}

.warranty_image_mob {
    top: -8.6rem;
    left: 0rem;
    position: absolute !important;
    float: left;
}

.second_offer_desktop {
    right: -16px !important;
}

.pos-abs {
    padding-bottom: 300px;
}

.pos-abs-battery {
    padding-bottom: 14.6rem !important;
}


.custom-arrow {
    position: absolute;
    top: 37%;
    transform: translateY(-50%);
    z-index: 10;
    background-color: rgba(0, 0, 0, 0);
    border: none;
    color: #f1ecec;
    /* padding: 20px 10px 20px 10px; */
}

.carousel-control-prev.custom-arrow {
    left: -8px;
}

.carousel-control-next.custom-arrow {
    right: -8px;
}

.custom-arrow i {
    font-size: 40px;
}

@media (max-width: 768px) {
.custom-arrow i {
    font-size: 25px;
}
}
@media (max-width: 576px) {
.custom-arrow i {
    font-size: 18px;
}
}
#banner .custom-arrow {
opacity: 0;
transform: translateX(-10px); /* Move slightly to the left for prev */
transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

#banner .custom-arrow.carousel-control-next {
    transform: translateX(10px); /* Move slightly to the right for next */
}

#banner:hover .custom-arrow {
    opacity: 1;
    transform: translateX(0); /* Reset position on hover */
}

.s-icon-shadow {
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.5));
}

/* Hide arrows by default */
.scroll-btn {
    opacity: 0;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

/* Show arrows on hover */
.scroll-btn {
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    border: none;
    color: white;
    padding: 3px;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.5));
}

.scrollToTop {
    width: 50px;
    height: 50px;
    line-height: 30px;
    text-align: center;
    position: fixed;
    bottom: 112px;
    right: 5px;
    z-index: 999;
    display: flex;
}

.phone-icon {
    width: 50px;
    height: 50px;
    line-height: 30px;
    text-align: center;
    position: fixed;
    bottom: 58px;
    z-index: 999;
    display: flex;
    right: 5px !important;
}
.discount-offer-price {
    display: flex;
}

.clr_vlt {
    color:#7a2cff;
}

.tyre-detail-warranty {
    position: absolute;
    right: 0;
    top: 50%;
}

.tyre-detail-search-size {
    color: #f54952;
    text-decoration: underline;
}

.tyre-detail-search-size:hover {
    color: #f54952;
    text-decoration: underline;
}

@font-face {
    font-family: 'UAESymbol';
    src: url('/fonts/uae-symbol/font.woff2') format('woff2'),
         url('/fonts/uae-symbol/font.woff') format('woff'),
         url('/fonts/uae-symbol/font.ttf') format('truetype');
}

.dirham-symbol-bold {
    font-family: 'UAESymbol', sans-serif;
    font-size: inherit;
    color: inherit;
    font-weight: bold;
    vertical-align: top;
}

.dirham-symbol {
    font-family: 'UAESymbol', sans-serif;
    font-size: inherit;
    color: inherit;
    vertical-align: top;
}