.featured-restuarent-sec{
    padding: 120px 0;
}
.featured-restuarent-sec .row{
    align-items:center;
}
.featured-restuarent-heading{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:50px;
}
.view-all-restaurants{
    display:flex;
    justify-content:center;
    align-items:center;
    color:#DC2625;
}
.view-all-restaurants > svg{
    margin-left:4px;
}
.col-4{
    width: calc(8.33% *4);
    padding: 0 15px;
}
.card-image > img{
    width:100%;
    height:100%;
    object-fit:contain
}
.card-image{
    position:relative;
}
.card-image > p{
    position: absolute;
    top: 32px;
    left: 23px;
    background-color:white;
    width:154px;
    border-radius:55px;
    color:#DC2625;
    font-size:14px;
    font-weight:500;
    padding: 5px 9px;
}

.rest-card{
    max-width:424px;
    /*height:398px;*/
    border: 1px solid rgba(0 , 0, 0, 20%);
    border-radius:15px;
    margin-bottom:30px;
}
.card-content{
    max-width:384px;
    /*height:69px;*/
    padding:20px;
    margin-bottom:33px;
}
.card-content > .food-name{
    text-transform:capitalize;
    font-size:24px;
    font-weight:400;
    color:#000000;
}
.card-content > .food-items{
    text-transform:capitalize;
    font-size:18px;
    font-weight:400;
    color:#000000;
}
.rating-box{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding: 0 20px;
}
.rating{
    display:flex;
    justify-content: center;
    align-items:center;
    background:#16A34A;
    color:#FFFFFF;
    border-radius:5px;
    
    padding:5px 15px;
}
.rating > svg{
    margin-right:4px;
}
.time{
    display:flex;
    justify-content:center;
    align-items:center;
}
.time > svg{
    margin-right:10px;
}
@media screen  and (max-width:1024px){
    .card-content{
        margin-bottom:11px;
    }
    .card-content > .food-name {
        font-size: 22px;
    }
}
@media screen and (max-width:768px){
    .card-content {
    margin-bottom:7px;
    }
    .card-content > .food-name {
        font-size: 15px;
    }
    .card-content > .food-items{
        font-size:11px;
    }
    .card-image > p {
    top: 90px;
    left: 65px;
    }
    .rating {
    padding: 5px 10px;
    }
    .rating-box {
    padding: 0 11px;
    }
}
@media screen and (max-width:576px){
    .col-4{
        width:100%;
    }
    .card-content > .food-name{
       font-size: 27px;;
    }
}