body {
  width: 100%;
  height: 100vh;
  position: relative;
  font-family: 'ABeeZee', Arial, Helvetica, sans-serif;
}

.main{
  position: relative;
  height: 100%;
}

.line {
  width: 100%;
  margin-top: 1vh;
  margin-bottom: 1vh;
  border: 1px solid #b0cb1f;
}


@keyframes fade-in{
  0% {background-color: transparent;}
  100% {background-color: rgba(0, 0, 0, 0.25);}
}

@keyframes down-fade-in{
  0% {bottom: 100%; opacity: 0%;}
  100% {bottom: 50%; opacity: 100%;}
}

@keyframes up-fade-in{
  0% {top: 50%; opacity: 0%;}
  100% {top: 10%; opacity: 100%;}
}

@keyframes rise-up {
  0% {box-shadow: 0px 0px -5px rgba(0, 0, 0, 0.5);}
  100% {box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5); transform: translateY(-2px);}
}


.text-soft{
  font-family: 'ABeeZee', Arial, Helvetica, sans-serif;
  color: rgba(0, 0, 0, 0.5);
}
/*media queries*/

@media (max-width: 767px) {
  main, #top, #footer-data {
    width: 100svw;
  }
}