*{
	margin:0;
	padding:0;
}

body {
 overflow: hidden;
 background-color: red;
  width:100vw;
 height:100vh
}

header{
	display:none;

}

@keyframes transform{
    0%      {transform:translate(0px,0px);}
    50%     {transform: translate(0px, 200px);}
    100%    {transform: translate(0px,0px);}
}

section{
    margin: auto;
    margin-top: 10vh;
    margin-left: 1.5vw;
    float: left;
    animation-name: transform;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    height: auto; 
    width: auto; 
    max-width: 30px; 
    max-height: 30px;
}

    .box-1 {
         animation-duration: 10s;
         animation-delay: 0s;
         }

    .box-2 {
         animation-duration: 10s;
         animation-delay: 1s;
         animation-name: transform;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
         }

    .box-3{
         animation-duration: 10s;
         animation-delay: 2s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }

    .box-4 {
         animation-duration: 10s;
         animation-delay: 3s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }

         .box-5 {
         animation-duration: 10s;
         animation-delay: 4s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }

         .box-6 {
         animation-duration: 10s;
         animation-delay: 5s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }

         .box-7 {
         animation-duration: 10s;
         animation-delay: 6s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }

              .box-8 {
         animation-duration: 10s;
         animation-delay: 7s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }

              .box-9 {
         animation-duration: 10s;
         animation-delay: 8s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }

              .box-10 {
         animation-duration: 10s;
         animation-delay: 9s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }


              .box-11 {
         animation-duration: 10s;
         animation-delay: 10s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }
              .box-12 {
         animation-duration: 10s;
         animation-delay: 11s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }
              .box-13 {
         animation-duration: 10s;
         animation-delay: 12s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }
              .box-14 {
         animation-duration: 10s;
         animation-delay: 13s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }

               .box-15 {
         animation-duration: 10s;
         animation-delay: 14s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }
               .box-16 {
         animation-duration: 10s;
         animation-delay: 15s;
         animation-name: transform;
             animation-iteration-count: infinite;
    animation-timing-function: linear;
         }



