#skylark_animation,
#flower_animation,
#fox_animation,
#hare_animation,
#ram_animation,
#grasshopper_animation,
#dog_animation {
    width: 300px;
    height: 300px;
    margin: 80px 0 50px;
    z-index: 0 !important;
}

.animations_wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 0 50px;
}

.fox #fox_animation {
    margin: 0;
    width: 270px;
    height: 270px;
    margin-left: -53px;
    margin-top: -24px;
    z-index: 0 !important;
}

.bird #skylark_animation {
    margin: 0;
    width: 110px;
    height: 110px;
    margin-left: -20px;
    margin-top: -20px;
    z-index: 0 !important;
}

.opening_animation {
    margin: 0 auto -30px;
    display: flex;
    justify-content: center;
    z-index: 0 !important;
}

.opening_animation div {
    width: 180px !important;
    height: 180px !important;
    margin: 60px 0 0 !important;
    z-index: 0 !important;
}

.hare {
    position: relative;
    z-index: 0 !important;
}

.hare #hare_animation,
.ram #ram_animation {
    margin: 0;
    width: 200px;
    height: 200px;
    margin-left: -44px;
    margin-top: -140px;
    margin-bottom: -20px;
}

.ram #ram_animation {
    margin-left: -27px;
    margin-top: -60px;
    margin-bottom: -43px;
    z-index: 0 !important;
}

.store_ram #ram_animation {
    margin: 0;
    width: 200px;
    height: 200px;
    margin-left: auto;
    margin-top: 20px;
    margin-right: -20px;
    margin-bottom: -140px;
    z-index: 0 !important;
}

.grasshopper #grasshopper_animation,
.flower #flower_animation {
    margin: 0;
    width: 180px;
    height: 180px;
    margin: -60px auto 60px;
    z-index: 0 !important;
}

.dog #dog_animation {
    margin: 0;
    width: 200px;
    height: 200px;
    margin: -40px auto -47px;
    z-index: 0 !important;
}

.skylark #skylark_animation {
    margin: 0;
    width: 190px;
    height: 190px;
    margin: -40px auto -30px;
    z-index: 0 !important;
}

@media (max-width: 1000px) {
    .ram #ram_animation {
        margin: 30px auto -45px;
        z-index: 0 !important;
    }
}

@media (max-width: 800px) {
    .fox #fox_animation {
        width: 190px;
        height: 190px;
        margin-left: -35px;
        margin-top: -10px;
    }

    .dog #dog_animation {
        margin: 0;
        width: 180px;
        height: 180px;
        margin: -40px auto -42px;
    }

    .skylark #skylark_animation {
        margin: 0;
        width: 170px;
        height: 170px;
        margin: -40px auto -28px;
    }
}

@media (max-width: 550px) {
    .store_ram #ram_animation {
        width: 200px;
        height: 200px;
        margin: 40px auto -140px;
    }
}

@media (max-width: 500px) {
    .hare #hare_animation,
    .ram #ram_animation {
        width: 200px;
        height: 200px;
        margin: -40px auto -20px;
    }

    .ram #ram_animation {
        width: 180px;
        height: 180px;
        margin: 30px auto -40px;
    }
}