
/* ANIMATIONS */
.animate-fade-in-up {
    animation: fadeInUp 1s var(--animation-curve) both;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(.4rem);
    }

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


/* Fancy fadein text animation */
h2 {
    animation: fadeIn 1s ease;
}

ul {
    list-style-type: none;
}

.hidden {
    opacity: 0;
    transition: all 1s;
    filter: blur(5px);
}

.hidden.translateX-left {
    transform: translateX(-25%);
}

.hidden.translateX-right {
    transform: translateX(25%);
}

.show {
    opacity: 1;
    filter: blur(0px);
    transform: translateX(0) !important;
}

.listed-xp {
    display: flex
}

.experience:nth-child(2) {
    transition-delay: 500ms;
}

.experience:nth-child(3) {
    transition-delay: 1000ms;
}

.experience:nth-child(4) {
    transition-delay: 1500ms;
}

.experience:nth-child(5) {
    transition-delay: 2000ms;
}

/* Icon box delay */
.icon-box-container:nth-child(2) {
    transition-delay: 500ms;
}

.icon-box-container:nth-child(3) {
    transition-delay: 1000ms;
}

.icon-box-container:nth-child(4) {
    transition-delay: 1500ms;
}

.icon-box-container:nth-child(5) {
    transition-delay: 2000ms;
}

.about-us-person img {
    border-radius: 50%;
    width: 150px;
    height: 150px;
    margin: 0 auto;
    display: block;
    /* transition: 0.5s ease-in-out; */
}

.about-us-person:nth-child(2) {
    transition-delay: 1000ms;
}




/* Initial fade/fly in */
@keyframes flyInFromBottom {
    0% {
        opacity: 0;
        transform: translateX(-1rem);
    }

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

/* Logo spin */
@keyframes spinLogo {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Zoom-in appear */
@keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.2);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.animate-zoom-in-appear {
    animation: zoomIn 1s var(--animation-curve) forwards;
}


/** Animation delays **/
:root{
    --animation-delay-delta: .3s;
}
.animation-delay-1 {
    animation-delay: calc(1 * var(--animation-delay-delta));
}
.animation-delay-2 {
    animation-delay: calc(2 * var(--animation-delay-delta));
}
.animation-delay-3 {
    animation-delay: calc(3 * var(--animation-delay-delta));
}
.animation-delay-4 {
    animation-delay: calc(4 * var(--animation-delay-delta));
}
.animation-delay-5 {
    animation-delay: calc(5 * var(--animation-delay-delta));
}
.animation-delay-6 {
    animation-delay: calc(6 * var(--animation-delay-delta));
}
.animation-delay-7 {
    animation-delay: calc(7 * var(--animation-delay-delta));
}
.animation-delay-8 {
    animation-delay: calc(8 * var(--animation-delay-delta));
}
.animation-delay-9 {
    animation-delay: calc(9 * var(--animation-delay-delta));
}
.animation-delay-10 {
    animation-delay: calc(10 * var(--animation-delay-delta));
}