1#@!#!123s

ALWAYS HENGHENG888 1#@!#!123s
: / var / www / smartweb / priyoholidays.com / src / styles / scss /
Filename : app.scss
back
@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';


@layer base {
  * {
    @apply scroll-smooth font-poppins font-normal;
  }

  .font-bangla, .font-bengali {
    @apply font-kalpurush
  }
}


.container {
  @apply mx-auto px-2.5 md:px-4 lg:px-6 xl:px-8;
}

/* Container */
.mx-container {
  @apply mx-auto px-4 lg:px-8 xl:px-16;
}

.hx-container {
  @apply mx-4;
}

@media (min-width: 1290px) {
  .hx-container {
    @apply mx-[24px];
  }
}

@media (min-width: 1330px) {
  .hx-container {
    @apply mx-[46px];
  }
}

@media (min-width: 1370px) {
  .hx-container {
    @apply mx-[68px];
  }
}

@media (min-width: 1410px) {
  .hx-container {
    @apply mx-[90px];
  }
}

@media (min-width: 1450px) {
  .hx-container {
    @apply mx-[112px];
  }
}

@media (min-width: 1490px) {
  .hx-container {
    @apply mx-[134px];
  }
}

@media (min-width: 1530px) {
  .hx-container {
    @apply mx-[156px];
  }
}

@media (min-width: 1570px) {
  .hx-container {
    @apply mx-[178px];
  }
}

@media (min-width: 1610px) {
  .hx-container {
    @apply mx-[200px];
  }
}

@media (min-width: 1650px) {
  .hx-container {
    @apply w-[70%] mx-auto px-4;
  }
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

/* Components */

.link-primary {
  @apply font-semibold text-primary hover:text-primary-dark transition-colors hover:underline;
}

.fade-in-up {
  @apply visible opacity-0 transform translate-y-5;
  animation: fadeInUp 0.8s ease-in-out forwards;
}

.cshape {
  @apply absolute -inset-6 animate-spin-slow w-[calc(100%+46px)] h-[calc(100%+46px)] rounded-full border border-primary-light;
}

.cshape.sbtm::before {
  @apply absolute -bottom-[10px] right-1/2 w-[18px] h-[18px] rounded-full bg-primary;
  content: '';
}

.cshape.sbtm::after {
  @apply absolute -bottom-[10px] right-1/2 w-[18px] h-[18px] rounded-full bg-primary-light animate-ping;
  content: '';
}

.cshape.sleft::before {
  @apply absolute top-1/2 -left-[10px] w-[18px] h-[18px] rounded-full bg-primary;
  content: '';
}

.cshape.sleft::after {
  @apply absolute top-1/2 -left-[10px] w-[18px] h-[18px] rounded-full bg-primary-light animate-ping;
  content: '';
}

.cshape.stop::before {
  @apply absolute -top-[10px] right-1/2 w-[18px] h-[18px] rounded-full bg-primary;
  content: '';
}

.cshape.stop::after {
  @apply absolute -top-[10px] right-1/2 w-[18px] h-[18px] rounded-full bg-primary-light animate-ping;
  content: '';
}

.cshape.sright::before {
  @apply absolute top-1/2 -right-[10px] w-[18px] h-[18px] rounded-full bg-primary;
  content: '';
}

.cshape.sright::after {
  @apply absolute top-1/2 -right-[10px] w-[18px] h-[18px] rounded-full bg-primary-light animate-ping;
  content: '';
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(-20px);
  }
}

@keyframes slide {
  0%,
  100% {
    transform: translatex(-15%);
  }
  50% {
    transform: none;
  }
}

.animate-slide {
  animation: slide 4s ease-out infinite forwards;
}