@tailwind base;
@tailwind components;
@tailwind utilities;
@layer components {
  @font-face {
    font-family: Baskerville400angka;
    src: url("./font/Baskervville/libre-baskerville.regular.ttf");
  }
  @font-face {
    font-family: Baskerville400;
    src: url("./font/Baskervville/Baskervville-Regular.ttf");
  }
  .ff-Baskerville400-angka {
    font-family: "Baskerville400angka";
  }
  .ff-Baskerville400 {
    font-family: "Baskerville400";
  }
  @font-face {
    font-family: PotantoSans400;
    src: url("./font/Pontano_Sans/PontanoSans-Regular.ttf");
  }
  .ff-PotantoSans400 {
    font-family: "PotantoSans400";
  }
  @font-face {
    font-family: GenomeReguler;
    src: url("./font/Genome-Font-Family/Genome Regular.otf");
  }
  .ff-GenomeReguler {
    font-family: "GenomeReguler";
  }
  @font-face {
    font-family: GenomeBO;
    src: url("./font/Genome-Font-Family/Genome Bold Oblique.otf");
  }

  @font-face {
    font-family: GenomeB;
    src: url("./font/Genome-Font-Family/Genome Bold.otf");
  }
  .ff-GenomeBO {
    font-family: "GenomeBO";
  }
  @font-face {
    font-family: GenomeDBO;
    src: url("./font/Genome-Font-Family/Genome Demi Bold Oblique.otf");
  }

  @font-face {
    font-family: GenomeDB;
    src: url("./font/Genome-Font-Family/Genome Demi Bold.otf");
  }
  .ff-GenomeDB {
    font-family: "GenomeDB";
  }
  @font-face {
    font-family: GenomeLO;
    src: url("./font/Genome-Font-Family/Genome Light Oblique.otf");
  }

  @font-face {
    font-family: GenomeL;
    src: url("./font/Genome-Font-Family/Genome Light.otf");
  }
  @font-face {
    font-family: GenomeThin;
    src: url("./font/genome/Genome-Thin.otf");
  }
  /*  */
  .ff-GenomeThin {
    font-family: "GenomeThin";
  }
  .ff-GenomeL {
    font-family: "GenomeL";
  }
  @font-face {
    font-family: GenomeMO;
    src: url("./font/Genome-Font-Family/Genome Medium Oblique.otf");
  }
  @font-face {
    font-family: GenomeM;
    src: url("./font/Genome-Font-Family/Genome Medium.otf");
  }
  .ff-GenomeM {
    font-family: "GenomeM";
  }
  @font-face {
    font-family: GenomeRO;
    src: url("./font/Genome-Font-Family/Genome Regular Oblique.otf");
  }
  /* italic */
  .ff-GenomeDBO {
    font-family: "GenomeDBO";
  }
  /* italic */
  .ff-GenomeBO {
    font-family: "GenomeBO";
  }
  /* italic */
  .ff-GenomeLO {
    font-family: "GenomeLO";
  }
  /* italic */
  .ff-GenomeMO {
    font-family: "GenomeMO";
  }
  /* italic */
  .ff-GenomeRO {
    font-family: "GenomeRO";
  }
}
html {
  scroll-behavior: smooth !important;
}
.swiper-button-next:after,
.swiper-button-prev:after {
  font-family: none !important;
  content: "" !important;
}

.mySwiper .swiper-button-next {
  right: -1.5rem !important;
  width: 48px !important;
}
.mySwiper .swiper-button-prev {
  width: 48px !important;
  left: -1.5rem !important;
}
/* 
.mySwiper2 .swiper-button-next,
.mySwiper2 .swiper-button-prev {
  top: 30% !important;
} */

.mySwiper2 .swiper-button-next,
.mySwiper2 .swiper-button-next img {
  right: -0.2rem !important;
  width: 32px !important;
}

.mySwiper2 .swiper-button-prev,
.mySwiper2 .swiper-button-prev img {
  width: 32px !important;
  left: -0.2rem !important;
}
@media (min-width: 640px) {
  .mySwiper2 .swiper-button-next,
  .mySwiper2 .swiper-button-next img {
    width: 40px !important;
    right: -1.3rem !important;
  }
  .mySwiper2 .swiper-button-prev,
  .mySwiper2 .swiper-button-prev img {
    width: 40px !important;
    left: -1.5rem !important;
  }
}

@media (min-width: 1024px) {
  .mySwiper2 .swiper-button-next,
  .mySwiper2 .swiper-button-next img {
    right: -1.5rem !important;
    width: 48px !important;
  }
  .mySwiper2 .swiper-button-prev,
  .mySwiper2 .swiper-button-prev img {
    width: 48px !important;
  }
}

.swiper-pagination-bullet-active {
  background-color: #1b1a1a !important;
}