.blog-post-content {
    margin-top: -95px;
    position: relative;
    z-index: 1;
    background: linear-gradient(180deg, rgba(7, 15, 44, 0) 0%, #070F2C 45.4%);

}

.side-blog-item {
    &:hover {
        background-color: rgba($white, .05);
        .arrow-btn {
            transform: rotate(0);
            background-color: $primary;
            border-color: $primary !important;
            opacity: 1 !important;
            span {
                color: $white !important;
            }
        }
    }
}

// Home Two
.side-blog-item {
    &.style-two {
        &:hover {
            background-color: $white;
            box-shadow: $box-shadow-sm;
        }
    }
} 

.blog-post-style-two {
    img {
        width: 496px;
        height: 530px;
        object-fit: cover;
        @media(max-width: 1199px) {
            width: 100%;
            height: auto;
            border-radius: 0 !important;
        }
    }
    .blog-post-2-content {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        @media(max-width: 1199px) {
            border-radius: 0 !important;
            width: 100%;
            position: inherit;
            transform: inherit;
        }
    }
}

// Home 11
.blog_12_item {
    &:hover {
        .btn {
            background: $gd-11;
            border: 0;
        }
    }
}

// Home 12
.blog_11_item {
    &:hover {
        .btn {
            background-color: $yellow-custom;
            color: $dark !important;
        }
    }
}

// Blog 14
.blog_14_wrapper {
    display: flex;
    gap: 16px;
}

.blog_14_item {
    min-height: 550px;
	width: calc(100% / 3);
	cursor: pointer;
	transition: width 750ms ease-in-out;
	transition-delay: 250ms;
	display: inline-flex;
	align-items: center;
	justify-content: center;
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    img {
        height: 100%;
        width: 100%;
        object-fit: cover;
        // @media(max-width: 575px) {
        //     min-height: 312px;
        // }
    }
    .content {
        position: absolute;
        inset: 0;
        .bottom  {
            opacity: 0;
            visibility: hidden;
            transition: 2s;
            transition-delay: 1s;
            @media(max-width: 991px) {
                opacity: 1;
                visibility: visible;
            }
            .fs-28 {
                @media(max-width: 1199px) {
                    font-size: 22px;
                }
                @media(max-width: 575px) {
                    font-size: 18px;
                }
            }
        }
    }
    &.active {
        width: 105%;
        .content {
            .tag {
                background-color: $warning !important;
            }
            .bottom {
                opacity: 1;
                visibility: visible;
            }
        }
    }
}
// .blog_14_wrapper {
//     display: flex;
//     gap: 16px;
//     @media(max-width: 991px) {
//         flex-direction: column;
//     }
// }

// .blog_14_item {
//     flex: 1;
//     transition: flex 0.3s ease-in-out;
//     cursor: pointer;
//     position: relative;
//     overflow: hidden;
//     img {
//         height: 100%;
//         width: 100%;
//         object-fit: cover;
//         @media(max-width: 575px) {
//             min-height: 312px;
//         }
//     }
//     .content {
//         position: absolute;
//         inset: 0;
//         .bottom  {
//             opacity: 0;
//             visibility: hidden;
//             @media(max-width: 991px) {
//                 opacity: 1;
//                 visibility: visible;
//             }
//             .fs-28 {
//                 @media(max-width: 1199px) {
//                     font-size: 22px;
//                 }
//                 @media(max-width: 575px) {
//                     font-size: 18px;
//                 }
//             }
//         }
//     }
//     &.active {
//         flex: 2;
//         .content {
//             .tag {
//                 background-color: $warning !important;
//             }
//             .bottom {
//                 opacity: 1;
//                 visibility: visible;
//             }
//         }
//     }
// }