@charset "utf-8";


/* scale */
@-webkit-keyframes scaleDown {
    0% {-webkit-transform: scale(1.07); transform: scale(1.07);}
    100% {-webkit-transform: scale(1); transform: scale(1);}
}

@keyframes scaleDown {
    0% {-webkit-transform: scale(1.07); transform: scale(1.07);}
    100% {-webkit-transform: scale(1); transform: scale(1);}
}


/* swing */
@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }

    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }

    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }

    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }

    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }

    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }

    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}


/* shakeX */
@-webkit-keyframes shakeX {
	0%,to {
		-webkit-transform:translateZ(0);
		transform:translateZ(0)
	}

	10%,30%,50%,70%,90% {
		-webkit-transform:translate3d(-8px,0,0);
		transform:translate3d(-8px,0,0)
	}

	20%,40%,60%,80% {
		-webkit-transform:translate3d(8px,0,0);
		transform:translate3d(8px,0,0)
	}
}
@keyframes shakeX {
	0%,to {
		-webkit-transform:translateZ(0);
		transform:translateZ(0)
	}

	10%,30%,50%,70%,90%{
		-webkit-transform:translate3d(-8px,0,0);
		transform:translate3d(-8px,0,0)
	}

	20%,40%,60%,80% {
		-webkit-transform:translate3d(8px,0,0);
		transform:translate3d(8px,0,0)
	}
}




/* fade up */
@keyframes fadeUp{
	0% {
		transform:translateY(30px);
		opacity:0;
	}
	100% {
		transform:translateY(0);
		opacity:1;
	}
}



/* twinkle */
@keyframes twinkle{
	0%{
		opacity:1;
	}
	20%{
		opacity:0.5;
	}
	40%{
		opacity:0.8;
	}
	80%{
		opacity:0.7;
	}
	100%{
		opacity:1;
	}
}



/* bg gradi */
@keyframes bgGradi {
    0% {
        background-position: 100% 100%;
    }

    50% {
        background-position: 0 100%;
    }

    100% {
        background-position: 100% 100%;
    }
}