:root {

    /* Colors: */
        --rlf-color: #EEE9E2;
        --rlf-green-hl: #6B9913;
        --rlf-color: #818285;
        --rlf-color: #D1BFA6;
        --rlf-green: #00403A;
        --rlf-forest: #072D26;
        --rlf-teal: #00A299;
        --rlf-blue: #00728F;
        --rlf-greentl: #025A53;
        --rlf-linkcolor: #D2A159;
        --rlf-drkblue: #0C3953;

    }

    .os_page_container a, .os_page_container a:visited {
        text-decoration: none;
        box-shadow: inset 0 0 0 #D2A159, 0 2px 0 #D2A159;
        transition: * .3s;
        color: inherit;
        overflow: hidden;
        font-weight: 700;
      }
      
      .os_page_container a:hover {
        box-shadow: inset 0 -30px 0 #D2A159, 0 2px 0 #D2A159;
        color: var(--rlf-forest);
      }

    .os_darkBg p, .os_darkBg h2, .os_darkBg h1, .os_darkBg span p, .os_darkBg span {
        color: #fff;
    }

    /* Helper classes */
    /* Helper classes */
    /* Helper classes */
    /* Helper classes */

    .os_page_container .os_centerText {
        text-align: center;
    }

    .os_page_container section {
        position: relative;
    }

    .os_overlayBg {
        background-blend-mode: multiply;
    }

    img.os_logoMark_white {
        transform: scale(0.5);
    }

    /* Arrows */
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 40px;
    height: 40px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);

    cursor: pointer;

    background: var(--rlf-green-hl);
    border-radius: 50%;
    z-index: 33;
    transition: background .5s;
    box-shadow: 3px 3px 20px #00000061;
    border: none !important;
    outline: none;
}

.slick-next:hover, .slick-prev:hover {
    background: var(--rlf-blue);
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    opacity: 1;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .5;
}

.slick-prev:before { content: "<"; }
.slick-next:before { content: ">"; }

.slick-prev:before,
.slick-next:before
{
    font-size: 23px;
    font-weight: 600;
    line-height: 1;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

button.slick-next.slick-arrow { 
    right: 20px;
}
button.slick-prev.slick-arrow { 
    left: 20px;
}

button.slick-next:focus, button.slick-prev:focus {
    outline: none;
}

/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.os_timeline_wrapper {
    padding-bottom: 50px;
}

.slick-dots
{
    position: absolute;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    bottom: -30px;
    list-style: none;
    text-align: center;
}

.slick-dots li
{
    position: relative;
    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: min(4vw, 26px);
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}

    /* Helper classes */
    /* Helper classes */
    /* Helper classes */
    /* Helper classes */


    .os_page_container {
        margin-top: 131.92px;
    }

    .os_secShadow {
        width: 100%;
        height: 13vmin;
        max-height: 220px;
        background: transparent linear-gradient(180deg, #0C395300 0%, #020B11CC 100%) 0% 0% no-repeat padding-box;
        position: absolute;
        bottom: 0;
        opacity: .5;
    }

    .os_content_wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 10vmin 0;
    }

    .os_paperBg {
        background: white;
        box-shadow: 8px 8px 50px #00000052;
    }



    /* Typography styles */
    /* Typography styles */
    /* Typography styles */
    /* Typography styles */

    .os_page_container p {
        font-size: clamp(18px, 2.9vw, 22px);
        width: min(85%, 695px);
    }

    .os_page_container h1 {
        font-size: clamp(38px, 4.5vw, 68px);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: .05em;
    }

    .os_page_container h2 {
        font-size: clamp(24px, 4.5vw, 38px);
        font-weight: 600;
        text-transform: uppercase;
    }

    h2.os_secTitle {
        margin-bottom: 2.8vmax;
        width: min(85%, 695px);
        letter-spacing: .05em;
    }

    .os_leadText {
        font-size: clamp(22px, 2.9vw, 24px);
        max-width: 900px;
    }

    /* Typography styles */
    /* Typography styles */
    /* Typography styles */
    /* Typography styles */

    .os_hero_container {
        background: var(--rlf-green) url("https://rlf-2021.jointstaging.com/wp-content/uploads/2021/07/Group-29@2x-scaled.jpg") no-repeat center top;
        background-size: 100% auto;
        padding-top: 10vmax;
        position: relative;
    }

    .os_title_wrapper {
        width: 80%;
        margin: 0 auto;
        text-align: center;
        color: white;
        height: 40vw;
        display: flex;
        flex-direction: column;
        align-content: stretch;
        justify-content: space-between;
    }
    
    .os_title_wrapper img {
        max-width: 100%;
        align-self: center;
        transform: scale(0.5);
        display: none;
    }
    
    h2.os_pgSubTitle {
        justify-self: flex-start;flex-grow: 2;
        text-transform: inherit;
    }

    .os_content_wrapper {
        width: min(85%, 1080px);
        margin: 0 auto;
    }

    .os_content_wrapper .os_blockquote {
        font-family: freight-display-pro,serif;
        font-weight: 400;
        font-style: normal;
        font-size: clamp(21px, 2vw, 25px);
        letter-spacing: 0.031em;
        background: var(--rlf-blue);
        color: white;
        text-align: left;
        padding: 3vmax;
        width: 117.9%;
        float: left;
        margin-left: -9%;
        margin-top: 1.4vmax;
        margin-bottom: 0.8vmax;
    }

    .os_content_wrapper .os_blockquote .os_cite {
        display: block;
        font-size: clamp(14px, 2.9vw, 16px);
        font-family: "PublicaSans-UltraLight";
        font-style: normal;
        margin-top: 20px;
    }
    
    .os_content_wrapper .os_blockquote .os_cite:before {content: ' - ';}

    .os_cite br { display: none; }

    /* This applies from 600px onwards */
    @media (min-width: 1268px) {
        .os_cite br { display: initial; }
        .os_title_wrapper img {
            display: block;
        }

        .os_content_wrapper .os_blockquote {
            width: min(34vmax, 560px);
            margin-left: -27.7%;
            text-align: right;
            margin-right: 2vmax;
            padding: 2.1vmax;
        }

    }



    /* Mapping Section Styles */
    /* Mapping Section Styles */
    /* Mapping Section Styles */
    /* Mapping Section Styles */


    .os_mapping_container {
        position: relative;
        background: var(--rlf-teal);
    }
    .os_mapping_container .os_secHeader_wrapper {
        background: #97b7b5 url("https://rlf-2021.jointstaging.com/wp-content/uploads/2021/07/mappingheader-scaled.jpg") no-repeat center top;
        background-size: cover;
        padding-top: 10vmin;
        padding-bottom: 10vmin;
    }
    /* Mapping Section Styles */
    /* Mapping Section Styles */
    /* Mapping Section Styles */
    /* Mapping Section Styles */

    /* New Style Section Styles */
    /* New Style Section Styles */
    /* New Style Section Styles */
    /* New Style Section Styles */

    .os_newstyle_container {
        background: var(--rlf-drkblue) url("https://rlf-2021.jointstaging.com/wp-content/uploads/2021/07/Mask-Group-3@2x-scaled.jpg") no-repeat center top;
        background-size: 100% auto;
        padding-top: 35vmin;
    }


    /* New Style Section Styles */
    /* New Style Section Styles */
    /* New Style Section Styles */
    /* New Style Section Styles */

    /* Enduring  Section Styles */
    /* Enduring  Section Styles */
    /* Enduring  Section Styles */
    /* Enduring  Section Styles */

    .os_enduring_container {
        background: var(--rlf-forest) url("https://rlf-2021.jointstaging.com/wp-content/uploads/2021/07/enduring-scaled.jpg") no-repeat center top;
        background-size: 200% auto;
        padding-top: 35vmin;
        padding-bottom: 10vmin;
    }

    .os_enduring_container .os_content_wrapper {
        padding-bottom: 0;
    }

        /* This applies from 600px onwards */
        @media (min-width: 900px) {
            .os_enduring_container {
                background-size: 100% auto;
                padding-top: 16vw;
            }
        }

    /* Enduring  Section Styles */
    /* Enduring  Section Styles */
    /* Enduring  Section Styles */
    /* Enduring  Section Styles */

    /* Strategies Section Styles */
    /* Strategies Section Styles */
    /* Strategies Section Styles */
    /* Strategies Section Styles */

    .os_end_container {
        background: linear-gradient(180deg, #00728F 30.7%, #00A299 45%, #00A299 100%) 0% 0% no-repeat padding-box;
    }

    .os_strategies_container {
        background: url("https://rlf-2021.jointstaging.com/wp-content/uploads/2021/07/Group-31@2x-scaled.jpg")no-repeat center top;
        background-size: 100% auto;
        padding-top: 35vmin;
        z-index: 1;
    }

    .os_photoWrapper {
        width: min(85%, 820px);
        display: grid;
        grid-template-columns: none;
        gap: 4vmin;
        margin: 4vmin 0;
    }

    /* This applies from 600px onwards */
    @media (min-width: 600px) {

        .os_photoWrapper {
            grid-template-columns: 1fr 1fr;
        }

    }

    /* Strategies Section Styles */
    /* Strategies Section Styles */
    /* Strategies Section Styles */
    /* Strategies Section Styles */

    /* Forward Section Styles */
    /* Forward Section Styles */
    /* Forward Section Styles */
    /* Forward Section Styles */

    .os_forward_container .os_secHeader_wrapper {
        background: url("https://rlf-2021.jointstaging.com/wp-content/uploads/2021/07/forwardbg2.jpg")no-repeat center top;
        background-size: cover;
        padding-top: 8vmin;
    }


    /* Forward Section Styles */
    /* Forward Section Styles */
    /* Forward Section Styles */
    /* Forward Section Styles */

    .os_timeline_container .os_content_wrapper {
        padding-bottom: 2vw;
    }

    .os_timeline_container {
        background: var(--rlf-greentl);
        padding-bottom: 10vmin;
    }

    .os_milestone {
        background: white;
        padding: 0.10%;
        margin: 0.10%;
        box-shadow: 4px 5px 14px #0000002e;
    }

    .os_timelinePhotoWrapper {
        position: relative;
        margin-bottom: 2.5vmax;
    }

    img.os_timelinePhoto {
        width: 100%;
        height: auto;
    }
    
    .os_timelineDate {
        background: var(--rlf-green-hl);
        color: white;
        font-weight: 700;
        padding: 1vmin 4vmin;
        font-size: 18px;
        position: absolute;
        bottom: -1.7vmax;
    }
    
    .os_timelineText p {
        font-size: clamp(13px, 2.9vw, 17px);
        width: 100%;
        line-height: 1.4em;
        color: initial;
        font-weight: 300;
    }

    .os_timeline_container div.slick-current.slick-active.slick-center {
        opacity: 1;
        filter: blur(0) grayscale(0);
    }

    .os_coverPhoto img {
        height: 100%;
        width: 100%;
        object-fit: cover;
        object-position: center;
    }
    
    .os_coverPhoto {
        height: min(250px, 46vw);
    }
    
    .os_timeline_container div.slick-slide {
        opacity: .5;
        transition: all 0.8s;
        filter: grayscale(40%);
    }

    /* This applies from 600px onwards */
    @media (min-width: 900px) {

        .os_timeline_container {
            padding-bottom: 0;
        }

        .os_timeline_container .os_slider {
            padding-top: 0;
        }

    }


    /* Modal styles */
    /* Modal styles */
    /* Modal styles */
    /* Modal styles */


    .page-template-page-our-story .staff-modal .modal-content p, 
    .page-template-page-our-story .staff-modal .modal-content .os_modalText li {
        font-size: clamp(16px, 2.9vw, 18px);
        line-height: 1.5em;
    }
    
    .page-template-page-our-story .staff-modal .modal-content h1 {
        font-size: clamp(24px, 2.9vw, 36px);
        font-weight: 600;
    }
    
    .page-template-page-our-story .staff-modal .modal-content {
        padding: 6vmin;
    }

    .os_modalPhoto img {
        width: 100%;
        height: auto;
    }

    .page-template-page-our-story .staff-modal .modal-content .modal-header {
        order: 1;
        grid-area: header;
    }
    
    .os_modalPhoto {
        order: 2;
        grid-area: modalPhoto;
        margin-bottom: 2vmin;
    }
    
    .os_modalText {
        order: 3;
        grid-area: modalText;
    }


    /* This applies from 600px onwards */
    @media (min-width: 900px) {

        .os_modalPhoto {
            order: 1;
        }
        
        .page-template-page-our-story .staff-modal .modal-content .modal-header {
            order: 2;
            margin-left: 40px;
        }
        
        .page-template-page-our-story .staff-modal .modal-content.os_modalGrid {
            display: grid;
            grid-template-columns: 40% 60%;
            grid-template-rows: 60px auto;
            grid-template-areas:
                "modalPhoto header"
                "modalPhoto modalText";
        }
        
        .os_modalText {
            margin-left: 40px;
        }

        .os_modalText p:last-of-type {
            margin-bottom: 0;
        }
        
        .page-template-page-our-story .staff-modal .modal-lg {
            max-width: 1080px;
            margin: 40px auto;
            width: 90%;
        }

    }