.quote-hero {
    background-size: cover;
    background-position: center center;
    text-align: left;
    padding: 0px 50px;

}


.quote-img-wrapper {
    position: relative;
    display: flex;
}

.quote-hero-circle-wrapper {
 position: absolute;
 left: 0;
 bottom: 0;
 height: 100%;
 width: 100%;
 overflow: hidden;
 min-height: 340px;
}

.quote-hero-circle {
    background: rgba(255, 255, 255, 0.30);
    border-radius: 50%;
    width: 100%;
    padding-top: 100%;
    position: absolute;
    bottom: -110px;
    left: 0;
}


.quote-hero-image {
    position: relative;
    display: flex;
    align-items: flex-end;
    padding-bottom: 0;
    padding-top: 0;
}


@media (max-width: 767px) {
    .quote-hero-image {
        display: none;
    }

}

.quote-hero-image img {
    width: 100%;
    padding: 0 20px;
    z-index: 1;
    margin-top: -80px;
}

.quote-hero-content {
    padding: 70px 20px;
    display: flex;
    align-items: center;
}

@media (max-width: 767px) {
    .quote-hero-content {
        padding: 50px 20px;
    }

    .quote-hero {
        padding: 0px 0px;
    
    }
}


.quote-hero-quote {
    font-size: 20px;
}


.quote-hero-name, .quote-hero-job {
    display: block;
    font-size: 20px;
    font-weight: 700;
}



/*CNS Styles*/

.cns-page .cns-dark-background.quote-hero {
    background: var(--e-global-color-primary);
}


.cns-page .cns-dark-background .quote-hero-quote, 
.cns-page .cns-dark-background .quote-hero-job, 
.cns-page .cns-dark-background .quote-hero-name {
    color: #fff!important; 
}


.cns-page .cns-dark-background .quote-hero-circle {
background: linear-gradient(47deg,rgba(43,104,246,0.1) 0%, rgba(43,104,246,0.4) 30%,  rgba(92,200,150,0.5) 60%, rgba(92,200,150,0) 100%); 
}



.cns-page .cns-light-background.quote-hero {
    background: #f8f8f8;
}



.cns-page .cns-light-background .quote-hero-circle {
background: linear-gradient(90deg,rgba(92,200,150,0.6) 0%, rgba(92,200,150,0.3) 60%, rgba(92,200,150,0.1) 100%);
}