.callout-images {
    padding: 40px 0;
}
.callout-images .section-title {
    margin: 0 0 20px;
}
.callout-images .section-title a {
    color: var(--wp--preset--color--ink);
    border-bottom: 1px solid var(--wp--preset--color--ink);
    width: fit-content;
}
.callout-images .section-title a:hover {
    color: var(--wp--preset--color--blue);  
    border-bottom: 1px solid var(--wp--preset--color--blue);
    opacity: 1;
}
/*--------------------------------------------------------------
Image Grid
--------------------------------------------------------------*/
.section-images {
    display: grid;
    gap: 20px;
    position: relative;
}

.section-images-small {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.section-images-medium {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.section-images-large {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

/*--------------------------------------------------------------
## Section Posts: In Posts
--------------------------------------------------------------*/
.type-post .section-images-small {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.type-post .section-images-medium {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.type-post .section-images-large {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/*--------------------------------------------------------------
## Section Posts: After Posts
--------------------------------------------------------------*/
.block-area-after-post .section-images-small {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.block-area-after-post .section-images-medium {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.block-area-after-post .section-images-large {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/*--------------------------------------------------------------
## Section Posts: In POST EDITOR
--------------------------------------------------------------*/
.content-sidebar .editor-styles-wrapper .section-images-small {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.content-sidebar .editor-styles-wrapper .section-images-medium {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.content-sidebar .editor-styles-wrapper .section-images-large {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/*--------------------------------------------------------------
## Section Posts: Sidebar
--------------------------------------------------------------*/
.block-area-sidebar .callout-images.is-style-bg-border {
    padding: 0;
}
.block-area-sidebar .section-images-small {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.block-area-sidebar .section-images-medium {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.block-area-sidebar .section-images-large {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 10px;
}

/*--------------------------------------------------------------
## Section Posts: Mobile
--------------------------------------------------------------*/
@media (max-width: 900px) {
    .section-images-small {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .section-images-medium, .type-post .section-images-medium, .block-area-after-post .section-images-medium {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 800px) {
    .section-images-large, .type-post .section-images-large, .block-area-after-post .section-images-large {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .section-images-small, .type-post .section-images-small, .block-area-after-post .section-images-small {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/*--------------------------------------------------------------
All Image Formats
--------------------------------------------------------------*/
.post-image {
    display: block;
    position: relative;
    border-radius: 5px;
    -webkit-box-shadow: var(--wp--custom--box-shadow--3);
    -moz-box-shadow: var(--wp--custom--box-shadow--3);
    box-shadow: var(--wp--custom--box-shadow--3);
}
.post-image:hover {
    color: var(--wp--preset--color--grey-four)!important;
    transition: all .8s ease 0s;
    transform: scale(1.05);
    opacity:1;
}
.post-image a:hover {
    opacity: 1;
}
.post-image img {
    border-radius: 5px;
}

.image-title {
    font-family: var(--wp--preset--font-family--custom-sans);
    border-radius: 0 var(--wp--custom--border-radius--small) var(--wp--custom--border-radius--small) 0;
    background: var(--wp--preset--color--white);
    color: var(--wp--preset--color--ink);
    width: fit-content;
    display: block;
    padding: 10px;
    font-size: var(--wp--preset--font-size--small);
    line-height: var(--wp--custom--line-height--xsmall);
    font-weight: 700;
    position: absolute;
    bottom: 20px;
    left: 0;
    -webkit-box-shadow: var(--wp--custom--box-shadow--3);
    -moz-box-shadow: var(--wp--custom--box-shadow--3);
    box-shadow: var(--wp--custom--box-shadow--3);
}

.image-lg .image-title {
    font-size: var(--wp--preset--font-size--medium);
}

/*--------------------------------------------------------------
Sidebar Styling
--------------------------------------------------------------*/
.block-area-sidebar .callout-images .section-icon {
    width: 30px;
    height: 30px;
    border: 2px solid #FFF;
    margin-right: 0;
    margin: -35px auto 5px !important;
}
