@charset "utf-8";
.rabbit {
    width: 5em;
    height: 3em;
    background: white;
    border-radius: 70% 90% 60% 50%;
    position: absolute;
    top: 20%;
    right: 5%;
    box-shadow: -0.2em 1em 0 -0.75em #b78e81;
    transform: rotate(0deg) translate(-2em, 0);
    z-index: 1;
    animation: hop 1s infinite linear;
    opacity: 0.5;
}

.rabbit:before {
    content: "";
    position: absolute;
    width: 1em;
    height: 1em;
    background: white;
    border-radius: 100%;
    top: 0.5em;
    left: -0.3em;
    box-shadow: 4em 0.4em 0 -0.35em #3f3334, 0.5em 1em 0 white, 4em 1em 0 -0.3em white, 4em 1em 0 -0.3em white, 4em 1em 0 -0.4em white;
    animation: kick 1s infinite linear;
}

.rabbit:after {
    content: "";
    position: absolute;
    width: 0.75em;
    height: 2em;
    background: white;
    border-radius: 50% 100% 0 0;
    transform: rotate(-30deg);
    right: 1em;
    top: -1em;
    border-top: 1px solid #f7f5f4;
    border-left: 1px solid #f7f5f4;
    box-shadow: -0.5em 0em 0 -0.1em white;
}
 @keyframes hop {
     20% {
         -moz-transform: rotate(-10deg) translate(1em, -2em);
         -ms-transform: rotate(-10deg) translate(1em, -2em);
         -webkit-transform: rotate(-10deg) translate(1em, -2em);
         transform: rotate(-10deg) translate(1em, -2em);
         box-shadow: -0.2em 3em 0 -1em #b78e81;
     }

     40% {
         -moz-transform: rotate(10deg) translate(3em, -4em);
         -ms-transform: rotate(10deg) translate(3em, -4em);
         -webkit-transform: rotate(10deg) translate(3em, -4em);
         transform: rotate(10deg) translate(3em, -4em);
         box-shadow: -0.2em 3.25em 0 -1.1em #b78e81;
     }

     60%,
     75% {
         -moz-transform: rotate(0) translate(4em, 0);
         -ms-transform: rotate(0) translate(4em, 0);
         -webkit-transform: rotate(0) translate(4em, 0);
         transform: rotate(0) translate(4em, 0);
         box-shadow: -0.2em 1em 0 -0.75em #b78e81;
     }
 }

 @keyframes kick {

     20%,
     50% {
         box-shadow: 4em 0.4em 0 -0.35em #3f3334, 0.5em 1.5em 0 white, 4em 1.75em 0 -0.3em white, 4em 1.75em 0 -0.3em white,
             4em 1.9em 0 -0.4em white;
     }

     40% {
         box-shadow: 4em 0.4em 0 -0.35em #3f3334, 0.5em 2em 0 white, 4em 1.75em 0 -0.3em white, 4.2em 1.75em 0 -0.2em white,
             4.4em 1.9em 0 -0.2em white;
     }
 }