/*--------------------------------------------------------------
# Inter
--------------------------------------------------------------*/
@font-face {
  font-family: 'Inter';
  src:
    local('Inter-ExtraLight'),
    url(fbcf1d9ad9d7bac9f6de.ttf) format('ttf');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src:
    local('Inter-Light'),
    url(02850f28027788580733.ttf) format('ttf');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src:
    local('Inter-Regular'),
    url(9ca9ba81e9dcaa12b3a1.ttf) format('ttf');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src:
    local('Inter-Medium'),
    url(3f7acfe50aad7ad68548.ttf) format('ttf');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src:
    local('Inter-SemiBold'),
    url(6058d3da655fb35169c2.ttf) format('ttf');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src:
    local('Inter-Bold'),
    url(0eaf807b1cf0eceabe0f.ttf) format('ttf');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src:
    local('Inter-ExtraBold'),
    url(4164cfba15dbca5f37aa.ttf) format('ttf');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/*--------------------------------------------------------------
# Karla
--------------------------------------------------------------*/
@font-face {
  font-family: 'Karla';
  src:
    local('Karla-ExtraLight'),
    url(5662cef4f5f88827e599.ttf) format('ttf');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Karla';
  src:
    local('Karla-Light'),
    url(ff193d9207bb1d3f63c1.ttf) format('ttf');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Karla';
  src:
    local('Karla-Regular'),
    url(f950111be01b92a807ba.ttf) format('ttf');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Karla';
  src:
    local('Karla-Medium'),
    url(3865ebfcffcb8469e5d3.ttf) format('ttf');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Karla';
  src:
    local('Karla-SemiBold'),
    url(ad031b3f19d4bb6eaafb.ttf) format('ttf');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Karla';
  src:
    local('Karla-Bold'),
    url(23ca816af95c228bcb4e.ttf) format('ttf');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Karla';
  src:
    local('Karla-ExtraBold'),
    url(122ef3399f6dfa1c2974.ttf) format('ttf');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/*--------------------------------------------------------------
# Fonts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
* {
  box-sizing: border-box;
}

body {
  font-family: Inter, Karla, sans-serif;
  overflow-x: hidden;
  max-width: 100vw;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  overflow-x: hidden;
  max-width: 100vw;
}

#root {
  overflow-x: hidden;
  max-width: 100vw;
}
/* global.css */

/* Style the dots container */
.custom-dots .slick-dots {
  position: absolute;
  bottom: -30px; /* Adjust as needed */
  left: 0;
  width: 100%;
  text-align: center;
}

/* Style individual dots */
.custom-dots .slick-dots li button {
  width: 30px; /* Adjust size */
  height: 10px; /* Adjust size */
  background: #fff; /* Dot color */
  border-radius: 5px; /* Rounded edges */
}

/* Style the active dot */
.custom-dots .slick-dots li.slick-active button {
  background: #000; /* Active dot color */
}

/* Hide the dots that are not needed */
.custom-dots .slick-dots li:nth-child(n + 3) {
  display: none; /* Hide extra dots */
}

/* Show only a limited number of dots */
.custom-dots .slick-dots li:nth-child(n + 1):nth-child(-n + 2) {
  display: inline-block; /* Show only the first 2 dots */
}

