@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500&display=swap');

body {
  margin: 0;
  font-family: 'JetBrains Mono', monospace;
  font-size: 16px
}

.wallpaper {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.6)), url(/web/20220126115624im_/https://irc.land/lol.gif);
  background-size: cover;
  background-position: center;
  height: 100vh;
}

.content {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.sidetext {
  text-align: left;
  z-index: 100;
  color: #fff
}

h1 {
  color: #fff;
}

i {
  margin-right: 10px
}

.pfp {
  width: 125px;  
  height: auto;  
  border-radius: 50%;
  /* box-shadow: 0px 32px 40px 40px rgba(66, 10, 156, 0.664); I'll work on this later lmfao */
}

a {
  text-decoration: none;
  color: white;
  opacity: 0.5
}

a:hover {
  opacity: 1
}

.fade-in-image {
  animation: fadeIn 3s;
  -webkit-animation: fadeIn 3s;
  -moz-animation: fadeIn 3s;
  -o-animation: fadeIn 3s;
  -ms-animation: fadeIn 3s;
}
@keyframes fadeIn {
  0% { opacity:0; }
  100% { opacity:1; }
}

@-moz-keyframes fadeIn {
  0% { opacity:0; }
  100% { opacity:1; }
}

@-webkit-keyframes fadeIn {
  0% { opacity:0; }
  100% { opacity:1;}
}

@-o-keyframes fadeIn {
  0% { opacity:0; }
  100% { opacity:1; }
}

@-ms-keyframes fadeIn {
  0% { opacity:0; }
  100% { opacity:1; } /* idk i remember spacing this shit. fucking tabine */
}

@media only screen and (max-width: 600px) {
  h3 {
    font-size: 15px
  }

}

.center {
  text-align: center;
}