.line1, .line2, .line3, .line4, .line5 {
  height:6px;
  border-radius:6px;
  display:inline-block;
}
.line1 {
  background: #131E58;
}
.line2 {
  background: #29727C;
}
.line3 {
  background: #0077C8;
}
.line4 {
  background: #E6EEEB;
}
.line5 {
  background: #BFBFBF;
}
.divide {
 margin-bottom:0px;
  padding-bottom:0px;
  height:12px;
}

.reflection
{
    -webkit-transform: scaleY(-1);
    -moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
}

.mirror
{
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
}

/**
 * ----------------------------------------
 * animation scale-up-hor-right
 * ----------------------------------------
 */

.scale-up-hor-right {
	-webkit-animation: scale-up-hor-right 2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: scale-up-hor-right 2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
@-webkit-keyframes scale-up-hor-right {
  0% {
    -webkit-transform: scaleX(0.9);
            transform: scaleX(0.9);
    -webkit-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
  }
}
@keyframes scale-up-hor-right {
  0% {
    -webkit-transform: scaleX(0.9);
            transform: scaleX(0.9);
    -webkit-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
  }
}


/**
 * ----------------------------------------
 * animation scale-up-hor-left
 * ----------------------------------------
 */

.scale-up-hor-left {
	-webkit-animation: scale-up-hor-left 2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: scale-up-hor-left 2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

@-webkit-keyframes scale-up-hor-left {
  0% {
    -webkit-transform: scaleX(0.9);
            transform: scaleX(0.9);
    -webkit-transform-origin: 0% 0%;
            transform-origin: 0% 0%;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: 0% 0%;
            transform-origin: 0% 0%;
  }
}
@keyframes scale-up-hor-left {
  0% {
    -webkit-transform: scaleX(0.9);
            transform: scaleX(0.9);
    -webkit-transform-origin: 0% 0%;
            transform-origin: 0% 0%;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: 0% 0%;
            transform-origin: 0% 0%;
  }
}

@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: scroll()) {
  .scale-up-hor-left {
    animation-timeline: view();
    animation-range: 15vh 60vh;
  }
    .scale-up-hor-right {
    animation-timeline: view();
    animation-range: 15vh 60vh;
  }
  }
}
