.arrow-down {
    width: 30px;
    opacity: 0.7;
    z-index: 10;
    position: relative;

    margin-left: auto;
    margin-right: auto;
}

@keyframes bounce {
    from,
    7%,
    18%,
    to {
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translate3d(0, 0, 0);
    }

    13%,
    15% {
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0, -15px, 0) scaleY(1.1);
    }

    23% {
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0, -7.5px, 0) scaleY(1.05);
    }

    27% {
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translate3d(0, 0, 0) scaleY(0.95);
    }

    30% {
        transform: translate3d(0, -2px, 0) scaleY(1.02);
    }

    33% {
        transform: translate3d(0, 0, 0) scaleY(1);
    }
}

.bounce {
    animation-name: bounce;
    transform-origin: center bottom;
}

.animated {
    animation-duration: 3s;
    animation-fill-mode: both;
    animation-iteration-count: infinite;
}

@keyframes shake {
    0% { transform: rotate(0deg); }
    10% { transform: rotate(-10deg); }
    20% { transform: rotate(10deg); }
    30% { transform: rotate(-10deg); }
    40% { transform: rotate(0deg); }
}