
/*!
 * animsition v4.0.2
 * A simple and easy jQuery plugin for CSS animated page transitions.
 * http://blivesta.github.io/animsition
 * License : MIT
 * Author : blivesta (http://blivesta.com/)
 */
.animsition,
.animsition-overlay {
    position: relative;
    opacity: 0;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

/**
 * overlay option
 */
.animsition-overlay-slide {
    position: fixed;
    opacity: 1 !important;
    z-index: 6;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: #f22842;
    /*animation: clip-path 3s forwards;*/
}

.clip-path-circle {
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: forwards; /* Chrome 16+, Safari 4+ */
    -moz-animation-fill-mode: forwards; /* FF 5+ */
    -o-animation-fill-mode: forwards; /* Not implemented yet */
    -ms-animation-fill-mode: forwards; /* IE 10+ */
    animation-fill-mode: forwards; /* When the spec is finished */
    -webkit-animation-name: clip-path-circle;
    animation-name: clip-path-circle;
}

@-webkit-keyframes clip-path-circle {
    0% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 0, #000 0);
        mask-image: radial-gradient(circle at 50%, transparent 0, #000 0)
    }
    1% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 1%, #000 1%);
        mask-image: radial-gradient(circle at 50%, transparent 1%, #000 1%)
    }
    2% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 2%, #000 2%);
        mask-image: radial-gradient(circle at 50%, transparent 2%, #000 2%)
    }
    3% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 3%, #000 3%);
        mask-image: radial-gradient(circle at 50%, transparent 3%, #000 3%)
    }
    4% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 4%, #000 4%);
        mask-image: radial-gradient(circle at 50%, transparent 4%, #000 4%)
    }
    5% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 5%, #000 5%);
        mask-image: radial-gradient(circle at 50%, transparent 5%, #000 5%)
    }
    6% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 6%, #000 6%);
        mask-image: radial-gradient(circle at 50%, transparent 6%, #000 6%)
    }
    7% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 7%, #000 7%);
        mask-image: radial-gradient(circle at 50%, transparent 7%, #000 7%)
    }
    8% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 8%, #000 8%);
        mask-image: radial-gradient(circle at 50%, transparent 8%, #000 8%)
    }
    9% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 9%, #000 9%);
        mask-image: radial-gradient(circle at 50%, transparent 9%, #000 9%)
    }
    10% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 10%, #000 10%);
        mask-image: radial-gradient(circle at 50%, transparent 10%, #000 10%)
    }
    11% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 11%, #000 11%);
        mask-image: radial-gradient(circle at 50%, transparent 11%, #000 11%)
    }
    12% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 12%, #000 12%);
        mask-image: radial-gradient(circle at 50%, transparent 12%, #000 12%)
    }
    13% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 13%, #000 13%);
        mask-image: radial-gradient(circle at 50%, transparent 13%, #000 13%)
    }
    14% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 14%, #000 14%);
        mask-image: radial-gradient(circle at 50%, transparent 14%, #000 14%)
    }
    15% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 15%, #000 15%);
        mask-image: radial-gradient(circle at 50%, transparent 15%, #000 15%)
    }
    16% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 16%, #000 16%);
        mask-image: radial-gradient(circle at 50%, transparent 16%, #000 16%)
    }
    17% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 17%, #000 17%);
        mask-image: radial-gradient(circle at 50%, transparent 17%, #000 17%)
    }
    18% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 18%, #000 18%);
        mask-image: radial-gradient(circle at 50%, transparent 18%, #000 18%)
    }
    19% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 19%, #000 19%);
        mask-image: radial-gradient(circle at 50%, transparent 19%, #000 19%)
    }
    20% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 20%, #000 20%);
        mask-image: radial-gradient(circle at 50%, transparent 20%, #000 20%)
    }
    21% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 21%, #000 21%);
        mask-image: radial-gradient(circle at 50%, transparent 21%, #000 21%)
    }
    22% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 22%, #000 22%);
        mask-image: radial-gradient(circle at 50%, transparent 22%, #000 22%)
    }
    23% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 23%, #000 23%);
        mask-image: radial-gradient(circle at 50%, transparent 23%, #000 23%)
    }
    24% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 24%, #000 24%);
        mask-image: radial-gradient(circle at 50%, transparent 24%, #000 24%)
    }
    25% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 25%, #000 25%);
        mask-image: radial-gradient(circle at 50%, transparent 25%, #000 25%)
    }
    26% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 26%, #000 26%);
        mask-image: radial-gradient(circle at 50%, transparent 26%, #000 26%)
    }
    27% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 27%, #000 27%);
        mask-image: radial-gradient(circle at 50%, transparent 27%, #000 27%)
    }
    28% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 28%, #000 28%);
        mask-image: radial-gradient(circle at 50%, transparent 28%, #000 28%)
    }
    29% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 29%, #000 29%);
        mask-image: radial-gradient(circle at 50%, transparent 29%, #000 29%)
    }
    30% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 30%, #000 30%);
        mask-image: radial-gradient(circle at 50%, transparent 30%, #000 30%)
    }
    31% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 31%, #000 31%);
        mask-image: radial-gradient(circle at 50%, transparent 31%, #000 31%)
    }
    32% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 32%, #000 32%);
        mask-image: radial-gradient(circle at 50%, transparent 32%, #000 32%)
    }
    33% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 33%, #000 33%);
        mask-image: radial-gradient(circle at 50%, transparent 33%, #000 33%)
    }
    34% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 34%, #000 34%);
        mask-image: radial-gradient(circle at 50%, transparent 34%, #000 34%)
    }
    35% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 35%, #000 35%);
        mask-image: radial-gradient(circle at 50%, transparent 35%, #000 35%)
    }
    36% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 36%, #000 36%);
        mask-image: radial-gradient(circle at 50%, transparent 36%, #000 36%)
    }
    37% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 37%, #000 37%);
        mask-image: radial-gradient(circle at 50%, transparent 37%, #000 37%)
    }
    38% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 38%, #000 38%);
        mask-image: radial-gradient(circle at 50%, transparent 38%, #000 38%)
    }
    39% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 39%, #000 39%);
        mask-image: radial-gradient(circle at 50%, transparent 39%, #000 39%)
    }
    40% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 40%, #000 40%);
        mask-image: radial-gradient(circle at 50%, transparent 40%, #000 40%)
    }
    41% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 41%, #000 41%);
        mask-image: radial-gradient(circle at 50%, transparent 41%, #000 41%)
    }
    42% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 42%, #000 42%);
        mask-image: radial-gradient(circle at 50%, transparent 42%, #000 42%)
    }
    43% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 43%, #000 43%);
        mask-image: radial-gradient(circle at 50%, transparent 43%, #000 43%)
    }
    44% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 44%, #000 44%);
        mask-image: radial-gradient(circle at 50%, transparent 44%, #000 44%)
    }
    45% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 45%, #000 45%);
        mask-image: radial-gradient(circle at 50%, transparent 45%, #000 45%)
    }
    46% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 46%, #000 46%);
        mask-image: radial-gradient(circle at 50%, transparent 46%, #000 46%)
    }
    47% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 47%, #000 47%);
        mask-image: radial-gradient(circle at 50%, transparent 47%, #000 47%)
    }
    48% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 48%, #000 48%);
        mask-image: radial-gradient(circle at 50%, transparent 48%, #000 48%)
    }
    49% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 49%, #000 49%);
        mask-image: radial-gradient(circle at 50%, transparent 49%, #000 49%)
    }
    50% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 50%, #000 50%);
        mask-image: radial-gradient(circle at 50%, transparent 50%, #000 50%)
    }
    51% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 51%, #000 51%);
        mask-image: radial-gradient(circle at 50%, transparent 51%, #000 51%)
    }
    52% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 52%, #000 52%);
        mask-image: radial-gradient(circle at 50%, transparent 52%, #000 52%)
    }
    53% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 53%, #000 53%);
        mask-image: radial-gradient(circle at 50%, transparent 53%, #000 53%)
    }
    54% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 54%, #000 54%);
        mask-image: radial-gradient(circle at 50%, transparent 54%, #000 54%)
    }
    55% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 55%, #000 55%);
        mask-image: radial-gradient(circle at 50%, transparent 55%, #000 55%)
    }
    56% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 56%, #000 56%);
        mask-image: radial-gradient(circle at 50%, transparent 56%, #000 56%)
    }
    57% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 57%, #000 57%);
        mask-image: radial-gradient(circle at 50%, transparent 57%, #000 57%)
    }
    58% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 58%, #000 58%);
        mask-image: radial-gradient(circle at 50%, transparent 58%, #000 58%)
    }
    59% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 59%, #000 59%);
        mask-image: radial-gradient(circle at 50%, transparent 59%, #000 59%)
    }
    60% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 60%, #000 60%);
        mask-image: radial-gradient(circle at 50%, transparent 60%, #000 60%)
    }
    61% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 61%, #000 61%);
        mask-image: radial-gradient(circle at 50%, transparent 61%, #000 61%)
    }
    62% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 62%, #000 62%);
        mask-image: radial-gradient(circle at 50%, transparent 62%, #000 62%)
    }
    63% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 63%, #000 63%);
        mask-image: radial-gradient(circle at 50%, transparent 63%, #000 63%)
    }
    64% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 64%, #000 64%);
        mask-image: radial-gradient(circle at 50%, transparent 64%, #000 64%)
    }
    65% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 65%, #000 65%);
        mask-image: radial-gradient(circle at 50%, transparent 65%, #000 65%)
    }
    66% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 66%, #000 66%);
        mask-image: radial-gradient(circle at 50%, transparent 66%, #000 66%)
    }
    67% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 67%, #000 67%);
        mask-image: radial-gradient(circle at 50%, transparent 67%, #000 67%)
    }
    68% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 68%, #000 68%);
        mask-image: radial-gradient(circle at 50%, transparent 68%, #000 68%)
    }
    69% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 69%, #000 69%);
        mask-image: radial-gradient(circle at 50%, transparent 69%, #000 69%)
    }
    70% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 70%, #000 70%);
        mask-image: radial-gradient(circle at 50%, transparent 70%, #000 70%)
    }
    71% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 71%, #000 71%);
        mask-image: radial-gradient(circle at 50%, transparent 71%, #000 71%)
    }
    72% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 72%, #000 72%);
        mask-image: radial-gradient(circle at 50%, transparent 72%, #000 72%)
    }
    73% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 73%, #000 73%);
        mask-image: radial-gradient(circle at 50%, transparent 73%, #000 73%)
    }
    74% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 74%, #000 74%);
        mask-image: radial-gradient(circle at 50%, transparent 74%, #000 74%)
    }
    75% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 75%, #000 75%);
        mask-image: radial-gradient(circle at 50%, transparent 75%, #000 75%)
    }
    76% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 76%, #000 76%);
        mask-image: radial-gradient(circle at 50%, transparent 76%, #000 76%)
    }
    77% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 77%, #000 77%);
        mask-image: radial-gradient(circle at 50%, transparent 77%, #000 77%)
    }
    78% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 78%, #000 78%);
        mask-image: radial-gradient(circle at 50%, transparent 78%, #000 78%)
    }
    79% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 79%, #000 79%);
        mask-image: radial-gradient(circle at 50%, transparent 79%, #000 79%)
    }
    80% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 80%, #000 80%);
        mask-image: radial-gradient(circle at 50%, transparent 80%, #000 80%)
    }
    81% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 81%, #000 81%);
        mask-image: radial-gradient(circle at 50%, transparent 81%, #000 81%)
    }
    82% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 82%, #000 82%);
        mask-image: radial-gradient(circle at 50%, transparent 82%, #000 82%)
    }
    83% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 83%, #000 83%);
        mask-image: radial-gradient(circle at 50%, transparent 83%, #000 83%)
    }
    84% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 84%, #000 84%);
        mask-image: radial-gradient(circle at 50%, transparent 84%, #000 84%)
    }
    85% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 85%, #000 85%);
        mask-image: radial-gradient(circle at 50%, transparent 85%, #000 85%)
    }
    86% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 86%, #000 86%);
        mask-image: radial-gradient(circle at 50%, transparent 86%, #000 86%)
    }
    87% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 87%, #000 87%);
        mask-image: radial-gradient(circle at 50%, transparent 87%, #000 87%)
    }
    88% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 88%, #000 88%);
        mask-image: radial-gradient(circle at 50%, transparent 88%, #000 88%)
    }
    89% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 89%, #000 89%);
        mask-image: radial-gradient(circle at 50%, transparent 89%, #000 89%)
    }
    90% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 90%, #000 90%);
        mask-image: radial-gradient(circle at 50%, transparent 90%, #000 90%)
    }
    91% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 91%, #000 91%);
        mask-image: radial-gradient(circle at 50%, transparent 91%, #000 91%)
    }
    92% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 92%, #000 92%);
        mask-image: radial-gradient(circle at 50%, transparent 92%, #000 92%)
    }
    93% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 93%, #000 93%);
        mask-image: radial-gradient(circle at 50%, transparent 93%, #000 93%)
    }
    94% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 94%, #000 94%);
        mask-image: radial-gradient(circle at 50%, transparent 94%, #000 94%)
    }
    95% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 95%, #000 95%);
        mask-image: radial-gradient(circle at 50%, transparent 95%, #000 95%)
    }
    96% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 96%, #000 96%);
        mask-image: radial-gradient(circle at 50%, transparent 96%, #000 96%)
    }
    97% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 97%, #000 97%);
        mask-image: radial-gradient(circle at 50%, transparent 97%, #000 97%)
    }
    98% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 98%, #000 98%);
        mask-image: radial-gradient(circle at 50%, transparent 98%, #000 98%)
    }
    99% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 99%, #000 99%);
        mask-image: radial-gradient(circle at 50%, transparent 99%, #000 99%)
    }
    100% {
        -webkit-mask-image: radial-gradient(circle at 50%, transparent 100%, #000 100%);
        mask-image: radial-gradient(circle at 50%, transparent 100%, #000 100%)
    }
}

.animsition-icon-loader {
    width: 100px;
    height: 100px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
    z-index: 100;
}

/* loading option */
.animsition-loading,
.animsition-loading:after {
    width: 100px;
    height: 100px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
    z-index: 100;
}

.animsition-loading {
    background-color: transparent;
    border-top: 5px solid rgba(0, 0, 0, 0.2);
    border-right: 5px solid rgba(0, 0, 0, 0.2);
    border-bottom: 5px solid rgba(0, 0, 0, 0.2);
    border-left: 5px solid #eee;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
    -webkit-animation-name: animsition-loading;
    animation-name: animsition-loading;
}

@-webkit-keyframes animsition-loading {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes animsition-loading {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}


.fade-in {
    -webkit-animation-name: fade-in;
    animation-name: fade-in;
}


@-webkit-keyframes fade-out {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}


@keyframes fade-out {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}


.fade-out {
    -webkit-animation-name: fade-out;
    animation-name: fade-out;
}

@-webkit-keyframes fade-in-up {
    0% {
        -webkit-transform: translateY(500px);
        transform: translateY(500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fade-in-up {
    0% {
        -webkit-transform: translateY(500px);
        transform: translateY(500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}


.fade-in-up {
    -webkit-animation-name: fade-in-up;
    animation-name: fade-in-up;
}


@-webkit-keyframes fade-out-up {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
        opacity: 0;
    }
}


@keyframes fade-out-up {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
        opacity: 0;
    }
}


.fade-out-up {
    -webkit-animation-name: fade-out-up;
    animation-name: fade-out-up;
}

@-webkit-keyframes fade-in-up-sm {
    0% {
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fade-in-up-sm {
    0% {
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}


.fade-in-up-sm {
    -webkit-animation-name: fade-in-up-sm;
    animation-name: fade-in-up-sm;
}


@-webkit-keyframes fade-out-up-sm {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-100px);
        transform: translateY(-100px);
        opacity: 0;
    }
}


@keyframes fade-out-up-sm {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-100px);
        transform: translateY(-100px);
        opacity: 0;
    }
}


.fade-out-up-sm {
    -webkit-animation-name: fade-out-up-sm;
    animation-name: fade-out-up-sm;
}

@-webkit-keyframes fade-in-up-lg {
    0% {
        -webkit-transform: translateY(1000px);
        transform: translateY(1000px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fade-in-up-lg {
    0% {
        -webkit-transform: translateY(1000px);
        transform: translateY(1000px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}


.fade-in-up-lg {
    -webkit-animation-name: fade-in-up-lg;
    animation-name: fade-in-up-lg;
}


@-webkit-keyframes fade-out-up-lg {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-1000px);
        transform: translateY(-1000px);
        opacity: 0;
    }
}


@keyframes fade-out-up-lg {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-1000px);
        transform: translateY(-1000px);
        opacity: 0;
    }
}


.fade-out-up-lg {
    -webkit-animation-name: fade-out-up-lg;
    animation-name: fade-out-up-lg;
}

@-webkit-keyframes fade-in-down {
    0% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fade-in-down {
    0% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}


.fade-in-down {
    -webkit-animation-name: fade-in-down;
    animation-name: fade-in-down;
}


@-webkit-keyframes fade-out-down {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(500px);
        transform: translateY(500px);
        opacity: 0;
    }
}


@keyframes fade-out-down {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(500px);
        transform: translateY(500px);
        opacity: 0;
    }
}


.fade-out-down {
    -webkit-animation-name: fade-out-down;
    animation-name: fade-out-down;
}

@-webkit-keyframes fade-in-down-sm {
    0% {
        -webkit-transform: translateY(-100px);
        transform: translateY(-100px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fade-in-down-sm {
    0% {
        -webkit-transform: translateY(-100px);
        transform: translateY(-100px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}


.fade-in-down-sm {
    -webkit-animation-name: fade-in-down-sm;
    animation-name: fade-in-down-sm;
}


@-webkit-keyframes fade-out-down-sm {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
        opacity: 0;
    }
}


@keyframes fade-out-down-sm {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
        opacity: 0;
    }
}


.fade-out-down-sm {
    -webkit-animation-name: fade-out-down-sm;
    animation-name: fade-out-down-sm;
}

@-webkit-keyframes fade-in-down-lg {
    0% {
        -webkit-transform: translateY(-1000px);
        transform: translateY(-1000px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fade-in-down-lg {
    0% {
        -webkit-transform: translateY(-1000px);
        transform: translateY(-1000px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}


.fade-in-down-lg {
    -webkit-animation-name: fade-in-down;
    animation-name: fade-in-down;
}


@-webkit-keyframes fade-out-down-lg {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(1000px);
        transform: translateY(1000px);
        opacity: 0;
    }
}


@keyframes fade-out-down-lg {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(1000px);
        transform: translateY(1000px);
        opacity: 0;
    }
}


.fade-out-down-lg {
    -webkit-animation-name: fade-out-down-lg;
    animation-name: fade-out-down-lg;
}

@-webkit-keyframes fade-in-left {
    0% {
        -webkit-transform: translateX(-500px);
        transform: translateX(-500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fade-in-left {
    0% {
        -webkit-transform: translateX(-500px);
        transform: translateX(-500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}


.fade-in-left {
    -webkit-animation-name: fade-in-left;
    animation-name: fade-in-left;
}


@-webkit-keyframes fade-out-left {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(-500px);
        transform: translateX(-500px);
        opacity: 0;
    }
}


@keyframes fade-out-left {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(-500px);
        transform: translateX(-500px);
        opacity: 0;
    }
}


.fade-out-left {
    -webkit-animation-name: fade-out-left;
    animation-name: fade-out-left;
}

@-webkit-keyframes fade-in-left-sm {
    0% {
        -webkit-transform: translateX(-100px);
        transform: translateX(-100px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fade-in-left-sm {
    0% {
        -webkit-transform: translateX(-100px);
        transform: translateX(-100px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}


.fade-in-left-sm {
    -webkit-animation-name: fade-in-left-sm;
    animation-name: fade-in-left-sm;
}


@-webkit-keyframes fade-out-left-sm {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(-100px);
        transform: translateX(-100px);
        opacity: 0;
    }
}


@keyframes fade-out-left-sm {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(-100px);
        transform: translateX(-100px);
        opacity: 0;
    }
}


.fade-out-left-sm {
    -webkit-animation-name: fade-out-left-sm;
    animation-name: fade-out-left-sm;
}

@-webkit-keyframes fade-in-left-lg {
    0% {
        -webkit-transform: translateX(-1500px);
        transform: translateX(-1500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fade-in-left-lg {
    0% {
        -webkit-transform: translateX(-1500px);
        transform: translateX(-1500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}


.fade-in-left-lg {
    -webkit-animation-name: fade-in-left-lg;
    animation-name: fade-in-left-lg;
}


@-webkit-keyframes fade-out-left-lg {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(-1500px);
        transform: translateX(-1500px);
        opacity: 0;
    }
}


@keyframes fade-out-left-lg {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(-1500px);
        transform: translateX(-1500px);
        opacity: 0;
    }
}


.fade-out-left-lg {
    -webkit-animation-name: fade-out-left-lg;
    animation-name: fade-out-left-lg;
}

@-webkit-keyframes fade-in-right {
    0% {
        -webkit-transform: translateX(500px);
        transform: translateX(500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fade-in-right {
    0% {
        -webkit-transform: translateX(500px);
        transform: translateX(500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}


.fade-in-right {
    -webkit-animation-name: fade-in-right;
    animation-name: fade-in-right;
}


@-webkit-keyframes fade-out-right {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(500px);
        transform: translateX(500px);
        opacity: 0;
    }
}


@keyframes fade-out-right {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(500px);
        transform: translateX(500px);
        opacity: 0;
    }
}


.fade-out-right {
    -webkit-animation-name: fade-out-right;
    animation-name: fade-out-right;
}

@-webkit-keyframes fade-in-right-sm {
    0% {
        -webkit-transform: translateX(100px);
        transform: translateX(100px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fade-in-right-sm {
    0% {
        -webkit-transform: translateX(100px);
        transform: translateX(100px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}


.fade-in-right-sm {
    -webkit-animation-name: fade-in-right-sm;
    animation-name: fade-in-right-sm;
}


@-webkit-keyframes fade-out-right-sm {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(100px);
        transform: translateX(100px);
        opacity: 0;
    }
}


@keyframes fade-out-right-sm {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(100px);
        transform: translateX(100px);
        opacity: 0;
    }
}


.fade-out-right-sm {
    -webkit-animation-name: fade-out-right-sm;
    animation-name: fade-out-right-sm;
}

@-webkit-keyframes fade-in-right-lg {
    0% {
        -webkit-transform: translateX(1500px);
        transform: translateX(1500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fade-in-right-lg {
    0% {
        -webkit-transform: translateX(1500px);
        transform: translateX(1500px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}


.fade-in-right-lg {
    -webkit-animation-name: fade-in-right-lg;
    animation-name: fade-in-right-lg;
}


@-webkit-keyframes fade-out-right-lg {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(1500px);
        transform: translateX(1500px);
        opacity: 0;
    }
}


@keyframes fade-out-right-lg {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(1500px);
        transform: translateX(1500px);
        opacity: 0;
    }
}


.fade-out-right-lg {
    -webkit-animation-name: fade-out-right-lg;
    animation-name: fade-out-right-lg;
}

@-webkit-keyframes rotate-in {
    0% {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
    100% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
}

@keyframes rotate-in {
    0% {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
    100% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
}


.rotate-in {
    -webkit-animation-name: rotate-in;
    animation-name: rotate-in;
}


@-webkit-keyframes rotate-out {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
    100% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
}


@keyframes rotate-out {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
    100% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
}


.rotate-out {
    -webkit-animation-name: rotate-out;
    animation-name: rotate-out;
}

@-webkit-keyframes rotate-in-sm {
    0% {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
    100% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
}

@keyframes rotate-in-sm {
    0% {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
    100% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
}


.rotate-in-sm {
    -webkit-animation-name: rotate-in-sm;
    animation-name: rotate-in-sm;
}


@-webkit-keyframes rotate-out-sm {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
    100% {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
}


@keyframes rotate-out-sm {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
    100% {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
}


.rotate-out-sm {
    -webkit-animation-name: rotate-out-sm;
    animation-name: rotate-out-sm;
}

@-webkit-keyframes rotate-in-lg {
    0% {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
    100% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
}

@keyframes rotate-in-lg {
    0% {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
    100% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
}


.rotate-in-lg {
    -webkit-animation-name: rotate-in-lg;
    animation-name: rotate-in-lg;
}


@-webkit-keyframes rotate-out-lg {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
    100% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
}


@keyframes rotate-out-lg {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 1;
    }
    100% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        opacity: 0;
    }
}


.rotate-out-lg {
    -webkit-animation-name: rotate-out-lg;
    animation-name: rotate-out-lg;
}

@-webkit-keyframes flip-in-x {
    0% {
        -webkit-transform: perspective(550px) rotateX(90deg);
        transform: perspective(550px) rotateX(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(550px) rotateX(0deg);
        transform: perspective(550px) rotateX(0deg);
        opacity: 1;
    }
}

@keyframes flip-in-x {
    0% {
        -webkit-transform: perspective(550px) rotateX(90deg);
        transform: perspective(550px) rotateX(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(550px) rotateX(0deg);
        transform: perspective(550px) rotateX(0deg);
        opacity: 1;
    }
}


.flip-in-x {
    -webkit-animation-name: flip-in-x;
    animation-name: flip-in-x;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}


@-webkit-keyframes flip-out-x {
    0% {
        -webkit-transform: perspective(550px) rotateX(0deg);
        transform: perspective(550px) rotateX(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(550px) rotateX(90deg);
        transform: perspective(550px) rotateX(90deg);
        opacity: 0;
    }
}


@keyframes flip-out-x {
    0% {
        -webkit-transform: perspective(550px) rotateX(0deg);
        transform: perspective(550px) rotateX(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(550px) rotateX(90deg);
        transform: perspective(550px) rotateX(90deg);
        opacity: 0;
    }
}


.flip-out-x {
    -webkit-animation-name: flip-out-x;
    animation-name: flip-out-x;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-x-nr {
    0% {
        -webkit-transform: perspective(100px) rotateX(90deg);
        transform: perspective(100px) rotateX(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(100px) rotateX(0deg);
        transform: perspective(100px) rotateX(0deg);
        opacity: 1;
    }
}

@keyframes flip-in-x-nr {
    0% {
        -webkit-transform: perspective(100px) rotateX(90deg);
        transform: perspective(100px) rotateX(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(100px) rotateX(0deg);
        transform: perspective(100px) rotateX(0deg);
        opacity: 1;
    }
}


.flip-in-x-nr {
    -webkit-animation-name: flip-in-x-nr;
    animation-name: flip-in-x-nr;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}


@-webkit-keyframes flip-out-x-nr {
    0% {
        -webkit-transform: perspective(100px) rotateX(0deg);
        transform: perspective(100px) rotateX(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(100px) rotateX(90deg);
        transform: perspective(100px) rotateX(90deg);
        opacity: 0;
    }
}


@keyframes flip-out-x-nr {
    0% {
        -webkit-transform: perspective(100px) rotateX(0deg);
        transform: perspective(100px) rotateX(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(100px) rotateX(90deg);
        transform: perspective(100px) rotateX(90deg);
        opacity: 0;
    }
}


.flip-out-x-nr {
    -webkit-animation-name: flip-out-x-nr;
    animation-name: flip-out-x-nr;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-x-fr {
    0% {
        -webkit-transform: perspective(1000px) rotateX(90deg);
        transform: perspective(1000px) rotateX(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(1000px) rotateX(0deg);
        transform: perspective(1000px) rotateX(0deg);
        opacity: 1;
    }
}

@keyframes flip-in-x-fr {
    0% {
        -webkit-transform: perspective(1000px) rotateX(90deg);
        transform: perspective(1000px) rotateX(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(1000px) rotateX(0deg);
        transform: perspective(1000px) rotateX(0deg);
        opacity: 1;
    }
}


.flip-in-x-fr {
    -webkit-animation-name: flip-in-x-fr;
    animation-name: flip-in-x-fr;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}


@-webkit-keyframes flip-out-x-fr {
    0% {
        -webkit-transform: perspective(1000px) rotateX(0deg);
        transform: perspective(1000px) rotateX(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(1000px) rotateX(90deg);
        transform: perspective(1000px) rotateX(90deg);
        opacity: 0;
    }
}


@keyframes flip-out-x-fr {
    0% {
        -webkit-transform: perspective(1000px) rotateX(0deg);
        transform: perspective(1000px) rotateX(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(1000px) rotateX(90deg);
        transform: perspective(1000px) rotateX(90deg);
        opacity: 0;
    }
}


.flip-out-x-fr {
    -webkit-animation-name: flip-out-x-fr;
    animation-name: flip-out-x-fr;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-y {
    0% {
        -webkit-transform: perspective(550px) rotateY(90deg);
        transform: perspective(550px) rotateY(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(550px) rotateY(0deg);
        transform: perspective(550px) rotateY(0deg);
        opacity: 1;
    }
}

@keyframes flip-in-y {
    0% {
        -webkit-transform: perspective(550px) rotateY(90deg);
        transform: perspective(550px) rotateY(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(550px) rotateY(0deg);
        transform: perspective(550px) rotateY(0deg);
        opacity: 1;
    }
}


.flip-in-y {
    -webkit-animation-name: flip-in-y;
    animation-name: flip-in-y;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}


@-webkit-keyframes flip-out-y {
    0% {
        -webkit-transform: perspective(550px) rotateY(0deg);
        transform: perspective(550px) rotateY(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(550px) rotateY(90deg);
        transform: perspective(550px) rotateY(90deg);
        opacity: 0;
    }
}


@keyframes flip-out-y {
    0% {
        -webkit-transform: perspective(550px) rotateY(0deg);
        transform: perspective(550px) rotateY(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(550px) rotateY(90deg);
        transform: perspective(550px) rotateY(90deg);
        opacity: 0;
    }
}


.flip-out-y {
    -webkit-animation-name: flip-out-y;
    animation-name: flip-out-y;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-y-nr {
    0% {
        -webkit-transform: perspective(100px) rotateY(90deg);
        transform: perspective(100px) rotateY(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(100px) rotateY(0deg);
        transform: perspective(100px) rotateY(0deg);
        opacity: 1;
    }
}

@keyframes flip-in-y-nr {
    0% {
        -webkit-transform: perspective(100px) rotateY(90deg);
        transform: perspective(100px) rotateY(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(100px) rotateY(0deg);
        transform: perspective(100px) rotateY(0deg);
        opacity: 1;
    }
}


.flip-in-y-nr {
    -webkit-animation-name: flip-in-y-nr;
    animation-name: flip-in-y-nr;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}


@-webkit-keyframes flip-out-y-nr {
    0% {
        -webkit-transform: perspective(100px) rotateY(0deg);
        transform: perspective(100px) rotateY(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(100px) rotateY(90deg);
        transform: perspective(100px) rotateY(90deg);
        opacity: 0;
    }
}


@keyframes flip-out-y-nr {
    0% {
        -webkit-transform: perspective(100px) rotateY(0deg);
        transform: perspective(100px) rotateY(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(100px) rotateY(90deg);
        transform: perspective(100px) rotateY(90deg);
        opacity: 0;
    }
}


.flip-out-y-nr {
    -webkit-animation-name: flip-out-y-nr;
    animation-name: flip-out-y-nr;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-y-fr {
    0% {
        -webkit-transform: perspective(1000px) rotateY(90deg);
        transform: perspective(1000px) rotateY(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(1000px) rotateY(0deg);
        transform: perspective(1000px) rotateY(0deg);
        opacity: 1;
    }
}

@keyframes flip-in-y-fr {
    0% {
        -webkit-transform: perspective(1000px) rotateY(90deg);
        transform: perspective(1000px) rotateY(90deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: perspective(1000px) rotateY(0deg);
        transform: perspective(1000px) rotateY(0deg);
        opacity: 1;
    }
}


.flip-in-y-fr {
    -webkit-animation-name: flip-in-y-fr;
    animation-name: flip-in-y-fr;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}


@-webkit-keyframes flip-out-y-fr {
    0% {
        -webkit-transform: perspective(1000px) rotateY(0deg);
        transform: perspective(1000px) rotateY(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(1000px) rotateY(90deg);
        transform: perspective(1000px) rotateY(90deg);
        opacity: 0;
    }
}


@keyframes flip-out-y-fr {
    0% {
        -webkit-transform: perspective(1000px) rotateY(0deg);
        transform: perspective(1000px) rotateY(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(1000px) rotateY(90deg);
        transform: perspective(1000px) rotateY(90deg);
        opacity: 0;
    }
}


.flip-out-y-fr {
    -webkit-animation-name: flip-out-y-fr;
    animation-name: flip-out-y-fr;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}

@-webkit-keyframes zoom-in {
    0% {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes zoom-in {
    0% {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}


.zoom-in {
    -webkit-animation-name: zoom-in;
    animation-name: zoom-in;
}


@-webkit-keyframes zoom-out {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
    50% {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}


@keyframes zoom-out {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
    50% {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}


.zoom-out {
    -webkit-animation-name: zoom-out;
    animation-name: zoom-out;
}

@-webkit-keyframes zoom-in-sm {
    0% {
        -webkit-transform: scale(.95);
        transform: scale(.95);
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes zoom-in-sm {
    0% {
        -webkit-transform: scale(.95);
        transform: scale(.95);
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}


.zoom-in-sm {
    -webkit-animation-name: zoom-in-sm;
    animation-name: zoom-in-sm;
}


@-webkit-keyframes zoom-out-sm {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
    50% {
        -webkit-transform: scale(.95);
        transform: scale(.95);
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}


@keyframes zoom-out-sm {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
    50% {
        -webkit-transform: scale(.95);
        transform: scale(.95);
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}


.zoom-out-sm {
    -webkit-animation-name: zoom-out-sm;
    animation-name: zoom-out-sm;
}

@-webkit-keyframes zoom-in-lg {
    0% {
        -webkit-transform: scale(.4);
        transform: scale(.4);
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes zoom-in-lg {
    0% {
        -webkit-transform: scale(.4);
        transform: scale(.4);
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}


.zoom-in-lg {
    -webkit-animation-name: zoom-in-lg;
    animation-name: zoom-in-lg;
}


@-webkit-keyframes zoom-out-lg {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
    50% {
        -webkit-transform: scale(.4);
        transform: scale(.4);
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}


@keyframes zoom-out-lg {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
    50% {
        -webkit-transform: scale(.4);
        transform: scale(.4);
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}


.zoom-out-lg {
    -webkit-animation-name: zoom-out-lg;
    animation-name: zoom-out-lg;
}

@-webkit-keyframes overlay-slide-in-top {
    0% {
        height: 100%;
    }
    100% {
        height: 0;
    }
}

@keyframes overlay-slide-in-top {
    0% {
        height: 100%;
    }
    100% {
        height: 0;
    }
}


.overlay-slide-in-top {
    top: 0;
    height: 0;
    -webkit-animation-name: overlay-slide-in-top;
    animation-name: overlay-slide-in-top;
}


@-webkit-keyframes overlay-slide-out-top {
    0% {
        height: 0;
    }
    100% {
        height: 100%;
    }
}


@keyframes overlay-slide-out-top {
    0% {
        height: 0;
    }
    100% {
        height: 100%;
    }
}


.overlay-slide-out-top {
    top: 0;
    height: 100%;
    -webkit-animation-name: overlay-slide-out-top;
    animation-name: overlay-slide-out-top;
}

@-webkit-keyframes overlay-slide-in-bottom {
    0% {
        height: 100%;
    }
    100% {
        height: 0;
    }
}

@keyframes overlay-slide-in-bottom {
    0% {
        height: 100%;
    }
    100% {
        height: 0;
    }
}


.overlay-slide-in-bottom {
    bottom: 0;
    height: 0;
    -webkit-animation-name: overlay-slide-in-bottom;
    animation-name: overlay-slide-in-bottom;
}


@-webkit-keyframes overlay-slide-out-bottom {
    0% {
        height: 0;
    }
    100% {
        height: 100%;
    }
}


@keyframes overlay-slide-out-bottom {
    0% {
        height: 0;
    }
    100% {
        height: 100%;
    }
}


.overlay-slide-out-bottom {
    bottom: 0;
    height: 100%;
    -webkit-animation-name: overlay-slide-out-bottom;
    animation-name: overlay-slide-out-bottom;
}

@-webkit-keyframes overlay-slide-in-left {
    0% {
        width: 100%;
    }
    100% {
        width: 0;
    }
}

@keyframes overlay-slide-in-left {
    0% {
        width: 100%;
    }
    100% {
        width: 0;
    }
}


.overlay-slide-in-left {
    width: 0;
    -webkit-animation-name: overlay-slide-in-left;
    animation-name: overlay-slide-in-left;
}


@-webkit-keyframes overlay-slide-out-left {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}


@keyframes overlay-slide-out-left {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}


.overlay-slide-out-left {
    left: 0;
    width: 100%;
    -webkit-animation-name: overlay-slide-out-left;
    animation-name: overlay-slide-out-left;
}

@-webkit-keyframes overlay-slide-in-right {
    0% {
        width: 100%;
    }
    100% {
        width: 0;
    }
}

@keyframes overlay-slide-in-right {
    0% {
        width: 100%;
    }
    100% {
        width: 0;
    }
}


.overlay-slide-in-right {
    right: 0;
    width: 0;
    -webkit-animation-name: overlay-slide-in-right;
    animation-name: overlay-slide-in-right;
}


@-webkit-keyframes overlay-slide-out-right {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}


@keyframes overlay-slide-out-right {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}


.overlay-slide-out-right {
    right: 0;
    width: 100%;
    -webkit-animation-name: overlay-slide-out-right;
    animation-name: overlay-slide-out-right;
}
