
.post-card-wrapper.is-horizontal {}

/* post card set - slide */
.post-card-wrapper.is-horizontal.layout-slide .post-card-wrapper-container {}

/* post card set - grid */
.post-card-wrapper.is-horizontal.grid .post-card-wrapper-container {
    display: grid;
    gap: var(--customize-card-gap);
    /* grid-template-columns: auto auto; */
    /* grid-template-columns: repeat(auto-fit,minmax(200px,1fr)); */
    grid-template-columns: repeat(2,1fr);
}

/* post card */
.post-card.is-horizontal {
    display: flex;
    flex-wrap: nowrap;
}
.post-card.is-horizontal>.post-card-col.this-col-img {
    width: 305px;
    height: 305px;
    border-radius: var(--customize-card-border-radius);
    overflow: hidden;
    /* background-color: #ccc; */
}
/* .post-card.is-horizontal>.post-card-col.this-col-img>.img-sec {
    opacity: 0;
} */
.post-card.is-horizontal>.post-card-col.this-col-info {
    display: flex;
    flex-direction: column;
    width: calc(100%  - 305px);
    padding: 30px;
}
.post-card.is-horizontal>.post-card-col.this-col-info .highlight {
    margin-top: auto;
}

/* --------------------------------------------------------- */


.post-card-slide .splide-track {
    padding: 20px 0;
}

/* ============================================================================================== */
/* =========================================== horizontal ======================================= */
/* ============================================================================================== */

.post-card-grid.is-horizontal {
    display: grid;
    gap: var(--customize-card-gap);
    /* grid-template-columns: auto auto; */
    /* grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); */
    grid-template-columns: repeat(2, 1fr);
}
.post-card.is-horizontal .inner-row {
    display: flex;
    flex-direction: column;
}

.post-card.is-horizontal>.inner-row,
.post-card.is-horizontal>.inner-row>.inner-col {
    position: relative;
}
.post-card.is-horizontal>.inner-row {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: stretch;
    width: 100%;
    /* height: 305px; */
}
.post-card.is-horizontal>.inner-row>.inner-col.this-col-img {
    padding: 5px;
    width: 305px;
}
.post-card.is-horizontal>.inner-row>.inner-col.this-col-img .img-sec {
    border-radius: 15px;
    overflow: hidden;
    z-index: 1;
}
.post-card.is-horizontal>.inner-row>.inner-col.this-col-info {
    display: flex;
    flex-direction: column;
    padding: 30px;
    width: calc(100% - 305px);
}


/* xxl */
@media (min-width: 1400px) {}

/* xxl - 1 */
@media (min-width:1500px) and (max-width: 1599.98px) {}

/* xxl - 2 */
@media (min-width: 1400px) and (max-width: 1499.98px) {}

/* xl */
@media (min-width: 1200px) and (max-width: 1399.98px) {

    .post-card.is-horizontal>.inner-row>.inner-col.this-col-img {
        width: 280px;
    }
    .post-card.is-horizontal>.inner-row>.inner-col.this-col-info {
        padding: 30px;
        width: calc(100% - 280px);
    } 

}

/* lg */
@media (min-width: 992px) and (max-width: 1199.98px) {

    .post-card.is-horizontal>.inner-row>.inner-col.this-col-img {
        width: 250px;
    }
    .post-card.is-horizontal>.inner-row>.inner-col.this-col-info {
        padding: 20px;
        width: calc(100% - 250px);
    } 

}

/* md */
@media (min-width: 768px) and (max-width: 991.98px) {

    .post-card-grid.is-horizontal {
        grid-template-columns: repeat(1, 1fr);
    }

}

/* sm - xs */
@media (max-width: 767.98px) {}

/* sm */
@media (min-width: 576px) and (max-width: 767.98px) {

    .post-card-grid.is-horizontal {
        grid-template-columns: repeat(1, 1fr);
    }
    .post-card.is-horizontal>.inner-row>.inner-col.this-col-img {
        width: 200px;
    }
    .post-card.is-horizontal>.inner-row>.inner-col.this-col-info {
        padding: 30px;
        width: calc(100% - 200px);
    }   

}

/* xs */
@media (max-width: 575.98px) {

    .post-card-grid.is-horizontal {
        grid-template-columns: repeat(1, 1fr);
    }
    .post-card.is-horizontal>.inner-row>.inner-col.this-col-img {
        width: 190px;
    }
    .post-card.is-horizontal>.inner-row>.inner-col.this-col-info {
        padding: 15px;
        width: calc(100% - 190px);
    }    

}

/* xs custom */
@media (max-width: 399.98px) {}