@media screen and (min-width: 768px) {
    .animatable {
        /* initially hide animatable objects */
        visibility: hidden;

        /* initially pause animatable objects their animations */
        -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
        -ms-animation-play-state: paused;
        -o-animation-play-state: paused;
        animation-play-state: paused;
    }

    /* show objects being animated */
    .animated {
        visibility: visible;
        -webkit-animation-fill-mode: both;
        -moz-animation-fill-mode: both;
        -ms-animation-fill-mode: both;
        -o-animation-fill-mode: both;
        animation-fill-mode: both;
        -webkit-animation-duration: 1s;
        -moz-animation-duration: 1s;
        -ms-animation-duration: 1s;
        -o-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-play-state: running;
        -moz-animation-play-state: running;
        -ms-animation-play-state: running;
        -o-animation-play-state: running;
        animation-play-state: running;
    }

    /* CSS Animations (extracted from http: //glifo.uiparade.com/) */
    @-webkit-keyframes fadeInDown {
        0% {
            opacity: 0;
            -webkit-transform: translateY(-20px);
        }

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

    @-moz-keyframes fadeInDown {
        0% {
            opacity: 0;
            -moz-transform: translateY(-20px);
        }

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

    @-o-keyframes fadeInDown {
        0% {
            opacity: 0;
            -o-transform: translateY(-20px);
        }

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

    @keyframes fadeInDown {
        0% {
            opacity: 0;
            transform: translateY(-20px);
        }

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

    @-webkit-keyframes fadeIn {
        0% {
            opacity: 0;
        }

        20% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @-moz-keyframes fadeIn {
        0% {
            opacity: 0;
        }

        20% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @-o-keyframes fadeIn {
        0% {
            opacity: 0;
        }

        20% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes fadeIn {
        0% {
            opacity: 0;
        }

        60% {
            opacity: 0;
        }

        20% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @-webkit-keyframes bounceInLeft {
        0% {
            opacity: 0;
            -webkit-transform: translateX(-2000px);
        }

        60% {
            -webkit-transform: translateX(20px);
        }

        80% {
            -webkit-transform: translateX(-5px);
        }

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

    @-moz-keyframes bounceInLeft {
        0% {
            opacity: 0;
            -moz-transform: translateX(-2000px);
        }

        60% {
            -moz-transform: translateX(20px);
        }

        80% {
            -moz-transform: translateX(-5px);
        }

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

    @-o-keyframes bounceInLeft {
        0% {
            opacity: 0;
            -o-transform: translateX(-2000px);
        }

        60% {
            opacity: 1;
            -o-transform: translateX(20px);
        }

        80% {
            -o-transform: translateX(-5px);
        }

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

    @keyframes bounceInLeft {
        0% {
            opacity: 0;
            transform: translateX(-2000px);
        }

        60% {
            transform: translateX(20px);
        }

        80% {
            transform: translateX(-5px);
        }

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

    @-webkit-keyframes bounceInRight {
        0% {
            opacity: 0;
            -webkit-transform: translateX(2000px);
        }

        60% {
            -webkit-transform: translateX(-20px);
        }

        80% {
            -webkit-transform: translateX(5px);
        }

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

    @-moz-keyframes bounceInRight {
        0% {
            opacity: 0;
            -moz-transform: translateX(2000px);
        }

        60% {
            -moz-transform: translateX(-20px);
        }

        80% {
            -moz-transform: translateX(5px);
        }

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

    @-o-keyframes bounceInRight {
        0% {
            opacity: 0;
            -o-transform: translateX(2000px);
        }

        60% {
            -o-transform: translateX(-20px);
        }

        80% {
            -o-transform: translateX(5px);
        }

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

    @keyframes bounceInRight {
        0% {
            opacity: 0;
            transform: translateX(2000px);
        }

        60% {
            transform: translateX(-20px);
        }

        80% {
            transform: translateX(5px);
        }

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

    @-webkit-keyframes fadeInUp {
        0% {
            opacity: 0;
            -webkit-transform: translateY(20px);
        }

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

    @-moz-keyframes fadeInUp {
        0% {
            opacity: 0;
            -moz-transform: translateY(20px);
        }

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

    @-o-keyframes fadeInUp {
        0% {
            opacity: 0;
            -o-transform: translateY(20px);
        }

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

    @keyframes fadeInUp {
        0% {
            opacity: 0;
            transform: translateY(20px);
        }

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

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

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

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

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

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

        50% {
            -moz-transform: scale(1.05);
        }

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

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

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

        50% {
            -o-transform: scale(1.05);
        }

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

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

    @keyframes bounceIn {
        0% {
            opacity: 0;
            transform: scale(.3);
        }

        50% {
            transform: scale(1.05);
        }

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

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

    @-webkit-keyframes moveUp {
        0% {
            opacity: 1;
            -webkit-transform: translateY(40px);
        }

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

    @-moz-keyframes moveUp {
        0% {
            opacity: 1;
            -moz-transform: translateY(40px);
        }

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

    @-o-keyframes moveUp {
        0% {
            opacity: 1;
            -o-transform: translateY(40px);
        }

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

    @keyframes moveUp {
        0% {
            opacity: 1;
            transform: translateY(40px);
        }

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

    @-webkit-keyframes fadeBgColor {
        0% {
            background: none;
        }

        70% {
            background: none;
        }

        100% {
            background: #464646;
        }
    }

    @-o-keyframes fadeBgColor {
        0% {
            background: none;
        }

        70% {
            background: none;
        }

        100% {
            background: #464646;
        }
    }

    @keyframes fadeBgColor {
        0% {
            background: none;
        }

        70% {
            background: none;
        }

        100% {
            background: #464646;
        }
    }

    .animated.animationDelay {
        animation-delay: .4s;
        -webkit-animation-delay: .4s;
    }

    .animated.animationDelayMed {
        animation-delay: 1.2s;
        -webkit-animation-delay: 1.2s;
    }

    .animated.animationDelayLong {
        animation-delay: 1.6s;
        -webkit-animation-delay: 1.6s;
    }

    .animated.fadeBgColor {
        -webkit-animation-name: fadeBgColor;
        -moz-animation-name: fadeBgColor;
        -o-animation-name: fadeBgColor;
        animation-name: fadeBgColor;
    }

    .animated.bounceIn {
        -webkit-animation-name: bounceIn;
        -moz-animation-name: bounceIn;
        -o-animation-name: bounceIn;
        animation-name: bounceIn;
    }

    .animated.bounceInRight {
        -webkit-animation-name: bounceInRight;
        -moz-animation-name: bounceInRight;
        -o-animation-name: bounceInRight;
        animation-name: bounceInRight;
    }

    .animated.bounceInLeft {
        -webkit-animation-name: bounceInLeft;
        -moz-animation-name: bounceInLeft;
        -o-animation-name: bounceInLeft;
        animation-name: bounceInLeft;
    }

    .animated.fadeIn {
        -webkit-animation-name: fadeIn;
        -moz-animation-name: fadeIn;
        -o-animation-name: fadeIn;
        animation-name: fadeIn;
    }

    .animated.fadeInDown {
        -webkit-animation-name: fadeInDown;
        -moz-animation-name: fadeInDown;
        -o-animation-name: fadeInDown;
        animation-name: fadeInDown;
    }

    .animated.fadeInUp {
        -webkit-animation-name: fadeInUp;
        -moz-animation-name: fadeInUp;
        -o-animation-name: fadeInUp;
        animation-name: fadeInUp;
    }

    .animated.moveUp {
        -webkit-animation-name: moveUp;
        -moz-animation-name: moveUp;
        -o-animation-name: moveUp;
        animation-name: moveUp;
    }
}