/* Quote Large */
.quote-large.cabb-block-background.beige{
    background: var(--wp--preset--color--light-beige);
    color: var(--wp--preset--color--dark-green);
}

.quote-large.cabb-block-background.green{
    background: var(--wp--preset--color--dark-green);
    color: var(--wp--preset--color--white);
}

.quote-large .white blockquote{
    background: var(--wp--preset--color--light-beige);
}

.quote-large .beige blockquote{
    background: var(--wp--preset--color--medium-beige);
}

.quote-large .green blockquote{
    background: var(--wp--preset--color--medium-green);
}

.quote-large.cabb-block-background.beige blockquote{
    background: var(--wp--preset--color--medium-beige);
}

.quote-large .quote-large-container {
    position: relative;
    width: 100%;
    max-width: 100%;
    padding: 0;
}

.quote-large .quote-large-container .inner{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 5rem;
    max-width: 1120px;
    margin: 0 auto;
}

.quote-large .quote-large-container.right .inner{
    flex-direction: row-reverse;
}

.quote-large .quote-large-container:not(.has-image) .inner{
    padding-top: 5.75rem;
    padding-bottom: 5.75rem; /* 140 - 48 */
}

.quote-large .quote-large-container .inner .image-col img{
    max-width: 100%;
    height:auto;
    display:block;
    max-width: 350px;
}

.quote-large .quote-large-container .inner .quote-col{
    max-width: 690px;
}

.quote-large blockquote{
    padding: 1rem;
    border-radius: 20px;
    position: relative;
    margin: 0;
}

.quote-large blockquote:before {
    content: "";
    display: block;
    width: 32px;
    height: 25px;
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='25' viewBox='0 0 32 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.6 24.4001V17.4401C17.6 12.7467 18.7466 8.90672 21.04 5.92006C23.3333 2.88006 26.72 0.906724 31.2 5.62668e-05V6.00006C29.3333 6.42672 27.7866 7.22672 26.56 8.40006C25.3866 9.52006 24.6133 10.8534 24.24 12.4001H29.6V24.4001H17.6ZM-4.82798e-05 24.4001V17.4401C-4.82798e-05 12.7467 1.14662 8.90672 3.43995 5.92006C5.73329 2.88006 9.11995 0.906724 13.6 5.62668e-05V6.00006C11.7333 6.42672 10.1866 7.22672 8.95995 8.40006C7.78662 9.52006 7.01328 10.8534 6.63995 12.4001H12V24.4001H-4.82798e-05Z' fill='%239776E4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 2;
    position: absolute;
    top: -13px;
}

.quote-large blockquote p{
    font-family: 'Jakarta';
    font-weight:600;
    font-size: 2rem;
    line-height: 2.5rem;
    margin: 0px;
    text-align: left;
}

.quote-large cite{
    font-family: 'DMSans';
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-style: normal;
    margin: 1rem 0 0 0;
    display:block;
    text-align: left;
}

/* mobile */
@media screen and (max-width: 767px){
    
    .quote-large blockquote p{
        font-size: 1.5rem !important;
        line-height: 2.0rem !important;
    }

    .quote-large cite{
        font-size: 1.0rem;
        line-height: 1.75rem;
    }
    
    .quote-large .quote-large-container .inner .image-col img{
        max-width: 100%;
        max-height: 400px;
        width: auto;
        height: auto;
    }
}

/* tablet */
@media (max-width: 1180px) {
    .quote-large .quote-large-container .inner{
        flex-direction: column;
        gap: 2rem;
    }

    .quote-large .quote-large-container.right .inner{
        flex-direction: column;
    }

    .quote-large .quote-large-container:not(.has-image) .inner{
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
}
