@keyframes people01{
    from{
        top:0;
        opacity:1;
    }
    90%{
        top:25%;
        opacity:1;
    }
    100%{
        top:50%;
        opacity:0;
    }
}

@keyframes people02{
    from{
        top:25%;
        opacity:1;
    }
    90%{
        top:50%;
        opacity:1;
    }
    100%{
        top:75%;
        opacity:0;
    }
}    

@keyframes people03{
    from{
        top:50%;
        opacity:1;
    }
    90%{
        top:75%;
        opacity:1;
    }
    100%{
        top:75%;
        opacity:0;
    }
}

@keyframes people02_02{
    from{
        top:75%;
        opacity:0;
        transform:translateX(0) rotate(0) scaleX(1);
        transform-origin: right bottom;
    }
    50%{
        top:75%;
        opacity:1;
        transform:translateX(-10%) rotate(90deg) scaleX(1);
        transform-origin:right bottom;
    }
    70%{
        top:75%;
        transform:translateX(-10%) rotate(90deg) scaleX(1);
        transform-origin:right bottom;
    }
    100%{
        top:75%;
        opacity:1;
        transform:translateX(-10%) rotate(53deg) scaleX(0.9);
        transform-origin:right bottom;
    }
}

   
   


@keyframes people03_02{
    from{
        top:75%;
        opacity:0;
        transform:translateX(0%) rotate(0) scaleX(1);
        transform-origin:left bottom;
    }
    40%{
        top:75%;
        opacity:1;
        transform:translateX(20%) rotate(-90deg) scaleX(1);
        transform-origin:left bottom;
    }
    60%{
        top:75%;
        transform:translateX(20%) rotate(-90deg) scaleX(1);
        transform-origin:left bottom;
    }
    100%{
        top:75%;
        opacity:1;
        transform:translateX(20%) rotate(-53deg) scaleX(0.9);
        transform-origin:left bottom; 
    }
}


@keyframes innovation03 {
    from{
        top:75%;
        opacity:1;
        transform:translate(20%) rotate(-53deg) scaleX(0.9);
        transform-origin:left bottom; 
    }
    90%{
        opacity:1;
    }
    to{
        top:75%;
        opacity:0;
        transform:translate(0) rotate(0) scaleX(1);
        transform-origin:left bottom;
    }
}

@keyframes innovation02{
    from{
        top:75%;
        opacity:1;
        transform:translate(-10%) rotate(53deg) scaleX(0.9);
        transform-origin:right bottom;
    }
    90%{
        opacity:1;
    }
    to{
        top:75%;
        opacity:0;
        transform:translate(0) rotate(0) scaleX(1);
        transform-origin:right bottom;
    }
}

@keyframes innovation04{
    from{
        transform:rotate(0) scaleX(1) translateX(0);
    }
    50%{
        transform:rotate(90deg) scaleX(0.56) translateX(-40%);
    }
    to{
        transform:rotate(90deg) scaleX(0.4) translateX(-72.9%);
    }
}

@keyframes innovation01{
    from{
        opacity:0;
        transform:translate(0,-40%) rotate(90deg) scaleX(0.5);
    }
    to{
        opacity:1;
        transform:translate(0,0%) rotate(90deg) scaleX(0.5);
    }
}
@keyframes innovation04_re{
    from{
        transform:rotate(90deg) scaleX(0.4) translateX(-72.9%);
    }
    30%{
        transform:rotate(90deg) scaleX(0.56) translateX(-40%);
    }
    to{
        transform:rotate(0) scaleX(1) translateX(0);
    }
}
@keyframes innovation01_re{
    from{
        opacity:1;
        transform:translate(0,0%) rotate(90deg) scaleX(0.5);
    }
    to{
        opacity:0;
        transform:translate(0,-40%) rotate(90deg) scaleX(0.5);
    }
}
@keyframes people01_re{
    from{
        top:50%;
        opacity:0;
    }
    100%{
        top:0;
        opacity:1;
    }
}
@keyframes people02_re{
    from{
        top:75%;
        opacity:0;
    }

    100%{
        top:25%;
        opacity:1;
    }
}
@keyframes people03_re{
    from{
        top:75%;
        opacity:0;
    }
     100%{
        top:50%;
        opacity:1;
    }
}

@keyframes mouseover_font{
    from{
        font-weight:400;
        padding-left:0;
    }
    to{
        font-weight:700;
        padding-left:50px;
    }
}

@keyframes mouseleave_font{
    from{
        font-weight:700;
        padding-left:50px;
    }
    to{
        font-weight:400;
        padding-left:0;
    }
}
@keyframes onclick{
    from{
        font-weight: 700;
        padding-left: 50px;
    }
    to{
        font-weight:700;
        padding-left:0;
    }
}

@keyframes unclick{
    from{
        font-weight: 700;
        padding-left:0;
    }
    to{
        font-weight:400;
        padding-left:0;
    }

}

.mouseover_font{
    animation:mouseover_font 0.5s ease-in-out both;
}
.mouseleave_font{
    animation:mouseleave_font 0.5s ease-in-out both;
}
.onclick{
    animation:onclick 0.5s ease-in-out both;
}
.unclick{
    animation:unclick 0.5s ease-in-out both;
}



