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

html {
  scroll-behavior: smooth;
}

 
@font-face {
  font-family: "gentyDemo";
  src: url('../fonts/GentyDemo-Regular.ttf');
}
 


body {
  font-family: "Titan One", sans-serif;
}

.lucky_font {
  font-family: "Luckiest Guy", cursive;
}

.genty_font {
  font-family: "gentyDemo", sans-serif;     
}

.delius_font {
  font-family: "Delius", cursive; 
  
}

.outfit_font {
    font-family: "Outfit", sans-serif;
}

.proza-libre_font {
  font-family: "Proza Libre", sans-serif; 
}


.thin_stroke{
  -webkit-text-stroke: .1px black;
}

.medium_stroke{
  -webkit-text-stroke: 2px black;
}


.medium_shadow{
  text-shadow: 2px 2px 1px  #000000;
}

.bold_shadow{
  text-shadow: 2px 7px 1px  #000000;
}


.mirror_image{
  transform: scaleX(-1);
}

.contract_shadow{
  box-shadow: 0px 10px 0px 0px #00000073;
}

section:not(.hero) .title {
    text-shadow: 0px 12px 0px #000000bf;
    -webkit-text-stroke: 4px black;
  }

/* navbar */
nav .logo h2 {
  text-shadow: 0 3px 0 black;
  -webkit-text-stroke: 1px black;
}

nav li:hover a {
  color: rgb(20, 20, 20);
}

nav li a{
  font-family: "Luckiest Guy", cursive; 
}

nav .buy { 
  font-family: "Luckiest Guy", cursive;
}

nav .social .media { 
  box-shadow: 3.74px 3.74px 0px 0px #000000;

}

nav .social .media:hover {
  transform: scale(1.1);
}


/* menu button */
.menu {
  transform: translateX(-100%);
}

.menu-button {
  display: none;
  overflow: hidden;

  height: 35px;
  width: 45px;

  position: relative;

  align-items: center;
}

.menu-button span {
  width: 100%;
  height: 3px;
  background-color: white;
  position: absolute;
  transition: all 0.3s ease-in-out;
}

.menu-button span:nth-child(1) {
  top: 0;
}

.menu-button span:nth-child(2) {
  position: relative;
}

.menu-button span:nth-child(3) {
  bottom: 0;
}

.menu-button.active span:nth-child(1) {
  transform: rotate(45deg);
  top: 1rem;
}

.menu-button.active span:nth-child(2) {
  width: 0%;
}

.menu-button.active span:nth-child(3) {
  transform: rotate(-45deg);
  bottom: 1rem;
}

/* hero section */
.hero .title {
  -webkit-text-stroke: 4px black;
  text-shadow: 0 15px 0 black;
}

.rotate_img {
  animation: img_rotate 10s linear infinite;
}

@keyframes img_rotate {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/* animation */
.float_animation{
  animation: float 2s ease-in-out infinite;
}
@keyframes float {
0% {
  transform: translatey(0px);
}
50% { 
  transform: translatey(-20px);
}
100% {
  transform: translatey(0px);
}
}


/* about */

.about_title{
  text-shadow: 0px 2px 1px  #000000;
}


.medium_shadow{
  text-shadow: 2px 2px 1px  #000000;
}



@media screen and (max-width: 1024px) {
  .menu-button {
    display: flex;
    position: absolute;
    right: 0;
  }

  .menu {
    transform: translateX(-100%);
  }

  .menu.active {
    transform: translateX(0%);
  }

  /* hero */
  .hero .title {
    -webkit-text-stroke: 3px black;
    text-shadow: 0 12px 0 black;
  }
}

@media screen and (max-width: 500px) {
    
  section:not(.hero) .title {
    text-shadow: 0px 5px 0px #000000bf;
    -webkit-text-stroke: 1.5px black;
  } 

  /* navbar */
  .menu-button {
    width: 27px;
    height: 23px;
  }

  .menu-button.active span:nth-child(1) {
    top: 0.6rem;
  }

  .menu-button.active span:nth-child(3) {
    bottom: 0.7rem;
  } 

  nav .social .media {
    box-shadow: 1.09px 1.09px 0px 0px #000000;
  }

  /* hero */
  .hero .title {
    -webkit-text-stroke: 2px black;
    text-shadow: 0 8px 0 black;
  }

   
 
}