.blog {
    width: 90%;
    margin: 0 auto;
}

.posts {
    margin-bottom: 20px;
    overflow: hidden;
    width: 100%;
    border-radius: 10px;
    position: relative;
    background: #0a2b22;
}

.image_section {
    height: 260px;
    margin-right: -42px;
    margin-bottom: -10px;
    min-width: 400px;
    max-width: 450px;
    background: #0a2b22;
    display: flex;
    justify-content: center;
    align-items: center;

}

.image_section img {
    max-width: 100%;
}

.post-category {
    display: inline-block;
    font-size: 11px;
    background: red;
    margin: 8px 0;
    padding: 5px;
    border-radius: 10px
}

.post-category a {
    color: #fff
}

.post-title {
    font-size: 16px;
    letter-spacing: -.5px;
    line-height: 26px;
    overflow: hidden;
    text-align: right
}

.post-title a {
    color: var(--e-global-color-text);
    transition: .1s all ease-in-out;
}


.posts .text-box h4 {
    margin: 20px 0 10px;
    color: white;
}

.the-excerpt {
    margin-bottom: 15px;
    font-size: 14px;
    border-bottom: 1px solid var(--e-global-color-secondary);
    padding-bottom: 10px;
}

.post-deta {
    display: block;
}

.post-deta a {
    color: #8f8f8f;
    text-decoration: none
}

.post-meta, .update-date {
    font-size: 13px
}

.post-meta {
    margin: 0 14px 0 0
}

.fixed {
    margin-left: 15px;
    text-align: justify
}

.posts:nth-of-type(odd) .text-box, .posts:nth-of-type(even) .text-box {
    border-right: 75px solid transparent;
    position: absolute;
    height: 0;
    top: 0;
    left: 0;
    width: 65%
}

.posts:nth-of-type(odd) .text-box {
    border-bottom: 270px solid #0a1717;
}

.posts:nth-of-type(even) .text-box {
    border-top: 270px solid #0a1717;
}

.posts:nth-of-type(even) .fixed {
    margin-top: -270px
}

.post-deta a:hover {
    color: #000
}

.post-title a:hover {
    color: var(--e-global-color-primary);
}

.navigation-page {
    text-align: center
}

.nav-links a, .nav-links span {
    list-style: none;
    padding: 12px;
    margin: 3px;
    margin-bottom: 20px;
    color: #000;
    border-radius: 10px;
    display: inline-block;
    border: 1px solid #d9d9d9;
    background: #0000000f;
    font-size: 20px
}

.product-price {
    background: #0a2b22;
    padding: 10px;
    border-radius: 10px;
    margin: 0 0 15px 0;
}

.add-to-cart button {
    background: var(--e-global-color-primary);
    border: none;
    padding: 10px;
    border-radius: 10px;
}

.add-to-cart input {
    background: var(--e-global-color-text);
    border: none;
    padding: 10px 5px;
    border-radius: 10px;
    width: 10%;
}

form.add_to_cart_section_cart {
    display: flex;
    gap: 10px;
}

.product-price span {
    margin: 0 0 0 6px;
}

@media only screen and (max-width: 767px) {
    .post-deta {
        display: inline-flex;
        flex-wrap: wrap;
        margin-right: -20px;
        color: #fff
    }

    .blog {
        width: 90%
    }

    .the-excerpt {
        display: none
    }

    .posts:nth-of-type(odd) .text-box {
        border-bottom: 211px solid #00000087
    }

    .posts:nth-of-type(even) .text-box {
        border-top: 211px solid #00000087
    }

    .posts img:not([class = emoji]) {
        margin-right: 0;
        max-width: none;
        width: 100%;
        height: 211px
    }

    .post-title a {
        color: #fff
    }

    .post-deta a {
        color: #f7f7f7;
        text-decoration: revert
    }

    .posts:nth-of-type(even) .fixed {
        margin-top: -211px
    }

    .image_section {
        height: 210px;
    }
}