.favorites{
    position: absolute;
    top: 0;
    right: 15px;
    width: 36px;
    height: 36px;
    z-index: 10;
}

.card-list .card.card-bg  .favorites{
    right: 70%;
}

@media only screen and (max-width: 1200px) {
    .card-list .card.card-bg  .favorites{
        right: 51%;
    }
}
@media only screen and (max-width: 767px) {
    .card-list .card.card-bg  .favorites{
        right: 0;
    }
}
.favorites::before {
    background-repeat: no-repeat;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: -1px;
    right: -1px;
    -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.5,3);
    transition: transform .3s cubic-bezier(.5,0,.5,3);
    transition: transform .3s cubic-bezier(.5,0,.5,3),-webkit-transform .3s cubic-bezier(.5,0,.5,3);
    -webkit-tap-highlight-color: transparent;
}

.favorites::before{
    background-image: url(/img/favorites/favorites_off.svg);
}

.active .favorites::before{
    background-image: url(/img/favorites/favorites_on.svg);
}

.favorites.delete::before{
    background-image: url(/img/favorites/favorites_del.svg);
}