@tailwind base;
@tailwind components;
@tailwind utilities;

@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,600;1,400&display=swap");

@import "react-alice-carousel/lib/alice-carousel.css";

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

body {
  width: 100%;
  height: 100%;
  /* overflow-x: hidden; */
  scroll-behavior: smooth;
  background-color: #212121;
}

/* Scroll bar */
/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #212121;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #dcca87;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #dcca87;
}

/* Carousel */
.alice-carousel__stage {
  display: flex;
}
.alice-carousel__stage-item {
  flex: 1 0 auto;
  /* height: 97vh; */
  height: 650px;
  z-index: 0;
}

.alice-carousel__stage-item img {
  height: 100%;
  width: 100%;
}

.map {
  filter: grayscale(50%) invert(100%) contrast(80%);
}
