.recent .card {
    border-radius: 15px;
    margin-bottom: 40px;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s
}

.recent .card .card-img {
    border-radius: 15px
}

.recent .card h5 {
    font-size: 20px;
    color: #fff;
    margin-bottom: 5px
}

.recent .card p {
    font-size: 14px;
    color: #34bade
}

.recent .card.active, .recent .card:hover {
    transform: scale(1.05, 1.1);
    -webkit-transform: scale(1.05, 1.1);
    -ms-transform: scale(1.05, 1.1);
    -moz-transform: scale(1.05, 1.1);
    box-shadow: 0 20px 32px 0 rgba(0, 0, 0, .25)
}

.recent .card.active .card-img-overlay, .recent .card:hover .card-img-overlay {
    background: -webkit-linear-gradient(rgba(0, 0, 0, .3), rgba(150, 200, 214, .95));
    background: -moz-linear-gradient(rgba(0, 0, 0, .3), rgba(150, 200, 214, .95));
    background: linear-gradient(rgba(0, 0, 0, .3), rgba(150, 200, 214, .95));
    background: -ms-linear-gradient(rgba(0, 0, 0, .3), rgba(150, 200, 214, .95))
}

.recent .card.active p, .recent .card:hover p {
    color: #fff
}

.recent .card-img-overlay {
    border-radius: 15px;
    background: -webkit-linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .85));
    background: -moz-linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .85));
    background: linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .85));
    background: -ms-linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .85));
    background: -o-linear-gradient(rgba(189, 163, 163, .3), rgba(0, 0, 0, .85))
}

.recent .heart {
    width: auto!important
}

.recent .bottom-text {
    position: absolute;
    bottom: 30px;
    left: 5%;
}

@media (max-width:767px) {
    .recent {
        margin-top: 100px
    }
}