*, ::after, ::before {padding: 0; margin: 0; box-sizing: border-box;}
html {font-size: 2vh; scroll-behavior: smooth;}
body {font-family: 'Poppins'; font-weight: 300; line-height: 1.6; color: #012031;} 
.container {max-width: 100%; margin: 0 auto;}
.innercontainer {max-width: 45rem; margin: 4rem auto; width: 100%; position: relative;}
.content p {margin-bottom: 2em;}
h2, h3 {font-family: 'Poppins'; font-weight: 500; line-height: 1.2; font-size: 1.7rem; margin-bottom: 1.25rem; color: #101010;}
.content h3 {font-size: 1.25rem; font-weight: 600; margin-top: 0.5rem; margin-bottom: 0.5rem;}
a {color: #279991;}
.content {font-family: 'Roboto Slab'; line-height: 1.82;}
.pretitle {font-family: 'Poppins'; font-weight: 600; text-transform: uppercase; font-size: 0.98rem; color: #279991; margin-bottom: 0.2rem;}
.inset {margin: 0 2.5rem; padding-bottom: 2rem;}
img {max-width: 100%; display: block; width: 100%;}



/* LIST RIGHT */

.section.list-right .innercontainer {margin-bottom: 0;}
.section.list-right.blue .innercontainer {margin-top: 0;}
.section.list-right.blue .innercontainer ul {padding-bottom: 1em;}
.section.list-right h2 {max-width: 30rem; margin: 2.5rem 0 -2rem; font-size: 2.3rem;}
.section.list-right .innercontainer > h3 {font-size: 1.25rem; font-weight: 600; margin-top: 0.5rem; margin-bottom: 0.5rem;}
.section.list-right img {position: absolute; margin: 2rem 0 0 -7rem; width: 5rem;}
.section.list-right p:last-child {padding-bottom: 0;}
.section.list-right .innercontainer > * {margin-left: 3rem}
.section.list-right .innercontainer > ul {padding-left: 1rem;}
.section.list-right.list-inside .innercontainer > h3,
.section.list-right.list-inside .innercontainer > h3 + p {padding-left: 6.5rem;}
.section.list-right.list-inside img {left: 9.5rem;}


/* VALUES */

.section.values h2 {max-width: 30rem; margin-bottom: 5rem; font-size: 2.3rem;}



/* WHO WE ARE */

.section.who-we-are {padding-top: 6rem; padding-bottom: 2rem;}
.section.who-we-are .container {flex-direction: row; justify-content: flex-start;}
.section.who-we-are .container h2 {max-width: 26rem; font-size: 1.9rem; line-height: 1.3;}
.section.who-we-are .container ul {padding-left: 5rem; font-size: 1.2rem; line-height: 1.6;}
.section.who-we-are .container ul li {list-style: none; padding: 0 0 1rem;}
.section.who-we-are .container ul li a {color: white; text-decoration: none; display: block; position: relative;}
.section.who-we-are .container ul li a::after {content: ""; background: url(/img/singlearrowright.svg) center center / contain no-repeat; display: inline-block; vertical-align: middle; height: 0.5rem; width: 1rem; margin-left: 0.6rem;}
 


/* PROGRAMS */

.section.programs {padding-bottom: 9rem;}
.section.programs .img {margin: 3rem 0 2rem; position: relative;}
.section.programs img {display: block; max-width: 100%;}
.section.list-right.blue > .container .innercontainer > h3,
body:not(.who-we-are) .section .inset h3 {font-size: 1.7rem; font-weight: 500; margin-top: 0; margin-bottom: 1.1rem;}
.section.list-right.blue > .container .innercontainer > h3 {line-height: 1.4; max-width: 32rem; margin-bottom: 1.5rem;}
.section .inset h3:first-child {margin-top: 0.5rem;}
.section .inset + p {margin-top: 3rem;}
body.who-we-are .section .inset + p {margin-top: 2rem; margin-bottom: 2rem; padding-bottom: 0;}
body.who-we-are .section .inset + p:last-child {margin-bottom: 0;}
.impact .section.list-right .innercontainer > h2 {margin: -1rem 0 3rem -21.5rem;}


/* HEADER */

.section.header {position: absolute; width: 100%; padding-top: 0; padding-bottom: 0; z-index: 2;}
.section.header > .container {display: flex; justify-content: space-between; flex-direction: row;}
.section.header a {color: white; text-decoration: none; text-transform: uppercase; font-weight: 500; display: block;}
.section.header img {height: 2rem; display: block; width: auto;}
.section.header > div:first-child a {padding-top: 2.75rem;}
.section.header ul {display: flex;}
.section.header ul li {list-style: none;}
.section.header ul li a {font-size: 0.65rem; padding: 0.75rem 0 0.1rem; margin: 1rem 0 1rem 2.5rem;}
.section.header ul li.active > a {border-bottom: 1px solid white;}
.section.header ul#menu > li > ul {position: absolute; font-family: 'Roboto Slab'; opacity: 0; transition: opacity 0.3s ease-in-out;}
.section.header ul#menu > li > ul li {display: flex;}
.section.header ul#menu > li > ul li a {text-transform: none;}
.section.header ul#menu > li > ul li ul {display: block;}
.section.header ul#menu > li > ul li a {padding: 0.15rem 0; margin-top: 0; margin-bottom: 0;}
.section.header ul#menu > li > ul li ul li a {margin-left: 1.5rem; font-weight: 300;}
.section.header ul#menu > li > ul a {padding-top: 0;}

.menuhover .header,
.menuopen .header {min-height: 15rem;}
.section.header::after {
    content: "";
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    height: 100%; 
    width: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    position: absolute;
    pointer-events: none;
}
.menuhover .header::after,
.menuopen .header::after {
    background: linear-gradient(to bottom, rgba(0, 30, 73, 0.8) 0%, rgba(0, 33, 80, 0.8) 10%, rgba(0, 12, 29, 0.9) 100%); 
    opacity: 1;
}
.menuhover .header ul#menu > li > ul,
.menuopen .header ul#menu > li > ul {opacity: 1;}
.section.header ul#menu > li > ul li > ul li a:hover {font-weight: 700;}



/* SECTIONS */

.section {padding: 3.5rem 4.5rem; position: relative; overflow: hidden; z-index: 1;}
.section > .container {display: flex; flex-direction: column; justify-content: flex-end; height: 100%;}
.section.fullheight a {display: inline-block; padding: 1rem 0;}
.section a.arrow {padding-left: 2.6rem; background: url(/img/arrow-right-white.svg) left center / auto 2rem no-repeat;}
.section a.arrow.down {background-image: url(/img/arrow-down-white.svg);}
.section.green {background: #279991; color: white;}
.section.blue {background: #01243E; color: white;}
.section.blue h3, .section.blue h2 {color: white;}
.section.lightgray {background: #FCF9F9;}
.section.green p {font-size: 2.1rem; font-weight: 500;}
.section.white {background: white;}
.section.large p {font-family: 'Roboto Slab'; font-size: 1.5rem; line-height: 1.6;}
.section.larger p {font-family: 'Roboto Slab'; font-size: 1.25rem; line-height: 1.6;}
.section.bgimage {background: #333 url() center center / cover no-repeat; color: white;}
.section.bgimage.fixedbg {background-attachment: fixed;}
.section.bgimage div.img {position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 0; background: transparent url() center center / cover no-repeat; max-height: 100vh;}
.section.bgimage::before {
    position: absolute;
    content: "";
    width: 100%; height: 100%;
    left: 0; top: 0;
    z-index: 1;
}
.section.bgimage.hastext::before {
    background: linear-gradient(to bottom, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.75) 100%);
}
.section.largeheight {height: 88vh;}
.section.fullheight {height: calc(100vh + 1px);}
.section.fullheight h1, .section.fullheight h2 {line-height: 1.3; font-weight: 500; font-size: 2.1rem; margin-bottom: 1rem; color: white;}
.section.fullheight div {font-weight: 500; font-size: 1rem; margin-bottom: 0.6rem; position: relative; z-index: 1;}
.section.fullheight a {color: white; text-decoration: none; font-size: 0.8rem;}
.section.invert, .section.invert a {color: #01243E;}
.section.invert a.arrow {background-image: url(/img/arrow-right.svg);}
.section.invert h2 {color: #222222;}
.section.largepadding {padding-top: 5rem; padding-bottom: 5rem;}
.section.largepadding .innercontainer {margin-top: 0; margin-bottom: 0;}
.section.title + .section.largepadding {padding-bottom: 4rem;}

@keyframes zoomin {
    0% {transform: scale(1);}
    100% {transform: scale(1.15);}
}
@keyframes fadein {
    from {opacity: 0; transform: translateY(1rem);}
    to {opacity: 1; transform: translateY(0);}
}
.section .small .img {overflow: hidden;}
.section .small .img.opaque,
.section.opaque:not(.title) > * {opacity: 0;}
.section.fullheight + .section.opaque,
.section .small .img.notopaque,
.section.notopaque:not(.title) > * {
    animation-name: fadein;
    animation-duration: 1.25s;
    animation-delay: 0.5s;
    animation-fill-mode: backwards;
}
.section .small .img.notopaque img,
.section.bgimage.fixedbg.notopaque div.img {animation: zoomin 20s; animation-fill-mode: forwards; transform-origin: center center;}


/* MOSAIC */

.section ul.mosaic {display: flex; flex-wrap: wrap; gap: 2rem; margin-top: 3rem;}
.section ul.mosaic li {list-style: none; position: relative; flex-grow: 1; min-width: 10rem; width: 30%;}
.section ul.mosaic li.featured {width: 100%;}
.section ul.mosaic li a {display: block; padding-bottom: 100%;}
.section ul.mosaic li.featured a {padding-bottom: 50%;}
.section ul.mosaic li a span {position: absolute; line-height: 1.4; bottom: 0; width: 100%; background: rgba(39, 153, 145, 0.7); color: white; padding: 0.5rem 0.8rem 0.65rem;}



/* VIDEO */

.section.video {padding: 0; height: 41vw; width: 100%;}
.section.video .video-container {padding-bottom: 56.25%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%)!important; width: 100%; opacity: 1!important;}
.section.video .playbutton {
    position: absolute; 
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)!important;
    width: 5rem;
    height: 5rem;
    background: url(/img/play.svg) center center / contain no-repeat;
    z-index: 19;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
.section.video.loaded .playbutton {opacity: 1;}
.section.video.playing .playbutton {opacity: 0; background: url(/img/pause.svg) center center / contain no-repeat;}
.section.video.paused::before, .section.video.playing::before {content: none;}
.section.video.playing .playbutton:hover {opacity: 1;}
.section.video .video-container .vimeoplayer, .section.video .video-container .vimeoplayer iframe {height: 100%; width: 100%; position: absolute; opacity: 0;}
.section.video.paused .video-container .vimeoplayer, .section.video.paused .video-container .vimeoplayer iframe,
.section.video.playing .video-container .vimeoplayer, .section.video.playing .video-container .vimeoplayer iframe {opacity: 1;}


/* TITLE */

.section.title {position: absolute; left: 0; transform: translateY(-50%); padding-top: 0; padding-bottom: 0; z-index: 5; width: 100%;}
.section.title > .container {position: relative; display: block;}
.section.title > .container > * {font-weight: 500; font-size: 1.75rem; margin: 0; padding: 1.2rem 4.5rem 1.2rem 0; line-height: 1.1; color: white; background: #269890; display: inline-block; min-width: 15rem;}
.section.title > .container > *::before {content: ""; top: 0; position: absolute; width: 50vw; right: 100%; height: 100%; background: #269890;}



/* TABS */

ul.tabs {display: flex; font-family: 'Poppins'; font-weight: 500; font-size: 1.35rem; margin-bottom: 1.2rem;}
ul.tabs li {list-style: none;}
ul.tabs li a {padding: 0; text-decoration: none; text-decoration: none; cursor: pointer; color: #012031; white-space: nowrap;}
ul.tabs li + li {margin-left: 2.3rem;}
ul.tabs li.active a {border-bottom: 1px solid #012031;}
ul.tabs + div h3 {display: none;}
.hidden {opacity: 0; pointer-events: none; position: absolute; width: 0; height: 0; overflow: hidden;}
.visible {opacity: 1;}
ul.tabs + * > * {transition: opacity 0.3s ease-in-out;}



/* EXPANDABLE */

.expandable h3 {font-weight: 500; cursor: pointer; margin: 0.75rem 0; font-size: 1.4rem;}
.expandable h3::after {
    content: "";
    background: url(/img/singlearrowright.svg) center center / contain no-repeat;
    display: inline-block;
    vertical-align: middle;
    height: 0.6rem;
    width: 1rem;
    margin-left: 0.6rem;
}
.expandable > div {height: 0; transition: all 0.3s ease-in-out; overflow: hidden; opacity: 0;}
.expandable.active > div {height: auto; opacity: 1;}
.expandable.active h3::after {
    background: url(/img/close.svg) center center / contain no-repeat;
    height: 0.6rem;
}



/* FOOTER */

.section.footer {background: #01243e; color: #ddd7d7; padding-top: 3.5rem; padding-bottom: 2rem;}
.section.footer > .container {display: block;}
.section.footer > .container .columns {position: relative;}
.section.footer > .container .columns > div:nth-child(1) {position: absolute; max-width: 50rem; width: calc(100% - 18rem);}
.section.footer > .container .columns > div:nth-child(1) a {color: #ddd7d7;}
.section.footer > .container .innercontainer {margin: 0 auto; line-height: 1.5;}
.section.footer > .container .innercontainer > div {float: right; margin-bottom: 5rem; font-family: 'Poppins';}
.section.footer > .container .innercontainer > div ul.tabs {display: flex; font-size: 1rem; margin-bottom: 0;}
.section.footer > .container .innercontainer > div ul.tabs li {list-style: none; margin: 0.3rem 0 1rem; position: relative; font-weight: 500;}
.section.footer > .container .innercontainer > div ul.tabs li:not(:last-child) {padding-right: 0.75rem; margin-right: 0.75rem;}
.section.footer > .container .innercontainer > div ul.tabs li:not(:last-child)::after {content: "|"; position: absolute; right: 0; top: 0; transform: translateX(50%);}
.section.footer > .container .innercontainer > div ul.tabs li a {padding: 0; text-decoration: none; border: 0; cursor: pointer;}
.section.footer > .container .innercontainer > div ul.tabs li.active a {border-bottom: 1px solid #ddd7d7;}
.section.footer > .container .innercontainer > div a {padding: 0; color: #ddd7d7; text-decoration: none; border-bottom: 1px solid #ddd7d7; font-weight: 500;}
.section.footer > .container .innercontainer > div a[href^="tel"] {border: 0; font-weight: 300;}
.section.footer > .container .innercontainer > div p {font-family: 'Roboto Slab'; padding-bottom: 0.9rem;}
.section.footer > .container .innercontainer h3 {font-weight: 600; margin: 0 0 1rem; font-size: 1.4rem; color: #ddd7d7;}
.section.footer ul.footermenu {clear: both; text-transform: uppercase; display: flex; font-weight: 500; font-size: 0.65rem;}
.section.footer ul.footermenu li {list-style: none; margin-right: 1.25rem;}
.section.footer ul.footermenu li:first-child {margin-right: 2.25rem;}
.section.footer ul.footermenu li a {color: #ddd7d7; text-decoration: none; padding: 0;}


@media (max-width: 42rem) { 
    html {font-size: 15px;}
    .section.footer ul.footermenu li {font-size: 0.8rem; padding: 0.5rem 0!important;}
}
@media (min-width: 120vh) { 
    .innercontainer {left: 5rem;}
}
@media (max-width: 130vh) { 
    .section.list-right .innercontainer > h2 {margin-left: 0rem; padding-left: 0rem;}
    .section.list-right .innercontainer > * {margin-left: 0; padding-left: 7rem;}
    .section.list-right.list-inside .innercontainer > * {padding-left: 0rem;}
    .section.list-right.list-inside .innercontainer img {left: 6.5rem;}
    body.innovation .section.list-right .innercontainer > p,
    .section.list-right.blue .innercontainer > h3 {padding-left: 0;}
}
@media (min-width: 137vh) { 
    .section.footer > .container .columns > div:nth-child(1) {padding-top: 3rem;}
}
@media (min-width: 117vh) { 
    .container {max-width: 78rem;}
    .container.small {max-width: 55rem;}
}
@media (max-width: 110vh) { 
    .section {padding-left: 9vw; padding-right: 9vw;}
    .section.footer {padding-bottom: 1rem;}
    .section.footer > .container .innercontainer > div {float: none;}
    .section.footer ul.footermenu {flex-direction: column-reverse;}
    .section.footer ul.footermenu li {padding: 0.25rem 0; margin: 0!important;}
    .section.footer ul.footermenu li:first-child {margin-top: 4rem!important;}
    .section.who-we-are .container {flex-direction: column;}
    .section.who-we-are .container ul {padding: 1rem 0 0 0;}
    .section.footer > .container .columns > div:nth-child(1) {position: relative; width: 100%; max-width: 100%; padding-bottom: 5rem; padding-top: 2rem;}
    ul.tabs {display: none;}
    ul.tabs + div h3 {display: block;}
    ul.tabs + div > div:not(:first-child) h3 {padding-top: 1rem;}
    ul.tabs + div .hidden {opacity: 1; position: relative; pointer-events: all; width: auto; height: auto; overflow: auto;}
    .nobronmobile br {display: none;}
}
@media (max-width: 90vh) { 
    .section {padding-left: 4.5vw; padding-right: 4.5vw;}
    .inset {margin: 0;}
    .section.bgimage.fixedbg {background-attachment: scroll;}
}