/*
Theme Name: Creo
Theme URI: http://example.com/creo
Author: Your Name
Author URI: http://example.com
Description: A custom WordPress theme.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: creo, theme, simple
*/

.vertline.in-view {
  animation-name: lineup;
  animation-duration: 3s;
  animation-iteration-count: 1;
  animation-fill-mode: none, forwards;
  margin-bottom: -10px !important;
}

@keyframes lineup {
  0% {
    height: 0px;
  }
  100% {
    height: 250px;
  }
}

.vertline-white.in-view {
  animation-name: linedown;
  animation-duration: 3s;
  animation-iteration-count: 1;
  animation-delay: 3s;
  animation-fill-mode: none, forwards;
  /* margin-top: -10px !important; */
}

@keyframes linedown {
  0% {
    height: 0px;
  }
  100% {
    height: 250px;
  }
}

.vertline-big.in-view {
  animation: linedown-big 3s forwards;
  margin-bottom: -10px !important;
}

@keyframes linedown-big {
  0% {
    height: 0px;
  }
  100% {
    height: 200px;
  }
}

.vertline-big-top.in-view {
  animation-name: linedown-big-top;
  animation-duration: 3s;
}

@keyframes linedown-big-top {
  0% {
    height: 0px;
  }
  100% {
    height: 50px;
  }
}

.vertline-big-bottom.in-view {
  animation: linedown-big-bottom 3s backwards;
}

@keyframes linedown-big-bottom {
  0% {
    height: 0px;
  }
  100% {
    height: 50px;
  }
}

.vertline-arrow.in-view {
  animation: linedown-arrow 3s forwards;
}

@keyframes linedown-arrow {
  0% {
    width: 0px;
  }
  100% {
    width: 130px;
  }
}

/* .vertline-arrow2.in-view {
  animation: linedown-arrow2 3s forwards;
  animation-delay: 3s;
  margin-left: 25px;
}

@keyframes linedown-arrow2 {
  0% {
    height: 0px;
  }
  100% {
    height: 260px;
  }
}

.vertline-arrow3.in-view {
  animation: linedown-arrow2 3s forwards;
  animation-delay: 6s;
}

@keyframes linedown-arrow3 {
  0% {
    height: 0px;
  }
  100% {
    height: 260px;
  }
} */

.vertline-arrow4.in-view {
  animation: linedown-arrow4 3s forwards;
}

@keyframes linedown-arrow4 {
  0% {
    width: 0px;
  }
  100% {
    width: 130px;
  }
}