/* HERO */

@keyframes hero-content {
  from {top: 100px;
        opacity: 0;}
  to {top: 0px;
       opacity: 1;}
}

/* ABOUT */

@keyframes about-img-box{
  0% {
    transform: translate(5%);
    clip-path: inset(0 0 0 100%);
    opacity: 0;
}

100% {
    transform: translate(0);
    clip-path: inset(0 0 0 0);
    opacity: 1;
}
}

/* PROCESS */

@keyframes process-icons {
  0% {
    opacity: 0;
    transform: translateY(20px);
}

100% {
    opacity: 1;
    transform: translateY(0);
 }

}

/* OUTLOOK */

@keyframes main-img {
  0% {
    opacity: 0;
    transform: translateY(-40px);
}

100% {
    opacity: 1;
    transform: translateY(0);
 }

}

@keyframes main-img-2 {
  0% {
    opacity: 0;
    transform: translateX(-40px);
}

100% {
    opacity: 1;
    transform: translateX(0);
 }

}

@keyframes main-img-3 {
  0% {
    opacity: 0;
    transform: translateX(40px);
}

100% {
    opacity: 1;
    transform: translateX(0);
 }

}

@keyframes outlook-list-items {
  0% {
    opacity: 0;
    transform: translateX(300px);
}

100% {
    opacity: 1;
    transform: translateX(0);
 }

}

@keyframes img-box-list {
  0% {
    opacity: 0;
    transform: translateY(40px);
}

100% {
    opacity: 1;
    transform: translateY(0);
 }

}



/* MISSION */

@keyframes mission-img-box{
  0% {
    transform: translate(5%);
    clip-path: inset(0 0 0 100%);
    opacity: 0;
}

100% {
    transform: translate(0);
    clip-path: inset(0 0 0 0);
    opacity: 1;
}
}