/**
Animate CSS Class for TXIdea,A 2015-07-22.
------------------------------------------
Please REMOVE webkit&moz prefix if old version layout engine is no longer for use.
**/
/* Ten years red logo scale */
.ease_out_2 {
  animation:anim_ease_out_2 1s cubic-bezier(.27,.51,.37,.85);
  /* Special prefix for old webkit & gecko*/
  -webkit-animation:anim_ease_out_2 1s cubic-bezier(.27,.51,.37,.85);
  -moz-animation:anim_ease_out_2 1s cubic-bezier(.27,.51,.37,.85);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
}
@keyframes anim_ease_out_2 {
  0% {
      transform: scale(0.1,0.1);
      opacity: 0;
  }
  100%{
      transform: scale(1,1);
      opacity: 1;
  }
}
/* Special prefix for old webkit & gecko*/
@-webkit-keyframes anim_ease_out_2 {
  0% {
      -webkit-transform: scale(0.1,0.1);
      opacity: 0;
  }
  100%{
      -webkit-transform: scale(1,1);
      opacity: 1;
  }
}
@-moz-keyframes anim_ease_out_2 {
  0% {
      transform: scale(0.1,0.1);
  }
  100%{
      transform: scale(1,1);
  }
}

.rotate_180_show {
  animation: anim_rotate_180_show 1s ease-in-out;
  -webkit-animation: anim_rotate_180_show 1s ease-in-out;
  -moz-animation: anim_rotate_180_show 1s ease-in-out;
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
}
@keyframes anim_rotate_180_show {
  0% {
    transform: rotateY(180deg);
  }
  100% {
    transform: rotateY(0deg);
  }
}
@-webkit-keyframes anim_rotate_180_show {
  0% {
    -webkit-transform: rotateY(180deg);
  }
  100% {
    -webkit-transform: rotateY(0deg);
  }
}
@-moz-keyframes anim_rotate_180_show {
  0% {
    transform: rotateY(180deg);
  }
  100% {
    transform: rotateY(0deg);
  }
}
.rotate_180_hide {
  animation: anim_rotate_180_hide 1s ease-in-out;
  -webkit-animation: anim_rotate_180_hide 1s ease-in-out;
  -moz-animation: anim_rotate_180_hide 1s ease-in-out;
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
}
@keyframes anim_rotate_180_hide {
  0% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(180deg);
  }
}
@-webkit-keyframes anim_rotate_180_hide {
  0% {
    -webkit-transform: rotateY(0deg);
  }
  100% {
    -webkit-transform: rotateY(180deg);
  }
}
@-moz-keyframes anim_rotate_180_hide {
  0% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(180deg);
  }
}
.scale_hide {
  animation: anim_scale_hide 500ms ease-in-out;
  -webkit-animation: anim_scale_hide 500ms ease-in-out;
  -moz-animation: anim_scale_hide 500ms ease-in-out;
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode:forwards;
  -moz-animation-fill-mode:forwards;
}
@keyframes anim_scale_hide {
  0% {
    transform: scale(1,1);
    opacity: 1;
  }
  100% {
    transform: scale(2,2);
    opacity: 0;
  }
}
@-webkit-keyframes anim_scale_hide {
  0% {
    -webkit-transform: scale(1,1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2,2);
    opacity: 0;
  }
}
@-moz-keyframes anim_scale_hide {
  0% {
    transform: scale(1,1);
    opacity: 1;
  }
  100% {
    transform: scale(2,2);
    opacity: 0;
  }
}
.scale_show {
  animation: anim_scale_show 1s cubic-bezier(.27,.51,.37,.85);
  -webkit-animation: anim_scale_show 1s cubic-bezier(.27,.51,.37,.85);
  -moz-animation: anim_scale_show 1s cubic-bezier(.27,.51,.37,.85);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-delay: 500ms;
  -webkit-animation-delay: 500ms;
  -moz-animation-delay: 500ms;
}
@keyframes anim_scale_show {
  0% {
    transform: scale(0,0);
    opacity: 0;
  }
  100% {
    transform: scale(1,1);
    opacity: 1;
  }
}
@-webkit-keyframes anim_scale_show {
  0% {
    -webkit-transform: scale(0,0);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1,1);
    opacity: 1;
  }
}
@-moz-keyframes anim_scale_show {
  0% {
    transform: scale(0,0);
    opacity: 0;
  }
  100% {
    transform: scale(1,1);
    opacity: 1;
  }
}
/* Text 'tian' fade in */
.logo_tian_fadein {
  animation: anim_logo_tian_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -webkit-animation: anim_logo_tian_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -moz-animation: anim_logo_tian_fadein 1s cubic-bezier(.39,.64,.37,.94);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-delay: 2.2s;
  -webkit-animation-delay: 2.2s;
  -moz-animation-delay: 2.2s;
}
@keyframes anim_logo_tian_fadein {
  0% {
      background-position: 0px -255px;
      opacity: 0;
  }
  100% {
      background-position: 0px 0px;
      opacity: 1;
  }
}
@-webkit-keyframes anim_logo_tian_fadein {
  0% {
    background-position: 0px -255px;
    opacity: 0;
  }
  100% {
    background-position: 0px 0px;
    opacity: 1;
  }
}
@-moz-keyframes anim_logo_tian_fadein {
  0% {
    background-position: 0px -255px;
    opacity: 0;
  }
  100% {
    background-position: 0px 0px;
    opacity: 1;
  }
}
/* Text 'shi' fade in */
.logo_shi_fadein {
  animation: anim_logo_shi_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -webkit-animation: anim_logo_shi_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -moz-animation: anim_logo_shi_fadein 1s cubic-bezier(.39,.64,.37,.94);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-delay: 2s;
  -webkit-animation-delay: 2s;
  -moz-animation-delay: 2s;
}
@keyframes anim_logo_shi_fadein {
  0% {
      background-position: -399px 0px;
      opacity: 0;
  }
  100% {
      background-position: 0px 0px;
      opacity: 1;
  }
}
@-webkit-keyframes anim_logo_shi_fadein {
  0% {
      background-position: -399px 0px;
      opacity: 0;
  }
  100% {
      background-position: 0px 0px;
      opacity: 1;
  }
}
@-moz-keyframes anim_logo_shi_fadein {
  0% {
      background-position: -399px 0px;
      opacity: 0;
  }
  100% {
      background-position: 0px 0px;
      opacity: 1;
  }
}
/* Text 'nian' fade in */
.logo_nian_fadein {
  animation: anim_logo_nian_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -webkit-animation: anim_logo_nian_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -moz-animation: anim_logo_nian_fadein 1s cubic-bezier(.39,.64,.37,.94);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-delay: 2s;
  -webkit-animation-delay: 2s;
  -moz-animation-delay: 2s;
}
@keyframes anim_logo_nian_fadein {
  0% {
      background-position: 235px 0px;
      opacity: 0;
  }
  100% {
      background-position: 0px 0px;
      opacity: 1;
  }
}
@-webkit-keyframes anim_logo_nian_fadein {
  0% {
      background-position: 235px 0px;
      opacity: 0;
  }
  100% {
      background-position: 0px 0px;
      opacity: 1;
  }
}
@-moz-keyframes anim_logo_nian_fadein {
  0% {
      background-position: 235px 0px;
      opacity: 0;
  }
  100% {
      background-position: 0px 0px;
      opacity: 1;
  }
}
.logo_tenyears_2_intro_fadein {
  animation: anim_logo_tenyears_2_intro_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -webkit-animation: anim_logo_tenyears_2_intro_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -moz-animation: anim_logo_tenyears_2_intro_fadein 1s cubic-bezier(.39,.64,.37,.94);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-delay: 3s;
  -webkit-animation-delay: 3s;
  -moz-animation-delay: 3s;
}
@keyframes anim_logo_tenyears_2_intro_fadein {
  0% {
    transform: translateY(500px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1
  }
}
@-webkit-keyframes anim_logo_tenyears_2_intro_fadein {
  0% {
    -webkit-transform: translateY(500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0px);
    opacity: 1
  }
}
@-moz-keyframes anim_logo_tenyears_2_intro_fadein {
  0% {
    transform: translateY(500px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1
  }
}
/* Ten years intro scale */
/**.logo_intro_scale {
  animation: anim_ease_out_2 800ms cubic-bezier(.39,.64,.37,.94);
  -webkit-animation: anim_ease_out_2 800ms cubic-bezier(.39,.64,.37,.94);
  -moz-animation: anim_ease_out_2 800ms cubic-bezier(.39,.64,.37,.94);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-delay: 1.4s;
  -webkit-animation-delay: 1.4s;
  -moz-animation-delay: 1.4s;
}**/
.logo_intro_title_fadein {
  animation: anim_logo_intro_title 800ms cubic-bezier(.39,.64,.37,.94);
  -webkit-animation: anim_logo_intro_title 800ms cubic-bezier(.39,.64,.37,.94);
  -moz-animation: anim_logo_intro_title 800ms cubic-bezier(.39,.64,.37,.94);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-delay: 1.4s;
  -webkit-animation-delay: 1.4s;
  -moz-animation-delay: 1.4s;
}
@keyframes anim_logo_intro_title {
  0% {
    transform: translate(-500px,0px);
    opacity: 0;
  }
  100% {
    transform: translate(0px,0px);
    opacity: 1;
  }
}
@-webkit-keyframes anim_logo_intro_title {
  0% {
    -webkit-transform: translate(-500px,0px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0px,0px);
    opacity: 1;
  }
}
@-moz-keyframes anim_logo_intro_title {
  0% {
    transform: translate(-500px,0px);
    opacity: 0;
  }
  100% {
    transform: translate(0px,0px);
    opacity: 1;
  }
}
.logo_intro_content_fadein {
  animation: anim_logo_intro_content 800ms cubic-bezier(.39,.64,.37,.94);
  -webkit-animation: anim_logo_intro_content 800ms cubic-bezier(.39,.64,.37,.94);
  -moz-animation: anim_logo_intro_content 800ms cubic-bezier(.39,.64,.37,.94);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-delay: 1.4s;
  -webkit-animation-delay: 1.4s;
  -moz-animation-delay: 1.4s;
}
@keyframes anim_logo_intro_content {
  0% {
    transform: translate(500px,0px);
    opacity: 0;
  }
  100% {
    transform: translate(0px,0px);
    opacity: 1;
  }
}
@-webkit-keyframes anim_logo_intro_content {
  0% {
    -webkit-transform: translate(500px,0px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0px,0px);
    opacity: 1;
  }
}
@-moz-keyframes anim_logo_intro_content {
  0% {
    transform: translate(500px,0px);
    opacity: 0;
  }
  100% {
    transform: translate(0px,0px);
    opacity: 1;
  }
}
/* Text 'xing' fade in */
.logo_xing_fadein {
  animation: anim_logo_xing_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -webkit-animation: anim_logo_xing_fadein 1s cubic-bezier(.39,.64,.37,.94);
  -moz-animation: anim_logo_xing_fadein 1s cubic-bezier(.39,.64,.37,.94);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-delay: 2.2s;
  -webkit-animation-delay: 2.2s;
  -moz-animation-delay: 2.2s;
}
@keyframes anim_logo_xing_fadein {
   0% {
      background-position: 0px 255px;
      opacity: 0;
  }
  100% {
      background-position: 0px 0px;
      opacity: 1;
  }
}
@-webkit-keyframes anim_logo_xing_fadein {
  0% {
    background-position: 0px 255px;
    opacity: 0;
  }
  100% {
    background-position: 0px 0px;
    opacity: 1;
  }
}
@-moz-keyframes anim_logo_xing_fadein {
  0% {
    background-position: 0px 255px;
    opacity: 0;
  }
  100% {
    background-position: 0px 0px;
    opacity: 1;
  }
}

/* We do - arrow move */
.tx_wedo_arrow_move:hover > div {
  animation: anim_wedo_arrow_move 700ms ease-in-out infinite;
  -webkit-animation: anim_wedo_arrow_move 700ms ease-in-out infinite;
  -moz-animation: anim_wedo_arrow_move 700ms ease-in-out infinite;

}
@keyframes anim_wedo_arrow_move {
  0% {
    transform: translate(0px,50px);
  }
  50% {
    transform: translate(0px,30px);
  }
  100% {
    transform: translate(0px,50px);
  }
}
@-webkit-keyframes anim_wedo_arrow_move {
  0% {
    -webkit-transform: translate(0px,50px);
  }
  50% {
    -webkit-transform: translate(0px,30px);
  }
  100% {
    -webkit-transform: translate(0px,50px);
  }
}
@-moz-keyframes anim_wedo_arrow_move {
  0% {
    transform: translate(0px,50px);
  }
  50% {
    transform: translate(0px,30px);
  }
  100% {
    transform: translate(0px,50px);
  }
}

/* We do - plug flag */

.tx_wedo_plug_flag:hover > div {
  animation: anim_wedo_plug_flag 700ms ease-in-out infinite;
  -webkit-animation: anim_wedo_plug_flag 700ms ease-in-out infinite;
  -moz-animation: anim_wedo_plug_flag 700ms ease-out infinite;
}
@keyframes anim_wedo_plug_flag {
  0% {
    transform: translate(0px,-20px);
  }
  50% {
    transform: translate(0px,-30px);
  }
  100% {
    transform: translate(0px,-20px);
  }
}
@-webkit-keyframes anim_wedo_plug_flag {
  0% {
    -webkit-transform: translate(0px,-20px);
  }
  50% {
    -webkit-transform: translate(0px,-30px);
  }
  100% {
    -webkit-transform: translate(0px,-20px);
  }
}
@-moz-keyframes anim_wedo_plug_flag {
  0% {
    transform: translate(0px,-20px);
  }
  50% {
    transform: translate(0px,-30px);
  }
  100% {
    transform: translate(0px,-20px);
  }
}

/* We do - breath bubble */
.tx_wedo_breath_bubble:hover >div {
  animation: anim_wedo_breath_bubble 1s ease-in-out infinite;
  -webkit-animation: anim_wedo_breath_bubble 1s ease-in-out infinite;
  -moz-animation: anim_wedo_breath_bubble 1s ease-in-out infinite;
}
@keyframes anim_wedo_breath_bubble {
  0% {
    transform: scale(1,1);
  }
  50% {
    transform: scale(1.2,1.2);
  }
  100% {
    transform: scale(1,1);
  }
}
@-webkit-keyframes anim_wedo_breath_bubble {
  0% {
    -webkit-transform: scale(1,1);
  }
  50% {
    -webkit-transform: scale(1.2,1.2);
  }
  100% {
    -webkit-transform: scale(1,1);
  }
}
@-moz-keyframes anim_wedo_breath_bubble {
  0% {
    transform: scale(1,1);
  }
  50% {
    transform: scale(1.2,1.2);
  }
  100% {
    transform: scale(1,1);
  }
}

/* We do - shoparrow move */
.tx_wedo_shoparrow_move:hover > a > div > div {
  animation: anim_shoparrow_move 1s ease-out infinite;
  -webkit-animation: anim_shoparrow_move 1s ease-out infinite;
  -moz-animation: anim_shoparrow_move 1s ease-out infinite;
}
@keyframes anim_shoparrow_move {
  0% {
    transform: translate(0px,0px);
  }
  100% {
    transform: translate(-20px,-5px);
  }
}
@-webkit-keyframes anim_shoparrow_move {
  0% {
    -webkit-transform: translate(0px,0px);
  }
  100% {
    -webkit-transform: translate(-20px,-5px);
  }
}
@-moz-keyframes anim_shoparrow_move {
  0% {
    transform: translate(0px,0px);
  }
  100% {
    transform: translate(-20px,-5px);
  }
}

/** Produce info page**/
.pinfo_showcontainer {
  animation: anim_showcontainer 1s ease-out;
  -webkit-animation: anim_showcontainer 1s ease-out;
  -moz-animation: anim_showcontainer 1s ease-out;
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
}
@keyframes anim_showcontainer {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes anim_showcontainer {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes anim_showcontainer {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.pinfo_showinfo {
  animation: anim_showinfo 0.5s ease-out;
  -webkit-animation: anim_showinfo 0.5s ease-out;
  -moz-animation: anim_showinfo 0.5s ease-out;
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
}
@keyframes anim_showinfo {
  0% {
    transform: translateX(-150%);
  }
  100% {
    transform: translateX(0%);
  }
}
@-webkit-keyframes anim_showinfo {
  0% {
    -webkit-transform: translateX(-150%);
  }
  100% {
    -webkit-transform: translateX(0%);
  }
}
@-moz-keyframes anim_showinfo {
  0% {
    -moz-transform: translateX(-150%);
  }
  100% {
    -moz-transform: translateX(0%);
  }
}

.page_scalehide {
  -webkit-animation: anim_page_scalehide 0.3s ease-in;
  -moz-animation: anim_page_scalehide 0.3s ease-in;
  animation: anim_page_scalehide 0.3s ease-in;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
@keyframes anim_page_scalehide {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(100%);
}
@-webkit-keyframes anim_page_scalehide {
  0% {
    -webkit-transform: translateX(0%);
  }
  100% {
    -webkit-transform: translateX(100%);
}
@-moz-keyframes anim_page_scalehide {
  0% {
    -moz-transform: translateX(0%);
  }
  100% {
    -moz-transform: translateX(100%);
}