/* BEGIN b-card-22 */
.b-card-22 {
    display: block;
    position: relative;
    margin-bottom: 30px;
}
.b-card-22 img{
  border-radius: 10px;
}
.b-card-22::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    border-radius: 10px;
    transition: all 0.5s;
    background-color: rgb(0 0 0 / 20%);
}
.b-card-22 .b_title {
    position: absolute;
    bottom: 5px;
    width: 95%;
    left: 8px;
    padding: 10px;
    border-radius: 10px;
    color: #fff;
    background: rgba(175, 31, 69, 0.7);
    backdrop-filter: blur(5px);
    z-index: 2;
}
.b-card-22:hover::before {
    opacity: 1;
}
/* END b-card-22 */
@media screen and (max-width: 767px) {
    .b-card-22 .b_title{
        position: static;
        margin-top: 10px;
        width: 100%;
    }
}