:root {

    --_max_width: 1400px;
    --_main_padding: 5vw;

    --_light_blue: #1A9CDE;
    --_lightest_blue: #B6E6FF;
    --_dark_blue: #0655A4;
    --_yellow: #FDC875;
    --_yellow2: #F9A031;
    --_green: #7CD38B;
    --_orange: #F76700;
    --_purple: #80389C;
    --_purple2: #8C52FF;
    --_teal: #12C7C9;
}


@media all and (max-width: 1400px) {
/*    :root {
        --_main_padding: 25px;
    }*/

}

@font-face {
    font-family: 'Avenir';
    src: url('../fonts/AvenirLight.ttf') format('truetype');
    font-weight: 300;
}

@font-face {
    font-family: 'Avenir';
    src: url('../fonts/AvenirRegular.ttf') format('truetype');
    font-weight: 400;
}

@font-face {
    font-family: 'Avenir';
    src: url('../fonts/AvenirBlack.ttf') format('truetype');
    font-weight: 900;
}

@font-face {
    font-family: 'Avenir';
    src: url('../fonts/AvenirHeavy.ttf') format('truetype');
    font-weight: 700;
}



.wrapper {
    width: 100%;
    max-width: var(--_max_width);
    padding: 100px var(--_main_padding);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0 auto;
    z-index: 1;
    position: relative;
}

.wrapper-align-center {
    align-items: center;
}

.wrapper-stack {
    flex-direction: column;
}

nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2000;
}

.nav-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.nav-header-mobile,
.mobile-nav-header{
    display: none;
}

.bg-blue {background-color: var(--_light_blue);}
.bg-orange {background-color: var(--_orange);}
.bg-light-blue {background-color: var(--_lightest_blue);}
.bg-purple {background-color: var(--_purple);}
.bg-teal {background-color: var(--_teal);}
.bg-green {background-color: var(--_green);}
.bg-yellow {background-color: var(--_yellow2);}
.bg-purple2 {background-color: var(--_purple2);}

.bg-orange .main-nav > .current-menu-parent,
.bg-orange .main-nav > .current-menu-item,
.bg-orange  .sub-menu > ul {
    background-color: #C15100;
}

.bg-green .main-nav > .current-menu-parent,
.bg-green .main-nav > .current-menu-item,
.bg-green  .sub-menu > ul {
    background-color: #5FA26B;
}

.bg-purple .main-nav > .current-menu-parent,
.bg-purple .main-nav > .current-menu-item,
.bg-purple .sub-menu > ul {
    background-color: #632A79;
}

.bg-teal .main-nav > .current-menu-parent,
.bg-teal .main-nav > .current-menu-item,
.bg-teal .sub-menu > ul {
    background-color: #09A5A6;
}

.bg-yellow .main-nav > .current-menu-parent,
.bg-yellow .main-nav > .current-menu-item,
.bg-yellow .sub-menu > ul {
    background-color: #DA8317;
}

.bg-purple2 .main-nav > .current-menu-parent,
.bg-purple2 .main-nav > .current-menu-item,
.bg-purple2 .sub-menu > ul {
    background-color: #7B49DD;
}

@media (hover: hover) {
    .bg-orange .secondary-nav li:hover > a,
    .bg-orange .secondary-nav li:hover > span{
        color: var(--_orange);
    }

    .bg-orange .main-nav li:hover { background-color: rgba(193, 81, 0,.7); }

    .bg-light-blue .secondary-nav li:hover > a,
    .bg-light-blue .secondary-nav li:hover > span{
        color: var(--_lightest_blue);
    }

    .bg-purple .secondary-nav li:hover > a,
    .bg-purple .secondary-nav li:hover > span{
        color: var(--_purple);
    }

    .bg-purple .main-nav li:hover { background-color: rgba(99, 42, 121,.7); }

    .bg-teal .secondary-nav li:hover > a,
    .bg-teal .secondary-nav li:hover > span{
        color: var(--_teal);
    }

    .bg-teal .main-nav li:hover { background-color: rgba(9, 165, 166,.7); }

    .bg-green .secondary-nav li:hover > a,
    .bg-green .secondary-nav li:hover > span{
        color: var(--_green);
    }

    .bg-green .main-nav li:hover { background-color: rgba(95, 162, 107, .7); }

    .bg-yellow .secondary-nav li:hover > a,
    .bg-yellow .secondary-nav li:hover > span{
        color: var(--_yellow);
    }

    .bg-yellow .main-nav li:hover { background-color: rgba(218, 131, 23, .7); }

    .bg-purple2 .secondary-nav li:hover > a,
    .bg-purple2 .secondary-nav li:hover > span{
        color: var(--_purple2);
    }

    .bg-purple2 .main-nav li:hover { background-color: rgba(123, 73, 221, .7); }

}

nav .wrapper {
    justify-content: space-around;
    padding: 25px var(--_main_padding);
}

.nav-logo-container img {
    height: 45px;
}

nav ul {
    list-style: none;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
}



.main-nav li {
    margin: 0 20px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 15px;
    transition: .2s;
    border-radius: 30px;
}

.main-nav li > a,
.main-nav li > span {
    color: #fff;
    text-decoration: none;
    display: flex;
    padding: 5px 15px;
    justify-content: center;
    cursor: pointer;
}
/*.main-nav li > a:hover,
.main-nav li > span:hover {
    color: var(--_yellow);
}*/

.main-nav li:hover {
    background-color: rgba(6, 85, 164,.7);
    border-radius: 30px;
}



.sub-menu {
    padding-top: 20px;
    position: absolute;
    top: 100%;
    min-width: 300px;
    display: none;
}

.main-nav li:hover >  .sub-menu,
.main-nav li:hover >  .sub-menu {
    display: flex;
}

.sub-menu > ul {
    padding: 30px 10px;
    border-radius: 50px;
    display: flex;
    width: 100%;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    background-color: var(--_dark_blue);
}

.sub-menu  li > a:hover,
.sub-menu  li > span:hover,
.sub-menu  li > a:hover,
.sub-menu  li > span:hover,
.sub-menu  .current_page_item{
    color: #FDC875
}

.main-nav > .current-menu-parent,
.main-nav > .current-menu-item,
.main-nav > .current-menu-parent.cfgt-link.selected-cfgt,
.main-nav > .current-menu-item.cfgt-link.selected-cfgt,
.main-nav > .cfgt-link.selected-cfgt{
    background-color: var(--_dark_blue);
   /* padding: 5px 15px;*/
    border-radius: 30px;
}

.main-nav > .current-menu-parent.cfgt-link,
.main-nav > .current-menu-item.cfgt-link,
.main-nav > .cfgt-link{
    background-color: transparent;
}

.sub-menu  .current_page_item > a,
.sub-menu  .current_page_item > span{
    color: #FDC875
}

.language-nav li > a,
.language-nav li > span {
    color: #fff;
    text-decoration: none;
    display: flex;
    padding: 5px 15px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    min-width: 80px;
    min-height: 44px;
    border-radius: 22px;
}

.language-nav > li > a,
.language-nav > li > span {
    border-radius: 25px;
    border: 1px solid #fff;
}

.language-nav li:hover > .sub-menu,
.language-nav li:hover > .sub-menu {
    display: flex;
}

.language-nav > li {
    margin: 0 20px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.language-nav .sub-menu {
    min-width: unset;
}

.language-nav .sub-menu > ul {
    border-radius: 25px;
    padding: 20px 10px;
}

.nav-right-container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}



.secondary-nav {
    margin-left: 15px;
}

.secondary-nav li > a,
.secondary-nav li > span {
    color: #fff;
    text-decoration: none;
    display: flex;
    padding: 5px 25px;
    justify-content: center;
    cursor: pointer;
    border: 1px solid #fff;
    min-width: 80px;
    min-height: 44px;
    border-radius: 22px;
    align-items: center;
    line-height: 1;
}

.language-nav > li > a i,
.language-nav > li > span i {
    margin-left: 10px;
}

.secondary-nav li:hover > a,
.secondary-nav li:hover > span{
    background-color: #fff;
    color: var(--_light_blue);
}

.section-overview-banner {
    background-color: var(--_light_blue);
    min-height: 100vh;
}

.title-container {
    width: 100%;
    min-height: 80vh;
    padding-top: 100px;
    padding-bottom: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.title-container h1 {
    font-size: 5em;
    color: #fff;
    text-align: center;
    line-height: 1.1;
}

.title-container img {
    width: 40%;
    max-width: 150px;
    margin-bottom: 60px;
}

.title-container h1 span {
    font-weight: 300;

}

.banner-video-container {
    width: 100%;
    aspect-ratio: 1920 / 1000;
    min-height: 140vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url('../images/video-bg.png');
    background-size: cover;
    background-position: center;
    position: relative;
}

.section-overview-banner {
    position: relative;
}

.section-overview-banner .wrapper {
    z-index: 2;
    position: relative;
    margin-bottom: 20vh;
}

.overview-img-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    transition: 1s;
    opacity: 1;
}

.overview-shape1 {
    width: 520px;
    position: absolute;
    bottom: 165px;
    left: calc(calc(50% - 300px) + 170px);
}

.overview-shape2 {
    width: 280px;
    position: absolute;
    bottom: 680px;
    left: calc(calc(50% - 150px) + 270px);
}

.overview-shape3 {
    width: 280px;
    position: absolute;
    bottom: 405px;
    left: calc(calc(50% - 150px) - 250px);
}

.banner-video-bg-overlay {
    background-position: bottom;
    position: absolute;
    background-size: auto 1600px;
    top: -1px;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('../images/overview-bg4.png');
    background-repeat: no-repeat;
    opacity: 1;
    transition: 1s;
}

.video-section-reveal .banner-video-bg-overlay {
    opacity: 0;
}

.video-section-reveal .overview-img-bg {
    opacity: 0;
}

.main-video-trigger {
    opacity: 0;
    transition: 1s;
}

.video-section-reveal .main-video-trigger {
    opacity: 1;
    z-index: 3;
}

.play-trigger {
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--_yellow);
    border-radius: 50%;
    cursor: pointer;
}

.play-trigger img {
    width: 30%;
}

.section-overview-message {
    background-color: #ffffff;
}

.message-profile {
    width: 100%;
    max-width: 400px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.message-profile-image {
    aspect-ratio: 1 / 1;
    background-size: cover;
    background-position: center;
    width: 100%;
    border-radius: 50%;
    z-index: 1;
    top: 0;
    opacity: 0;
    transition: opacity 1s;
    position: relative;
}

.profile-loaded .message-profile-image{
    animation-name: animation-message-profile-image;
    animation-duration: .8s;
    opacity: 1;
}

@keyframes animation-message-profile-image {
    0%   {top: 50px;}
    80%  {top: -5px;}
    100% {top: 0;}
}


.message-profile-trigger {
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--_yellow);
    border-radius: 50%;
    position: absolute;
    /*top: calc(50% + 20px);*/
    bottom: 80px;
    left: -40px;
    z-index: 3;
    cursor: pointer;
    opacity: 0;
    transition: opacity 1s;
}

.profile-loaded .message-profile-trigger{
    animation-name: animation-message-profile-trigger;
    animation-duration: .9s;
    opacity: 1;
}

@keyframes animation-message-profile-trigger {
    0%   {bottom: -200px;}
    80%  {bottom: 90px;}
    100% {bottom: 80px;}
}

.message-profile-container-reverse .message-profile-trigger {
    left: unset;
    right: -40px;
}

.profile-loaded .message-profile-content{
    animation-name: animation-message-profile-content;
    animation-duration: 1s;
    opacity: 1;
}

@keyframes animation-message-profile-content {
    0%   {bottom: -200px;}
    80%  {bottom: -20px;}
    100% {bottom: -30px;}
}

.message-profile-trigger img {
    width: 30%;
}

.message-profile-content {
    width: 150px;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--_dark_blue);
    position: absolute;
    left: 10px;
    bottom: -30px;
    z-index: 2;
    border-radius: 50%;
    opacity: 0;
    transition: opacity 1s;
}

.profile-loaded .message-profile-content{
    animation-name: animation-message-profile-content;
    animation-duration: 1s;
    opacity: 1;
}

@keyframes animation-message-profile-content {
    0%   {bottom: -200px;}
    80%  {bottom: -20px;}
    100% {bottom: -30px;}
}

.message-profile-container-reverse .message-profile-content {
    left: unset;
    right: 10px;
}

.message-profile-content p {
    margin: 0;
    color: #fff;
    font-size: .8em;
    line-height: 1.2;
}

.mpi-aliou-sene {
    background-image: url('../images/aliou-sene.jpg');
}

.mpi-estelle-courty-duchon {
    background-image: url('../images/estelle-courty-duchon.jpg');
}

.custom-header {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    min-width: 300px;
}

.custom-header span {
    color: #fff;
    background-color: var(--_light_blue);
    padding: 0 35px;
    margin: 2px;
    border-radius: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 2.5em;
    position: relative;
    top: 0;
    opacity: 0;
    transition: opacity 1s;
}
.custom-header span:nth-child(2) {
    margin-left: 15px;
}


.custom-header.custom-header-loaded span{
    animation-name: animation-custom-header;
    animation-duration: .6s;
    opacity: 1;
}

.custom-header.custom-header-loaded span:nth-child(2) {
    animation-duration: .8s;
}

.custom-header.custom-header-loaded span:nth-child(3) {
    animation-duration: 1s;
}


@keyframes animation-custom-header {
    0%   {top: 50px;}
    80%  {top: -5px;}
    100% {top: 0;}
}



.message-profile-container {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.message-profile-container-reverse {
    flex-direction: row-reverse;
}

.message-profile-container .custom-header {
    margin: 0 100px 0 0;
}

.message-profile-container-reverse {
    flex-direction: row-reverse;
}

.message-profile-container-reverse .custom-header {
    margin: 0 0 0 100px;
}


.section-overview-highlights {
    background-color: var(--_lightest_blue);
}

.info-section {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    position: relative;
    opacity: 0;
    transition: .2s;
    margin-bottom: 50px;
}



.info-section.info-loaded {
    opacity: 1;
}

.info-section-header {
    align-items: flex-start;
    opacity: 1 !important;
}

.info-section-header .custom-header {
    min-width: 30vw;
}

.info-section-header p {
    font-size: 2em;
    color: var(--_dark_blue);
    min-width: 30vw;

}

.info-section p {
     max-width: 400px;
    position: relative;
}

.info-section > p,
.info-section > div:not(.info-bubble) p {
   top: 0;
    opacity: 0;
    transition: opacity 2s;
}

div:not(.info-bubble) p {
    top: 0;
    opacity: 0;
    transition: opacity 2s;
    position: relative;
}

footer p,
.message-profile-content p,
.info-bubble p{
    opacity: 1 !important;
}

div:not(.info-bubble) p.text-loaded{
    animation-name: animation-info-section-text;
    animation-duration: .8s;
    opacity: 1;
}

.info-section.info-loaded > p,
.info-section.info-loaded > div:not(.info-bubble) p {
    animation-name: animation-info-section-text;
    animation-duration: .8s;
    opacity: 1;
}

.info-section.info-loaded > p.info-text-slow,
.info-section.info-loaded > div:not(.info-bubble) p.info-text-slow {
    animation-duration: 1.2s;
}

.page-section ul {
    top: 0;
    position: relative;
    opacity: 0;
    transition: opacity 2s;
}

.page-section ul.list-loaded  {
    animation-name: animation-info-section-text;
    animation-duration: 1s;
    opacity: 1;
}

.page-section ul ul {
    opacity: 1;
    top: 0 !important;
}

@keyframes animation-info-section-text {
    0%   {top: 50px;}
    80%  {top: -5px;}
    100% {top: 0;}
}


.info-bubble {
    aspect-ratio: 1 / 1;
    max-width: 400px;
    width: 100%;
    background-color: rgba(253, 200, 117, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    flex-direction: column;
    padding: 35px 50px;
    margin: 25px;
    position: relative;
    top: 0;
    opacity: 0;
    transition: opacity 1s;
}

.info-bubble-s2 {
    transition: .7s;
}

.info-loaded .info-bubble{
    opacity: 1;
    animation: animation-info-section-bubble;
    animation-duration: 1.2s;
}


.info-loaded .info-image-bubble{
    opacity: 1;
    animation: animation-info-section-bubble;
    animation-duration: .8s;
}

.info-loaded .info-bubble-img {

    opacity: 1;
    animation: animation-info-section-bubble;
    animation-duration: 1s;
}

.info-loaded .info-bubble.info-quick{

    animation-duration: .8s;
}

@keyframes animation-info-section-bubble {
    0%   {top: 50vh;}
    80%  {top: -15px;}
    100% {top: 0;}
}

.info-bubble p {
    /*width: 70%;*/
    text-align: center;
}

.info-bubble-image-full {
    width: 60%;
}

.info-bubble-icon {
    width: 80px;
    margin-top: 15px;
}

.info-stat {
    font-size: 12em;

    color: var(--_dark_blue);
    position: relative;
    line-height: 1;
    opacity: 0;
    transition: opacity 1s;
    top: 0;
}

.info-stat.counter-loaded{
    opacity: 1;
    animation: animation-info-stat;
    animation-duration: .6s;
}

@keyframes animation-info-stat {
    0%   {top: 50px}
    50%  {top: -5px;}
    100% {top: 0;}
}

.info-stat span {
    font-weight: 700;
    min-height: 254px;
    text-align: right;
}

.info-stat img {
    position: absolute;
    top: 70%;
    left: -50px;
    height: 120px;

}

.icon-small {
    height: 150px;
}

.info-item-124 {
    margin-bottom: 250px;
}

.info-item-124 p {
    padding-right: 50px;
}


.info-item-344 {
    margin-top: 100px;
}


.info-item-534 {
    margin-left: 150px;
}

.info-item-534 p {
    padding: 20px 0 0 55px;
}

.info-item-9536 .info-bubble {
    margin-bottom: 130px;
    margin-right: -50px;
    z-index: 2;
}

.info-item-9536 .info-stat {
    margin-top: 130px;
    margin-left: -50px;
    z-index: 1;
}

.info-item-9536 .info-stat img {
    height: 230px;
    left: -200px;
}

.info-item-8664 {
    align-items: flex-start;
}

.info-item-8664 .info-bubble {
    z-index: 2;
    margin-top: 100px;
    left: -80px;
}

.info-item-8664 .info-stat {
    margin-bottom: 100px;
    right: -80px;
    z-index: 1;
}

.info-item-7345 {
    left: 20vw;
}

.info-item-7345 .info-bubble {
    z-index: 2;
    margin-top: 120px;
    left: -40px;
    max-width: 200px;
}

.info-item-7345 .info-stat {
    margin-bottom: 120px;
    right: -40px;
    z-index: 1;
}

.info-item-6945  {
    align-items: flex-start;
}

.info-item-6945 .info-bubble {
    z-index: 2;
    margin-top: 80px;
    left: -50px;
}

.info-item-6945 .info-stat {
    margin-bottom: 80px;
    right: -50px;
    z-index: 1;
}

.info-item-5794 {
    margin-top: 100px;
    padding: 20px 0 0 55px;
}

.info-item-5267 {
    margin-bottom: 130px;
}

.info-item-5794 img {
    margin-bottom: 40px;
}

.info-item-2754 {
    margin-bottom: 250px;

}

.info-item-3414 {
    margin-top: 200px;
}

.info-item-3414 .info-bubble {
    margin-top: -80px;
    right: 40px;
}

.info-item-3414 .info-stat {
    left: 40px;
}

/* SSettlement & Integration Needs */
.section-settlement-integration .section-services-banner {
    background-color: var(--_green);
}

.section-banner-image {
    width: 100%;
    height: 100vh;
    background-size: cover;
    background-position: center;
}

.section-settlement-banner-image-left {
    background-image: url('../images/employment/employment-banner-image-left.png');
}

.section-settlement-banner-image-right {
    background-image: url('../images/employment/employment-banner-image-right.png');
}


.section-banner-image-mobile {
    display: none;
}


.section-settlement-integration-banner-container .section-banner-image {
    position: absolute;
}

.section-settlement-integration-banner-image {
    background-image: url('../images/settlement-integration/section-settlement-bg-image.jpg');
}

.logo-container-section {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 40px;
    z-index: 1;
}

.logo-container-section p {
    font-weight: 700;
    margin-top: 20px;
    margin-right: 30px;
    min-width: 200px;
}

.logo-container-section .logo-container {
    display: flex;
    align-content: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: unset;
}

.logo-container-section .logo-container img {
   /* height: 50px; */
   margin: 0 25px 25px;
}

.settlement-integration-needs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
    padding-top: 150px;
    position: relative;
    padding-bottom: 150vh;
}

.settlement-integration-needs > div {
    width: 50%;
}

/*
.settlement-integration-needs:after {
    width: 600px;
    aspect-ratio: 1 / 1;
    content: '';
    background-color: #ECF6EB;
    border-radius: 50%;
    position: absolute;
    z-index: 1;
    right: 25px;
    top: 50px;
}
*/

.services-needs > div {
    width: 50%;
    z-index: 2;
}

.section-settlement-integration .custom-header span {
    background-color: var(--_green);
}

.settlement-integration-info-bg {
/*    background-image: url('../images/service-info-bg.png');
    width: 100%;
    aspect-ratio: 1 / 1;
    background-size: 80% auto;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
    margin-top: -15vh;
    display: flex;
    align-items: center;
    justify-content: center;*/
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
}

.settlement-integration-info-bg img {
    position: absolute;
}

.si-shape1 {
    width: 600px;
    bottom: 70vh;
    left: calc(calc(50% - 300px) + 20%);
}

.si-shape2 {
    width: 300px;
    left: calc(calc(50% - 150px) + 5%);
    bottom: calc(calc(50% - 150px) - 50vh);
}

.si-shape3 {
    bottom: calc(calc(50% - 475px));
    width: 1000px;
}

.settlement-integration-info-bg-content .custom-header {
    margin-bottom: 50px;
}

.settlement-integration-info-bg-content {
    width: 100%;
    position: relative;
    z-index: 2;
    padding-top: 0;
    margin-top: -65vh;
}

.settlement-integration-info-bg-content > div {
    width: 50%;
    max-width: 600px;
}

.btn-container {
    margin-top: 50px;
}

.btn-container.btn-mobile {
    display: none;
}

.btn-cta {
    padding: 5px 25px;
    height: 50px;
    border-radius: 25px;
    border: 1px solid var(--_dark_blue);
    text-align: center;
    text-decoration: none;
    color: var(--_dark_blue);
    transition: .1s;
}

.btn-cta:hover {
    background-color: var(--_dark_blue);
    color: #fff;
}

.btn-cta.btn-cta-green {
    border-color: var(--_green);
    color: var(--_green);
}

.btn-cta.btn-cta-green:hover {
    background-color:var(--_green);
    color: #fff;
}

.btn-cta.btn-cta-orange {
    border-color: var(--_orange);
    color: var(--_orange);
}

.btn-cta.btn-cta-orange:hover {
    background-color:var(--_orange);
    color: #fff;
}

.btn-cta.btn-cta-purple {
    border-color: var(--_purple);
    color: var(--_purple);
}
.btn-cta.btn-cta-purple:hover {
    background-color:var(--_purple);
    color: #fff;
}

.btn-cta.btn-cta-purple2 {
    border-color: var(--_purple2);
    color: var(--_purple2);
}

.btn-cta.btn-cta-purple2:hover {
    background-color:var(--_purple2);
    color: #fff;
}

.btn-cta.btn-cta-yellow {
    border-color: var(--_yellow);
    color: var(--_yellow);
}

.btn-cta.btn-cta-yellow:hover {
    background-color: var(--_yellow);
    color: #fff;
}

.btn-cta.btn-cta-teal {
    border-color: var(--_teal);
    color: var(--_teal);
}

.btn-cta.btn-cta-teal:hover {
    background-color: var(--_teal);
    color: #fff;
}

.btn-cta.btn-cta-yellow2 {
    border-color: var(--_yellow2);
    color: var(--_yellow2);
}

.btn-cta.btn-cta-yellow2:hover {
    background-color: var(--_yellow2);
    color: #fff;
}

.section-settlement-integration-stats {
    background-color: #ECF6EB;
}

.section-settlement-integration .info-stat {
    color: var(--_green);
}

.graph-icon {
    height: 400px;
}

.graph-content {
    margin-left: 50px;
}

.graph-content p {
    font-size: 2em;
    line-height: 1.2;
    margin: 0;
}

.content-text {
    font-size: 2em;
    line-height: 1.2;
    margin: 0;
}

.content-text-green {
    color: var(--_green);
}

.info-image-bubble {
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: 350px;
    background-position: center;
    background-size: cover;
    top: 0;
    opacity: 0;
    transition: 1s;
    position: relative;
}

.info-bubble-img {
    top: 0;
    opacity: 0;
    transition: 1s;
    position: relative;
}

.info-image-bubble img {
    width: 100%;
    height: 100%;
}

.info-item-45363 {
    background-image: url('../images/services-img.png');
    margin-left: 50px;
}

.info-item-546434 {
    max-width: 200px;
}

.info-item-546434 .info-bubble-icon {
    margin-top: 10px;
}

.info-item-si-1 > div {
    position: relative;
    right: 20%;
}

.info-item-si-1-1 {
    margin-top: -120px;
    left: 50px;
    z-index: 2;
}

.info-item-si-2 {
    position: relative;
    left: 10%;
    margin-top: -100px;
}

.info-item-si-2-1 {
    margin-top: -100px;
}

.info-item-si-7-1 {
    position: relative;
    top: -80px;
    right: -100px;
}

.info-item-si-9-1 {
    width: 200px;
    z-index: 2;
    position: relative;
}

.info-item-si-9-1 .info-bubble-icon {
    margin-top: 20px;
    width: 60px;
}

.info-item-si-10-1 {
    position: relative;
    top: -40px;
    left: -100px;
    z-index: 0;
}



.info-item-si-11 > div {
    left: 10%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.info-item-si-11-1 {
    margin-top: -40px;
    left: 80px;
    z-index: 1;
}

.info-item-si-12 {
    z-index: 2;
}

.info-item-si-13 > div {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.info-item-si-13-1 {
    z-index: 1;
    right: 50%;
    margin-top: -40px;
}

.p-sm {
    font-size: 1.2em !important;
    margin-bottom: 20px !important;
}

/* Testimonial */



.testimonial-container {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
    background-color: var(--_light_blue);
}

.testimonial-item {
    width: 100%;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 100px 50px;
}

.testimonial-item > div {
    max-width: 800px;
}

.testimonial-quote {
    font-size: 2.5em;
    color: #fff;
    line-height: 1.2;
    margin-bottom: 50px;
    font-weight: 400;
    opacity: 1 !important;
}

.testimonial-quoter {
    color: #fff;
    margin-bottom: 0;
    opacity: 1 !important;
}

.message-profile-text {
    max-width: 400px;
    margin-right: 100px;
}

.message-profile-container-reverse .message-profile-text {
    margin-right: 0;
    margin-left: 100px;
}

.mpi-service-extra1 {
    background-image: url('../images/service-extra1.png');
}

.mpi-service-extra2 {
    background-image: url('../images/service-extra2.png');
}

.sse-circle-1 {
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    width: 100%;
    max-width: 400px;
    background-color: #5FA26B;
    left: calc(10vw);
    bottom: 120px;
    position: relative;
    z-index: 1;
}

.sse-circle-2 {
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    width: 100%;
    max-width: 200px;
    background-color: #ECF6EB;
    position: absolute;
    z-index: 2;
    bottom: 100px;
}

.section-extra-wrapper {
    position: relative;
}

.section-extra-wrapper .message-profile-container {
    margin-bottom: 40vh;
}

.sse-circle-container {
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

.section-img-bg {
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

.gallery-container {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
    padding: 1px;
}

.gallery-item {
    padding: 1px;
}

.gallery-item > div {
    width: 100%;
    height: 500px;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;

}

.gallery-item-description {
    padding: 10px 25px;
    background-color: rgba(0,0,0,.8);
    width: 100%;
}
.gallery-item-description p {
    color: #fff;
    margin: 0;
    font-size: .8em;
    opacity: 1 !important;
}

.service-gallery-item1 {
    width: 30%;
}

.service-gallery-item1 > div {
    background-image: url('../images/service-gallery1.png')
}

.service-gallery-item2 {
    width: 70%;
}

.service-gallery-item2 > div {
    background-image: url('../images/service-gallery2.png')
}

.service-gallery-item3 {
    width: 40%;
}

.service-gallery-item3 > div {
    background-image: url('../images/service-gallery3.png')
}

.service-gallery-item4 {
    width: 25%;
}

.service-gallery-item4 > div {
    background-image: url('../images/service-gallery4.png')
}

.service-gallery-item5 {
    width: 35%;
}

.service-gallery-item5 > div {
    background-image: url('../images/service-gallery5.png')
}

.service-gallery-item6 {
    width: 70%;
}

.service-gallery-item6> div {
    background-image: url('../images/service-gallery6.png')
}

.service-gallery-item7 {
    width:30%;
}

.service-gallery-item7 > div {
    background-image: url('../images/service-gallery7.png')
}

/* Employment */

.section-employment-wrapper {
    position: relative;
}

.section-employment-banner {
    background-color: var(--_orange);
}

.section-employment-banner-image {
    background-image: url('../images/employment/employment-banner-image.jpg');
}





.section-employment .custom-header span {
    background-color: var(--_orange);
}

.section-employment .info-stat {
    color: var(--_orange);
}

.section-employment-stats {
    background-color: #FDECE1;
}

.employment-info-bg {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
}




.employment-needs {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    z-index: 2;
    padding-top: 50px;
    position: relative;
    width: 40%;
    padding-bottom: 50vh;
}

.emp-our-services-container {
    aspect-ratio: 1 / 1;
    width: 400px;
    position: absolute;
    left: calc(calc(50% - 200px) + 300px);
   bottom: calc(calc(50% - 200px) - 50px);
}

.emp-our-services-bg {
    width: 100%;
    height: 100%;
}


.employment-needs .custom-header {
    margin-bottom: 100px;
}

.emp-our-services-content {
    background-color: rgba(0, 0, 0, 0.7);
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    height: 130px;
    width: 130px;
    padding: 10px;
}

.emp-our-services-content p {
    color: #fff;
    text-align: center;
    font-size: .8em;
    margin: 0;
    line-height: 1.2;
}

.employment-info-bg .custom-header {
    position: absolute;
    left: 0;
    bottom: 0;
}

.employment-info-bg-content {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    margin-top: -20vh;
    flex-wrap: wrap;
}

.employment-info-bg-content > div {
    width: 50%;
    padding: 25px;
}

.employment-info-bg-content .custom-header {
    width: 100%;
}

.employment-info-shape1 {
    width: 600px;
    bottom: 30vh;
    left: -10%;
    position: absolute;
}
.employment-info-shape2 {
    bottom: calc(calc(50% - 225px));
    width: 1000px;
    position: absolute;
}

.employment-info-text {
    margin-bottom: 0;
    color: var(--_orange);
    font-size: 1.5em;
    max-width: 600px !important;
}



.employment-job-fair1 {
    display: flex;
    align-items:flex-end;
    justify-content: flex-start;
    position: relative;
    flex-direction: column;
    width: 100%;
    max-width: 900px;
    min-height: 100vh;
    z-index: 2;
    padding-top: 60vh;
}

.employment-job-fair1 p {
    max-width: 400px;
    position: absolute;
    top: -100px;
    right: calc(10%);
}



.employment-job-fair2 {
    min-height: 100vh;
    display: flex;
    align-items: flex-start;
    width: 100%;
    z-index: 2;
    max-width: 900px;
    padding-top: 60vh;
    padding-bottom: 20vh;
}

.employment-job-fair2 p {
    max-width: 400px;
}

.employment-extra-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: column;
}

.employment-shape {
    width: 600px;
    position: absolute;
}

.employment-shape1 {
    left: calc(50% - 400px);
    bottom: 600px;
}
.employment-shape2 {
    right: calc(50% - 500px);
    bottom: 300px;
}

.employment-extra-img {
    position: absolute;
    width: 450px;
    top: calc(60vh + 400px);
    left: calc(calc(50% - 150px) - 20%);
}

.info-item-e-1 > div {
    right: 10%;
    position: relative;
}


.info-item-e-2 {
    max-width: 250px;
    right: 60%;
    margin-top: -100px;
}

.info-item-e-2 .info-bubble-icon {
    width: 60px;
    margin-top: 20px;
}

.info-item-e-3 > div {
    display: flex;
    align-items: center;
    justify-content: center;
    right: 30%;
}

.info-item-e-3 .info-stat {
    min-width: 300px;
}

.info-item-e-4 {
    max-width: 250px;
    right: 20%;
    margin-top: -35px;
}

.info-item-e-4 .info-bubble-icon {
    width: 60px;
    margin-top: 20px;
}

.info-item-5 {
}

.info-item-e-5 > div{
    padding-top: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.info-item-e-5-1 {
    z-index: 1;
    left: 100px;
    bottom: 100px;
}

.info-item-e-6 {
    z-index: 2;
    max-width: 300px;
}

.info-item-e-5-img {
    background-image: url('../images/employment-info1.png');
    position: absolute;
    right: -30px;
    max-width: 220px;
}

.info-loaded .info-item-e-5-img {
    top: -20px;
}

.info-item-e-7 {
    margin-top: -100px;
}

.info-item-e-7 > div {
    position: relative;
}

.info-item-e-7-img {
    background-image: url('../images/employment-info2.png');
    position: absolute;
    max-width: 300px;
    left: -150px;
    z-index: 1;
}

.info-item-e-7 p {
    left: 200px;
    margin-top: 200px;
    z-index: 2;
    position: relative;
}

.info-item-e-9 {
    max-width: 320px;
    left: -100px;
    margin-top: 150px;
}

.info-item-e-9 .info-bubble-icon {
    width: 60px;
    margin-top: 20px;
}

.info-item-e-8 > div {
    position: relative;
    right: 5%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Legal Assistance */

.section-legal-assistance-banner {
    background-color: var(--_purple);
}

.section-legal-assistance-banner-image {
    background-image: url('../images/legal-assistance/legal-assistance-banner-image.jpg');
}

.section-legal-assistance .custom-header span {
    background-color: var(--_purple);
}

.section-legal-assistance .info-stat {
    color: var(--_purple);
}

.section-legal-assistance-stats {
    background-color:#F3D9FC;
}

.section-legal-assistance-info {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-direction: column;
}


.legal-assistance-info-shape {
    position: absolute;
    width: 1000px;
    top: 15%;
    left: calc(calc(50% - 500px) + 12%);
}

.legal-assistance-needs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 80vh;
    z-index: 1;
    position: relative;
}

.legal-assistance-needs img {
    margin-top: 15vh;
    width: 100%;
    max-width: 450px;
}

.legal-assistance-needs > div {
    width: 50%;
}

.legal-assistance-needs .custom-header {
    margin-bottom: 50px;
}



.legal-assistance-info-img {
    width: 55%;
    align-self: flex-start;
}


.legal-assistance-info-bg-content {
    width: 55%;
    align-self: flex-end;
    margin-top: -15vh;
    z-index: 1;
    position: relative;
    margin-left: auto;
    margin-right: 0;
}

.legal-assistance-info-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
}

.la-image1 {
    position: absolute;
    width: 1000px;
}

.la-image2 {
  width: 300px;
    position: absolute;
    top: calc(calc(50% - 150px) - 30vh );
    right: calc(calc(50% - 150px) - 200px );
}

.la-image3 {
    width: 500px;
    position: absolute;
    top: calc(calc(50% - 250px) + 280px );
    left: calc(calc(50% - 250px) - 300px );
}


.legal-assistance-info-bg-content .custom-header {
    margin-bottom: 50px;
}

.legal-assistance-info-vid .message-profile-image{
    background-image: url('../images/legal-assistance-info-vid.png');
}

.legal-assistance-info-vid .message-profile-content {
    width: 200px;
    height: 200px;
    font-weight: 900;
    top: -20px;
    left: -60px;
    bottom: unset;
}

.legal-assistance-info-vid .message-profile-trigger {
    top: -80px;
    left: 100px;
    width: 150px;
    height: 150px;
}

.legal-assistance-info-text {
    margin-bottom: 0;
    color: var(--_purple);
    font-size: 1.5em;
    max-width: 600px !important;
    margin-left: 40px;
}

.legal-assistance-graph-container {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

.legal-assistance-graph-container .graph {
    margin-bottom: 40px;
}

.legal-assistance-graph-container > div {
    width: 33.3%;
    padding: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.legal-assistance-graph-container img {
    width: 100%;
    margin-bottom: 50px;
}

.legal-assistance-graph-container p {
    color: var(--_purple);
    font-size: 1.5em;
}

.section-legal-assistance-extra .custom-header span {
    background-color: rgba(99, 42, 121, 1);
}

.lae-wrapper {
    min-height: 100vh;
    flex-direction: column;
    justify-content: flex-start;
    max-width: 1000px;
}

.lae-wrapper p {
    color: #fff;
    max-width: 600px;
    margin-top: 20vh;
}

.section-legal-assistance-extra .lae-wrapper:last-child,
.section-primary-health-extra .lae-wrapper:last-child{
    justify-content: flex-end;
}



.lae-align-end {
    align-self: flex-end;

}

.lae-container {
    position: relative;
}

.lae-bg {
    position: sticky;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    padding-bottom: 100px;
}

.lae-bg img {
    position: absolute;
    padding-bottom: 300px;
}

.legal-assistance-shape3 {
    width: 540px;
    right: calc(calc(50% - 270px) - 180px);
    bottom: 480px;
    position: absolute;
}

.legal-assistance-shape2 {
    width: 540px;
    left: calc(50% - 360px);
    bottom: 200px;
    position: absolute;
}

.legal-assistance-extra1 {
    width: 270px;
    left: calc(calc(50% - 170px) - 190px);
    bottom: 470px;
    position: absolute;

}


.lae-container {
    position: relative;
}

.legal-assistance-gallery-item1 {
    width: 30%;
}

.legal-assistance-gallery-item1 > div {

    background-image: url('../images/legal-assistance-gallery1.png');
}

.legal-assistance-gallery-item2 {
    width: 70%;
}
.legal-assistance-gallery-item2 > div  {
    background-image: url('../images/legal-assistance-gallery2.png');
}

.legal-assistance-gallery-item3 {
    width: 40%;
}

.legal-assistance-gallery-item3 > div  {
    background-image: url('../images/legal-assistance-gallery3.png');
}

.legal-assistance-gallery-item4 {
    width: 20%;
}

.legal-assistance-gallery-item4 > div  {
    background-image: url('../images/legal-assistance-gallery4.png');
}

.legal-assistance-gallery-item5 {
    width: 40%;
}
.legal-assistance-gallery-item5 > div  {
    background-image: url('../images/legal-assistance-gallery5.png');
}

.info-item-la-1 {
    margin-bottom: 0 !important;
}

.info-item-la-1 > div {
  display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.info-item-la-1-1 {
    top: -100px;
    right: -120px;
}

.info-item-la-2 {
    max-width: 350px;
}

.info-item-la-2 .info-bubble-icon {
    margin-top: 20px;
}

.info-item-la-3 > div {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    left: -5%;
}

.info-item-la-4 {
    max-width: 350px;
    left: -100px;
    margin-top: -50px;
}

.info-item-la-4 .info-bubble-icon {
    margin-top: 20px;
}

.info-item-la-8 > div {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 100%;
}

.info-item-la-8-1 {
    min-width: 320px !important;
}

.info-item-la-9 {
    max-width: 350px;
    margin-top: 300px;
    margin-right: -120px;
    margin-left: -120px;
    z-index: 2;
}

.info-item-la-8 .message-profile-container {
    width: 350px;
    margin-top: -100px;
    position: relative;
    top: 40vh;
    transition: 1s;
}

.info-loaded.info-item-la-8 .message-profile-container {
    top: 0;
}

.info-item-la-10 img {
    width: 400px;
}

/* Primary Health */

.section-primary-health-banner {
    background-color: var(--_teal);
    min-height: 100vh;
}

.bg-transition-wrapper {
    min-height: 100vh;
    position: relative;
}

.bg-transition {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 2;
     background: radial-gradient(transparent 0%, #fff 0%, #fff 100%);
    transition: 2s;
}

.bg-transition-wrapper.transition-loaded .bg-transition {
    background: radial-gradient(transparent 50%, #fff 100%);

}

.section-primary-health-banner-image {
    background-image: url('../images/primary-health/primary-health-banner-image.jpg');
}

.section-primary-health .custom-header {
    margin-bottom: 50px;
}

.section-primary-health .custom-header span {
    background-color: var(--_teal);
}

.primary-health-needs {
    padding-bottom: 60vh;
    z-index: 1;
    position: relative;
    padding-top: 100px;
}

.primary-health-needs p {
    max-width: 50%;
}

.primary-health-info-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.primary-health-info-bg-content {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
}

.ph-image1 {
    width: 600px;
    position: absolute;
    z-index: 2;
    left: calc(calc(50% - 300px) + 15%);
    top: calc(calc(50% - 300px) - 15vh);
}

.ph-image2 {
    width: 300px;
    position: absolute;
    z-index: 2;
    left: calc(calc(50% - 150px) - 25%);
    top: calc(calc(50% - 150px) + 15vh);
}

.ph-shape1 {
    width: 800px;
    position: absolute;
    left: calc(calc(50% - 400px) - 15%);
}

.primary-health-info-bg-content > div {
    width: 30%;
    padding-right: 35px;
}

.primary-health-info-bg-content > div:first-child {
    width: 40%;
}

.primary-health-info-bg-content > div:first-child p {
    max-width: 80%;
}

.section-primary-health .info-stat {
    color: var(--_teal);
}

.section-primary-health-stats {
    background-color:#DBF0F2;
}

.info-section-v2 {

}

.info-section-v2 img {
    width: 350px;
}

.info-section-v2 p {
    font-size: 2em;
    color: var(--_teal);
}

.section-primary-health-stats .info-section-v2 p {
    color: var(--_teal);

}

.info-section-v2 div {
    padding: 25px;
}

.info-section-v2.info-section-v2-reverse {
    flex-direction: row-reverse;
}

.primary-health-gallery-item1 {
    width: 35%;
}

.section-primary-health-stats p.text-w-lg {
    max-width: 600px;
}

.primary-health-gallery-item1 > div {

    background-image: url('../images/primary-health/primary-health-gallery1.png');
}

.primary-health-gallery-item2 {
    width: 65%;
}
.primary-health-gallery-item2 > div  {
    background-image: url('../images/primary-health/primary-health-gallery2.png');
}

.primary-health-gallery-item3 {
    width: 65%;
}

.primary-health-gallery-item3 > div  {
    background-image: url('../images/primary-health/primary-health-gallery3.png');
}

.primary-health-gallery-item4 {
    width: 35%;
}

.primary-health-gallery-item4 > div  {
    background-image: url('../images/primary-health/primary-health-gallery4.png');
}

.section-primary-health-extra p {
    color: #000;
}

.primary-health-shape2 {
    width: 320px;
    position: absolute;
    left: calc(calc(50% - 160px) - 295px);
/*    top: calc(calc(50% - 160px) - 210px);*/
    bottom: 500px;
}

.primary-health-shape3 {
   width: 620px;
    position: absolute;
    left: calc(calc(50% - 300px) + 155px);
    bottom: 200px;
}

.primary-health-extra1 {
    width: 640px;
    position: absolute;
    left: calc(calc(50% - 300px) - 160px);
    /*top: calc(calc(50% - 300px) - 380px);*/
    bottom: 500px;
}

.primary-health-extra2 {
    width: 320px;
    position: absolute;
    left: calc(calc(50% - 150px) + 310px);
    /*top: calc(calc(50% - 300px) - 370px);*/
    bottom: 820px;
}

/* Mental Health */

.section-mental-health-banner {
    background-color: var(--_teal);
}

.section-mental-health-banner-image {
    background-image: url('../images/mental-health/mental-health-banner-image.png');
}

.mental-health-info-images {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.section-mental-health-wrapper {
    position: relative;
}

.section-mental-health-wrapper > .wrapper {
    padding-top: 0;
}

.mental-health-info-images img {
    max-width: 80%;
}

.mental-health-info-img1 {
    width: 400px;
    position: absolute;
    left: calc(calc(50% - 200px) - 290px);
    top: calc(calc(50% - 200px) - 30vh);
}

.mental-health-info-img2 {
    width: 800px;
    position: absolute;
}

.mental-health-info-img3 {
    width: 400px;
    position: absolute;
    left: calc(calc(50% - 200px) + 250px);
    top: calc(calc(50% - 200px) + 100px);
}

.mental-health-needs {
    padding-bottom: 70vh;
    z-index: 1;
    position: relative;
    padding-top: 100px;
}

.section-mental-health-info .custom-header {
    margin-bottom: 50px;
}

.mental-health-needs p {
    width: 50%;
    max-width: 800px;
}

.mental-health-info-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mental-health-info-bg-content {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    width: 50%;
    margin-left: auto;
    margin-right: 0;
}

.section-mental-health .custom-header span {
    background-color: var(--_teal);
}

.section-mental-health .info-stat {
    color: var(--_teal);
}

.section-mental-health-stats {
    background-color:#DBF0F2;
}

.mental-health-gallery-item1 {
    width: 35%;
}

.mental-health-gallery-item1 > div {

    background-image: url('../images/mental-health/mental-health-gallery1.png');
}

.mental-health-gallery-item2 {
    width: 65%;
}
.mental-health-gallery-item2 > div  {
    background-image: url('../images/mental-health/mental-health-gallery2.png');
}

.mental-health-gallery-item3 {
    width: 50%;
}

.mental-health-gallery-item3 > div  {
    background-image: url('../images/mental-health/mental-health-gallery3.png');
}

.mental-health-gallery-item4 {
    width: 50%;
}

.mental-health-gallery-item4 > div  {
    background-image: url('../images/mental-health/mental-health-gallery4.png');
}

.info-item-mh-1 > div {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.info-item-mh-1-1 {
    right: -100px;
}

.info-item-mh-3 > div {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-direction: column;
}

.info-item-mh-4 {
    margin-top: -100px;
    left: -150px;
    max-width: 320px;
}

.info-item-mh-6 img{
    width: 250px
}

/* Childhood & families*/

.section-childhood-families-banner {
    background-color: var(--_yellow2);
}

.section-childhood-families-banner-image {
    background-image: url('../images/childhood-families/childhood-families-banner-image.png');
}

.childhood-families-needs {
    width: 50%;
    margin-left: auto;
    margin-right: 0;
    padding-bottom: 80vh;
    padding-top: 100px;
    max-width: 600px;
    z-index: 2;
}

.section-childhood-families-wrapper {
    position: relative;
}

.section-childhood-families-wrapper > .wrapper {
    padding-top: 0;
}

.childhood-families-needs p,
.childhood-families-needs ul {
    max-width: 600px;
}

.section-childhood-families .custom-header {
    margin-bottom: 50px;
}

.section-childhood-families .custom-header span {
    background-color: var(--_yellow2);
}

.childhood-families-info {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.childhood-families-info-wrapper {
    z-index: 1;
}

.childhood-families-info-bg-content {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

.childhood-families-info-bg-content > div {
    width: 50%;
    padding-right: 50px;
}

.childhood-families-info-bg {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
align-items: center;
    justify-content: center;
}

.childhood-families-img1 {
    width: 1000px;
    position: absolute;
}

.childhood-families-shape1 {
    width: 400px;
    position: absolute;
    left: calc(calc(50% - 200px) - 10%);
    top: calc(calc(50% - 200px) + 10%);
}

.childhood-families-shape2 {
    width: 150px;
    position: absolute;
    top: calc(calc(50% - 75px) - 35vh);
}

.section-childhood-families .info-stat {
    color: var(--_yellow2);
}

.section-childhood-families-stats {
    background-color:#F8E0C5;
}

.section-childhood-families-extra .message-profile-content {
    width: 200px;
    height: 200px;
}

.section-childhood-families-extra .message-profile-container-reverse .message-profile-content {
    left: unset;
    right: 10px;
}

.section-childhood-families-extra .message-profile-container-reverse .message-profile-trigger {
    left: unset;
    right: -40px;
}

.childhood-families-extra-stats {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.childhood-families-extra-stats > div {
    width: 25%;
    padding: 25px;
}

.cfes-stat {
    color: #fff;
    font-size: 6em;
    font-weight: 300;
}

.cfes-stat span {
    font-weight: 700;
}

.childhood-families-info-vid .message-profile-image{
    background-image: url('../images/childhood-families/childhood-families-info-vid1.png');
}

.childhood-families-info-vid .message-profile-trigger {
    right: -40px;
    left: unset;
    width: 150px;
    height: 150px;
    top: unset;
    bottom: -40px;
}

.childhood-families-info-vid .profile-loaded .message-profile-trigger {
    animation-name: animation-message-profile-trigger-childhood-families-info-vid;
    animation-duration: 1.1s;
    opacity: 1;
}

@keyframes animation-message-profile-trigger-childhood-families-info-vid {
    0%   {bottom: -200px;}
    80%  {bottom: -30px;}
    100% {bottom: -40px;}
}

.mpi-childhood-families-extra1 {
    background-image: url('../images/childhood-families/childhood-families-vid2.png');
}

.mpi-childhood-families-extra2 {
    background-image: url('../images/childhood-families/childhood-families-vid3.png');
}

.info-item-cf-1 > div {
    display: flex;
    align-items: center;
    justify-content: center;
    left: -10%;
    position: relative;
}

.info-item-cf-1-1 {
    right: -80px;
}

.info-item-cf-3 {
}

.info-item-cf-3 > div {
    display: flex;
    align-items: center;
    justify-content: center;
    right: -10%;
    position: relative;
}

.info-item-cf-4 {
    z-index: 1;
    width: 320px;
}

.info-item-cf-3 img {
    width: 300px;
    position: absolute;
    z-index: 0;
    margin-top: 260px;

}

.info-item-cf-5 p {
    max-width: 500px;
    color: var(--_yellow2);
}

.info-item-cf-6 {
    padding-top: 400px !important;
}

.childhood-families-info-vid {
    width: unset;
}

.childhood-families-info-vid .message-profile {
    width: 400px;
}

.info-item-cf-7-1 {
    right: 50px;
}

.info-item-cf-8 {
    position: absolute;
    z-index: 2;
    max-width: 300px;
    top: 100px;
}

.info-loaded .info-bubble.info-item-cf-8 {
    animation: animation-info-item-cf-8 ;
    animation-duration: .8s;
}

@keyframes animation-info-item-cf-8 {
    0%   {top: 300px;}
    80%  {top: 90px;}
    100% {top: 100px;}
}

.childhood-families-shape3 {
    width: 500px;
    position: absolute;
    left: calc(calc(50% - 250px) - 20vw);
    /*    top: calc(calc(50% - 160px) - 210px);*/
    bottom: 10vh;
}

.childhood-families-shape4 {
    width: 300px;
    position: absolute;
    left: calc(calc(50% - 150px) + 20%);
    bottom: 60vh;
}


/* Access to Housing */

.section-access-to-housing-banner {
    background-color: var(--_purple2);
}

.section-access-to-housing-banner-image {
    background-image: url('../images/access-to-housing/access-to-housing-banner-image.jpg');
}

.access-to-housings-needs-wrapper {
    position: relative;
}

.access-to-housings-needs-wrapper > .wrapper {
    padding-top: 0;
}

.access-to-housings-needs {
    width: 100%;
    padding-bottom: 70vh;
    padding-top: 50px;
    z-index: 2;

}

.access-to-housings-needs p {
    width: 40%;
}
.section-access-to-housing .custom-header {
    margin-bottom: 30px;
}

.access-to-housing-info-wrapper {
    position: relative;
    z-index: 2;
    width: 40%;
    margin-left: auto;
    margin-right: 0;
    padding-bottom: 100px;
}


.section-access-to-housing .custom-header span {
    background-color: var(--_purple2);
}

.access-to-housing-info-bg {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.access-to-housing-info-img1{
    width: 500px;
    position: absolute;

    top: calc(calc(50% - 250px) - 35vh);
    right: calc(calc(50% - 250px) - 20%);
}

.access-to-housing-info-shape1 {
    width: 700px;
    position: absolute;
    top: calc(calc(50% - 300px) + 5vh);
}

.access-to-housing-info-img2 {
    width: 350px;
    position: absolute;
    left: calc(calc(50% - 175px) - 20%);
    top: calc(calc(50% - 175px) + 20%);
}

.section-access-to-housing .info-stat {
    color: var(--_purple2);
}

.section-access-to-housing-stats {
    background-color:#F3D9FC;
}

.access-to-housing-gallery-item1 {
    width: 25%;
}

.access-to-housing-gallery-item1 > div {

    background-image: url('../images/access-to-housing/access-to-housing-gallery1.png');
}

.access-to-housing-gallery-item2 {
    width: 75%;
}
.access-to-housing-gallery-item2 > div  {
    background-image: url('../images/access-to-housing/access-to-housing-gallery2.png');
}

.access-to-housing-gallery-item3 {
    width: 50%;
}

.access-to-housing-gallery-item3 > div  {
    background-image: url('../images/access-to-housing/access-to-housing-gallery3.png');
}

.access-to-housing-gallery-item4 {
    width: 20%;
}

.access-to-housing-gallery-item4 > div  {
    background-image: url('../images/access-to-housing/access-to-housing-gallery4.png');
}

.access-to-housing-gallery-item5 {
    width: 30%;
}

.access-to-housing-gallery-item5 > div  {
    background-image: url('../images/access-to-housing/access-to-housing-gallery5.png');
}



.info-item-ah-1 > div {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.info-item-ah-1-1 {
    position: absolute;
    left: -60%;
}

.info-item-ah-2 {
    max-width: 350px;
}

.info-item-ah-4 {
    position: absolute;
    right: -90%;
}

.info-item-ah-3 {
    padding-bottom: 150px;
}

.info-item-ah-3 > div {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.section-access-to-housing-stats .info-section-v2 p {
    color: var(--_purple2);
    max-width: 500px;
}

.info-item-5 {
    align-items: flex-start;
    position: relative;
}

.info-item-5 > div {
    position: relative;
    z-index: 2;
}

.info-item-ah-6 {
    padding-top: 400px !important;
}

.info-item-5  .info-item-5-1 {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.info-item-5-1 img {
    width: 500px;
    z-index: 0;
}


/*Financials*/

.logo-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.logo-container img {
    margin: 15px 25px;
    height: 60px;
}

.logo-container img.lc-large {
    height: 130px;
}

.logo-container img.lc-medium {
    height: 100px;
}
.logo-container img.lc-small {
    height: 40px;
}

.logo-container-v2 {
    width: 100%;
    justify-content: space-around;
    margin: 20px auto;
}

.logo-container .logo-ontario { height: 70px;}
.logo-container .logo-ontario-health { height: 100px;}
.logo-container .logo-legal-aid-ontario { height: 120px;}
.logo-container .logo-ontario-labour { height: 105px;}

.logo-container .logo-ontario-children { height: 130px;}
.logo-container .logo-affaires-francophones { height: 110px;}
.logo-container .logo-ontario-trillium-foundation { height: 100px;}

.logo-container .logo-canada { height: 35px;}
.logo-container .logo-gov-can { height: 73px;}
.logo-container .logo-immigration { height: 47px;}
.logo-container .logo-can-doj { height: 49px;}

.logo-container .logo-cmhc-schl { height: 94px;}
.logo-container .logo-public-health-can { height: 58px;}
.logo-container .logo-employment-social-dev-can { height: 37px;}

.logo-container .logo-toronto { height: 88px;}
.logo-container .logo-region-peel { height: 120px;}
.logo-container .logo-york-region { height: 90px;}
.logo-container .logo-fjcf { height: 120px;}

.logo-container .logo-wcg { height: 62px;}
.logo-container .logo-united-way { height: 83px;}
.logo-container .logo-loft{ height: 52px;}
.logo-container .logo-ahc { height: 55px;}
.logo-container .logo-costi { height: 74px;}

.logo-container .logo-ircc {height: 47px;}
.logo-container-section .logo-container .logo-ontario {height: 54px;}
.logo-container-section .logo-container .logo-costi { height: 63px;}
.logo-container-section .logo-container .logo-ontario-health {height: 54px;}
.logo-container-section .logo-container .logo-fjcf { height: 100px;}
.logo-container-section .logo-container .logo-fbgov { height: 35px;}
.logo-container-section .logo-container .logo-emploi-ontario { height: 75px;}

.logo-outer-wrapper {
    background-color: #fff;

}

.logo-outer-wrapper .wrapper {
    padding-bottom: 0;
}

.logo-outer-wrapper .wrapper .logo-container {
    margin-bottom: 0;
}

#partners {
    padding:200px var(--_main_padding);
}

.section-content {
    display: flex;align-items: center;
    justify-content: center;
    width: 100%;
}

.section-content > div:first-child {
    width: 33.3%;
}

.section-content > div:last-child {
    width: 66.6%;
}

.section-content .custom-header {
    min-width: 400px;
}

/*.section-content .custom-header span {
    font-size: 3em;
    border-radius: 35px;
}*/

.section-content .custom-header span:nth-child(2) {
    margin-left: 25px;
}

.financial-section {
    width: 100%;
    margin-top: 100px;
}

.financial-section td {
    width: 33.3%;
}

.graph-info-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 4px;
}

.graph-info-item p {
    margin-bottom: 0;
}

.gii-color {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin-right: 5px;
}



.fs-header {
    font-size: 1.8em;
    color: var(--_dark_blue);
    margin-bottom: 0;
    line-height: 1.2;
}

.fs-subheader {
    font-size: 1.8em;
    color: var(--_light_blue);
    margin-bottom: 0;
    line-height: 1.2;
}

.financial-section tr {
    border-top: 1px solid #000;
}



.financial-section tr.tr-header {
    margin-top: 30px;
    border-top: 6px solid var(--_lightest_blue);
}

.financial-section td {
    padding-top: 35px;
    padding-bottom: 35px;
    vertical-align: top;
}

.financial-section tr.tr-pb td {
    padding-bottom: 50px;
}

.bar-graph-container {
    width: 100%;
    position: relative;
    height: 100px;
}

.bar-graph-bar {
    height: 100%;
    background-color: var(--_dark_blue);
    width: 100%;
    position: absolute;
}

.bar-graph-bar {
    height: 100%;
    width: 0;
    transition: 1.5s;
    background-color: var(--_dark_blue);
}

.bar-graph-loaded .bgb-33 {width: 33%;}
.bar-graph-loaded .bgb-34 {width: 34%;}
.bar-graph-loaded .bgb-78 {width: 78%;}
.bar-graph-loaded .bgb-83 {width: 83%;}
.bar-graph-loaded .bgb-90 {width: 90%;}
.bar-graph-loaded .bgb-92 {width: 92%;}
.bar-graph-loaded .bgb-95 {width: 95%;}
.bar-graph-loaded .bgb-100 {width: 100%;}

.gii-color1 { background-color: var(--_dark_blue); }
.gii-color2 { background-color: var(--_light_blue); }
.gii-color3 { background-color: #8DCEEF; }
.gii-color4 { background-color: var(--_lightest_blue); }

.location-container {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.location-container > div {
    width: 33.3%;
    padding: 0 25px;
}

.location-item {
    width: 100%;
    flex-direction: column;
    margin-bottom: 50px;
}

.location-item h4 {
    margin-bottom: 10px;
}

.location-item p.location-item-address {
    color: var(--_light_blue);
    margin-bottom: 10px;
}

.location-item p.location-item-contact {
    margin-bottom: 10px;
}

footer {
    background-color: var(--_dark_blue);
    color: #fff;
}

footer a {
    color: #fff;
    font-weight: 900;
    text-decoration: none;
}

footer a:hover {
    color: inherit;
    text-decoration: underline;
}

footer .wrapper {
    padding-top: 75px;
    padding-bottom: 75px;
}

footer .wrapper > div {
    width: 35%;
    padding: 0 20px;
}

footer .wrapper > div:last-child {
    width: 30%;
}

footer img {
    height: 80px;
    margin: 0 auto;
}

.section-reveal-double {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
}

.section-reveal-quad {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.section-reveal-double .section-reveal-container-banner {
    width: 50%;
}

.section-reveal-quad .section-reveal-container-banner {
    width: 50%;
    min-height: 50vh;
}

.section-reveal-container {
    position: relative;
    /*overflow: hidden;*/
    width: 100%;
    min-height: 300vh;
    background-color: #fff;
}

.section-reveal-container-banner {
    min-height: 200vh;
    position: relative;
    background-color: #fff;
}

.section-reveal {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    height: 100vh;
    position: sticky;
    top: 0;
}



.section-reveal-container-banner .section-circle {
    transition: clip-path 1.2s ease-in-out;
}

.section-services-extra .section-reveal {
    background-color: var(--_green);
}

.section-settlement-integration-banner-container .section-reveal-container {
    background-color: var(--_green);
}

.section-employment-extra .section-reveal {
    background-color: var(--_orange);
}

.section-employment-banner-container .section-reveal-container-banner {
    background-color: var(--_orange);
}

.section-legal-assistance-extra .section-reveal {
    background-color: var(--_purple);
}

.section-legal-assistance-banner-container .section-reveal-container {
    background-color: var(--_purple);
}

.section-primary-health-extra .section-reveal {
    background-color: var(--_teal);
}

.section-primary-health-banner-container .section-reveal-container {
    background-color: var(--_teal);
}

.section-mental-health-extra .section-reveal {
    background-color: var(--_teal);
}

.section-mental-health-banner-container .section-reveal-container {
    background-color: var(--_teal);
}

.section-childhood-families-extra .section-reveal {
    background-color: var(--_yellow2);
}

.section-childhood-families-banner-container .section-reveal-container {
    background-color: var(--_yellow2);
}

.section-access-to-housing-banner-container .section-reveal-container {
    background-color: var(--_purple2);
}

.section-circle.section-circle-left {
    clip-path: circle(0% at 15% 50%);
}

.section-circle.section-circle-right {
    clip-path: circle(0% at 85% 50%);
}

.section-reveal-active .section-circle.section-circle-left {
    clip-path: circle(100% at 15% 50%);
}

.section-reveal-active .section-circle.section-circle-right {
    clip-path: circle(100% at 85% 50%);
}

.section-circle {
    clip-path: circle(0% at 50% 50%); /* Start as a tiny circle */
    transition: clip-path .1s ease-in-out; /* Smooth transition */
    background-color: #77cce9;
}

.section-reveal-multi {
/*    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;*/
}

.section-reveal-multi .section-circle {
    height: 100%;
    width: 50%;
}


.section-reveal .wrapper {
    position: sticky;
    top: 0;
}

.donut-segment {
    transition: 1s;
}

.not-filled .donut-segment {
    stroke-dasharray: 1 99;
}

.parallax-img-wrapper {
    overflow: hidden;
}

.parallax-item,
.parallax-item-v2{
    opacity: 0;
    transition: opacity 1s;
}
.parallax-item.parallax-item-active,
.parallax-item-v2.parallax-item-active{
    opacity: 1;
}


/*Settlement*/

.section-settlement-integration .section-reveal-container-banner {
    background-color: var(--_green);
}

.section-settlement-integration .section-circle.section-circle-right {
    clip-path: circle(0% at 100% 50%);
}

.section-settlement-integration .section-circle.section-circle-left {
    clip-path: circle(0% at 0 50%);
}


.section-settlement-integration .section-reveal-active .section-circle.section-circle-right {
    clip-path: circle(120% at 100% 50%);
}

.section-settlement-integration .section-reveal-active .section-circle.section-circle-left {
    clip-path: circle(120% at 0% 50%);
}

/*Employment */

.section-employment-banner-container  .section-banner-image {
    height: 50vh;
}

.section-employment-banner-image-top-left {
    background-position: bottom right;
    background-image: url('../images/employment/employment-banner-image-top-left.jpg');

}

.section-employment-banner-image-top-right {
    background-image: url('../images/employment/employment-banner-image-top-right.jpg');
    background-position: bottom left;
}

.section-employment-banner-image-bottom-left {
    background-image: url('../images/employment/employment-banner-image-bottom-left.jpg');
    background-position: top right;
}

.section-employment-banner-image-bottom-right {
    background-position: top left;
    background-image: url('../images/employment/employment-banner-image-bottom-right.jpg');
}

.section-employment-banner-container {
    overflow: hidden;
}

.section-reveal.section-circle-top-left {
    height: 50vh;
    top: 0;
}

.section-reveal.section-circle-top-right {
    height: 50vh;
    top: 0;
}

.section-reveal.section-circle-bottom-left {
    height: 50vh;
    top: 50vh;
}

.section-reveal.section-circle-bottom-right {
    height: 50vh;
    top: 50vh;
}

.section-employment-banner-container .section-reveal-container-banner {
    background-color: var(--_orange);
}

.section-employment-banner-container .section-circle.section-circle-top-left {
    clip-path: circle(0% at 80% 80%);
}

.section-employment-banner-container .section-circle.section-circle-top-right {
    clip-path: circle(0% at 20% 80%);
}

.section-employment-banner-container .section-circle.section-circle-bottom-left {
    clip-path: circle(0% at 80% 20%);
}

.section-employment-banner-container .section-circle.section-circle-bottom-right {
    clip-path: circle(0% at 20% 20%);
}

.section-employment-banner-container .section-reveal-active .section-circle.section-circle-top-left {
    clip-path: circle(120% at 80% 80%);
}

.section-employment-banner-container .section-reveal-active .section-circle.section-circle-top-right {
    clip-path: circle(120% at 20% 80%);
}

.section-employment-banner-container .section-reveal-active .section-circle.section-circle-bottom-left {
    clip-path: circle(120% at 80% 20%);
}

.section-employment-banner-container .section-reveal-active .section-circle.section-circle-bottom-right {
    clip-path: circle(120% at 20% 20%);
}

/* Legal Assistance */

.section-legal-assistance-banner-container  .section-banner-image {
    height: 50vh;
}

.section-legal-assistance-banner-image-top-left {
    background-position: bottom right;
    background-image: url('../images/legal-assistance/legal-assistance-banner-image-top-left.jpg');

}

.section-legal-assistance-banner-image-top-right {
    background-image: url('../images/legal-assistance/legal-assistance-banner-image-top-right.jpg');
    background-position: bottom left;
}

.section-legal-assistance-banner-image-bottom-left {
    background-image: url('../images/legal-assistance/legal-assistance-banner-image-bottom-left.jpg');
    background-position: top right;
}

.section-legal-assistance-banner-image-bottom-right {
    background-position: top left;
    background-image: url('../images/legal-assistance/legal-assistance-banner-image-bottom-right.jpg');
}

.section-legal-assistance-banner-container {
    overflow: hidden;
}

.section-reveal.section-circle-top-left {
    height: 50vh;
    top: 0;
}

.section-reveal.section-circle-top-right {
    height: 50vh;
    top: 0;
}

.section-reveal.section-circle-bottom-left {
    height: 50vh;
    top: 50vh;
}

.section-reveal.section-circle-bottom-right {
    height: 50vh;
    top: 50vh;
}

.section-legal-assistance-banner-container .section-reveal-container-banner {
    background-color: var(--_purple);
}

.section-legal-assistance-banner-container .section-circle.section-circle-top-left {
    clip-path: circle(0% at 100% 0%);
}

.section-legal-assistance-banner-container .section-circle.section-circle-top-right {
    clip-path: circle(0% at 0% 0%);
}

.section-legal-assistance-banner-container .section-circle.section-circle-bottom-left {
    clip-path: circle(0% at 100% 100%);
}

.section-legal-assistance-banner-container .section-circle.section-circle-bottom-right {
    clip-path: circle(0% at 0% 100%);
}

.section-legal-assistance-banner-container .section-reveal-active .section-circle.section-circle-top-left {
    clip-path: circle(150% at 100% 0%);
}

.section-legal-assistance-banner-container .section-reveal-active .section-circle.section-circle-top-right {
    clip-path: circle(150% at 0% 0%);
}

.section-legal-assistance-banner-container .section-reveal-active .section-circle.section-circle-bottom-left {
    clip-path: circle(150% at 100% 100%);
}

.section-legal-assistance-banner-container .section-reveal-active .section-circle.section-circle-bottom-right {
    clip-path: circle(150% at 0% 100%);
}

/* Primary Health */

.section-primary-health-banner-image-left {
    background-position: center right;
    background-image: url('../images/primary-health/primary-health-banner-image-left.jpg');

}

.section-primary-health-banner-image-right {
    background-position: center right;
    background-image: url('../images/primary-health/primary-health-banner-image-right.jpg');

}


.section-primary-health-banner-container .section-reveal-container-banner {
    background-color: var(--_teal);
}

.section-primary-health-banner-container .section-circle.section-circle-left {
    clip-path: circle(0% at 80% 50%);
}

.section-primary-health-banner-container .section-circle.section-circle-right {
    clip-path: circle(0% at 20% 50%);
}




.section-primary-health-banner-container .section-reveal-active .section-circle.section-circle-right {
    clip-path: circle(100% at 80% 50%);
}

.section-primary-health-banner-container .section-reveal-active .section-circle.section-circle-left {
    clip-path: circle(100% at 20% 50%);
}

.section-reveal-double .section-reveal-container-banner-60 {
    width: 60%;
}

.section-reveal-double .section-reveal-container-banner-40 {
    width: 40%;
}

.section-reveal-container-banner.section-reveal-container-banner-60 .section-circle {
    transition: clip-path 1.2s ease-in-out;
}

.section-reveal-container-banner.section-reveal-container-banner-40 .section-circle {
    transition: clip-path 1.4s ease-in-out;
}

/* Mental Health */

.section-mental-health-banner-container  .section-banner-image {
    height: 50vh;
}

.section-mental-health-banner-image-top-left {
    background-position: bottom right;
    background-image: url('../images/mental-health/mental-health-banner-image-top-left.jpg');

}

.section-mental-health-banner-image-top-right {
    background-image: url('../images/mental-health/mental-health-banner-image-top-right.jpg');
    background-position: bottom left;
}

.section-mental-health-banner-image-bottom-left {
    background-image: url('../images/mental-health/mental-health-banner-image-bottom-left.jpg');
    background-position: top right;
}

.section-mental-health-banner-image-bottom-right {
    background-position: top left;
    background-image: url('../images/mental-health/mental-health-banner-image-bottom-right.jpg');
}

.section-mental-health-banner-container {
    overflow: hidden;
}

.section-reveal.section-circle-top-left {
    height: 50vh;
    top: 0;
}

.section-reveal.section-circle-top-right {
    height: 50vh;
    top: 0;
}

.section-reveal.section-circle-bottom-left {
    height: 50vh;
    top: 50vh;
}

.section-reveal.section-circle-bottom-right {
    height: 50vh;
    top: 50vh;
}

.section-mental-health-banner-container .section-reveal-container-banner {
    background-color: var(--_teal);
}

.section-mental-health-banner-container .section-circle.section-circle-top-left {
    clip-path: circle(0% at 100% 80%);
    transition: clip-path 1.4s ease-in-out;
}

.section-mental-health-banner-container .section-circle.section-circle-top-right {
    clip-path: circle(0% at 0% 80%);
    transition: clip-path 1.4s ease-in-out;
}

.section-mental-health-banner-container .section-circle.section-circle-bottom-left {
    clip-path: circle(0% at 80% 20%);
}

.section-mental-health-banner-container .section-circle.section-circle-bottom-right {
    clip-path: circle(0% at 20% 20%);
}

.section-mental-health-banner-container .section-reveal-active .section-circle.section-circle-top-left {
    clip-path: circle(150% at 100% 80%);
    transition: clip-path 1.0s ease-in-out;
}

.section-mental-health-banner-container .section-reveal-active .section-circle.section-circle-top-right {
    clip-path: circle(150% at 0% 80%);
    transition: clip-path 1.0s ease-in-out;
}

.section-mental-health-banner-container .section-reveal-active .section-circle.section-circle-bottom-left {
    clip-path: circle(150% at 80% 20%);
}

.section-mental-health-banner-container .section-reveal-active .section-circle.section-circle-bottom-right {
    clip-path: circle(150% at 20% 20%);
}


/* Childhood & Families */

.section-childhood-families-banner-image-left {
    background-position: center right;
    background-image: url('../images/childhood-families/childhood-families-banner-image-left.jpg');

}

.section-childhood-families-banner-image-right {
    background-position: -1px center;
    background-image: url('../images/childhood-families/childhood-families-banner-image-right.jpg');

}

.section-childhood-families-banner-container .section-reveal-container-banner {
    background-color: var(--_yellow2);
}

.section-childhood-families-banner-container .section-circle.section-circle-left {
    clip-path: circle(0% at 0% 0%);
}

.section-childhood-families-banner-container .section-circle.section-circle-right {
    clip-path: circle(0% at 100% 100%);
}


.section-childhood-families-banner-container .section-reveal-active .section-circle.section-circle-right {
    clip-path: circle(150% at 0% 0%);
}

.section-childhood-families-banner-container .section-reveal-active .section-circle.section-circle-left {
    clip-path: circle(150% at 100% 100%);
}


.section-childhood-families-banner-container .section-reveal-container-banner .section-circle {
    transition: clip-path 1.6s ease-in-out;
}

/* Access to Housing */

.section-access-to-housing-banner-image-left {
    background-position: center right;
    background-image: url('../images/access-to-housing/access-to-housing-banner-image-left.jpg');

}

.section-access-to-housing-banner-image-right {
    background-position: -1px center;
    background-image: url('../images/access-to-housing/access-to-housing-banner-image-right.jpg');

}

.section-access-to-housing-banner-container .section-reveal-container-banner {
    background-color: var(--_purple2);
}

.section-access-to-housing-banner-container .section-circle.section-circle-left {
    clip-path: circle(5% at 85% 40%);
}

.section-access-to-housing-banner-container .section-circle.section-circle-right {
    clip-path: circle(5% at 15% 60%);
}


.section-access-to-housing-banner-container .section-reveal-active .section-circle.section-circle-right {
    clip-path: circle(150% at 85% 40%);
}

.section-access-to-housing-banner-container .section-reveal-active .section-circle.section-circle-left {
    clip-path: circle(150% at 15% 60%);
}