/* General Styles */
.pb-section-2col .columns-wrap {
    display: grid;
    grid-gap: 4rem;
}

.pb-section-2col p:last-child {
    margin-bottom: 0;
}

.pb-section-2col .leftcol,
.pb-section-2col .rightcol {
    position: relative;
}

/* Background Colors */
.pb-section-2col .leftcol.brand-bg,
.pb-section-2col .rightcol.brand-bg {
    background: #ff4d00;
    color: #fff;
}

.pb-section-2col .leftcol.darkblue-bg,
.pb-section-2col .rightcol.darkblue-bg {
    background: #0B2340;
    color: #fff;
}

.pb-section-2col .leftcol.white-bg,
.pb-section-2col .rightcol.white-bg {
    background: #fff;
    color: #000;
}

.pb-section-2col .image-wrap {
    position: relative;
}

/* Image Pairs - Background Image */
.pb-section-2col .background-image-wrap {
    position: absolute;
    z-index: 0;
}

.pb-section-2col .leftcol .background-image-wrap {
    top: -60px;
    left: -60px;
}

.pb-section-2col .rightcol .background-image-wrap {
    top: -60px;
    right: -60px;
}

.pb-section-2col .background-image-wrap img {

    height: auto;
}

/* Image Pairs - Foreground Image */
.pb-section-2col .leftcol .image-wrap > img {
    position: relative;
    z-index: 1;
    margin-left: auto;
    display: block;
}

.pb-section-2col .rightcol .image-wrap > img {
    position: relative;
    z-index: 1;
    margin-right: auto;
    display: block;
}

/* Image Pairs - Image Caption */
.pb-section-2col .image-wrap .image-caption {
    position: absolute;
    bottom: 20px;
    right: 20px;
    z-index: 2;
    color: #ffffff;
}

.pb-section-2col .image-wrap .image-caption p {
    margin: 0;
}

/* Background Block */
.pb-section-2col .has-background-block .image-wrap {
    position: relative;
    max-width: fit-content;
    display: inline-block;
}

.pb-section-2col .rightcol.has-background-block .image-wrap {
    margin-top: 15rem;
}

@media (min-width: 768px) {
    .pb-section-2col .rightcol.has-background-block .image-wrap {
        margin-top: 0;
    }
}

.pb-section-2col .has-background-block .image-wrap .background-block {
    content: '';
    position: absolute;
    top: -15%;
    width: 100%;
    height: 100%;
    background: var(--brand-color-lightgray);
    z-index: 0;
}

.pb-section-2col .has-background-block .image-wrap img {
    position: relative;
    z-index: 1;
}

.pb-section-2col .leftcol.has-background-block .image-wrap .background-block {
    left: -25%;
    right: auto;
}

.pb-section-2col .rightcol.has-background-block .image-wrap .background-block {
    left: auto;
    right: -25%;
}

/* Button Styles */
.pb-section-2col a.btn {
    margin-top: 2rem;
}


/* Nomargin with Colored Background */
.pb-section-2col.nomargin-with-coloredbg .pb-section-margin-wrap {
    grid-gap: 0;
    max-width: 1860px;
}

.pb-section-2col.nomargin-with-coloredbg .leftcol,
.pb-section-2col.nomargin-with-coloredbg .rightcol {
    box-sizing: border-box;
}

.pb-section-2col.nomargin-with-coloredbg .leftcol.has-image img,
.pb-section-2col.nomargin-with-coloredbg .rightcol.has-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Responsive Grid Layouts */
@media (min-width: 768px) {
    .pb-section-2col .columns-wrap {
        grid-template-columns: 1fr 1fr;
        grid-gap: 6rem;
    }

    .pb-section-2col.column-width-80-20 .columns-wrap {
        grid-template-columns: 8fr 2fr;
    }

    .pb-section-2col.column-width-70-30 .columns-wrap {
        grid-template-columns: 7fr 3fr;
    }

    .pb-section-2col.column-width-60-40 .columns-wrap {
        grid-template-columns: 6fr 4fr;
    }

    .pb-section-2col.column-width-50-50 .columns-wrap {
        grid-template-columns: 1fr 1fr;
    }

    .pb-section-2col.column-width-40-60 .columns-wrap {
        grid-template-columns: 4fr 6fr;
    }

    .pb-section-2col.column-width-30-70 .columns-wrap {
        grid-template-columns: 3fr 7fr;
    }

    .pb-section-2col.column-width-20-80 .columns-wrap {
        grid-template-columns: 2fr 8fr;
    }
}

/* Image Styles */
.pb-section-2col.nomargin-with-coloredbg .leftcol.has-image img,
.pb-section-2col.nomargin-with-coloredbg .rightcol.has-image img {
    object-fit: cover;
    object-position: 100%;
}

@media (max-width: 1799px) {
    .pb-section-2col .rightcol.has-image img {
        min-width: 0 !important;
    }
}

@media (min-width: 768px) {
    .pb-section-2col-columns-wrap img.img-respect-width-retina,
    .pb-section-2col-columns-wrap img.img-respect-width-noresize {
        margin: 10px;
        width: auto;
    }
}

@media (min-width: 1100px) {
    .pb-section-2col-extra-padding-rightcol {
        padding-left: 80px;
    }

    .pb-section-2col-extra-padding-leftcol {
        padding-right: 80px;
    }

    .pb-section-2col .large-paragraph-heading {
        margin: 50px 0;
    }
}


@media (max-width: 767px) {

    .pb-section-2col.larger-offset-image .has-image {
        order: 1;
    }

    .pb-section-2col.larger-offset-image .has-text {
        order: 2;
    }
}

@media (min-width: 768px) {

    .pb-section-2col.larger-offset-image .columns-wrap {
        grid-gap: 10rem;
    }
}

@media (min-width: 1740px) {

    .pb-section-2col.larger-offset-image .has-image {
        width: calc(100% + 18.6rem);
    }

    .pb-section-2col.larger-offset-image .leftcol.has-image {
        margin-left: -18.6rem;
    }

    .pb-section-2col.larger-offset-image .rightcol.has-text {
        padding-left: 10rem;
    }
}

.pb-section-2col.align-left .columns-wrap {
    text-align: left;
}

.pb-section-2col.align-center .columns-wrap {
    text-align: center;
}

.pb-section-2col.align-right .columns-wrap {
    text-align: right;
}

@media (min-width: 768px) {
    .pb-section-2col.image-align-left .has-image {
        text-align: left;
    }

    .pb-section-2col.image-align-center .has-image {
        text-align: center;
    }

    .pb-section-2col.image-align-right .has-image {
        text-align: right;
    }

    .pb-section-2col.image-align-left .has-image-and-text {
        text-align: left;
    }

    .pb-section-2col.image-align-center .has-image-and-text {
        text-align: left;
    }

    .pb-section-2col.image-align-right .has-image-and-text {
        text-align: left;
    }
}

.pb-section-2col .has-image-and-text .image-wrap {
    margin-bottom: 6rem;
}

.pb-section-2col .image-caption {
    position: absolute;
    left: 2rem;
    bottom: 2rem;
    color: #fff;
    font-size: 1.6rem;
    z-index: 1;
}

.pb-section-2col .image-caption > * {
    font-size: var(--pb-normal-paragraph-fontsize-desktop);
}

.pb-section-2col .image-caption a {
    color: #fff;
    text-decoration: underline;
}

