#leaves {
    position: relative;
}

.floating-leaf {
    display:  inline-block;
    position: absolute;
    cursor: pointer;
}

.floating-leaf:hover img {
    animation:                 shake 0.82s cubic-bezier(.36, .07, .19, .97) both;
    transform:                 translate3d(0, 0, 0);
    /* When the animation is finished, start again */
    animation-iteration-count: 1;
}

.floating-leaf-title {
    font-size:   1.2em;
    font-weight: 600;
    color:       #222222;
}

@keyframes shake {
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }
    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }
    30%, 50%, 70% {
        transform: translate3d(-4px, 0, 0);
    }
    40%, 60% {
        transform: translate3d(4px, 0, 0);
    }
}

@keyframes wiggle {
    0% { transform: rotate(0deg); }
    80% { transform: rotate(0deg); }
    85% { transform: rotate(5deg); }
    95% { transform: rotate(-5deg); }
    100% { transform: rotate(0deg); }
}

@media only screen and (max-width: 600px) {

    .floating-leaf-title {
        font-size: 1em;
    }
}


@media only screen and (max-width: 400px) {

    .floating-leaf-title {
        font-size: 0.9em;
    }
}