#main {
  display: flex;
  align-items: flex-end;
  width: 100%;
  height: 100vh;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-image: url("../img/main/bg.jpg");
}
#main .section-logo-main {
  display: block;
  min-height: auto;
  padding: 0 15px;
  width: 100%;
  max-width: 1200px;
}
#main .section-logo-main .logo-main svg {
  width: 30%;
  height: auto;
  transform: translateY(125%);
}
#main .section-logo-main .logo-main svg .path {
  fill: rgba(0, 130, 147, 0);
  stroke-width: 2px;
  transition: fill 0s ease 0s;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
  animation-delay: 0.8s, 3s;
  animation-name: draw, fill;
  stroke: #008293;
  animation-duration: 3.25s, 1.3s;
}
#main .section-logo-main .logo-main svg .path.pathV {
  animation-duration: 2.5s, 1.3s;
}
#main .section-logo-main .logo-main svg .path.pathI {
  animation-duration: 2.5s, 1.3s;
}
#main .section-logo-main .logo-main svg .path.pathG {
  animation-duration: 3.25s, 1.3s;
}
#main .section-logo-main .logo-main svg .path.pathO {
  animation-duration: 4.375s, 1.3s;
}
#main .section-logo-main .logo-main svg .path.pathU {
  animation-duration: 2.5s, 1.3s;
}
#main .section-logo-main .logo-main svg .path.pathR {
  animation-duration: 5.25s, 1.3s;
}
#main .section-logo-main .img-white {
  width: 100%;
  opacity: 0;
  transform: translateY(60px);
}
#main .section-logo-main .img-white.active {
  animation: slide-in, fade-in;
  animation-delay: 3s;
  animation-duration: 0.6s, 0.4s;
  animation-fill-mode: forwards;
  animation-timing-function: linear;
}
@keyframes slide-in {
  100% {
    transform: translateY(0);
  }
}
@keyframes draw {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes fill {
  100% {
    fill: #008293;
  }
}

/*# sourceMappingURL=section-main.css.map */
