/* ==========================================================================*/
/* bounce */
/* ==========================================================================*/

/* Transition bounce - (in)
-----------------------------------------------------------------------------*/

@-webkit-keyframes bounce-in {
    0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  70% {
    -webkit-transform: scale(.9);
    transform: scale(.9);
  }

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

@-moz-keyframes bounce-in {
    0% {
        opacity: 0;
        transform: scale(.3);
    }

    50% {
        opacity: 1;
        transform: scale(1.05);
    }

    70% {
        transform: scale(.9);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@-ms-keyframes bounce-in {
        0% {
            opacity: 0;
            transform: scale(.3);
        }

        50% {
            opacity: 1;
            transform: scale(1.05);
        }

        70% {
            transform: scale(.9);
        }

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

@-o-keyframes bounce-in {
        0% {
            opacity: 0;
            transform: scale(.3);
        }

        50% {
            opacity: 1;
            transform: scale(1.05);
        }

        70% {
            transform: scale(.9);
        }

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

@keyframes bounce-in {
        0% {
            opacity: 0;
            transform: scale(.3);
        }

        50% {
            opacity: 1;
            transform: scale(1.05);
        }

        70% {
            transform: scale(.9);
        }

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

.transition-bounce-in .bounce-in-transition-view-to-show {
    -webkit-animation: bounce-in 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    -moz-animation: bounce-in 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    -ms-animation: bounce-in 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    -o-animation: bounce-in 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    animation: bounce-in 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    z-index: 100;
}

.transition-bounce-in .bounce-in-transition-view-to-hide {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 50;
}

/* Transition bounce  (out)
-----------------------------------------------------------------------------*/

@-webkit-keyframes bounce-out {
   0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  25% {
    -webkit-transform: scale(.95);
    transform: scale(.95);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }
}

@-moz-keyframes bounce-out {
    0% {
        transform: scale(1);
    }

    25% {
        transform: scale(.95);
    }

    50% {
        opacity: 1;
        transform: scale(1.1);
    }

    100% {
        opacity: 0;
        transform: scale(.3);
    }
}


@-ms-keyframes bounce-out {
    0% {
        transform: scale(1);
    }

    25% {
        transform: scale(.95);
    }

    50% {
        opacity: 1;
        transform: scale(1.1);
    }

    100% {
        opacity: 0;
        transform: scale(.3);
    }
}

@-o-keyframes bounce-out {
    0% {
        transform: scale(1);
    }

    25% {
        transform: scale(.95);
    }

    50% {
        opacity: 1;
        transform: scale(1.1);
    }

    100% {
        opacity: 0;
        transform: scale(.3);
    }
}


@keyframes bounce-out {
    0% {
        transform: scale(1);
    }


    25% {
        transform: scale(.95);
    }

    50% {
        opacity: 1;
        transform: scale(1.1);
    }

    100% {
        opacity: 0;
        transform: scale(.3);
    }
}

.transition-bounce-out .bounce-out-transition-view-to-show {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 50;
}

.transition-bounce-out .bounce-out-transition-view-to-hide {
     -webkit-animation: bounce-out 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    -moz-animation: bounce-out 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    -ms-animation: bounceout 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    -o-animation: bounce-out 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    animation: bounce-out 400ms 1 cubic-bezier(0.5, 0.1, 0.5, 1.0);
    z-index: 100;
}