.ani,
.ani_load{
    opacity: 0;
}

@keyframes bar_ani{
    0%{
        width: 0%;
    }
    100%{
        width: 100%;
    }
}
@keyframes bar_ani02{
    0%{
        height: 0%;
    }
    100%{
        height: 100%;
    }
}

@keyframes fade{
	0%{opacity:0;}
	100%{opacity:1;}
}
@keyframes fadeUp30{
	0%{opacity:0; transform:translateY(30px);}
	100%{opacity:1; transform:translateY(0);}
}

@keyframes fadeUp50{
	0%{opacity:0; transform:translateY(50px);}
	100%{opacity:1; transform:translateY(0);}
}

@keyframes fadeUp100{
	0%{opacity:0; transform:translateY(100px);}
	100%{opacity:1; transform:translateY(0);}
}

@keyframes fadeDown30{
	0%{opacity:0; transform:translateY(-30px);}
	100%{opacity:1; transform:translateY(0);}
}

@keyframes fadeDown50{
	0%{opacity:0; transform:translateY(-50px);}
	100%{opacity:1; transform:translateY(0);}
}

@keyframes fadeDown100{
	0%{opacity:0; transform:translateY(-100px);}
	100%{opacity:1; transform:translateY(0);}
}

@keyframes fadeUpDown{
	0%{opacity:0; transform:translateY(20px);}
	50%{opacity:1; transform:translateY(-10px);}
	100%{opacity:1; transform:translateY(0);}
}

@keyframes fadeLeft30{
	0%{opacity:0; transform:translateX(-30px);}
	100%{opacity:1; transform:translateX(0);}
}
@keyframes fadeLeft50{
	0%{opacity:0; transform:translateX(-50px);}
	100%{opacity:1; transform:translateX(0);}

}

@keyframes fadeRight50{
	0%{opacity:0; transform:translateX(50px);}
	100%{opacity:1; transform:translateX(0);}
}
@keyframes fadeRight100{
	0%{opacity:0; transform:translateX(100px);}
	100%{opacity:1; transform:translateX(0);}
}

@keyframes scaleDown{
	0%{}
	100%{opacity:1; transform:scale(1);}
}

@keyframes scaleUp{
	0%{transform:scale(1);}
	100%{transform:scale(1.05);}
}

@keyframes scaleUpDown{
	0%{transform:scale(1);}
	50%{transform:scale(1.1);}
	100%{transform:scale(1);}
}



