@keyframes jiggle
{
    0%      { margin-top: 0px; margin-left: 0px; }
    5%      { margin-top: -3px; margin-left: -4px; }
    10%     { margin-top: 8px; margin-left: 3px; }
    15%     { margin-top: 7px; margin-left: -2px; }
    20%     { margin-top: 4px; margin-left: 3px; }
    25%     { margin-top: -2px; margin-left: 4px; }
    30%     { margin-top: 3px; margin-left: -3px; }
    35%     { margin-top: 5px; margin-left: 8px; }
    40%     { margin-top: -10px; margin-left: -2px; }
    45%     { margin-top: -1px; margin-left: 8px; }
    50%     { margin-top: 2px; margin-left: 4px; }
    55%     { margin-top: 1px; margin-left: 9px; }
    60%     { margin-top: 0px; margin-left: 2px; }
    65%     { margin-top: 4px; margin-left: -4px; }
    70%     { margin-top: -5px; margin-left: -8px; }
    75%     { margin-top: 4px; margin-left: 7px; }
    80%     { margin-top: 3px; margin-left: 4px; }
    85%     { margin-top: -2px; margin-left: 3px; }
    90%     { margin-top: 1px; margin-left: 9px; }
    95%     { margin-top: -3px; margin-left: 3px; }
    100%    { margin-top: 0px; margin-left: 0px; }
}

.workspace .airhorn {
    position: absolute;
    background-image: url('../img/airhorn.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    height: 200px;
    width: 200px;

    &.active {
        animation: jiggle 1s infinite;
    }
}
