/* -- loader -- */
#loader{
	top: 0;
	left: 0;
	z-index: 9999;
	transition: -webkit-transform 1s cubic-bezier(0.5, 0, 0, 1);
    transition: transform 1.5s cubic-bezier(0.5, 0, 0, 1);
    transition: transform 1.5s cubic-bezier(0.5, 0, 0, 1), -webkit-transform 1s cubic-bezier(0.5, 0, 0, 1);
}
#loader.load_bg {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
}
.load_logo figure{
	opacity: 0;
	-webkit-transform: translateX(100px);
    transform: translateX(100px);
	transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    transition-duration: 1.5s;
    transition-delay:1s;
    transition-timing-function: cubic-bezier(0.2, 0.8, 0.7, 1);
	max-width: 300px;
	z-index: 2;
}
#loader.load .load_logo figure{
	-webkit-transform: translateX(0px); 
    transform: translateX(0px);
    opacity: 1.0;
}
#loading_line,#loading_bg{
	bottom: 0;
	left: 0;
	margin: auto;
	height: 100vh;
	-webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    transition: -webkit-transform .65s cubic-bezier(0.3, 1, 0.1, 1);
    transition: transform .65s cubic-bezier(0.3, 1, 0.1, 1);
    transition: transform .65s cubic-bezier(0.3, 1, 0.1, 1), -webkit-transform .65s cubic-bezier(0.3, 1, 0.1, 1);
	z-index: -2;
}
#loading_line{
    background-color: #ff006a;
}
#loading_bg{z-index: -1;transition-delay: .55s}
#loader.load #loading_line,#loader.load #loading_bg{transform: scaleY(1);}

#main .xt.animStart h2,#main_img .txt.animStart p{opacity: 0;}
#main .main_box.animStart h1{animation: heroText 600ms 800ms both;}
#main .main_box.animStart h2{animation: heroText 600ms 1000ms both;}
#main .main_box.animStart div{animation: heroText 600ms 1100ms both;}
@-webkit-keyframes heroText {
0% {
	opacity: 0;
	-webkit-transform: translate(50px, 0);
	transform: translate(50px, 0)
}
100% {
	opacity: 1;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0)
}
}
@keyframes heroText {
0% {
	opacity: 0;
	-webkit-transform: translate(50px, 0);
	transform: translate(50px, 0)
}
100% {
	opacity: 1;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0)
}
}

@-webkit-keyframes animText {
0% {
	opacity: 0;
	-webkit-transform: translate(0, 15px);
	transform: translate(0, 15px)
}
100% {
	opacity: 1;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0)
}
}
@keyframes animText {
0% {
	opacity: 0;
	-webkit-transform: translate(0, 15px);
	transform: translate(0, 15px)
}
100% {
	opacity: 1;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0)
}
}