/*color animation*/
.taf-color.active {
    /* color: #00ffff; */
    /* color: #00d009; */
    color: #eeff41;
    animation: tafcolor 30s linear infinite alternate;
}
.fill-color.active {
    animation: fillcolor 30s linear infinite alternate;
}
.taf-bg.active {
    animation: bgcolor 30s linear infinite alternate;
}
.taf-bg-light.active {
    animation: bgcolor-light 30s linear infinite alternate;
}
@keyframes tafcolor {
    /* 0% { color: #00ffff; } */
    0% {
        color: #eeff41;
    }
    10% {
        color: #e1f505;
    }
    20% {
        color: #001379;
    }
    30% {
        color: #06f0d9;
    }
    40% {
        color: #000000;
    }
    50% {
        color: #ffba00;
    }
    60% {
        color: #00ffc3;
    }
    70% {
        color: #1b553c;
    }
    80% {
        color: #008fff;
    }
    90% {
        color: #ff9cc0;
    }
    100% {
        color: #e52712;
    }
}
@keyframes fillcolor {
    /* 0% {fill: #00ffff;} */
    0% {
        fill: #eeff41;
    }
    10% {
        fill: #e1f505;
    }
    20% {
        fill: #001379;
    }
    30% {
        fill: #06f0d9;
    }
    40% {
        fill: #000000;
    }
    50% {
        fill: #ffba00;
    }
    60% {
        fill: #00ffc3;
    }
    70% {
        fill: #1b553c;
    }
    80% {
        fill: #008fff;
    }
    90% {
        fill: #ff9cc0;
    }
    100% {
        fill: #e52712;
    }
}
@keyframes bgcolor {
    /* 0% {background: rgba(0,255,255,0.9);} */
    0% {
        background: rgba(238, 255, 65, 0.9);
    }
    10% {
        background: rgba(0, 208, 9, 0.9);
    }
    20% {
        background: rgba(0, 19, 121, 0.9);
    }
    30% {
        background: rgba(0, 255, 105, 0.9);
    }
    40% {
        background: rgba(0, 0, 0, 0.9);
    }
    50% {
        background: rgba(255, 186, 0, 0.9);
    }
    60% {
        background: rgba(0, 255, 195, 0.9);
    }
    70% {
        background: rgba(27, 85, 60, 0.9);
    }
    80% {
        background: rgba(0, 143, 255, 0.9);
    }
    90% {
        background: rgba(255, 156, 192, 0.9);
    }
    100% {
        background: rgba(299, 39, 18, 0.9);
    }
}
@keyframes bgcolor-light {
    /* 0% {background: rgba(0,255,255,0.85);} */
    0% {
        background: rgba(238, 255, 65, 0.9);
    }
    10% {
        background: rgba(0, 208, 9, 0.9);
    }
    20% {
        background: rgba(0, 19, 121, 0.85);
    }
    30% {
        background: rgba(0, 255, 105, 0.85);
    }
    40% {
        background: rgba(0, 0, 0, 0.85);
    }
    50% {
        background: rgba(255, 186, 0, 0.85);
    }
    60% {
        background: rgba(0, 255, 195, 0.85);
    }
    70% {
        background: rgba(27, 85, 60, 0.85);
    }
    80% {
        background: rgba(0, 143, 255, 0.85);
    }
    90% {
        background: rgba(255, 156, 192, 0.85);
    }
    100% {
        background: rgba(299, 39, 18, 0.85);
    }
}
/**/
.section-title span {
    display: inline-block;
    /*   transition: transform .3s; */
}
/* .about .section-title span:nth-of-type(1) {
   transform: scale(1.1,1.1) translate(0, -40px);
}
.about .section-title span:nth-of-type(2) {
   transform: scale(1.1,1.1);
}
.about .section-title span:nth-of-type(3) {
   transform: scale(1.1,1.1) translate(0, 40px);
} */

.about .section-title.active span:nth-of-type(1) {
    transform: scale(1, 1) translate(0, 0px);
}
.about .section-title.active span:nth-of-type(2) {
    transform: scale(1, 1);
}
.about .section-title.active span:nth-of-type(3) {
    transform: scale(1, 1) translate(0, 0px);
}