/*



CORE CSS 

Author: Hao Nhien Nguyen

Licensed to: Touch Pride Pty Ltd



*/



/* Safari */

@-webkit-keyframes spin-l2r {

  0% { transform: rotate(0deg); }

  50% { transform: rotate(-360deg); }

  75% { transform: rotate(0deg); }

  100% { transform: rotate(720deg); }

}



@keyframes spin-l2r {

  0% { transform: rotate(0deg); }

  50% { transform: rotate(-360deg); }

  75% { transform: rotate(0deg); }

  100% { transform: rotate(720deg); }

}

@-webkit-keyframes spin-l {

  0% { transform: rotate(0deg); }

  100% { transform: rotate(-360deg); }


}


@keyframes spin-l {

  0% { transform: rotate(0deg); }

  100% { transform: rotate(-360deg); }


}

@-webkit-keyframes spin-r {

  0% { transform: rotate(0deg); }

  100% { transform: rotate(360deg); }


}

@keyframes spin-r {

  0% { transform: rotate(0deg); }

  100% { transform: rotate(360deg); }


}


@-webkit-keyframes shake {

  0% { transform: rotate(0deg); }

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

  20% { transform: rotate(0deg); }

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

  40% { transform: rotate(0deg); }

  50% { transform: rotate(0deg); }

  60% { transform: rotate(10deg); }

  70% { transform: rotate(0deg); }

  80% { transform: rotate(10deg); }

  90% { transform: rotate(0deg); }

  100% { transform: rotate(0deg); }

}



@keyframes shake {

  0% { transform: rotate(0deg); }

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

  20% { transform: rotate(0deg); }

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

  40% { transform: rotate(0deg); }

  50% { transform: rotate(0deg); }

  60% { transform: rotate(10deg); }

  70% { transform: rotate(0deg); }

  80% { transform: rotate(10deg); }

  90% { transform: rotate(0deg); }

  100% { transform: rotate(0deg); }

}



@keyframes flyin-l {

  0% {opacity:0; transform: translateX(-100%); }

  100% {opacity:1; transform: translate(0); }

}



@-webkit-keyframes flyin-l {

  0% {opacity:0; transform: translateX(-100%); }

  100% {opacity:1; transform: translate(0); }

}



@keyframes flyin-r {

  0% {opacity:0; transform: translateX(100%); }

  100% {opacity:1; transform: translate(0); }

}



@-webkit-keyframes flyin-r {

  0% {opacity:0; transform: translateX(100%); }

  100% {opacity:1; transform: translate(0); }

}



@keyframes flyin-u {

  0% {opacity:0; transform: translateY(-100%); }

  100% {opacity:1; transform: translate(0); }

}



@-webkit-keyframes flyin-u {

  0% {opacity:0; transform: translateY(-100%); }

  100% {opacity:1; transform: translate(0); }

}



@keyframes flyout-u {

  0% {opacity:1; transform: translate(0); }

  100% {opacity:0; transform: translateY(-100%); }

}



@keyframes flyout-l {

  0% {opacity:1; transform: translate(0); }

  100% {opacity:0; transform: translateX(-100%); }

}



@keyframes flyin-d {

  0% {opacity:0; transform: translateY(100%); }

  100% {opacity:1; transform: translate(0); }

}



@-webkit-keyframes flyin-d {

  0% {opacity:0; transform: translateY(100%); }

  100% {opacity:1; transform: translate(0); }

}



@keyframes fadeIn1 {

  0% {opacity:0; }

  100% {opacity:1; }

}



@keyframes fadeOut1 {

  0% {opacity:1; }

  100% {opacity:0; }

}



@keyframes growBoth {

  0% {opacity:0; transform: scale(0); }

  100% {opacity:1; transform: scale(1); }

}



@keyframes growX {

  0% {opacity:0; transform: scale(0,1); }

  100% {opacity:1; transform: scale(1,1); }

}



@keyframes shrinkBoth {

  0% {opacity:0; transform: scale(10); }

  100% {opacity:1; transform: scale(1); }

}



/*Ele*/



@keyframes bg-fly {

  0% { background-position: top left; }

  20% { background-position: bottom right; }

  35% { background-position: bottom left; }

  55% { background-position: top right; }

  70% { background-position: top left; }

  75% { background-position: bottom left; }

  85% { background-position: bottom right; }

  90% { background-position: top right; }

  100% { background-position: top left; }

}



.banner-fly

{

	animation: bg-fly 20s linear infinite;

}



.loader {

  border: 8px solid #f3f3f3;

  border-radius: 50%;

  border-top: 8px solid #3ba0;

  border-bottom: 8px solid #3ba0;

  width: 120px;

  height: 120px;

  -webkit-animation: spin 4s linear infinite; /* Safari */

  animation: spin-l2r 4s linear infinite;

}



.preAnim1

{

	opacity:0;

}



.preAnim2

{

	opacity:0;

	transform: translateX(100%);

}



.shakeItem

{

	-webkit-animation: shake 2s linear infinite; /* Safari */

	animation: shake 2s linear infinite;

}



.flyinlItem

{

	-webkit-animation: flyin-l 0.5s linear; /* Safari */

	animation: flyin-l 0.5s linear;

}



.flyinrItem

{

	-webkit-animation: flyin-r 0.5s linear; /* Safari */

	animation: flyin-r 0.5s linear;

}



.flyinuItem

{

	-webkit-animation: flyin-u 0.5s linear; /* Safari */

	animation: flyin-u 0.5s linear;

}



.flyindItem

{

	-webkit-animation: flyin-d 0.5s linear; /* Safari */

	animation: flyin-d 0.5s linear;

}