@charset "utf-8";

/*ANIMATION*/
@keyframes hover {
0%{opacity:1;}
100%{opacity:0.5;}
}

@keyframes point {
0%{opacity:0; transform:scale(1);}
30%{opacity:1; transform:scale(1);}
100%{opacity:0; transform:scale(2);}
}

@keyframes color_hover {
0%{color:#fff;}
100%{color:#63d7ab;}
}

@keyframes cta {
0%{transform:scale(1);}
100%{transform:scale(1.03);}
}



/*TOP ANIMATION*/
@keyframes mv_triangle {
    0% {opacity:1; transform:translate(100%,0);}
    100% {opacity:1; transform:translate(0,0);}
}

@keyframes mv_copy1 {
    0% {opacity:0; transform:translate(0,50%);}
    50% {opacity:1; transform:translate(0,50%);}
    100% {opacity:1; transform:translate(0,0);}
}

@keyframes mv_copy2 {
    0% {opacity:0; transform:translate(0,50%);}
    50% {opacity:1; transform:translate(0,50%);}
    100% {opacity:1; transform:translate(0,0);}
}

@keyframes mv_logo {
    0% {opacity:0; transform:translate(50%,0);}
    50% {opacity:1; transform:translate(50%,0);}
    100% {opacity:1; transform:translate(0,0);}
}

@keyframes mv_line{
    0%{transform:translate(-100%,0)}
    15%{transform:translate(-95%,0)}
    85%{transform:translate(-5%,0)}
    100%{transform:translate(0,0)}
}

@keyframes mv_produced {
    0% {opacity:0; transform:translate(0,50%);}
    50% {opacity:1; transform:translate(0,50%);}
    100% {opacity:1; transform:translate(0,0);}
}

@keyframes mv_symbol_l {
    0% {opacity:0; transform:translate(-30%,-30%);}
    100% {opacity:1; transform:translate(0,0);}
}

@keyframes mv_symbol_r {
    0% {opacity:0; transform:translate(30%,30%);}
    100% {opacity:1; transform:translate(0,0);}
}



/*INVIEW*/
.inviewfadeInUp {
opacity:0;
transform:translate(0,20%);
transition:0.5s ease;
}

.fadeInUp {
opacity:1;
transform:translate(0, 0);
}

.inviewfadeInRight {
opacity:0;
transform:translate(20%,0);
transition:0.5s ease;
}

.fadeInRight {
opacity:1;
transform:translate(0, 0);
}

.inviewfadeInDown {
opacity:0;
transform:translate(0,-20%);
transition:0.5s ease;
}

.fadeInDown {
opacity:1;
transform:translate(0, 0);
}

.inviewfadeInLeft {
opacity:0;
transform:translate(-20%,0);
transition:0.5s ease;
}

.fadeInLeft {
opacity:1;
transform:translate(0, 0);
}

.inviewfadeIn {
opacity:0;
transition:0.5s ease;
}

.fadeIn {
opacity:1;
}

.inviewfadeInLine {
width:0;
transition:0.5s ease;
}

.fadeInLine {
width:60px;
height:1px;
}

.inviewfadeInTriangleLeft {
opacity:0;
transform:translate(-90%,0);
transition:0.5s ease;
}

.fadeInTriangleLeft {
opacity:1;
transform:translate(0, 0);
}

.inviewfadeInTriangleRight {
opacity:0;
transform:translate(90%,0);
transition:0.5s ease;
}

.fadeInTriangleRight {
opacity:1;
transform:translate(0, 0);
}