@keyframes rotation {
  from {
      -webkit-transform: rotate(0deg);
  }
  to {
      -webkit-transform: rotate(359deg);
  }
}


@keyframes translatep1{
  0%{
    transform: translateY(35px);
  }

  100%{
    transform: translateY(5px);
    visibility: hidden;
  }
}

@keyframes translatep2{
  0%{
    transform: translateY(-20px);
  }

  100%{
    transform: translateY(40px);
    visibility: hidden;
  }
}

@keyframes translateright{
  0%{
    right: -50px;
    color: transparent;
    display: none;
  }

  30%{
    right: 150px;
    color: transparent;
    display: block;
  }

  100%{
    right: 200px;
    color: white;
  }
}

@keyframes translateleft{
  0%{
    right: 200px;
    color: white;
    display: block;
  }
  30%{
    right: 150px;
    color: transparent;
  }

  100%{
    right: -200px;
    color: transparent;
    display: none;
  }
}


@keyframes height{
  0%{
    height: 50vh;
    min-height: 250px;
  }

  100%{
    height: 0;
    min-height: 100px;
  }
}

@keyframes margin{
  0%{
    margin-top: 25vh;
    transform: translateY(-50%);
  }
  100%{
    margin-top: 0px;
    transform: translateY(0%);
  }
}

@keyframes h1{
  0%{
    font-size: 11.2vw;
  }
  100%{
    font-size: 3rem;
  }
}


@keyframes card{
  0%{}

  50%{
    transform: translateY(-40px);
  }

  100%{
    transform: translateY(-50px);
    opacity: 0;
  }
}

@keyframes textestroke{
  0%{
    -webkit-text-stroke : 1px;
  }

  100%{
    -webkit-text-stroke : 0px;
  }
}