@charset "UTF-8";



* {
  box-sizing: border-box;
}

body {
  font-family: "DIATYPE";
  margin: 0;
  padding: 0;
  background-color: black;
  height: 100dvh;
  width: 100vw;
  overflow: hidden; /* Disable regular scroll */

  cursor: none; /* Hide the default cursor */


}





@font-face {
  font-family: "DIATYPE";
  src: url("../fonts/ABCDiatype-Medium.woff2");
}

@font-face {
  font-family: "DIATYPElight";
  src: url("../fonts/ABCDiatype-Light.woff2");
}








/* footer */

.footer{
  font-size: 14pt;
}

.header{
  font-size: 14pt;
}



.contact{
  position: fixed;
  bottom: 0%;
  left: 50%;
  padding-bottom: 16px;
  padding-top: 4px;
  padding-left: 8px;
  background-color: none;
  z-index: 30;
  display: flex;
  gap: 16px;
  z-index: 5000;
  justify-content: left; /* Adjust to your need: center, space-around, space-evenly */


}


.footerellement{
  text-decoration: none;

}
.footerellement:hover{
  text-decoration: underline;
}

.credits{
  position: fixed;
  bottom: 0%;
  right: 0%;
  padding-bottom: 16px;
  padding-top: 4px;
  padding-right: 32px;
  color: white;
  font-size: 7pt;
  z-index: 4000;


}


/* CSS for Yohann Element (Right) */
#element04 {
  position: fixed;
  padding-bottom: 4px;
  padding-top: 16px;
  padding-left: 32px;
  color: white;
  top: 0;
  left: 0; /* Fixed on the left side */
  background-color: none;
  z-index: 30;
}


/* CSS for Yohann Element (Right) */
.bio {
  font-size: 32pt;
  position: fixed;
  padding-bottom: 4px;
  padding-top: 16px;
  padding-left: 8px;
  padding-right: 32px;
  color: white;
  top: 0;
  left: 50%;
  background-color: none;
  z-index: 30;
  line-height: 95%;
  letter-spacing: -1.2px;


  opacity: 20%;


}






#arrowcontact{
  position: relative;
  height: 10pt;
  filter: invert(100%);

}

#arrowCV{
  position: relative;
  height: 17pt;
  filter: invert(100%);
}
#arrowproject{
  position: relative;
  height: 10pt;
}

.footerellement{
  color: white;
  text-decoration: none;

}

/* footer */
















#custom-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 400px;
  height: 40px;
  font-size: 32pt;
  color: white; /* Default color */
  pointer-events: none;
  z-index: 10000;

  text-align: center;
  line-height: 90%;
  letter-spacing: -1.2px;

}




#bouncing-text {
  display: none; /* Hidden by default for desktop */
}




/* Hide the custom cursor on mobile devices */
@media (max-width: 768px) {





  #custom-cursor {
    display: none; /* Hide the custom cursor */
  }

  #bouncing-text {
    position: absolute;
    font-size: 32pt; /* Adjust font size */
    font-family: "DIATYPE";
    color: white;
    z-index: 10000;
    display: block;
    user-select: none; /* Prevent text selection */
    line-height: 90%;
    letter-spacing: -1.2px;
  }




  /* CSS for Yohann Element (Right) */
.bio {
  font-size: 29pt;
  position: fixed;
  padding-bottom: 4px;
  padding-top: 16px;
  padding-left: 32px;
  padding-right: 32px;
  top: 49px;
  left: 0%;
  background-color: none;
  z-index: 30;



}




.contact{
  position: fixed;
  bottom: 0%;
  left: 0%;
  padding-bottom: 16px;
  padding-top: 4px;
  padding-left: 32px;
  padding-right: 32px;
  background-color: none;
  z-index: 30;
  display: flex;
  gap: 16px;
  z-index: 50000;
  justify-content: space-evenly; /* Adjust to your need: center, space-around, space-evenly */
}

.credits{
  position: fixed;
  bottom: 0%;
  left: 0%;
  padding-bottom: 48px;
  padding-top: 4px;
  padding-left: 32px;
  padding-right: 32px;
  color: white;
  font-size: 7pt;
  z-index: 5000;


}


}