.mod-anim {
  opacity: 0;
  -webkit-transition-delay: 0.2s;
  -o-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transition-duration: 0.7s;
  -o-transition-duration: 0.7s;
  transition-duration: 0.7s;
  -webkit-transition-property: opacity,-webkit-transform;
  transition-property: opacity,-webkit-transform;
  -o-transition-property: opacity,transform;
  transition-property: opacity,transform;
  transition-property: opacity,transform,-webkit-transform; }
  .mod-anim.mod-anim--fade.js-active {
    opacity: 1; }
  .mod-anim.mod-anim--top {
    -webkit-transform: translate(0, -100px);
    -ms-transform: translate(0, -100px);
    transform: translate(0, -100px); }
    .mod-anim.mod-anim--top.js-active {
      opacity: 1;
      -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      transform: translate(0, 0); }
  .mod-anim.mod-anim--bottom {
    -webkit-transform: translate(0, 100px);
    -ms-transform: translate(0, 100px);
    transform: translate(0, 100px); }
    .mod-anim.mod-anim--bottom.js-active {
      opacity: 1;
      -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      transform: translate(0, 0); }
  .mod-anim.mod-anim--right {
    -webkit-transform: translate(100px, 0);
    -ms-transform: translate(100px, 0);
    transform: translate(100px, 0); }
    .mod-anim.mod-anim--right.js-active {
      opacity: 1;
      -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      transform: translate(0, 0); }
  .mod-anim.mod-anim--left {
    -webkit-transform: translate(-100px, 0);
    -ms-transform: translate(-100px, 0);
    transform: translate(-100px, 0); }
    .mod-anim.mod-anim--left.js-active {
      opacity: 1;
      -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      transform: translate(0, 0); }
  .mod-anim.mod-anim--zoom {
    -webkit-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    transform: scale(0, 0); }
    .mod-anim.mod-anim--zoom.js-active {
      opacity: 1;
      -webkit-transform: scale(1, 1);
      -ms-transform: scale(1, 1);
      transform: scale(1, 1); }
  .mod-anim.mod-anim--zoom2 {
    -webkit-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    transform: scale(0, 0);
    -webkit-transition-timing-function: cubic-bezier(0, 0.75, 0.6, 1.4);
    -o-transition-timing-function: cubic-bezier(0, 0.75, 0.6, 1.4);
    transition-timing-function: cubic-bezier(0, 0.75, 0.6, 1.4); }
    .mod-anim.mod-anim--zoom2.js-active {
      opacity: 1;
      -webkit-transform: scale(1, 1);
      -ms-transform: scale(1, 1);
      transform: scale(1, 1); }
  .mod-anim.mod-anim--zoom3 {
    -webkit-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    transform: scale(0, 0);
    -webkit-transition-timing-function: cubic-bezier(0.8, 0, 0, 0.4);
    -o-transition-timing-function: cubic-bezier(0.8, 0, 0, 0.4);
    transition-timing-function: cubic-bezier(0.8, 0, 0, 0.4); }
    .mod-anim.mod-anim--zoom3.js-active {
      opacity: 1;
      -webkit-transform: scale(1, 1);
      -ms-transform: scale(1, 1);
      transform: scale(1, 1); }
  .mod-anim.mod-anim--blur {
    -webkit-filter: blur(15px);
    filter: blur(15px);
    -webkit-transition-property: opacity,-webkit-transform,-webkit-filter;
    transition-property: opacity,-webkit-transform,-webkit-filter;
    -o-transition-property: opacity,transform,filter;
    transition-property: opacity,transform,filter;
    transition-property: opacity,transform,filter,-webkit-transform,-webkit-filter;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden; }
    .mod-anim.mod-anim--blur.js-active {
      opacity: 1;
      -webkit-filter: blur(0);
      filter: blur(0); }
  .mod-anim.mod-anim--text {
    overflow: hidden;
    opacity: 1;
    display: inline-block; }
    .mod-anim.mod-anim--text .mod-anim__inner {
      display: block;
      position: relative;
      height: 100%;
      -webkit-transition-property: -webkit-transform;
      transition-property: -webkit-transform;
      -o-transition-property: transform;
      transition-property: transform;
      transition-property: transform, -webkit-transform;
      -webkit-transition-duration: 0.5s;
      -o-transition-duration: 0.5s;
      transition-duration: 0.5s;
      -webkit-transform: translate(-100%, 0);
      -ms-transform: translate(-100%, 0);
      transform: translate(-100%, 0); }
      .mod-anim.mod-anim--text .mod-anim__inner:after {
        content: "";
        display: block;
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        bottom: 0px;
        background: #888;
        -webkit-transition-property: -webkit-transform;
        transition-property: -webkit-transform;
        -o-transition-property: transform;
        transition-property: transform;
        transition-property: transform, -webkit-transform;
        -webkit-transition-delay: 0.7s;
        -o-transition-delay: 0.7s;
        transition-delay: 0.7s;
        -webkit-transition-duration: 0.5s;
        -o-transition-duration: 0.5s;
        transition-duration: 0.5s;
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        transform: translate(0, 0); }
    .mod-anim.mod-anim--text.mod-anim--delay-02.js-active .mod-anim__inner {
      -webkit-transition-delay: 0.2s;
      -o-transition-delay: 0.2s;
      transition-delay: 0.2s; }
    .mod-anim.mod-anim--text.mod-anim--delay-04.js-active .mod-anim__inner {
      -webkit-transition-delay: 0.4s;
      -o-transition-delay: 0.4s;
      transition-delay: 0.4s; }
    .mod-anim.mod-anim--text.mod-anim--delay-06.js-active .mod-anim__inner {
      -webkit-transition-delay: 0.6s;
      -o-transition-delay: 0.6s;
      transition-delay: 0.6s; }
    .mod-anim.mod-anim--text.js-active .mod-anim__inner {
      -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      transform: translate(0, 0); }
      .mod-anim.mod-anim--text.js-active .mod-anim__inner:after {
        -webkit-transform: translate(100%, 0);
        -ms-transform: translate(100%, 0);
        transform: translate(100%, 0); }

.mod-anim.mod-anim--delay-00 {
  -webkit-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s; }

.mod-anim.mod-anim--delay-02 {
  -webkit-transition-delay: 0.2s;
  -o-transition-delay: 0.2s;
  transition-delay: 0.2s; }

.mod-anim.mod-anim--delay-04 {
  -webkit-transition-delay: 0.4s;
  -o-transition-delay: 0.4s;
  transition-delay: 0.4s; }

.mod-anim.mod-anim--delay-06 {
  -webkit-transition-delay: 0.6s;
  -o-transition-delay: 0.6s;
  transition-delay: 0.6s; }

.mod-anim.mod-anim--delay-08 {
  -webkit-transition-delay: 0.8s;
  -o-transition-delay: 0.8s;
  transition-delay: 0.8s; }

.mod-anim.mod-anim--delay-10 {
  -webkit-transition-delay: 1.0s;
  -o-transition-delay: 1.0s;
  transition-delay: 1.0s; }

.mod-anim.mod-anim--delay-15 {
  -webkit-transition-delay: 1.5s;
  -o-transition-delay: 1.5s;
  transition-delay: 1.5s; }

.mod-anim.mod-anim--delay-20 {
  -webkit-transition-delay: 2.0s;
  -o-transition-delay: 2.0s;
  transition-delay: 2.0s; }

/* ----------------------------------------------------------
loop
---------------------------------------------------------- */
.mod-anim.mod-anim--fadeloop.js-active {
  -webkit-animation: infinite_loop_opacity 1s ease-in-out 0s infinite alternate;
  animation: infinite_loop_opacity 1s ease-in-out 0s infinite alternate; }

.mod-anim.mod-anim--vertical-loop.js-active {
  opacity: 1;
  -webkit-animation: infinite_loop_bounce 1s ease-in-out 0s infinite alternate;
  animation: infinite_loop_bounce 1s ease-in-out 0s infinite alternate; }

.mod-anim.mod-anim--rotate {
  display: block;
  opacity: 1;
  -webkit-animation: infinite_loop_rotate 1s linear 0s infinite;
  animation: infinite_loop_rotate 1s linear 0s infinite; }

/* ----------------------------------------------------------
@keyframes
---------------------------------------------------------- */
@-webkit-keyframes infinite_loop_opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes infinite_loop_opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-webkit-keyframes infinite_loop_bounce {
  0% {
    -webkit-transform: translate3d(0, 0, -5px);
    transform: translate3d(0, 0, -5px); }
  100% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0); } }

@keyframes infinite_loop_bounce {
  0% {
    -webkit-transform: translate3d(0, 0, -5px);
    transform: translate3d(0, 0, -5px); }
  100% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0); } }

@-webkit-keyframes infinite_loop_rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }

@keyframes infinite_loop_rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }