.favorite-star {
    position: absolute;
    right: 95px;
    display: none;
    background-color: #FFFFFF;
    float: right;
    z-index: 1;
    animation: imgfade 0.7s;
}

@media screen and (max-width: 1100px) {
    .favorite-star {
        right: 20px;
    }
}

@keyframes imgfade {
    0% {
        opacity: 0;
    }

    25% {
        opacity: 0.3;
    }

    50% {
        opacity: 0.6;
    }

    75% {
        opacity: 0.9;
    }

    100% {
        opacity: 1;
    }
}

.favorite-star img {
    border-radius: 5px;
    color: gray;
    padding: 4px 5px;
    cursor: pointer;
    font-family: Roboto;
    letter-spacing: 0.2px;
    text-align: center;
    text-transform: uppercase;
    user-select: none;
    width: 106px;
    z-index: 2;
    background-color: #ffffff;
}

@media screen and (max-width: 550px) {
    .favorite-star img {
        padding: 2px 4px;
        height: 21px;
        width: 82px;
    }
}

.favorite-star:hover {
    cursor: pointer;
}

.favorite-star:hover img {
    background-color: #fffcbd;
}

.is-favorite img {
    background-color: #fffcbd !important;
}

.is-favorite:hover img {
    background-color: #ffffff !important;
}