.heart {
    z-index: 6;
    left: 50%;
    top: 15px;
    background-color: #545454;
    display: inline-block;
    height: 23px;
    position: fixed;
    transform: rotate(-45deg);
    width: 23px;

}
.heart:before,
.heart:after {
    content: "";
    background-color: #545454;
    border-radius: 50%;
    height: 23px;
    position: absolute;
    width: 23px;
}

.heart:before {
    top: -15px;
    left: 0;
}

.heart:after {
    left: 15px;
    top: 0;
}
.fa-heart-o:hover {
    background-color: #e20004;
    border-color: #e22f95;
    color: #fff;
}
.fa-heart-o:active{
    background: #ff00e4;
    border-color: #ff1600;
    color: #fff;
}
.fa-heart-o{
    background-color: #d6dbe9;
    color: #000000;
}
.upOnPhoto {
    position: relative;
    bottom: 130px;
    left: -130px;
    z-index: 1;!important;

}
@media (min-width: 850px) {
    .upOnPhoto {
        left: -110px;
        bottom: 130px;
    }
}

@media (max-width: 850px) and (min-width: 833px) {
    .upOnPhoto {
        left: -5px;
        bottom: 140px;
    }
}
@media (max-width: 832px) and (min-width: 600px) {
    .upOnPhoto {
        left: -5px;
        bottom: 140px;
    }
}
@media (min-width: 516px) and (max-width: 599px) {
    .upOnPhoto {
        left: -100px;
        bottom: 130px;
    }
}
@media (min-width: 499px) and (max-width: 516px) {
    .upOnPhoto {
        left: -5px;
        bottom: 150px;
    }
}
@media (min-width: 270px) and (max-width:499px){
    .upOnPhoto{
        left: 0;
        bottom: 150px;
    }
}
@media (min-width: 253px) and (max-width:270px){
    .upOnPhoto{
        left: 0;
        bottom: 150px;
    }
}

@media (max-width: 252px) {
    .upOnPhoto{
        left: 0;
        bottom: 150px;
    }
}



@media (max-width: 315px) {
    .heart {
        top: 20%;
        z-index: 6;
        left: 50%;
        background-color: #545454;
        display: inline-block;
        height: 15px;
        margin: -75px 10px;
        position: fixed;
        transform: rotate(-45deg);
        width: 15px;

    }
    .heart:before,
    .heart:after {
        content: "";
        background-color: #545454;
        border-radius: 50%;
        height: 15px;
        position: absolute;
        width: 15px;
    }

    .heart:before {
        top: -10px;
        left: 0;
    }

    .heart:after {
        left: 10px;
        top: 0;
    }
}
@media (max-width: 259px) {
    .heart{
        top: 15%;
    }
}
.liked{
    background: #bb001b;!important;
    border-color: #ff1600;!important;
    color: #fff;!important;
}