tailwind.css

@tailwind base;
@tailwind components;
@tailwind utilities;
html {
    scrollbar-width: none;
    scroll-behavior: smooth;

}
/* latin-ext */
@font-face {
  font-family: 'Spartan';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(./l7gAbjR61M69yt8Z8w6FZf9WoBxdBrFivl6HABTdfw.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Spartan';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(./l7gAbjR61M69yt8Z8w6FZf9WoBxdBrFivl6JABQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

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

#hexagons{
    -webkit-animation: colorchange 30s infinite alternate;
  }    
  
  @-webkit-keyframes colorchange {
        0% {
          filter: drop-shadow(0 0 0.25rem rgb(111, 0, 255));
        }
        10% {
          filter: drop-shadow(0 0 0.25rem rgb(0, 76, 255));
        }
        20% {
          filter: drop-shadow(0 0 0.25rem rgb(0, 255, 149));
        }
        30% {
          filter: drop-shadow(0 0 0.25rem rgb(255, 0, 0));
        }
        40% {
          filter: drop-shadow(0 0 0.25rem rgb(162, 57, 234));
        }
        50% {
          filter: drop-shadow(0 0 0.25rem rgb(4, 0, 255));
        }
        60% {
          filter: drop-shadow(0 0 0.25rem rgb(0, 255, 157));
        }
        70% {
          filter: drop-shadow(0 0 0.25rem rgb(255, 46, 99));
        }
        80% {
          filter: drop-shadow(0 0 0.25rem rgb(0, 225, 255));
        }
        90% {
          filter: drop-shadow(0 0 0.25rem rgb(0, 255, 0));
        }
        100% {
          filter: drop-shadow(0 0 0.25rem rgb(196, 0, 255));
        }
      }

      .hexagon {
       /* clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); */
        background-color: transparent;
        border: white 3px solid;
        background-size: cover;
        height: 24rem;
        width: 24rem;    
      }