@charset "UTF-8";
/* CSS Document */

/* Global Styles */

.text-image-block:has(div.c3_quote_comp) {
    min-height: 0px !important;
    padding: 0px !important;
    display: block !important;
    background-color: #ffffff !important;
}

div.c3_quote_comp {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    padding-top: 160px;
    padding-bottom: 120px;
    background-repeat: no-repeat;
    transition: all 0.5s ease;
    min-height: 600px;
    overflow: hidden;
    background-color: #ffffff;
    z-index: 1;
}

@media only screen and (max-width: 1300px) {
    div.c3_quote_comp {
        min-height: 300px;
        padding-top: 60px;
    }
}

div.c3_quote_comp_flip {
    background-color: #f1f1f6;
}

/*div.c3_quote_comp.c3_james {
    background-image: url(assets/james-Carroll.jpg);
    background-size: cover;
    background-position: left bottom;
}*/

div.c3_quote_comp.c3_james iframe {
    display: block;
    position: absolute;
    height: 115%;
    bottom: -50px;
    left: 0px;
    aspect-ratio: 1 / 1;
}

@media only screen and (max-width: 1100px) {
    div.c3_quote_comp.c3_james iframe {
        left: auto;
        right: 46%;
    }
}

@media only screen and (max-width: 1000px) {
    div.c3_quote_comp.c3_james iframe {
        left: auto;
        right: auto;
        width: 100%;
        position: relative;
        margin-top: -50px;
        margin-bottom: 50px;
    }
}


div.c3_quote_comp.c3_sarah {
    background-image: url(assets/Sarah-Richardson.jpg);
    background-size: cover;
    background-position: left bottom;
}

div.c3_quote_comp.c3_josie {
    background-image: url(assets/Josie-Crone.jpg);
    background-size: cover;
    background-position: left bottom;
}

div.c3_quote_comp.c3_sam {
    background-image: url(assets/Sam-Morris.png);
    background-size: cover;
    background-position: right bottom;
}

div.c3_quote_comp.c3_fiona {
    background-image: url(assets/Fiona_Dos_Santos.png);
    background-size: cover;
    background-position: right bottom;
}

div.c3_quote_comp.c3_bryony {
    background-image: url(assets/Bryony_Harrison.png);
    background-size: cover;
    background-position: left bottom;
}

div.c3_quote_comp.c3_shabnam {
    background-image: url(assets/Shabnam-Ali.png);
    background-size: cover;
    background-position: left bottom;
}

div.c3_quote_comp.c3_katie {
    background-image: url(assets/Katie-Longmate.png);
    background-size: cover;
    background-position: right bottom;
}

div.c3_quote_comp.c3_will {
    background-image: url(assets/Will_Bond.png);
    background-size: cover;
    background-position: right bottom;
}


div.c3_quote_comp.c3_grace {
    background-image: url(assets/Grace_Burney.png);
    background-size: cover;
    background-position: left bottom;
}

div.c3_quote_comp.c3_paul {
    background-image: url(assets/Paul_Greatholder.png);
    background-size: cover;
    background-position: right bottom;
}

div.c3_quote_comp.c3_amy {
    background-image: url(assets/Amy_Chapman.png);
    background-size: cover;
    background-position: left bottom;
}

div.c3_quote_comp.c3_caroline {
    background-image: url(assets/Caroline_Brosnan.png);
    background-size: cover;
    background-position: right bottom;
}

div.c3_quote_comp.c3_infocus_environment {
    background-image: url(assets/c3-infocus-environment.jpg);
    background-size: cover;
    background-position: left bottom;
}

div.c3_quote_comp.c3_infocus_justice {
    background-image: url(assets/c3-infocus-justice.jpg);
    background-size: cover;
    background-position: left bottom;
}

div.c3_quote_comp.c3_infocus_community {
    background-image: url(assets/c3-infocus-community.jpg);
    background-size: cover;
    background-position: left bottom;
}

@media only screen and (max-width: 1000px) {
    div.c3_quote_comp {
        padding-top: 0px;
        padding-bottom: 0px;
        background-size: 1000px !important;
    }
}


div.c3_quote_comp blockquote {
    display: block;
    max-width: 624px;
    width: 50%;
    position: relative;
    margin-left: 50%;
    padding-right: 16px;
    transition: all 0.5s ease;
}


div.c3_quote_comp.c3_quote_comp_flip blockquote {
    margin-right: 50%;
    margin-left: auto;
    text-align: right;
    width: calc(50% - 16px);
}

@media only screen and (max-width: 1000px) {
    div.c3_quote_comp blockquote {
        position: relative;
        width: 100% !important;
        margin-left: 0%;
        margin-right: 0%;
        padding-left: 32px;
        padding-right: 32px;
        padding-bottom: 32px;
        padding-top: 60px;
        margin-bottom: 320px !important;
    }
    
    div.c3_quote_comp.c3_james blockquote {
        margin-bottom: 50px !important;
    }
}


div.c3_quote_comp blockquote h3, div.c3_quote_comp blockquote h4 {
    color: var(--c3-color-teal);
    font-size: 30px;
    line-height: 36px;
    margin-bottom: 30px;
    transition: all 0.5s ease;
    transform: translateY(100vh);
    font-weight: 200;
}
/*
div.c3_quote_comp.c3_quote_comp_environment blockquote h3 {
    color: var(--c3-color-orange);
}

div.c3_quote_comp.c3_quote_comp_justice blockquote h3 {
    color: var(--c3-color-blue);
}

div.c3_quote_comp.c3_quote_comp_community blockquote h3 {
    color: var(--c3-color-red);
}

div.c3_quote_comp.c3_quote_comp_people blockquote h3 {
    color: var(--c3-color-environmental-green);
}*/

div.c3_quote_comp blockquote h3 strong, div.c3_quote_comp blockquote h4 strong {
    font-weight: 700;
}

div.c3_quote_comp blockquote h4 {
    color: #000000;
    transition-delay: 0.1s;
    opacity: 0.5;
}
    
div.c3_quote_comp blockquote h3.c3_quote {   
    padding-top: 135px;
    margin-top: -50px;
    color: #000000;
    font-family: 'Haboro Light Condensed It';
    font-family: "haboro-serif-condensed", serif;
}

div.c3_quote_comp blockquote h3.c3_quote::before {
    content: "";
    width: 100px;
    height: 100px;
    background-image: url(assets/c3-quote-teal.svg);
    background-repeat: no-repeat;
    position: absolute;
    top: 0px;
    left: 0px;
}

div.c3_quote_comp.c3_quote_comp_flip blockquote h3.c3_quote::before {
    left: auto;
    right: 0px;
}
/*
div.c3_quote_comp.c3_quote_comp_people blockquote h3.c3_quote::before {
    background-image: url(assets/c3-quote-green.svg);
}

div.c3_quote_comp.c3_quote_comp_environment blockquote h3.c3_quote::before {
    background-image: url(assets/c3-quote-orange.svg);
}

div.c3_quote_comp.c3_quote_comp_justice blockquote h3.c3_quote::before {
    background-image: url(assets/c3-quote-blue.svg);
}

div.c3_quote_comp.c3_quote_comp_community blockquote h3.c3_quote::before {
    background-image: url(assets/c3-quote-red.svg);
}*/


div.c3_quote_comp.c3_inview blockquote h3, div.c3_quote_comp.c3_inview blockquote h4 {
    transform: translateY(0vh);
}

div.c3_quote_comp blockquote a.c3_readmore {
    display: inline-block;
    position: relative;
    margin-bottom: 60px;
    font-size: 16px;
    color: #ffffff;
    padding: 5px;
    padding-left: 15px;
    padding-right: 20px;
    background-image: linear-gradient(90deg, #15847f, #0e6a6e);
    border-bottom-right-radius: 18px;
    transition: all 0.5s ease;
    transition-delay: 0.1s;
    transform: translateY(100vh);
    text-decoration: none;
    font-weight: 500;
}

div.c3_quote_comp.c3_inview blockquote a.c3_readmore {
    transform: translateY(0vh);
}

div.c3_quote_comp blockquote a.c3_play {
    display: block;
    overflow: hidden;
    text-decoration: none;
    transform: translateY(100vh);
    transition: all 0.5s ease;
    transition-delay: 0.1s;
    background-image: url(assets/c3-play-pause.svg);
    background-position: 0px -46px;
    background-size: 30px;
    background-repeat: no-repeat;
    margin-bottom: 0px;
    padding-left: 40px;
    height: 0px;
}

div.c3_quote_comp blockquote a.c3_play.c3_play_show {
    margin-bottom: 30px;
    height: 40px;
}


div.c3_quote_comp blockquote a.c3_play.isplaying {
    background-position: 0px 0px;
}

div.c3_quote_comp.c3_inview blockquote a.c3_play {
    transform: translateY(0vh);
}

div.c3_quote_comp blockquote a.c3_readmore:hover {
    padding-right: 30px;
}

div.c3_quote_comp blockquote p strong {
    font-size: 22px;
    line-height: 28px;
    color: var(--c3-color-teal); 
}

div.c3_quote_comp.c3_quote_comp_environment blockquote p strong {
    color: var(--c3-color-orange);
}

div.c3_quote_comp.c3_quote_comp_people blockquote p strong {
    color: var(--c3-color-environmental-green);
}

div.c3_quote_comp.c3_quote_comp_justice blockquote p strong {
    color: var(--c3-color-blue);
}

div.c3_quote_comp.c3_quote_comp_community blockquote p strong {
    color: var(--c3-color-red);
}

div.c3_quote_comp blockquote p {
    font-size: 16px;
    line-height: 20px;
    color: var(--c3-color-green);
    transition: all 0.5s ease;
    transition-delay: 0.2s;
    transform: translateY(100vh);
    margin-top: 0px;
    margin-bottom: 0px;
}

div.c3_quote_comp.c3_quote_comp_people blockquote p {
    color: #000000;
}

div.c3_quote_comp.c3_quote_comp_environment blockquote p {
    color: #000000;
}

div.c3_quote_comp.c3_quote_comp_justice blockquote p {
    color: #000000;
}

div.c3_quote_comp.c3_quote_comp_community blockquote p {
    color: #000000;
}

div.c3_quote_comp.c3_inview blockquote p {
    transform: translateY(0vh);
}

div.c3_quote_comp span {
    display: inline-block;
    position: relative;
    margin-bottom: 32px;
    font-size: 16px;
    color: #ffffff;
    padding: 5px;
    padding-left: 15px;
    padding-right: 20px;
    border-bottom-right-radius: 18px;
    font-weight: 700;
    transform: translateY(100vh);
    transition: all 0.5s ease;
}

div.c3_quote_comp.c3_quote_comp_people span {
    background-image: linear-gradient(90deg, #009a46, #44ae5e);
}

div.c3_quote_comp.c3_quote_comp_environment span {
    background-image: linear-gradient(90deg, #e65925, #f09043);
}

div.c3_quote_comp.c3_quote_comp_justice span {
    background-image: linear-gradient(90deg, #0e529c, #2977b8);
}

div.c3_quote_comp.c3_quote_comp_community span {
    background-image: linear-gradient(90deg, #b0153e, #c70555);
}

div.c3_quote_comp.c3_inview span {
    transform: translateY(0vh);
}