*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.con{
    
    width: 100%;
    height: 100vh;
}

.cards{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 775px;
    width: 100%;
    gap: 50px;
    overflow: hidden;
}


.card{
    width: 340px;
    border-radius: 26px;
    border: 1.32px solid #bebebe;
}

.card-header{
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
}

.card h1{
    font-family: Inter;
font-size: 18.41px;
font-weight: 600;
line-height: 22.28px;
line-height: 22px;
overflow: hidden;
}

.cardss:hover{
    overflow: hidden;
}
.card-locate{
    font-family: Inter;
font-size: 15.78px;
font-weight: 300;
line-height: 19.1px;
color: #787878;
line-height: 22px;
}


.card-img{
    width: 100%;
}

.card-img:hover{
    transition: 0.9s linear;
    transform: scale(1.1);
    
}

.card-body{
    padding: 14px 16px 24px;
}

.card-icons{
    display: flex;
    justify-content: space-between;
}
 

.card-icons-left{
    display: flex;
    gap: 24px;
    margin-bottom: 14px;
}

strong{
    font-family: Inter;
font-size: 15.78px;
font-weight: 600;
line-height: 19.1px;
}

.card-info{
    font-family: Inter;
    font-size: 15.78px;
}

i{
    color: #787878;
}


.fa-heart:hover{
    color: #FF5353;
}


i:hover{
    color: #FFBD3D;
    transform: rotate(45deg);
    transition: 0.2s linear;
}

.fa-share:hover{
    color: #5D94FF;
}

.fa-bookmark:hover{
    color: #5D94FF;
}