@font-face {
  font-family: "A Love of Thunder";
  src: url("../fonts/font1.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Avenir Light";
  src: url("../fonts/font2.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}

.custom_font {
  font-family: "A Love of Thunder";
  text-transform: uppercase;
}

.thin_font {
  font-family: "Avenir Light";
}

.custom-scroll {
  user-select: none;
  /* Disable text selection */
  -webkit-user-select: none;
  /* For Safari */
  -ms-user-select: none;
  /* For older IE */
  cursor: grab;
  /* Indicate that the element is draggable */
}

.custom-scroll:active {
  cursor: grabbing;
  /* Change cursor during active dragging */
}

.custom-scroll img {
  user-select: none;
  /* Disable text selection */
  pointer-events: none;
  /* Prevent mouse events like clicks and drag */
  -webkit-user-drag: none;
  /* Disable drag in Safari */
}

.custom-scroll::-webkit-scrollbar {
  display: none;
}

.custom-scroll::-webkit-scrollbar-track {
  display: none;
}

.custom-scroll::-webkit-scrollbar-thumb {
  display: none;
}

.split_font {
  font-family: "Avenir Light";
}

.split_font b {
  font-family: "A Love of Thunder";
  font-weight: normal;
  display: inline-block;
  text-transform: uppercase;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#share_popup_desktop a,
#share_popup_mobile a {
  opacity: 0;
  transform: translateY(-20px);
  transition: opacity 0.1s, transform 0.1s;
}

html {
  scroll-behavior: smooth;
}

#explore:target {
  scroll-margin-top: -200px; /* ruimte voor header */
}