html{
  background-color: black;
  color:white;
  padding:0px;
}
body{
    background-image: url("./media/landingBG.png");
    background-size:cover;
    height:100vh;
    margin:0px;
}
#intro{
  padding-top:10px;
  text-align: center;
  min-width:10px;
  max-width:1200px;
  height:600px;
  margin-left:auto;
  margin-right:auto;
  display:flex;
  flex-direction: row;
  justify-content: center;
  gap:1vw;
}
@keyframes boing {
  0% {transform: translate(0px,0px);}
  50% {transform: translate(0px,20px);}
  100% {transform: translate(0px,0px);}
}
#picture{
  display:flex;
  justify-content: center;
  flex-direction: column;
  min-width:40px;
  max-width:400px;
}
#picture>img{
  animation-name: boing;
  animation-duration: 5s;
  animation-iteration-count: infinite;
}
#desc{
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width:400px;
  min-width:40px;
  gap:5px;
}
#introText{
  padding-bottom:10px;
}
.linkbutton{
  margin-left:40px;
  margin-right:40px;
  max-width:200px;
  cursor:pointer;
}
.linkbutton:hover{
  filter: brightness(2);
  transform: scale(1.2);
  animation-name:growOpen;
  animation-duration:.1s;
}
@keyframes growOpen {
  from {transform: translate(0px,0px) scale(1);}
  to {transform: scale(1.2);}
}