@font-face {
    font-family: 'Roboto Variable';
    src: url('../fonts/Roboto-VariableFont_wdth,wght.ttf') format('truetype-variations');
    font-weight: 100 900; 
    font-stretch: 75% 100%; 
    font-style: normal;
}


@font-face {
    font-family: 'Roboto Variable';
    src: url('../fonts/Roboto-Italic-VariableFont_wdth,wght.ttf') format('truetype-variations');
    font-weight: 100 900;
    font-stretch: 75% 100%;
    font-style: italic;
}

@font-face {
    font-family: 'Playwrite ID';
    src: url('../fonts/PlaywriteID-VariableFont_wght.ttf') format('truetype-variations');
    font-weight: 100 400;
    font-style: normal;
}


* {
  font-family: 'Roboto Variable', sans-serif;
  scroll-behavior: smooth;
}

.cursive-text {
    font-family: 'Playwrite ID', cursive;
}


.curly-font{
  font-family: 'Cookie', cursive !important;
}

.my-container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  box-sizing: border-box; 
}

/*splide */
.splide__arrow {
  width: 2.75rem !important;
  height: 2.75rem !important;
  border-radius: 9999px !important;
  transition: all 0.2s ease-in-out !important;
  opacity: 1 !important;
}

.splide__arrow svg {
  fill: #374151 !important; 
  width: 1.25rem !important;
  height: 1.25rem !important;
}

.splide__arrow:hover {
  transform: translateY(-50%) scale(1.08) !important;
}

.splide__arrow:disabled {
  opacity: 0.3 !important;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
  .my-container {
    max-width: 540px;
  }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .my-container {
    max-width: 720px;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .my-container {
    max-width: 960px;
  }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  .my-container {
    max-width: 1140px;
  }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
  .my-container {
    max-width: 1320px;
  }
}