@import url(/includes/css/grid-flex.css);
@charset "UTF-8";
/* Web Solutions 4.0 Compatible */

:root {
  --blue: #0080C3;
  --dk-blue: #00507A;
  --gray: #6F6F6F;
  --lt-gray: #F0EFF4;
  --yellow: #FFB818;
  --green: #3AA688;
}

html {-webkit-box-sizing:border-box;box-sizing:border-box;}
*, *:before, *:after {-webkit-box-sizing:inherit;box-sizing:inherit;}
body{font-size:16px;margin:0;/* overflow-x: hidden; */padding:0;-webkit-text-size-adjust:none;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}

img{border: 0}
ul{padding-left: 0}
ul li{list-style:none}
html, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, hr{font-family:inherit; font-size:inherit; font-style:inherit;font-weight:inherit}
table {border-collapse:collapse}
td, th {empty-cells:show;vertical-align: middle;text-align:left;}
body {background:#333;overflow-x: hidden;}
#skipNavigation{background:#fff;color:#000;padding:.5em;position:absolute;left:0;top:-1000px;z-index:10}
#skipNavigation:focus,#skipNavigation:active{top:0;}
iframe[src="/management/login/persistSession.aspx"] {display: none}
/*page widths*/
body>header, #mainnav, main, body>footer, #alertApp{width:100%;float:left;clear:left;display:block;}
body>*>.wrap, body>footer>.fatFooter,#alertApp>*,.home .wrap{width:100%;max-width:75rem;margin-left:auto;margin-right:auto;overflow: hidden;position:relative;}

/* text */
body, .text, input, button, select, textarea {font-family:Arial, sans-serif;line-height:1.5;color:#666;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.text{font-size: 1rem}
a, a *{color:var(--yellow); text-decoration:none;}
a:hover, a:active, a:hover *, a:active *{color:var(--blue);}
p,h1,h2,h3,h4,hr,.content ul,.contentEditor ul,blockquote,dd,ol{margin-top:0;margin-bottom:1rem}
h1, h2, h3, h4, h5, h6, th{font-weight:400; line-height: 120%;}
p + h2, p + h3, p + h4, p + h5, p + h6 {margin-top:2em;}
.textColor, h1, h2, h3, h4, h5, h6, th, dt{color: var(--blue);}
em, i, q, cite, .italic{font-style:italic}
b, strong{font-weight:700}
u{text-decoration:none}
hr{border:0;border-top:1px solid rgba(0,0,0,.15);margin:1em 0;padding-top:1px}
p{color: var(--gray);font-size: 1em;line-height: 1.65;}
h1{font-size: 1.875em;margin: 0 0 .5em;text-transform: uppercase;}
.content .highlight h1 {color: #555;font-size: 1.375em;margin: 0 0 1.25rem;}
h2, .content * h1{color: var(--gray);font-size: 1.675em;}
h2.alt { color: var(--yellow); }
h3, .content * h2{color: var(--yellow);font-size: 1.4375em;}
h3.alt { color: var(--gray); }
h4, th{color: #29D3C4;font-size: 1.25em;}
h5 {font-size:1.1em}
h6 {font-size:1.0em}
sup, sub {font-size:.6em; line-height:.6em;vertical-align:baseline;position:relative}
sup {bottom:1ex}
sub {top:.5ex}
label {font-size: .875em;}

blockquote {
  border-bottom: .3125em solid var(--lt-gray);
  margin: 2em 0;
  padding: 1rem 2rem;
}

blockquote p {
  color: var(--blue);
  font-size: 1.0625em;
}

blockquote footer {
  color: var(--gray);
  font-size: .9375em;
  text-align: right;
}

blockquote footer::before {
  content: '- ';
  display: inline-block;
  margin: 0 .25em 0 0;
  position: relative;
  top: -.0625em;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
  -webkit-box-shadow: 0 0 0 30px #F8F8F8 inset !important;
}

/* Farro Light */
#resources-page label {
  font-family: 'Farro', sans-serif;
  font-weight: 300;
  font-style: normal;
}

#resources-page ::-webkit-input-placeholder {color: #525154; font-family: 'Farro', sans-serif; font-weight: 300; font-style: normal;}
#resources-page :-ms-input-placeholder {color: #525154; font-family: 'Farro', sans-serif; font-weight: 300; font-style: normal;}
#resources-page ::placeholder {color: #525154; font-family: 'Farro', sans-serif; font-weight: 300; font-style: normal;}


/* Farro Regular */
#mainnav>ul>li>a>ul li a, p, #resources h3, #sidenav li a, .photoright figcaption, .content ul li, blockquote footer,
label, input[type="text"], #web-solutions-exposure a, body>footer .copyright, #case-study span.partner,
#resources-page #key li, #resources-page #views, .text-image, .text-columns h2>span, .split-content .headshots figcaption, .split-content li,
.programs li, .quote blockquote p, .key-metrics-chart .label {
  font-family: 'Farro', sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* Farro Medium */
#mainnav>ul>li>a, #mobilenav a, #mobilenav span, h1,h2,h3,h4,h5,h6, #hero .textbox p, #interior-hero .textbox p, .heading,
#welcome h1, p.intro, blockquote p, #navContainer .menu, #our-stories.what-is .column .box p, #our-stories.what-is h3,
#metrics figcaption, .annual-report figure figcaption, .split-content figcaption, .key-metrics-chart #key-metrics-description {
  font-family: 'Farro', sans-serif;
  font-weight: 500;
  font-style: normal;
}

/* Farro Bold */
#hero .textbox p>span, #interior-hero .textbox p>span, .button, .button-alt,
.crt-widget button.crt-load-more, input[type="submit"], input[type="reset"], input[type="button"],
button[type="submit"], button[type="button"], #welcome h1 > span, #stay-connected h3 span, #resources date,
.fatFooter .column.social a, #our-ideas p>span, .highlight h1, #our-stories.what-is h3 span, #our-stories.what-is .column .box p>span,
#resources-page #filters-form strong, #resources-page #filters-form button, #floating-cta strong,
.ctop .split-intro .si-right .overlay-link a, .continuum h3, .text-columns h2,
main :is(div, section):nth-child(2 of .split-content) :is(.left, .right) :is(h2, h3), .programs li>strong, .split-content ul.count-up span.number, .key-metrics-chart .value {
  font-family: 'Farro', sans-serif;
  font-weight: 700;
  font-style: normal;
}


/* HEADER ------------------------------*/
body>header{background: #FFF;border-bottom: .3125em solid var(--blue);padding: .25rem 0;}
body>header>.wrap{height:60px}

#brand {
  display: block;
  float: left;
}

#brand img {
  height: auto;
  position: relative;
  top: .1875em;
}

header.sticky-header #brand img {width: 9.94em;}

body>header .twitter-header {
  display: inline-block;
}

.header-container {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-end;
  position: static;
  width: 100%;
  z-index: 5;
}

body>header #mainnav svg path {
  fill: var(--blue);
}

/* MAIN ------------------------------ */
.menu{ cursor: pointer; }
main, .mceContentBody{background:#fff}
.contentEditor{background:#fff;min-width:100%;}
/* t1 */
#sidenav{background: var(--lt-gray);width:100%;overflow:hidden;padding: 0 1.5em;margin: 0;}

#sidenav::before {
  content: '';
  display: block;
  background: red;
  height: 49px;
  position: absolute;
  left: 0;
}

#sidenav ul{font-size: 0;margin: 0 auto;max-width: 49rem;padding: 0;text-align: center;}
#sidenav li{display: inline-block;overflow:hidden;}
#sidenav li a{font-size: .9375rem;padding:.5em .25rem;line-height: 1.625;display:block; position:relative; z-index:10; }
#sidenav li a:hover, #sidenav li a:active{background:#e5e5e5}
#sidenav li.on>a{color:#000}
#sidenav>ul>li>a{display: none; }
/* t2 */
#sidenav li.on ul li a{height: 3.0625em;padding: .75em 1em;color:#666;}
#sidenav li ul li a:hover, #sidenav li ul li a:active{color: #FFF;background: var(--yellow);}
#sidenav li ul li.on>a{color: #FFF;background: var(--yellow);}
/* t3 */
#sidenav li ul li.on ul{display:none; padding-bottom:.5em;border:0}
#sidenav li ul li.on ul li{border:0}
#sidenav li ul li.on ul li a{padding-left:1rem;font-size:.8em;color:#666}
#sidenav li ul li ul li a:hover, #sidenav li ul li ul li a:active{background:#f5f5f5}
#sidenav li ul li ul li.on>a{color:#000; background:#e5e5e5;}
/* t4 */
#sidenav li ul li ul li.on ul li a{padding-left:1.5rem;font-size:.7em;color:#666}
#sidenav li ul li ul li ul li a:hover, #sidenav li ul li ul li a:active{background:#fff}
#sidenav li ul li ul li ul li.on>a{color:#000; background:#f5f5f5;}
/*section callouts*/
main>div>aside section{margin:0 0 20px;padding:10px}
main>div>aside section:hover{background:#FFC}
main>div>aside section h1{margin:0;font-size:1.2em}
main>div>aside section p{margin:0}
/* breadcrumb */
.breadcrumb{margin-bottom: 1em}
.breadcrumb a:after{content: "\00A0\00A0\203A\00A0"}

/* content */
.content{word-wrap:break-word}
.content .photoright, .content .photoleft, #content.content img.photoright, #content.content img.photoleft{max-width:50%;height:auto}
.content .photoright.small, #content.content img.photoright.small{max-width: 30%;}
.content .photoright img,.content .photoleft img {max-width:100%;height:auto;margin: 0;float: none}
.content img.phototreatment{max-width:50%;height:auto}
.content figure.phototreatment{width: 100%;text-align: center}
.content figure.phototreatment img{max-width: 100%;width: auto;height: auto}
.photoright figcaption {font-size: .8125em;text-align: right;}
img.phototreatment,img.photoright,img.photoleft,.photoright:not(.set-width) img,.photoleft img {max-width: 100%;width: auto;height: auto}
#content.content img {height: auto; max-width: 100%; }
.photoright.set-width {text-align: right;}
.photoright.set-width figcaption {max-width: 12.125rem;}
.photoright{float:right;clear:right}
.photoleft{float:left;clear:left}
.muted {opacity:0.5;filter:alpha(opacity=50)}
.highlight, .content .highlight{background: var(--lt-gray);border-top: .3125em solid var(--blue);clear: both;padding: 2em 1.5em;margin: 2em 0;}
small, .textSm{font-size:.8em}
.content table{width:100%}
.intro {font-size: 1.0625em;margin: 0 0 1.75em;}

.image-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 1.5em;
  text-align: center;
  margin-inline: auto;
  max-width: 40em;
}

.image-grid figure {
  margin: 0;
  width: calc(50% - .75em);
}

.annual-report .image-grid figure>img {
  aspect-ratio: 1;
  margin: 0 auto .5em;
  object-fit: cover;
  width: 100%;
}

.annual-report .image-grid figure figcaption {
  background: transparent;
  color: #4A4A4A;
  height: auto;
  min-height: 0;
  padding: 0;
}

.annual-report .image-grid.tall figure>img {
  aspect-ratio: 589 / 773;
}

.annual-report .blue-bg .image-grid figure figcaption {
  color: #FFF;
}


/* list */
.content ol{margin-left:2em}
.content ol ol li {list-style: lower-alpha}
.content ul li{font-size: 1em;line-height: 1.5;margin: 0 0 .75em;padding: 0 0 0 2.25em;text-indent: -.875em;}
.content ul li:before{content: url('../images/icon-angle-right.svg');display: inline-block;margin: 0 .5em 0 0;position: relative;text-align: center;text-indent:0;top: -.15em;}
.content ul li ul li:before{opacity: .5}

/* addon classes */
.clearFloats{clear:both}
.nobr{white-space: nowrap}
.twoCol, .threeCol, .resCol{
  -webkit-column-rule:1px outset rgba(0,0,0,.15);
  -moz-column-rule:1px outset rgba(0,0,0,.15);
  column-rule:1px outset rgba(0,0,0,.15);
  -webkit-column-gap:2em;
  -moz-column-gap:2em;
  column-gap:2em;
}
.req{color:#c00}
.textIcon{background:#999; background-color:rgba(0,0,0,.2);font-size:.8em;line-height:1em;display:inline-block;padding:.2em .4em;-webkit-border-radius: .5em;border-radius: .5em;color:#fff}
.textIcon:hover{background:#666; background-color:rgba(0,0,0,.4);color:#fff}
.clearfix:after{content: "";display: table;clear: both;}

.videoContainer {width: 100%;height:0;line-height:0;position: relative;padding-top:56.25%; /* 16:9 */}
.videoContainer.ratio-4-3 {padding-top:75%; /* 4:3 full-frame */}
.videoContainer iframe {position:absolute;left:0;top:0;right:0;bottom:0;width:100%;height:100%;border:0}

/* forms */
input, button, select{font-size:.9rem;line-height: 1.2em}
input[type="text"], input[type="password"], input[type="tel"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], textarea, select, input[type="button"], input[type="submit"], input[type="reset"]{-webkit-border-radius:0;border-radius:0; outline: none; -webkit-appearance:none;font-size: .9rem}
input[type="text"], input[type="password"], input[type="tel"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], textarea, select{
  background-color: #F8F8F8;
  border: 1px solid #D3D3D3;
  -webkit-border-radius: 0;
  border-radius: 0;
  color: #4A4A4A;
  padding: .1875rem .5rem;
  margin: 0 0 .25rem;
  -webkit-box-shadow: none;
  box-shadow: none;
  width: 100%;
  height: 2.25rem;
}

input[type="file"] {margin: 0 0 .25rem;}

input[type="text"]:focus, input[type="password"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, textarea:focus, select:focus{background-color: #FCFCFC;}
textarea{display:block;height: auto;font-size: .9rem;}

select {
  background-image: url('/images/icon-select-arrow.svg');
  background-repeat:no-repeat;
  background-position: calc(100% - .75rem) 1rem;
  padding-right: 18px
}

select::-ms-expand {
  display: none;
}
.crt-widget button.crt-load-more {transition: all .2s ease;}
select option{padding:0 .2em}
button, .button, .button-alt, input[type="button"], input[type="submit"], input[type="reset"], :is(#landing-intro, .landing-intro).annual-reports .button, .crt-widget button.crt-load-more{background:#69c;color:#fff;border:0;padding:.4em .6em;line-height:1em;cursor:pointer}
input::-moz-focus-inner {border:0;padding:0;}
button:hover,.button.hover,input[type="button"]:hover,input[type="submit"]:hover,input[type="reset"]:hover,
.button:hover,.button:focus,.button-alt:hover, .button-alt:focus,input[type="button"]:focus,
input[type="submit"]:focus,input[type="reset"]:focus{ background-color: var(--yellow); color:#FFF}
.button, .button-alt, input[type="submit"], input[type="button"], input[type="reset"], button[type="submit"], button[type="button"],
:is(#landing-intro, .landing-intro).annual-reports .button, .crt-widget button.crt-load-more {-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;background: var(--blue);display: -webkit-inline-box;display: -webkit-inline-flex;display: -ms-inline-flexbox;display: inline-flex;height: 3.125rem;-webkit-box-orient: vertical;-webkit-box-direction: normal;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;font-size: 1em;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;letter-spacing: 1px;line-height: 1.5;padding: .25em 1.5em 0;position: relative;text-transform: uppercase;}
.button-alt, button[type="button"] {background: var(--yellow);}

.button:hover, .button-alt:hover, input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover,
button[type="submit"]:hover, button[type="button"]:hover, :is(#landing-intro, .landing-intro).annual-reports .button:hover,
.crt-widget button.crt-load-more:hover {
  background: var(--gray);
}

button img{position: absolute;height:1em;width:auto;vertical-align:top;left: .375rem;}
input.bulky, .bulky {padding:.4em .6em;font-size:1.2em}
.formTable, .formTable table{width:100%}
.formTable input[type="text"], .formTable input[type="password"], .formTable input[type="tel"], .formTable input[type="number"], .formTable input[type="email"], .formTable input[type="url"], .formTable input[type="search"], .formTable textarea{width:100%}
.formTable table td,.formTable table td:first-child{padding-bottom:0}
.formTable.right td:first-child{text-align:right;width:1%}
.formTable.right td{width:auto}
.subjClass{display:none !important;}
#Captcha label{padding-left:0}
td.right, th.right{text-align:right}
.wsNew{display:inline-block;font-size:.7em;line-height:1.5em;height:1.5em;padding:0 .3em;margin:.3em 0;background-color:#FFC700;overflow:visible;vertical-align:top;color:#fff;font-style:italic}
.formEdit select, .formBuilder select { width:40%; }

/* pagination */
.pagination{font-size:.95em;text-align:right}

/* page header */
.pageHeader{width:100%;height:auto;margin-bottom:2em}

/* alert */
#alertApp {background: #990000;cursor: pointer;position: relative;width: 100%;padding: .5rem 2.5rem;z-index: 1;}
#alertApp:hover { background:#660000;}
#alertApp.alertStatic { cursor: default;}
#alertApp h1 {color: #FFF;font-size: .9375rem;line-height: 1.25rem;margin: 0 auto;padding: .1875rem .3125rem;text-align: center;}
#alertApp:hover h1,#alertApp.expand h1 {color: #FFF;}
#alertApp #alertDesc {height: 0;overflow: hidden;}
#alertApp p {color: #FFF;font-size: .9375rem;line-height: 1.5;margin: 0;padding: .5rem 0 .75rem;position: relative;text-align: center; z-index: 1;}

/* management overrides */
#wysiwygBody{background:#fff}

/* management table */
hr+.manage{margin-top:-1em}
.manage{border-bottom:1px solid rgba(0,0,0,.2);width:100%;line-height:1.3em;}
.manage th{border-bottom:1px solid rgba(0,0,0,.2);text-align:left}
.manage th.right{text-align:right}
.manage th.sort{cursor:pointer}
.manage th.sort img{margin-left:5px}
.manage th img {position:relative;bottom:-2px}
.manage td,.manage th{padding:5px 5px 5px 0;min-width: 4.25em;}
.manage img.preload{display:none;position:absolute;z-index:9900;top:0;border:solid 1px #fff}
.manage td.icons img{margin-left:5px;position:relative;bottom:-2px}
.manage td:first-child.icons img{margin-left:0}
.manage td:first-child.icons{padding-left:3px;padding-right:3px}
.manage td:nth-child(2) {overflow-wrap: break-word;word-wrap: break-word;-ms-word-break: break-all;word-break: break-all;word-break: break-word;-ms-hyphens: auto;-webkit-hyphens: auto;hyphens: auto;}
.manage td.icons a:first-child img{margin-left:0}
.manage td.icons input{position:relative;bottom:2px;margin-left:5px}
.manage .hidden{font-style:italic;color:#900}
.manageButton{text-align:right;padding:10px 0}
.alternate tbody tr:nth-child(even), .even{background:#fff}
.alternate tbody tr:nth-child(odd), .odd {background:rgba(0,0,0,.06)}
.manage+hr, .manage+.manageLinks+hr{margin-top:50px}
.manageLinks{margin-top:10px}
.manageLinks a{white-space:nowrap}
.manageLinks a img{position:relative;bottom:-2px}
.manageLinks button{margin-left:5px}
.manageButtons{text-align: right;padding:10px 0}
.wsReturnToButton {float:right;margin-top:-3.5em}
.manage.rightFirstChild td:first-child{text-align:right}
.sortRow th{cursor:pointer}
.manageEllipsis{width:200px;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;display:inline-block}

/* CURATOR ----------------------------- */
.stay-connected h2 {
  margin-bottom: 2.5625rem;
}
.stay-connected .crt-widget .crt-post-fullname a {color: var(--blue);}
.stay-connected .crt-widget .crt-post-text a {color: var(--yellow);}
.stay-connected .crt-post-share a {opacity: 1;}
.stay-connected .crt-post-share a * {color: var(--blue); transition: all .2s ease;}
.stay-connected .crt-post-share a *:hover {color: var(--yellow);}
.stay-connected .crt-widget.crt-widget-branded .crt-logo {display: none;}
.stay-connected .wrap {
  padding: 0 1.5em;
  max-width: 77em;
  margin: 0 auto;
}

/* ANNUAL REPORTS ---------------------- */
:is(#landing-intro, .landing-intro).annual-reports .wrap {
  max-width: 57.3125rem;
}
:is(#landing-intro, .landing-intro).annual-reports h1 {
  text-align: center;
}
:is(#landing-intro, .landing-intro).annual-reports .split-intro, .split-intro .wrap {
  display: flex;
  align-items: flex-start;
  gap: 4.6875rem;
}
h2.smaller-heading {
  font-size: 1.665em;
}
.performance-reports {
  padding: 4em 1.5em 5em;
  text-align: left;
}
.performance-reports h2 {
  text-align: center;
    margin-bottom: 3rem;
}
.performance-reports .wrap {
  max-width: 57.3125rem;
}
.split-reverse {
  display: flex;
  align-items: flex-start;
  gap: 4.6875rem;
}
.split-reverse img {
  width: 100%;
}
.split-reverse span {
  color: var(--gray);
    font-size: 1.3em;
    display: block;
    line-height: 1.2;
    font-weight: 500;
    margin-bottom: 0.875rem;
}
:is(#landing-intro, .landing-intro).annual-reports h2 {
  color: #0080C3;
}
.report-2024 :is(#landing-intro, .landing-intro).annual-reports h2 {
  color: var(--gray);
}
:is(#landing-intro, .landing-intro) .split-intro {
  padding-top: 1.625rem;
}
.split-intro .wrap {
  padding-top: 4.6875rem;
  padding-bottom: 2rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  max-width: 60.3125rem;
}
.split-intro .si-left {
  text-align: left;
}
.split-intro .si-left p {
  font-size: 1.25rem;
}

.split-intro .si-right p, :is(#landing-intro, .landing-intro) .split-intro .si-right p {
  margin-bottom: 0;
  text-align: left;
  color: #0080C3;
}
.split-intro .si-right p:first-of-type {
  font-weight: 500;
}
.split-intro .si-right p + p {
  font-size: 0.875rem;
}
.split-intro img {
  max-width: 100%;
  height: auto;
}
.split-intro.blue-bg {
  background: #0080C3;
}

.split-intro.blue-bg :is(h2, p) {
  color: #FFF;
}

.split-intro.blue-bg :is(h2, p).yellow {
  color: var(--yellow);
}

.annual-report .to-careers .wrap {
  max-width: 73.5rem;
  padding: 6rem 1.5rem 3.875rem;
  text-align: center;
}

.annual-report.interior .to-careers .wrap {
  padding: 1em 0;
}

.annual-report .to-careers h2 {
  text-align: center;
  text-transform: uppercase;
}

.annual-report .to-careers img {
  width: 100%;
  max-width: 37.5rem;
  margin: 1.375rem 0 4.375rem;
}

.annual-report .graphs .wrap {
  max-width: 73.5rem;
  padding: 6rem 1.5rem 3.875rem;
  text-align: center;
}

.annual-report.interior .graphs .wrap {
  padding: 1em 0;
}

.annual-report .graphs h2 {
  color: var(--gray);
  text-align: center;
  text-transform: uppercase;
  position: relative;
}
.annual-report .graphs h2:after {
  content: "";
  position: absolute;
  bottom: -2rem;
  right: 50%;
  transform: translateX(50%);
  width: 15rem;
  height: 1rem;
  background: url('/images/graph-key-2023.svg') no-repeat center / contain;
}

.annual-report .graphs.new h2:after {
  width: 18rem;
  height: 1rem;
  background: url(/images/graph-key-2023.svg) no-repeat center / contain;
}
.annual-report .graphs.new figure img {width: 9em;}

.annual-report .graphs ul {
  display: flex;
  align-items: flex-end;
  margin-top: 4.375rem;
  margin-bottom: 8.8125rem;
}

.annual-report .graphs ul li {
  margin: 0;
  padding: 0;
  position: relative;
  text-indent: 0;
}

.annual-report .graphs ul li:before {
  aspect-ratio: 1;
  content: "";
  position: absolute;
  right: 50%;
  transform: translateX(50%);
  bottom: -5.25rem;
  width: 7rem;
  border-radius: 50%;
  border: 4px solid var(--blue);
  box-shadow: 0 0 0 2px #FFF;
  background-color: #FFF;
  background-position: center;
  background-repeat: no-repeat;
  top: auto;
  margin: 0;
}
.annual-report .graphs ul li.people-stairs:before {
  background-image: url(/images/icons/misc/people-stairs.svg);
  background-size: 5.5rem 4.875rem;
}
.annual-report .graphs ul li.person-stairs:before {
  background-image: url(/images/icons/misc/person-stairs.svg);
  background-size: 5rem 5.0625rem;
}
.annual-report .graphs ul li.person-stairs-flag:before {
  background-image: url(/images/icons/misc/person-stairs-flag.svg);
  background-size: 4rem 5.25rem;
}
.annual-report figure {
  margin: 0;
}
.annual-report figure img {
  width: 7.875rem;
  height: auto;
  display: block;
  margin: 0 auto 1rem;
}
.annual-report figure figcaption {
  background: var(--blue);
  color: #FFF;
  font-size: 1rem;
  padding: 1.6875rem 1.125rem 2.5rem;
  text-align: center;
  line-height: 1.11em;
  border-radius: 0 0 5px 5px;
}


.annual-report .graphs .button {
  min-width: 12.9375rem;
  font-size: 1.125rem;
}
.annual-report .graphs .wrap > p:first-of-type {
  text-align: center;
}
.annual-report .graphs .wrap > p + p {
  max-width: 57.3125rem;
  margin: 2rem auto 0;
  text-align: left;
  font-size: 1rem;
  line-height: 1.33;
}
.annual-report .graphs .wrap > p strong {
  color: var(--blue);
}

.annual-report .split-section {
  overflow: hidden;
}

.annual-report .split-section h2 {
  text-transform: uppercase;
}

.year-ahead .wrap {
  padding-top: 3.625rem;
  padding-bottom: 3.6875rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  max-width: 75.3125rem;
}
.year-ahead h2 {
  text-transform: uppercase;
  text-align: center;
}
.year-ahead img {
  max-width: 100%;
  height: auto;
}

.year-ahead.blue-bg {
  background: #0080C3;
}

.year-ahead.blue-bg :is(h2, h3, p) {
  color: #FFF;
}

.year-ahead.blue-bg :is(h2, p).yellow {
  color: var(--yellow);
}

.report-2024 .reports-columns .underlined::after {
  display: none;
}



/* TWO COLUMNS RIBBON ------------------------------ /
* - 2023 Annual Report page
*/

.two-columns {
  background: #F2F2F2;
  padding-block: clamp(3em, 2.273em + 3.64vw, 5em);
}

.two-columns .full {
  text-align: center;
}

.two-columns img {
  display: block;
  margin: 0 auto;
  max-width: 25em;
  width: 100%;
}

.two-columns .wrap {
  padding-inline: 1.5em;
}

.two-columns .wrap>div.half {
  background: #FFF;
  border: 2px solid #EAEAEA;
  padding: 2.25em 1.5em;
}


/* ANNUAL REPORT DOWNLOAD RIBBON ------------------------------ */

.annual-report-download {
  background: var(--lt-gray);
}

.results .annual-report-download {
  background: #FFF;
}

.annual-report-download .wrap {
  margin-inline: auto;
  max-width: 60.625rem;
  padding: 4.5625rem 1.5rem 6.875rem;
}
.annual-report-download h2 {
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 2rem;
}
.annual-report-download ul {
  display: flex;
  gap: 9.375rem;
}
.annual-report-download ul li {
  text-align: center;
}
.annual-report-download ul li img {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: 2rem;
}
.annual-report-download a:hover .button {
  background: var(--gray);
  color: #FFF;
}

:is(.report-2024, .results) .annual-report-download ul {
  gap: 1.375rem;
}


/* FOOTER ------------------------------ */
body>footer{background: var(--blue);border-top: .125em solid #FFF;padding: 2.5em 1.5em 1.875em;color:#dadada;font-size:.9em;}
body>footer>.wrap{overflow:visible}
body>footer a{color: #FFF;}
body>footer a:hover, footer a:active{color:#fff}
body>footer a.on, footer .on>a{text-decoration:none;color:#fff}
.fatFooter>nav>ul ul li{padding-left: 1rem}
body>footer nav{display: block;}
body>footer nav>span:first-of-type { display: none; }
body>footer>div{min-height:18px}
body>footer .copyright {color: #FFF;font-size: .75rem;line-height: 1.75;}

.fatFooter {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 2em;
}

.fatFooter .column.tagline {
  width: 17.5em;
}

.fatFooter .column.tagline p {
  color: #FFF;
  font-size: .8125rem;
  line-height: 1.75;
}

.fatFooter .column.social {
  display: flex;
  flex-direction: column;
  margin: .3125em 0 0;
  text-align: right;
}

.fatFooter .column.social a {
  align-items: center;
  color: #FFF;
  display: flex;
  font-size: .98em;
  letter-spacing: .05em;
  margin: 0 0 1em;
  text-transform: uppercase;
  vertical-align: middle;
}

.fatFooter .column.social a svg {
  margin: 0 1em 0 0;
}

.copyright a:hover,
#web-solutions-exposure a:hover {
  color: rgba(255, 255, 255, .75);
}

.fatFooter .social a:hover {
  color: #282828;
}

.fatFooter .social a:hover svg path {
  fill: #282828;
}

.fatFooter .social a:hover svg * {
  opacity: 1;
}

/* TRANSITIONS ------------------------------ */
#mainnav a.twitter-header svg path,#brand img, #mobilenav span>svg path, #mobilenav span, #navContainer .menu, a, a *,button,
.button,input[type="button"],input[type="submit"],.rsFullscreenBtn,#alertApp,#alertApp span,#alertDesc,#navContainer li,.hamburger,
#navContainer aside.menu svg path, #resources-page #filters-form button::after, #resources-page #filters-form button.closed + div,
#resources-page #results li>a::after {
  -webkit-transition: all 200ms ease;
  transition: all 200ms ease
}

input:focus, select:focus, textarea:focus{
  -webkit-transition: background-color 150ms ease;
  transition: background-color 150ms ease
}

.stop-transitions * {
  transition: none !important;
}


/* FORM ERROR ------------------------------ */
.formError {background-color:Black; border:0; padding: 5px 10px; color:#fff; display:none; margin:0 0 2px; z-index:9999; -webkit-border-radius: 10px; border-radius: 10px; -moz-box-shadow:0 2px 2px #333; -webkit-box-shadow:0 2px 2px #333;}
.formError p {margin:0; font-size:.9em; }
.formError em { border:10px solid;  border-color:Black transparent transparent; bottom:-17px; display:block; height:0; left:40px; position:absolute; width:0; }

/* HELPERS ------------------------------ */

.flex-row {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 0 auto;
  padding: 0 1.5em;
  max-width: 77em;
  width: 100%;
}

/* SHARED STYLES ------------------------------ */

#flex-order {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.heading {
  color: var(--gray);
  font-size: 1.675em;
  text-transform: uppercase;
}

.video-container {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.video-container::before {
  content: '';
  display: block;
  padding: 0 0 56.154%;
}

.video-overlay,
.video-overlay-hover {
  bottom: 0;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: all .3s ease;
  width: 100%;
  z-index: 2;
}

.video-overlay {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  cursor: pointer;
}

.video-overlay-hover {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  opacity: 0;
}

.video-container:hover .video-overlay-hover {cursor: pointer; opacity: 1;}

.video-container iframe {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

/* ANIMATION FX ------------------------------ */
.no-glide {
  -webkit-transition-delay: 0s !important;
  -o-transition-delay: 0s !important;
  transition-delay: 0s !important;
  -webkit-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

.fade-in,
.animate-left, .animate-right, .animate-down, .animate-up,
.animate-up-left .animate-up-right, .animate-down-left, .animate-down-right,
.translate-left, .translate-right, .translate-up, .translate-down,
.translate-up-left, .translate-up-right, .translate-down-left, .translate-down-right {
  opacity: 0;
  position: relative;
  z-index: 15;
  -webkit-transition: all 1s ease;
  -o-transition: all 1s ease;
  -webkit-transition: all 1.25s ease;
  -o-transition: all 1.25s ease;
  transition: all 1.25s ease;
}

.animate-left { left: 4.75rem; top: 0; }
.animate-right { right: 4.75rem; top: 0; }
.animate-up { top: 4.75rem; }
.animate-down { top: -4.75rem; }

.animate-down-left { left: 4.75rem; top: -4.75rem; }
.animate-down-right { right: 4.75rem; top: -4.75rem; }
.animate-up-left { left: 4.75rem; top: 4.75rem; }
.animate-up-right { right: 4.75rem; top: 4.75rem;  }

.animate-left.animated { left: 0; top: 0; }
.animate-right.animated { right: 0; top: 0; }
.animate-up.animated { top: 0; }
.animate-down.animated { top: 0; }

.animate-up-left.animated { left: 0; top: 0; }
.animate-up-right.animated { right: 0; top: 0; }
.animate-down-left.animated { left: 0; top: 0; }
.animate-down-right.animated { right: 0; top: 0; }

.translate-left {-webkit-transform: translate(4.75rem,0);-ms-transform: translate(4.75rem,0);transform: translate(4.75rem,0);}
.translate-right {-webkit-transform: translate(-4.75rem,0);-ms-transform: translate(-4.75rem,0);transform: translate(-4.75rem,0);}
.translate-up {-webkit-transform: translate(0,4.75rem);-ms-transform: translate(0,4.75rem);transform: translate(0,4.75rem);}
.translate-down {-webkit-transform: translate(0,-4.75rem);-ms-transform: translate(0,-4.75rem);transform: translate(0,-4.75rem);}

.translate-up-left {-webkit-transform: translate(4.75rem,4.75rem);-ms-transform: translate(4.75rem,4.75rem);transform: translate(4.75rem,4.75rem);}
.translate-up-right {-webkit-transform: translate(-4.75rem,4.75rem);-ms-transform: translate(-4.75rem,4.75rem);transform: translate(-4.75rem,4.75rem);}
.translate-down-left {-webkit-transform: translate(4.75rem,-4.75rem);-ms-transform: translate(4.75rem,-4.75rem);transform: translate(4.75rem,-4.75rem);}
.translate-down-right {-webkit-transform: translate(-4.75rem,-4.75rem);-ms-transform: translate(-4.75rem,-4.75rem);transform: translate(-4.75rem,-4.75rem);}

.translate-left.animated {-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);}
.translate-right.animated {-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);}
.translate-up.animated {-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);}
.translate-down.animated {-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);}

.translate-down-left.animated {-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);}
.translate-down-right.animated {-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);}
.translate-up-left.animated {-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);}
.translate-up-right.animated {-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);}

.animated, .animated {opacity: 1;}

.animated,
.delay-1 {-webkit-transition-delay:.15s; -o-transition-delay:.15s; transition-delay:.15s;}
.delay-2 {-webkit-transition-delay:.3s;  -o-transition-delay:.3s;  transition-delay:.3s;}
.delay-3 {-webkit-transition-delay:.45s; -o-transition-delay:.45s; transition-delay:.45s;}
.delay-4 {-webkit-transition-delay:.6s; -o-transition-delay:.6s;  transition-delay:.6s;}
.delay-5 {-webkit-transition-delay:.75s; -o-transition-delay:.75s; transition-delay:.75s;}
.delay-6 {-webkit-transition-delay:.9s; -o-transition-delay:.9s;  transition-delay:.9s;}
.delay-7 {-webkit-transition-delay:1.05s; -o-transition-delay:1.05s; transition-delay:1.05s;}
.delay-8 {-webkit-transition-delay:1.2s; -o-transition-delay:1.2s; transition-delay:1.2s;}
.delay-9 {-webkit-transition-delay:1.35s; -o-transition-delay:1.35s; transition-delay:1.35s;}
.delay-10 {-webkit-transition-delay:1.5s; -o-transition-delay:1.5s; transition-delay:1.5s;}

.underlined {
  display: inline-block;
  position: relative;
}

.underlined::after {
  background: var(--yellow);
  content: '';
  display: block;
  height: 4px;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
  -webkit-transition-delay: .5s;
  -o-transition-delay: .5s;
  transition-delay: .5s;
  width: 0;
}

.underlined.animated::after {
  width: 100%;
}

.content .translate-up,
.content .animate-up {
  opacity: 1 !important;
  transform: none !important;
}




/*  HOMEPAGE RIBBON ORDER ------------------------------ */

#hero { order: 1; }
#our-stories { order: 2; }
#our-partners { order: 3; }
#welcome { order: 4; }
.home-news { order: 5; }
#stay-connected { order: 6; }
#our-idea { order: 7; }
#resources { order: 8; }




/* HERO  ------------------------------ */

#hero {
  position: relative;
  z-index: 1;
}

#slider .slide::after {
  content: '';
  display: block;
  padding: 0 0 49.43%;
}

#slider .slide {
  position: relative;
}

#slider .slide-bg {
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  bottom: 0;
  cursor: -webkit-grab;
  cursor: grab;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

#slider, .slide-inner, .slide-bg, .slick-slide, .slick-list, .slick-track {
  max-height: 46em;
}

#hero .textbox {
  position: absolute;
  text-align: center;
  width: 28.75rem;
}

#hero .textbox, #hero .textbox.rightMiddle {
  right: 5.5%;
  top: 50%;
  transform: translateY(-50%);
}

#hero .textbox.leftBottom {
  bottom: 3rem;
  left: 4%;
  top: auto;
  transform: none;
}

#hero .textbox p {
  color: #FFF;
  font-size: 1.8rem;
  line-height: 1.3;
  text-shadow: 0 2px 9px rgba(0,0,0,.5);
}

#hero .textbox p > span {
  color: var(--yellow);
  font-size: 2.2rem;
  letter-spacing: .05em;
  font-weight: 700;
  text-transform: uppercase;
}

#hero .slick-slide {
  float: left;
  outline: none !important;
}



/* OUR STORIES  ------------------------------ */

#our-stories, #video-library {
  padding: 9em 0 7em;
  position: relative;
}

#video-library {
  background: var(--blue);
}

#video-library.gray {
  background: var(--lt-gray);
}

#video-library h2 {
  color: #fff;
}

#video-library.gray h2 {
  color: var(--gray);
}

#our-stories .flex-row, #video-library .flex-row {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

#our-stories h2, #video-library h2 {
  position: absolute;
  top: 2.5em;
}

#our-stories .column {
  margin: 0 0 .625em;
  max-width: 35.1875em;
  width: -webkit-calc(50% - 1.75vw);
  width: calc(50% - 1.75vw);
}

#video-library .column {
  width: 32%;
}

#our-stories p {
  padding: 0 1.25em 0 0;
}

#our-stories .column p:last-of-type {
  margin: 0;
}

#our-stories .video-container {
  margin: 0 0 1.25em;
}

.play-button {
  background-image: url('/images/play-off.svg');
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  height: 3.125rem;
  left: 50%;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  -webkit-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
  width: 4.4375rem;
}

.profile-pic.video:hover .play-button,
.videoThumb:hover .play-button,
.video-overlay:hover .play-button {
  background-image: url('/images/play-on.svg');
}

.profile-pic.video {cursor: pointer;}


/* OUR STORIES v2 - WHAT IS CT OPPORTUNITY PROJECT? ------------------------------ */

#our-stories.what-is {
  padding: 6em 0;
  position: relative;
}

#our-stories.what-is .flex-row {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

#our-stories.what-is .column:first-of-type {
  max-width: 37.0625em;
  width: 50%;
}

#our-stories.what-is .column:last-of-type {
  max-width: 31.25em;
  margin: 0 0 0 auto;
  position: relative;
  width: -webkit-calc(50% - 2em);
  width: calc(50% - 2em);
}

#our-stories.what-is .column:last-of-type::after {
  content: '';
  display: block;
  padding: 0 0 100%;
}

#our-stories.what-is h2 {
  color: var(--blue);
  font-size: 1.5625rem;
  line-height: 1.4;
  position: static;
  top: auto;
}

#our-stories.what-is .column p:last-of-type {
  margin: 0;
  font-size: .9375em;
}

#our-stories.what-is .box {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background: var(--lt-gray);
  bottom: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  left: 0;
  padding: 1em 2em;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
}

/* #our-stories.what-is .box::before {
background: url('../images/box-border-top.jpg') no-repeat center center;
content: '';
height: 5px;
left: 0;
position: absolute;
top: 0;
width: 100%;
}

#our-stories.what-is .box::after {
background: url('../images/box-border-bottom.jpg') no-repeat center center;;
bottom: 0;
content: '';
height: 5px;
left: 0;
position: absolute;
width: 100%;
} */

#our-stories.what-is .exclamation {
  background: var(--yellow);
  -webkit-border-radius: 50%;
  border-radius: 50%;
  height:  6.25em;
  margin: 0 auto 3em;
  padding: 1.5em;
  position: relative;
  width:  6.25em;
}

#our-stories.what-is .exclamation svg {
  color: #FFF;
  height: auto;
  left: 50%;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 1.5em;
}

#our-stories.what-is h3 {
  color: var(--blue);
  font-size: 2.125em;
  text-transform: uppercase;
}

#our-stories.what-is h3>span {
  position: relative;
  top: -.25rem;
}

#our-stories.what-is h3::after {
  background: #A2A2A4;
  content: '';
  display: block;
  height: .25rem;
  margin: 1rem auto .25rem;
  width: 3rem;
}

#our-stories.what-is .column .box p {
  color: var(--gray);
  font-size: 1.25em;
  max-width: 100%;
}

#our-stories.what-is .column .box p>span {
  color: var(--blue);
  text-transform: uppercase;
}


/* OUR PARTNERS ------------------------------ */

#our-partners {
  background: var(--lt-gray);
  padding: 9em 0 10.625em;
  position: relative;
}

#our-partners h2 {
  position: absolute;
  top: 2.5em;
}

#our-partners #partner-callouts {width:100%; position:relative; overflow:hidden}
#our-partners #partner-callouts .slide-inner,
#our-partners #partner-callouts .slide-bg,
#our-partners #partner-callouts .slick-slide,
#our-partners #partner-callouts .slick-list,
#our-partners #partner-callouts .slick-track {max-height: none}
#our-partners #partner-callouts .slick-track .callout {float:left; margin: 0 1em}
#our-partners #partner-callouts .slick-arrow {position:absolute; font-size: 3em; font-weight:400; color:var(--blue); text-align:center; width:3rem; padding:0; z-index: 1; top: 0; height: 100%; background-color:var(--lt-gray)}
#our-partners #partner-callouts .slick-arrow:hover {color:var(--yellow);}
#our-partners #partner-callouts .slick-arrow.slick-prev {left:0}
  #our-partners #partner-callouts .slick-arrow.slick-prev:before {content:"\2039"}
#our-partners #partner-callouts .slick-arrow.slick-next {right:0;}
  #our-partners #partner-callouts .slick-arrow.slick-next:before {content:"\203A"}
  #our-partners #partner-callouts .slick-arrow.slick-next:before, #our-partners #partner-callouts .slick-arrow.slick-prev:before{background: #fff;
  border-radius: 50%;
  width: 1em;
  height: 1em;
  line-height: 1;}

#our-partners .callout {
  margin: 0 0 .625em;
  position: relative;
  max-width: 24em;
  width: 32%;
  z-index: 1;
}

#our-partners .callout-inner {
  background: var(--blue);
  -webkit-box-shadow: 0 0 0 0.125em transparent;
  box-shadow: 0 0 0 0.125em transparent;
  position: relative;
  overflow: hidden;
  -webkit-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

#our-partners .callout-image {
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
  z-index: 0;
}

#our-partners .callout-inner::before {
  content: '';
  display: block;
  padding: 0 0 100%;
}

#our-partners .callout h2 {
  color: var(--gray);
  font-size: 1.5em;
  margin: .875em 0 0;
  position: static;
  text-align: center;
}

#our-partners .callout a:hover .callout-image {
  -webkit-transform: scale(.97, .97);
  -ms-transform: scale(.97, .97);
  transform: scale(.97, .97);
}

#our-partners .callout a:hover h2 {
  color: var(--blue);
}

#our-partners .button {
  background: #FFF;
  border: .125em solid var(--yellow);
  bottom: 4.75em;
  color: var(--blue);
  font-size: 1em;
  left: 50%;
  padding: .25em 1em 0;
  position: absolute;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

#our-partners .button:hover {
  background: var(--gray);
  border-color: var(--gray);
  color: #FFF;
}




/* WELCOME  ------------------------------ */

#welcome {
  background-color: var(--blue);
  border-top: 2px solid #FFF;
}

#welcome.gray {
  background-color: var(--lt-gray);
}

#welcome .flex-row {
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  max-width: none;
  padding: 0;
  position: relative;
}

#welcome .column {
  width: 50%;
}

#welcome .column:first-of-type {
  border-right: 1px solid #FFF;
  background-repeat: no-repeat;
  background-position: center 85px;
  -webkit-background-size: 95% 95%;
  background-size: 95% 95%;
  padding: 0;
  position: relative;
}

#welcome .column:last-of-type {
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  border-left: 1px solid #FFF;
}

#welcome .column:last-of-type::after {
  content: '';
  display: block;
  padding: 0 0 78.68%;
}

#welcome .textbox {
  padding: 0 7vw;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

#welcome h1 {
  color: #FFF;
  font-size: 1.675em;
  line-height: 1.5;
  text-transform: none;
}

#welcome.gray h1 {
  color: var(--gray);
}

#welcome h1 > span {
  display: block;
  margin: 0 0 .5em;
  font-size: 2.4rem;
  text-transform: uppercase;
}

#welcome.interior h1 {
  font-size: 1.5em;
  text-transform: uppercase;
}

#welcome p {
  color: #FFF;
  font-size: 1.0625em;
  margin: 0 0 1.75em;
}

#welcome.gray p {
  color: var(--gray);
}




/* STAY CONNECTED  ------------------------------ */

#stay-connected {
  padding: 9em 0 4em;
  position: relative;
}

#stay-connected .flex-row > h2 {
  position: absolute;
  top: 2.5em;
}

#stay-connected .column {
  margin: 2em 0 0;
  text-align: center;
  width: 32%;
}

#stay-connected h3 {
  color: var(--gray);
  font-size: 1.375em;
  margin: .875em 0 .75em;
}

#stay-connected h3 > span {
  color: var(--blue);
  text-transform: uppercase;
}

#stay-connected h3::after {
  background: #D8D8D8;
  content: '';
  display: block;
  height: .25rem;
  margin: .675em auto 0;
  -webkit-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
  width: 1.5625em;
}

#stay-connected p {
  font-size: 1.0625em;
  color: rgba(111,111,111,.8)
}

#stay-connected a {
  display: block;
}

#stay-connected a svg, #stay-connected a img {
  height: 12vw;
  max-height: 11em;
  width: auto;
}

#stay-connected a:hover h3::after,
#stay-connected a:hover + h3::after {
  background: var(--yellow);
  width: 3em;
}

#stay-connected a:hover p,
#stay-connected a:hover ~ p {
  color: var(--blue);
}




/* OUR IDEAS ------------------------------ */

#our-ideas {
  background: var(--lt-gray);
  padding: 9em 0 4em;
  position: relative;
}

#our-ideas .flex-row {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  position: relative;
}

#our-ideas.case-studies .flex-row {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
}

#our-ideas h2 {
  position: absolute;
  top: -2.25em;
}

#our-ideas .button-alt {
  height: 2.5rem;
  padding: .25em 1.5em .125em;
  position: absolute;
  top: -5rem;
  right: 1.5em;
}

#our-ideas .callout {
  margin: 0 0 .625em;
  max-width: 24em;
  position: relative;
  width: 32%;
  z-index: 1;
}

#our-ideas .callout-inner {
  background: var(--blue);
  margin: 0 0 1em;
  position: relative;
  overflow: hidden;
  -webkit-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

#our-ideas .callout-image {
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
  z-index: 0;
}

#our-ideas .callout-inner::before {
  content: '';
  display: block;
  padding: 0 0 73.89%;
}

#our-ideas p {
  font-size: 1.0625em;
}

#our-ideas p > span {
  color: var(--blue);
  text-transform: uppercase;
}

#our-ideas .callout a:hover .callout-image {
  -webkit-transform: scale(.97, .97);
  -ms-transform: scale(.97, .97);
  transform: scale(.97, .96);
}

#our-ideas .callout a:hover p,
#our-ideas .callout a:hover p > span {
  color: var(--blue);
}




/* RESOURCES ------------------------------ */

#resources {
  border-top: 2px solid #FFF;
  position: relative;
}

#resources .button-alt {
  display: inline-flex;
  height: 2.5em;
  position: absolute;
  padding: .25em 1.5em .125em;
  right: 0;
  top: 0;
  z-index: 1;
}

#resources .flex-row {
  align-items: stretch;
  max-width: none;
  padding: 0;
  position: relative;
}

#resources .column {
  position: relative;
  width: 50%;
}

#resources .column:first-of-type {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 0;
  position: relative;
}

#resources .column:first-of-type::after {
  content: '';
  display: block;
  padding: 0 0 78.68%;
}

#resources .textbox {
  padding: 0 7vw;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 100%;
}

#resources .resource {
  border-bottom: 2px dashed #D8D8D8;
  margin: 0 0 .875em;
  padding: 0 0 1em;
}

#resources .resource:last-of-type {
  border: 0;
  margin: 0;
  padding: 0;
}

#resources a {
  display: block;
}

#resources date {
  color: var(--gray);
  font-size: .85em;
}

#resources h3 {
  color: var(--blue);
  font-size: 1.0625em;
  line-height: 1.5;
  margin: 0 0 0;
}

#resources h3 > a {
  color: var(--blue);
}

#resources a:hover h3, #resources a:hover date {
  color: var(--yellow);
}




/* INTERIOR HEADER ------------------------------ */

#interior-header {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  border-bottom: 2px solid var(--yellow);
  -webkit-box-shadow: inset 0 -2px 0 0 #FFF;
  box-shadow: inset 0 -2px 0 0 #FFF;
  clear: both;
  height: 16.875em;
}



/* INTERIOR HERO ------------------------------ */

#interior-hero {
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  clear: both;
  max-height: 40em;
  position: relative;
}

#interior-hero::before {
  content: '';
  display: block;
  padding: 0 0 35.71%;
}

#interior-hero .textbox {
  position: absolute;
  right: 5.5%;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 28.75rem;
}

#interior-hero .textbox p {
  color: #FFF;
  font-size: 1.75em;
  line-height: 1.5;
  margin: 0;
  text-shadow: 0 2px 9px rgba(0,0,0,.5);
}

#interior-hero .textbox p > span {
  color: var(--yellow);
  font-size: 1.0625em;
  letter-spacing: 2px;
}

#interior-hero .textbox p > span.linebreak {
  display: block;
}

/* LANDING PAGE INTRO ------------------------------ */

:is(#landing-intro, .landing-intro) {
  padding: 4em 1.5em 5em;
  text-align: center;
}

:is(#landing-intro, .landing-intro).our-partners {
  padding: 4em 1.5em 3em;
}

:is(#landing-intro, .landing-intro) .heading {
  font-size: 1.675em;
}

:is(#landing-intro, .landing-intro) .textbox {
  margin: 0 auto;
  max-width: 36em;
  width: 100%;
}

.landing-intro h1 {
  margin: 0 0 1em;
}

#landing-intro h1 {
  margin: 0;
}

#landing-intro h1 span.underlined::after {
  margin: .25rem auto .375rem;
}

#landing-intro i.subheading {
  color: var(--gray);
  display: block;
  margin: 0 0 .75em;
}

:is(#landing-intro, .landing-intro) p {
  margin: 0 0 2em;
}

:is(#landing-intro, .landing-intro) .button {
  background: #FFF;
  border: .125em solid var(--yellow);
  color: var(--blue);
  font-size: 1em;
  margin: .5em .25em 0;
  padding: .25em 1em 0;
}

:is(#landing-intro, .landing-intro) .button:hover {
  background: var(--gray);
  border-color: var(--gray);
  color: #FFF;
}

/* SPLIT SECTIONS ------------------------------ */

.split-section .flex-row {
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  border-bottom: 2px solid #FFF;
  max-width: none;
  padding: 0;
}

main .split-section:last-of-type .flex-row {
  border-bottom: 0;
}

.split-section .split-image {
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  width: 71.4%;
}

.equal-split .split-image {
  width: 50%;
  background-size: cover;
}

.split-section .split-image::before {
  content: '';
  display: block;
  padding: 0 0 50%;
}

.split-section .textbox {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  background: var(--lt-gray);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0.7em 3.5em 0 4em;
  width: 28.6%;
}

.equal-split .textbox {
  width: 50%;
}

.equal-split.blue-bg :is(h2, h3, p) {
  color: #FFF;
}

.equal-split.blue-bg :is(h2, p).yellow {
  color: var(--yellow);
}

main .split-section:nth-of-type(even) .textbox {
  background: #FFF;
}

main.report-2024 .split-section:nth-of-type(even) .textbox {
  background: var(--lt-gray);
}

.split-section .textbox {
  border-left: 2px solid #FFF;
}
.annual-report .split-section .flex-row:nth-child(odd) .textbox {
  border-left: 0;
}
main.report-2024 .split-section:nth-of-type(even).blue-bg .textbox {
  background: #0080C3;
}

.split-section .textbox h2 {
  font-size: 1.5em;
}

.split-section .textbox h2.blue {
  color: var(--blue);
}

.split-section .textbox p {
  font-size: 1.125em;
  margin: 0 0 1.5em;
  max-width: 100%;
}

/* VOICES ------------------------------ */

#voices { padding: 5em 0; position: relative;}

.annual-report-download + #voices {
  background: var(--lt-gray);
}

#voices .column, #voices .textbox { width: 50%; }

#voices .column {
  display: flex;
  justify-content: space-between;
}

#voices .column img { width: -webkit-calc(50% - .375em); width: calc(50% - .375em); height: 100%;}
#voices .textbox { padding: 0 4.125vw; }
#voices h2 { margin: 0 0 1.675em; }

#voices .underlined::after {
  -webkit-transition-delay: 1.15s;
  -o-transition-delay: 1.15s;
  transition-delay: 1.15s;
}

/* CASE STUDIES LANDING PAGES ------------------------------ */

#case-study {
  padding: 3.5rem 1.5rem 3rem;
  position: relative;
  z-index: 1;
}

#case-study .flex-row {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

#case-study .column:first-of-type {
  padding: 0 1.5rem 0 0;
  width: 47%;
}

#case-study .column:last-of-type {
  height: 30rem;
  width: 53%;
}

#case-study .flex-wrap {
  align-items: flex-end;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

#case-study span.partner {
  color: var(--blue);
  font-size: .875rem;
  text-transform: uppercase;
}

#case-study select {
  background-color: #EFEFEF;
  border: 0;
  display: block;
  font-size: .8125rem;
  margin: .25rem 0 0;
  max-width: 100%;
  width: 18.5em;
}

#case-study .button-alt {
  height: 2.25em;
  padding: .25em 1.5em .125rem;
  position: relative;
  right: 0;
  z-index: 3;
}

#case-study h2 {
  font-size: 2rem;
  margin-top: 2.5rem;
  padding: 0 0 .25rem 0;
  text-transform: uppercase;
}

#case-study h2 + h3 {
  color: var(--gray);
  font-size: 1rem;
  font-weight: 400;
  margin: 0 0 2rem;
}

#case-study p {
  max-width: 100%;
  width: 26rem;
}

#case-study .underlined::after {
  margin-top: .75rem;
}

#case-study h2 + h3 > a {
  color: var(--blue);
  font-weight: 700;
}

#case-study h2 + h3 > a:hover {
  color: var(--yellow);
}

#case-study .profile-pic {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  box-shadow: inset 0 0 0 20px #FFF;
  max-width: 40rem;
  position: relative;
  top: .5rem;
  width: 45vw;
}

#case-study .profile-pic::after {
  content: '';
  display: block;
  padding: 0 0 73.84%;
}

#quote {
  background: var(--blue);
  padding: 8rem 0 6rem;
  position: relative;
  margin-top: -8.75rem;
  z-index: 0;
  padding: 9vw 0 6.75vw;
}

#quote p {
  border-left: 5px solid var(--yellow);
  color: #FFF;
  font-size: 1.25em;
  max-width: 50rem;
  padding: 0 0 0 1.25rem;
}

#detail {
  padding: 5rem 1.5rem;
}

#detail .wrapper {
  margin: 0 auto;
  max-width: 100%;
  width: 49em;
}

#detail .video-container {
  margin: 2rem 0;
}

#detail p {
  line-height: 1.85;
}

/* VIDEO POP UP ------------------------------ */

#video {
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99;
  background: rgba(0,0,0,.95);
}

#video .center {
  width: 100%;
  max-width: 62.5em;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
}

#video .close {
  position: absolute;
  cursor: pointer;
  top: -2em;
  right: -.5em;
  width: 2em;
  line-height: 2em;
  text-align: center;
  font-weight: 600;
  -webkit-transition: ease all 200ms;
  transition: ease all 200ms;
  font-size: 3em;
}

#video .center .videoWrapper {
  position: relative;
  -webkit-box-shadow: 0 0 6.25em 0 rgba(0,0,0,.5);
  box-shadow: 0 0 6.25em 0 rgba(0,0,0,.5);
  overflow: auto;
}

.videoContainer {
  width: 100%;
  height: 0;
  line-height: 0;
  position: relative;
  padding-top: 56.25%;
}

.videoContainer iframe {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  border: 0;
}


/* RESOURCES ------------------------------ */
#resources-page {
  font-size: 1rem;
}

#resources-page .wrap {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
  max-width: 87.5em;
}

#resources-page #content {
  margin: 0 auto;
  order: 2;
}


/* Key */
#resources-page #key h2 {
  background: var(--blue);
  color: #FFF;
  font-size: 1em;
  line-height: 1.3;
  margin: 0;
  padding: .625em 1em;
  position: relative;
}

#resources-page #key ul {
  border: .0625rem solid #ECECEC;
  display: flex;
  justify-content: center;
  margin: 0;
  max-width: 100%;
  padding: 1em 1em 0;
}

#resources-page #key li {
  color: #525154;
  font-size: .875em;
  margin: 0 0 1em;
  padding: 0 1.5em;
  text-align: center;
  width: 20%;
}

#resources-page #key svg {
  display: block;
  height: 1.5em;
  margin: 0 auto .625em;
  width: auto;
}

#resources-page #key li svg.publication path { fill: var(--yellow); }
#resources-page #key li svg.tool path { fill: #FF6F18; }
#resources-page #key li svg.thought-paper path { fill: #A810AB; }
#resources-page #key li svg.evaluation path { fill: #D61B13; }
#resources-page #key li svg.infographic path { fill: #29D3C4; }


/* Views toggle */
#resources-page #views {
  align-items: center;
  display: flex;
  font-size: .875rem;
  justify-content: flex-end;
  margin: 0 0 1.375em;
  text-align: right;
}

#resources-page #views span { display: inline-block; margin: 0 .25em 0 0; }

#resources-page #views button {
  background-color: var(--lt-gray);
  border-radius: .125rem;
  height: 2.5em;
  margin: 0 0 0 .4375rem;
  position: relative;
  width: 2.5em;
}

#resources-page #views button.active {
  background: var(--blue);
  pointer-events: none;
}

#resources-page #views svg {
  height: 1.25em;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%,-50%);
  width: auto;
}

#resources-page #views path { fill: var(--gray); }
#resources-page #views .active path { fill: #FFF; }


/* Results */
#metrics figcaption {
  margin-top: 1em;
}

#resources-page #results li {
  margin: 0 0 1em;
  position: relative;
  z-index: 0;
}

#resources-page #results li.no-results {
  margin: 0;
  text-align: center;
  width: 100% !important;
}

#resources-page #results li>a {
  display: block;
  padding: 2em 3em 4em 1em;
  z-index: 0;
}

#resources-page #results .image {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  margin: 0 1em 1em 0;
}

#resources-page #results .image::before {
  content: '';
  display: block;
  padding: 0 0 100%
}

#resources-page #results li>a * { transition: none; }

#resources-page #results li p {color: var(--gray); }
#resources-page #results li .intro {font-size: 1em;line-height: 1.375;margin: 0 0 .5rem;}

#resources-page #results li::after {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: auto 1.5em;
  content: '';
  height: 3.125em;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 3.125em;
  z-index: 0;
}

#resources-page #results li.publication::after {
  background-color: var(--yellow);
  background-image: url('/images/resources/publication.svg');
}

#resources-page #results li.tool::after {
  background-color: #FF6F18;
  background-image: url('/images/resources/tool.svg');
}

#resources-page #results li.thought-paper::after {
  background-color: #A810AB;
  background-image: url('/images/resources/thought-paper.svg');
}

#resources-page #results li.evaluation::after {
  background-color: #D61B13;
  background-image: url('/images/resources/evaluation.svg');
}

#resources-page #results li.infographic::after {
  background-color: #29D3C4;
  background-image: url('/images/resources/infographic.svg');
}

#resources-page #results button {
  background: #FFF;
  border: 0;
  box-shadow: inset 0 0 0 .125rem #FFB808;
  color: var(--blue);
  display: flex;
  margin: 2em auto;
}

#resources-page #results button:hover {
  background: var(--blue);
  box-shadow: inset 0 0 0 .125rem var(--blue);
  color: #FFF;
}


#resources-page #results li>a::after,
#resources-page #results li>a::before {
  background: var(--lt-gray);
  content: '';
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

#resources-page #results li>a::after {
  opacity: 0;
}

#resources-page #results.list-view li:nth-child(even) a::before {background: rgba(240,239,244,.5); }

#resources-page #results li.publication a::after {
  background-color: var(--yellow);
}

#resources-page #results li.tool a::after {
  background-color: #FF6F18;
}

#resources-page #results li.thought-paper a::after {
  background-color: #A810AB;
}

#resources-page #results li.evaluation a::after {
  background-color: #D61B13;
}

#resources-page #results li.infographic a::after {
  background-color: #29D3C4;
}

#resources-page #results li>a:hover::after, #resources-page #results li>a:focus::after { opacity: .15; }


/* Results - List View */
#resources-page #results.list-view li a {
  align-items: flex-start;
  display: flex;
  padding: 1.25em 4.5625em 1.25em 1.25em;
}

#resources-page #results.list-view .image {min-width: 11.25em;width: 11.25em;}
#resources-page #results.list-view .description { max-width: 28em; }

/* Results - Grid View */
#resources-page #results.grid-view ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#resources-page #results.grid-view li {
  width: calc(50% - .5em);
}

#resources-page #results.grid-view li::after { bottom:0; top: auto; }

#resources-page #results.grid-view .image {
  float: left;
  width: 6.25em;
}

#resources-page #results.grid-view li p:not(.intro) { clear: both; }

/* Filters */
#resources-page #desktop-filters {
  min-width: 16.875em;
  order: 1;
  width: 16.875em;
}

#resources-page fieldset {
  background: var(--lt-gray);
  border: 0;
  outline: 0;
  padding: 1.5em 1.125em;
}

#resources-page #filters-form label {
  display: block;
  font-size: .875rem;
  position: relative;
}

#resources-page #filters-form strong {
  color: var(--blue);
  display: block;
  font-size: 1rem;
  text-transform: uppercase;
}

#resources-page #filters-form input[type="text"] {
  border: 0;
  height: auto;
  margin: .25em 0 .25em;
  padding: .875em .75em;
}

#resources-page #filters-form input[type="submit"] {
  background: transparent url('/images/resources/angle-right.svg') no-repeat center center / .75em auto;
  height: auto;
  padding: .875em 1em;
  position: absolute;
  right: 0;
}

#resources-page #filters-form button {
  background: 0 0;
  color: var(--blue);
  font-size: 1rem;
  margin: 1.25em 0 0;
  padding: .5em 0;
  position: relative;
  text-align: left;
  text-transform: uppercase;
  width: 100%;
}

#resources-page #filters-form button::before,
#resources-page #filters-form button::after {
  background: url('/images/resources/minus.svg') no-repeat right center / .875em auto;
  content: '';
  height: .875em;
  pointer-events: none;
  position: absolute;
  right: .4375em;
  top: .625em;
  transform-origin: 50% 50%;
  width: .875em;
}

#resources-page #filters-form button.closed::after {
  transform: rotate(90deg);
}


/* FLOATING CTA ------------------------------ */
#floating-cta {
  position: fixed;
  right: 0;
  z-index: 15;
}

#floating-cta .image {
  line-height: 0;
}

#floating-cta .image img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

#floating-cta strong {
  background: #FFB818;
  color: #0080C3;
  display: block;
  font-size: 1.125em;
  line-height: 1.11;
  padding: .75em 1em;
}

#floating-cta button {
  background: #0080C3;
  color: #FFB818;
  display: block;
  height: 1.5rem;
  font-size: 1.75em;
  line-height: 0.95;
  padding: 0;
  width: 1.5rem;
}




/* CTOP REPORT - SHARED ---------------------------- */
.table-wrap {
	margin-inline: calc(-1 * var(--ws-gap));
  padding-top: 1.5em;
  position: relative;
}

.table-wrap:where(.scroll-left, .scroll-right) .table-responsive {
  cursor: grab;
}

.table-wrap::before,
.table-wrap::after {
  color: #666;
  opacity: 0;
  position: absolute;
  top: 0;
  transition: all .3s ease;
}

.table-wrap::before {
  content: '\2039\00A0scroll';
}

.table-wrap::after {
  content: 'scroll\00A0\203A';
}

.table-wrap .scroll {
  position: relative;
}

.table-wrap .scroll::before,
.table-wrap .scroll::after {
  bottom: 0;
  content: '';
  height: 100%;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  transition: all .3s ease;
  width: 3em;
  z-index: 1;
}

.table-wrap .scroll::before {
  background: linear-gradient(90deg,rgba(0,0,0,.3) 0%, rgba(255,255,255,0) 100%);
  left: 0;
}

.table-wrap .scroll::after {
  background: linear-gradient(90deg,rgba(255,255,255,0) 0%, rgba(0,0,0,.3) 100%);
  right: 0;
}

.table-wrap.scroll-left::before,
.table-wrap.scroll-right::after,
.table-wrap.scroll-left .scroll::before,
.table-wrap.scroll-right .scroll::after {
  opacity: 1;
}

.table-responsive {
  border: 0;
  overflow-x: auto;
  position: relative;
  width: 100%;
  z-index: 0;
}

.table-wrap::before {
	left: var(--ws-gap);
}

.table-wrap::after {
	right: var(--ws-gap);
}

.table-wrap .container {
	margin-inline: var(--ws-gap);
  min-width: 42rem;	/* CHANGE HERE AS NEEDED */
  position: relative;
}




/* CTOP REPORT - SHARED ---------------------------- */
.ws-flex {
  --ws-gap: clamp(1.5em, 0.786em + 3.17vw, 3.563em);
  display: flex;
  flex-wrap: wrap;
  gap: var(--ws-gap);
}

.ws-flex>:is(li, article) {
  width: calc( 99.99% / var(--ws-column-count) - ( var(--ws-gap) * ( var(--ws-column-count) - 1 ) / var(--ws-column-count) ) );
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}



/* CTOP REPORT - SPLIT INTRO (RIBBON 2) ---------------------------- */
:is(#landing-intro, .landing-intro).annual-reports.ctop .wrap {
	max-width: 59.6875em;
}

.ctop .split-intro .si-right {
  position: relative;
}

.ctop .split-intro .si-right .overlay-link {
  background: rgba(255,255,255,.9);
  border: .25em solid #FFF;
  left: 0;
  font-size: clamp(1em, 0.913em + 0.38vw, 1.25em);
  padding-block: .25em;
  position: absolute;
  top: calc(50% - 2em);
  transform: translateY(-50%);
  width: 100%;
}

.ctop .split-intro .si-right .overlay-link a {
  background: url('/images/icons/chevron-right.svg') no-repeat right center / .4375em auto;
  color: var(--blue);
  display: inline;
  padding-right: .75em;
}

:is(#landing-intro, .landing-intro).ctop .split-intro .button {
  height: auto;
  margin: 0;
  text-align: center;
  padding: .5em 1em
}



/* CTOP REPORT - CONTINUUM (RIBBON 3)---------------------------- */

.continuum {
  background: var(--lt-gray);
  --ws-gap: 1.5rem;
  padding-block: clamp(3em, 2.308em + 3.08vw, 5em);
}

.continuum .wrap {
  margin-inline: auto;
  max-width: 77em;
  overflow: visible;
  padding-inline: 1.5rem;
}

.continuum h2 {
  text-align: center;
}

.continuum img {
  margin-block: 2em;
  max-width: 100%;
}

.continuum .ws-flex {
  --ws-column-count: 3
}

.continuum .ws-flex>li a {
  background: url('/images/icons/chevron-right.svg') no-repeat right center / .5625em auto;
  color: var(--blue);
  font-weight: 700;
  padding-right: .75em;
  white-space: nowrap;
}

.continuum h3 {
  color: var(--gray);
  text-align: center;
}

.continuum p {
  font-size: 1.125em;
}

.continuum .popover {
  background: #FFF;
  box-shadow: 0 1px 1px rgba(0,0,0,.035), 0 2px 2px rgba(0,0,0,.035), 0 4px 4px rgba(0,0,0,.035), 0 8px 8px rgba(0,0,0,.035), 0 16px 16px rgba(0,0,0,.035);
  left: 50%;
  max-width: calc(100% - 3em);
  opacity: 0;
  padding: 2em;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate(-50%,-50%);
  visibility: hidden;
}

.continuum .popover.show {
  opacity: 1;
  pointer-events: all;
  visibility: visible;
}

.continuum .popover button {
  background: var(--blue) url('/images/icons/xmark.svg') no-repeat center / 1.0625em auto;
  border-radius: 50%;
  height: 2em;
  padding: 0;
  position: absolute;
  right: .5em;
  top: .5em;
  width: 2em;
}



/* CTOP REPORT - BLUE SECTION (RIBBON 4) ---------------------------- */

.ctop-blue {
  background: var(--blue);
  padding-block: clamp(3em, 2.308em + 3.08vw, 5em);
}

.ctop-blue .wrap {
  max-width: 71.43em;
  padding-inline: 1.5em;
}


.ctop-blue img {
  display: block;
  height: 6.5em;
  margin: 0 auto 2em;
  object-fit: contain;
}

.ctop-blue p {
  color: #FFF;
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em)
}



/* CTOP REPORT - CHART SECTION (RIBBON 5) ---------------------------- */

.ctop-chart {
  padding-block: clamp(3em, 2.308em + 3.08vw, 5em);
  text-align: center;
}

.ctop-chart .wrap {
  padding-inline: 1.5em;
}

.ctop-chart .textbox {
  margin: 0 auto 3em;
  max-width: 40.625em;
}

.ctop-chart h2 {
  margin: 0 0 1em;
}

.ctop-chart p {
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
}

.ctop-chart img {
  display: inline-block;
  height: auto;
  max-width: 100%;
}



/* CTOP REPORT - FISCAL IMPACT (RIBBON 6) ---------------------------- */

.landing-intro.fiscal-impact {
  background: var(--blue);
}

.landing-intro.fiscal-impact :is(h2>span, p) {
  color: #FFF;
}



/* CTOP REPORT - TEXT IMAGE (RIBBONS 7-8) ---------------------------- */

.text-image {
  overflow: hidden;
}

.text-image.reverse {
  background: var(--dk-blue);
}

.text-image .wrap {
  margin: 0 auto;
  max-width: 75em;
  padding-inline: clamp(1.5em, -0.231em + 3.69vw, 3em); /* 750 - 1400 */
}

.text-image .image {
  background: no-repeat center / cover;
}

.text-image .textbox {
  padding-block: clamp(3em, 2.308em + 3.08vw, 5em);
}

.text-image h2 {
  font-size: clamp(1.5em, 1.37em + 0.58vw, 1.875em);
  text-transform: uppercase;
}

.text-image :is(p, li) {
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
}

.text-image li {
  margin: 0 0 .75em;
  padding-left: 1.5em;
  position: relative;
}

.text-image li::before {
  background: var(--blue);
  border-radius: 50%;
  content: '';
  height: .375em;
  left: .6875em;
  position: absolute;
  top: .5em;
  width: .375em;
}

.text-image li ul {
  columns: 2;
  margin: .75em 0 0;
}

.text-image li li {
  break-inside: avoid-column;
  margin: 0 0 .5em;
  font-size: 1em;
}

.text-image li li::before {
  background: var(--yellow);
  height: .3125em;
  width: .3125em;
}

.text-image.reverse :is(h2, p) {
  color: #FFF;
}

.text-image .button {
  height: auto;
  line-height: 1.1;
  margin: .1875em .1875em .1875em 0;
  padding: .869em 1.5em;
  text-align: center;
}

.text-image p>.button {
  font-size: .9em;
}

.text-image .button:nth-of-type(even):not(:is(:hover,:focus)) {
  background: #FFF;
  color: var(--blue);
}




/* CTOP REPORT - TEXT COLUMNS (RIBBONS 9) ---------------------------- */

.text-columns {
  padding-block: clamp(3em, 2.308em + 3.08vw, 5em);
}

.text-columns .wrap {
  padding-inline: 1.5em;
}

.text-columns img {
  display: block;
  height: 6.25em;
  margin: 0 auto 1em;
  object-fit: contain;
}

.text-columns h2 {
  color: var(--blue);
  font-size: clamp(1.438em, 1.416em + 0.1vw, 1.5em);
}

.text-columns h2>span {
  color: var(--gray);
  display: block;
  font-size: .833em;
  font-weight: 400;
}

.text-columns p {
  font-size: clamp(1.063em, 1.041em + 0.1vw, 1.125em);
}

/* CTOP REPORT - REPORT COlUMNS -------------------------------- */

.reports-columns {
  background-color: var(--lt-gray);
  text-align: center;
}

.report-2024 .reports-columns {
  background-color: #FFF;
}

.reports-columns h2 {
  font-size: clamp(1.25rem, 0.5288rem + 1.5385vw, 1.875rem);
  font-weight: 500;
  color: var(--gray);
}

.reports-columns img {
  /*aspect-ratio: 730 / 950;*/
  border: 1px solid var(--lt-gray);
  line-height: 0;
  max-width: 12.99rem;
  max-height: 16.75rem;
  margin-bottom: 1.25rem;
  margin-top: 1rem;
}

.reports-columns h3 {
  color: var(--blue);
  font-size: 1.25rem;
  font-weight: 400;
  margin-bottom: 1.8125rem;
  padding-bottom: 3rem;
    position: relative;
}

.reports-columns .textbox {
  max-width: 17.5625rem;
}

.reports-columns .button {
  position: absolute;
    bottom: 0;
    right: 50%;
    transform: translateX(50%);
}

.elevating-voices .reports-columns :is(h1, h2)::after {
  display: none;
}

/* CTOP REPORT - YEAR AHEAD --------------------------- */
.year-ahead p, .reports-columns .research-brief {
  max-width: 57.3125rem;
  margin: 0 auto;
}
.year-ahead h3{
  padding: 0;
  color: var(--gray);
  font-weight: 700;
}
.year-ahead article p {
  text-align: left;
}
.year-ahead article {
  margin-top: 1.5rem;
}

.financial-2024 img {
  width: 100%;
  padding: 0 1.5rem;
}

/* RECOMMENDATIONS FOR BUILDING CONNECTION --------- */
.build-connect {
	background-color: var(--lt-gray);
	text-align: center;
}
.build-connect .wrap {
  width: 100%;
    max-width: 77.375rem;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: auto;
}
.build-connect p {
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
  line-height: 1.6;
}
.build-connect h3 {
	position: relative;
	background-color: #FFF;
	width: 16.875rem;
	height: 8.9375rem;
	padding: 5rem 0.5rem 0;
  color: var(--blue);
  border: 2px solid #E3E3E5;
}
.build-connect h3::before {
  content: "";
  position: absolute;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  top: 2rem;
  transform: translateX(-50%);
  left: 50%;
}
.build-connect h3.education::before {
  background-image: url(/images/icons/book-open-cover-solid.svg);
  width: 2.5rem;
  height: 2rem;
}
.build-connect h3.criminal-justice::before {
  background-image: url(/images/icons/scale-balanced-solid.svg);
  width: 3.125rem;
  height: 2.5rem;
}
.build-connect h3.child-welfare::before {
  background-image: url(/images/icons/children-solid.svg);
  width: 3.0625rem;
  height: 2.5rem;
}
.build-connect h3.housing::before {
  background-image: url(/images/icons/house-sharp-solid.svg);
  width: 2.8125rem;
  height: 2.5rem;
}
.build-connect h3.health::before {
  background-image: url(/images/icons/stethoscope-solid.svg);
  width: 2.5rem;
  height: 2.375rem;
}
.build-connect ul li {
	margin: 0.75rem 0;
}
.build-connect ul li ul {
	margin: auto 0;
}
.build-connect ul li ul li {
	text-align: left;
	line-height: 1.625rem;
	display: flex;
	gap: 0.625rem;
  font-family: 'Farro', sans-serif;
  padding-left: 1.2em;
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
  position: relative;
}
.build-connect ul li ul li::before {
  aspect-ratio: 1;
  background: var(--blue);
  border-radius: 50%;
  content: '';
  left: .25em;
  position: absolute;
  top: .45em;
  width: .4375em;
}
.build-connect .underlined::after {
  margin: 5px auto 0;
}
.build-connect .underlined.animated::after {
  width: 60%;
}

/* CTOP REPORT POPUP ---------------------------- */

.modal {
  align-items: center;
  background-color: rgba(0,0,0,.6);
  display: flex;
  height: 100%;
  justify-content: center;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
}

.modal-content {
  background-color: #FFF;
  box-shadow: 0 0 25px 0 #000;
  left: 50%;
  max-height: calc(100% - 3em);
  max-width: calc(100% - 3em);
  position: absolute;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 46.625em;
}

.modal-content>div {
  overflow: auto;
}

.modal button.close {
  background: transparent;
  border: 0;
  color: var(--yellow);
  cursor: pointer;
  font-size: 3em;
  line-height: 1 !important;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: translate(0,-100%);
  transition: all .3s ease;
  width: auto;
}

.modal .image {
  background: no-repeat center / contain;
}

.modal .textbox {
  background: var(--blue);
}

.modal h2 {
  color: #FFF;
  margin: 0 0 .75em;
  text-transform: uppercase;
}

.modal p {
  color: #FFF;
  font-size: clamp(1em, 0.955em + 0.23vw, 1.125em);
  line-height: 1.55;
}

.modal .button {
  background: #FFF;
  border: 2px solid var(--yellow);
  color: var(--blue);
  padding: .125em 1.5em 0;
}




/* ###################################################### */
/* ############ NATIONAL LANDSCAPE SCAN PAGE ############ */
/* ###################################################### */

.landscape-scan {
  --ws-gap: 1.5em;
}


/* SPLIT CONTENT RIBBON ------------------------------ /
* - Ribbons 2, 3, & 6
*/

.split-content {
  background: #FFF;
  padding-block: clamp(2.5em, 1.773em + 3.64vw, 4.5em);
}

.split-content.gray {
  background: var(--lt-gray);
}

.split-content .wrap {
  margin-inline: auto;
  max-width: calc(73.875em + 2 * var(--ws-gap));
  padding-inline: var(--ws-gap);
}

.split-content .top {
  margin: 0 auto 2.5em;
  max-width: 52em;
  text-align: center;
}

.split-content .top :is(h1, h2) {
  color: var(--gray);
  display: table;
  font-size: clamp(1.5em, 1.364em + 0.68vw, 1.875em);
  margin: 0 auto;
  text-transform: uppercase;
}

.split-content .top :is(h1, h2)::after  {
  background: var(--yellow);
  content: '';
  display: block;
  height: .25rem;
  margin: .25em auto;
  text-align: center;
  width: calc(100% + .5rem);
}

main :is(div, section):nth-child(1 of .split-content) .top :is(h1, h2)::after,
main :is(div, section):nth-child(3 of .split-content) .top :is(h1, h2)::after {
  height: .125rem;
  width: 18.75rem;
}

.split-content i.subheading {
  color: var(--gray);
  display: block;
}

.split-content :is(.left, .right) :is(h2, h3) {
  font-size: clamp(1.25em, 1.182em + 0.34vw, 1.437em);
  margin: 0 0 .875em;
}

main :is(div, section):nth-child(2 of .split-content) .left :is(h2, h3) {
  text-align: center;
}

main :is(div, section):nth-child(2 of .split-content) .right :is(h2, h3) {
  margin: 0 0 1.25em;
  text-align: center;
}

.split-content p {
  color: var(--gray);
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
  line-height: 1.6;
}

.split-content ol {
  list-style-position: inside;
  padding: 0;
}

.split-content li {
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
  position: relative;
}

.split-content ul li {
  line-height: 1.6;
  margin: 0 0 .75em;
}

.split-content ol li {
  line-height: 1.3;
  margin: 0 0 1em;
}

.split-content li li {
  font-size: 1em;
}

.split-content ul>li {
  padding-left: 1.2em;
}

.split-content ul>li::before {
  aspect-ratio: 1;
  background: var(--blue);
  border-radius: 50%;
  content: '';
  left: .25em;
  position: absolute;
  top: .45em;
  width: .4375em;
}

.split-content ul>li>ul {
  margin: .5em 0 0;
}

.split-content ul>li>ul>li::before {
  background: var(--yellow);
  width: .3em;
}

.split-content .button {
  height: auto;
  line-height: 1.1;
  margin: 0.1875em 0.1875em 0.1875em 0;
  padding: 0.869em 1.5em;
  text-align: center;
}

.split-content p>.button {
  font-size: .9em;
}

.split-content img {
  display: block;
  height: auto;
  margin-inline: auto;
  max-width: 100%;
}


.split-content :is(.left, .right)>img {
  margin-bottom: 1.5em;
}

/* Right side headshots */
.split-content .headshots {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ws-gap);
}

.split-content .headshots figure {
  margin: 0;
  text-align: center;
  width: calc( 99.99% / var(--ws-column-count) - ( var(--ws-gap) * ( var(--ws-column-count) - 1 ) / var(--ws-column-count) ) );
}

.split-content .headshots figcaption {
  display: inline-block;
  font-size: 1.125em;
  margin: .625em 0 0;
}


/* Right side cards/number count-up */
.split-content ul.count-up {
  --ws-gap: 1em;
}

.split-content ul.count-up>li::before {
  display: none;
}

.split-content ul.count-up>li {
  background: #FFF;
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 1.3;
  padding: 1.3em .9em;
  text-align: center;
}

.split-content ul.count-up span.number {
  color: var(--blue);
  display: block;
  font-size: 2em;
  line-height: 1.1;
}

.split-content ul.count-up img {
  margin: 0 auto .625em;
  max-width: min(100%, 6.5rem);
}




/* QUOTE RIBBON ------------------------------ /
* - Ribbon 4
*/

.quote {
  background: var(--blue);
  padding-block: 3.5em;
}

.quote .wrap {
  margin-inline: auto;
  max-width: calc(57.25em + 5 * var(--ws-gap));
  padding-inline: calc(2.5 * var(--ws-gap));
}

.quote p {
  color: #FFF;
  font-size: clamp(1.25em, 1.068em + 0.91vw, 1.75em);
  line-height: 1.357;
  position: relative;
}

.quote p:first-of-type::before,
.quote p:last-of-type::after {
  aspect-ratio: 40.1 / 26.2;
  background: no-repeat center / contain;
  content: '';
  height: .9357em;
  position: absolute;
}

.quote p:first-of-type::before {
  background-image: url('/images/landscape-scan/quote-left.svg');
  transform: translateX(-1.75em);
}

.quote p:last-of-type::after {
  background-image: url('/images/landscape-scan/quote-right.svg');
  transform: translateX(.25em);
}

.quote p:last-of-type {
  margin: 0;
}

.quote blockquote {
  border: 0;
  margin: 0;
  padding: 0;
}




/* PROGRAMS RIBBON ------------------------------ /
* - Ribbon 5
*/

.programs {
  background: #00507A;
  padding-block: clamp(2.5em, 1.773em + 3.64vw, 4.5em);
}

.programs .wrap {
  margin-inline: auto;
  max-width: calc(73.875em + 2 * var(--ws-gap));
  padding-inline: var(--ws-gap);
}

.programs .top {
  margin: 0 auto 3em;
  max-width: 57.3125em;
  text-align: center;
}

.programs h2 {
  color: #FFF;
  display: table;
  font-size: clamp(1.5em, 1.364em + 0.68vw, 1.875em);
  margin: 0 auto;
  text-transform: uppercase;
}

.programs h2::after {
  background: var(--yellow);
  content: '';
  display: block;
  height: .25rem;
  margin: .25em auto 1.5em;
  text-align: center;
  width: calc(100% + .5rem);
}

.programs p {
  color: #FFF;
  font-size: clamp(1.0625em, 0.994em + 0.34vw, 1.25em);
  line-height: 1.6;
}

.programs h3 {
  color: var(--yellow);
  font-size: clamp(1.5em, 1.364em + 0.68vw, 1.875em);
  text-align: center;
}

.programs ul.ws-flex {
  --ws-gap: 1.25em;
  justify-content: center;
  row-gap: 3.75em;
  margin: 4em 0 3.5em;
}

.programs li {
  background: #FFF;
  color: var(--gray);
  display: flex;
  flex-direction: column;
  font-size: 1.0625em;
  padding: 4.375rem 1rem clamp(2em, 1.636em + 1.82vw, 3em);
  position: relative;
  text-align: center;
}

.programs li::before {
  aspect-ratio: 1;
  background: no-repeat center;
  border: 10px solid #FFF;
  border-radius: 50%;
  content: '';
  left: 50%;
  position: absolute;
  top: .7em;
  transform: translate(-50%,-50%);
  width: 6.25rem;
}

.programs li:nth-child(odd)::before { background-color: var(--yellow); }
.programs li:nth-child(even)::before { background-color: var(--blue); }

.programs li.job-prep::before { background-image: url('/images/landscape-scan/icons/job-prep.svg'); }
.programs li.mental-health::before { background-image: url('/images/landscape-scan/icons/mental-health.svg'); }
.programs li.case-management::before { background-image: url('/images/landscape-scan/icons/case-management.svg'); }
.programs li.ed-attainment::before { background-image: url('/images/landscape-scan/icons/ed-attainment.svg'); }
.programs li.relationships::before { background-image: url('/images/landscape-scan/icons/relationships.svg'); }
.programs li.training::before { background-image: url('/images/landscape-scan/icons/training.svg'); }
.programs li.connect::before { background-image: url('/images/landscape-scan/icons/connect.svg'); }
.programs li.flexibility::before { background-image: url('/images/landscape-scan/icons/flexibility.svg'); }
.programs li.case-loads::before { background-image: url('/images/landscape-scan/icons/case-loads.svg'); }
.programs li.transitional::before { background-image: url('/images/landscape-scan/icons/transitional.svg'); }
.programs li.partnerships::before { background-image: url('/images/landscape-scan/icons/partnerships.svg'); }
.programs li.job-support::before { background-image: url('/images/landscape-scan/icons/job-support.svg'); }
.programs li.mentoring::before { background-image: url('/images/landscape-scan/icons/mentoring.svg'); }
.programs li.cc-mental-health::before { background-image: url('/images/landscape-scan/icons/cc-mental-health.svg'); }


.programs li>strong {
  color: var(--blue);
  display: block;
  font-size: 1.176em;
  line-height: 1.3;
  margin: 0 0 .75em;
}

.programs li>span {
  display: block;
  margin-top: auto;
}


/* ###################################################### */
/* ###################################################### */



/* CONTINUUM GRAPHIC RIBBON ------------------------------ /
* - Research Agenda - ribbon 1
*/

.continuum-graphic {
  background: var(--lt-gray);
  padding-block: clamp(2.5em, 2.045em + 2.27vw, 3.75em) clamp(2.5em, 2.318em + 0.91vw, 3em);
}

.continuum-graphic .wrap {
  margin-inline: auto;
  max-width: max(87.2%, 76.3125em);
  padding-inline: 1.5em;
}

.continuum-graphic img {
  display: block;
  margin: 0 auto;
  max-width: 125em;
  width: 100%;
}




/* REPORTS RIBBON ------------------------------ /
* - Research Agenda - ribbon 2
*/

.reports {
  padding-block: clamp(3em, 2.364em + 3.18vw, 4.75em) clamp(2.5em, 1.045em + 7.27vw, 6.5em);
  text-align: center;
}

.reports .ws-flex {
  justify-content: center;
  --ws-gap: 1.125em;
}

.reports .wrap {
  margin-inline: auto;
  max-width: 76.875em;
  padding-inline: 1.5em;
}

.reports h1 {
  margin: 0 0 clamp(1.5em, 0.955em + 2.73vw, 3em);
}

.reports h1>span::after {
  margin: .25em auto 0;
  max-width: 19.1875rem;
}

.reports article,
.reports article>a {
  display: flex;
  flex-direction: column;
}

.reports .image {
  aspect-ratio: 730 / 950;
  border: 1px solid var(--lt-gray);
  line-height: 0;
}

.reports .image img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.reports .textbox {
  align-items: center;
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  padding: 1.625em 1.25em 2em;
}

.reports h2 {
  color: var(--blue);
  font-size: clamp(1.25em, 1.159em + 0.45vw, 1.5em);
  line-height: 1.083;
  margin: 0 0 1em;
}

.reports p {
  color: var(--gray);
  font-size: clamp(1.0625em, 0.994em + 0.34vw, 1.25em);
  line-height: 1.3;
  margin: 0 0 1.375em;
}

.reports p:last-child {
  margin: 0;
}

.reports .button {
  margin-top: auto;
}




/* ############################################### */
/* ############ ELEVATING VOICES PAGE ############ */
/* ############################################### */

main.elevating-voices {
  --ws-gap: 1.5em;
}

main.elevating-voices .split-content .wrap {
  align-items: center;
}

.elevating-voices :is(h1, h2)::after {
  height: .125rem !important;
  background: var(--yellow);
  content: '';
  display: block;
  margin: .75rem auto 1.5rem !important;
  width: 18.75rem !important;
  text-align: center;
}

.elevating-voices .reverse :is(h2)::after {
  margin: .75rem 0 1.5rem !important;
}

main.elevating-voices figure {
  margin: 0;
}

main.elevating-voices p {
  text-wrap: pretty;
}



/* ELEVATING THE VOICES OF YOUNG PEOPLE RIBBON ----------------------------- */

.split-content.elevating-voices {
	padding-bottom: 1em;
}

.split-content.elevating-voices h1 + i {
  margin: -1em 0 1em;
}

.split-content.elevating-voices h2 {
  color: var(--gray);
}

.split-content.elevating-voices h2:after {
  display: none;
}




/* METHODOLOGY RIBBON ------------------------------ */

.methodology {
  background: var(--lt-gray);
  padding-block: clamp(2.5em, 2.136em + 1.82vw, 3.5em) clamp(3.5em, 2.773em + 3.64vw, 5.5em);
  text-align: center;
  text-wrap: pretty;
}

.methodology .wrap {
  margin-inline: auto;
  max-width: calc(74em + 2 * var(--ws-gap));
  padding-inline: var(--ws-gap);
}

.methodology h2 {
  font-size: clamp(1.5em, 1.364em + 0.68vw, 1.875em);
  margin: 0 0 1.75em;
  text-transform: uppercase;
}

.methodology p {
  color: var(--gray);
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
  line-height: 1.3;
  margin-inline: auto;
  max-width: 45.85em;
}

.methodology h3 {
  color: #6F6F6F;
  font-size: clamp(1.25em, 1.159em + 0.45vw, 1.5em);
  font-weight: 700;
  margin: 1.5em 0 0;
}

.methodology .table-responsive {
  padding-inline: var(--ws-gap) 0;
}

.methodology .table-wrap {
	margin-inline: calc(-1 * var(--ws-gap));
  padding-top: 1.5em;
}

.methodology .table-wrap::before {
	left: .5em;
}

.methodology .table-wrap::after {
	right: .5em;
}

.methodology .container {
  margin-inline: 0;
  min-width: 75em;
}

.methodology .graphic {
    display: flex;
}

.methodology .graphic>div {
  display: flex;
  flex-direction: column;
  position: relative;
}

.methodology .graphic>div:not(:last-of-type) {
  margin-right: 3.125em;
}

.methodology .graphic>div:not(:last-of-type)::after {
  background: no-repeat center / contain;
  content: '';
  display: inline-block;
  height: 3.3125em;
  left: calc(100% - 2px);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.5em;
}

.methodology .graphic>div:nth-of-type(1)::after {
  background-image: url('/images/elevating-voices/arrow-green.svg');
}

.methodology .graphic>div:nth-of-type(2)::after {
  background-image: url('/images/elevating-voices/arrow-blue.svg');
}

.methodology .graphic>div:nth-of-type(1) { background: var(--green); }
.methodology .graphic>div:nth-of-type(2) { background: var(--blue); }
.methodology .graphic>div:nth-of-type(3) { background: var(--dk-blue); }

.methodology .graphic>div>div {
  align-items: center;
  display: flex;
  flex: 1 0 auto;
  justify-content: center;
  min-height: 7.5em;
  padding: .9375em;
}

.methodology .graphic>div:nth-of-type(1)>div {
  width: 15.3125em;
}

.methodology .graphic strong {
  color: #FFF;
  display: block;
  font-family: 'Farro', sans-serif;
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
  font-weight: 500;
}

.methodology .graphic ul {
  display: flex;
  border-top: 2px solid #FFF;
  height: 100%;
  margin: 0;
}

.methodology .graphic ul>li {
  color: #FFF;
  font-family: 'Farro', sans-serif;
  height: 100%;
  line-height: 1.5;
  padding: 1.25em .875em 2.5em;
  text-align: left;
  width: 33.33%;
}

.methodology .graphic ul>li:nth-child(even) {
  background: rgba(255,255,255,.1);
}




/* COMMUNITY ADVISORY GROUP RIBBON ------------------------------ */

.split-content.community-advisory-group h2 {
  margin: 0 auto 1em;
}

.split-content.community-advisory-group .top {
  margin: 0;
  max-width: 100%;
}

.split-content.community-advisory-group h3 {
  color: var(--gray);
  font-weight: 700;
  margin: 0 0 .5em !important;
  text-align: left;
}

.split-content.community-advisory-group .left>ul {
  margin: 0;
}

.split-content.community-advisory-group .left>ul>li {
  color: #FFF;
  line-height: 1;
  margin: 0 0 .625em;
  padding: 0.75em;
}

.split-content.community-advisory-group .left>ul>li::before {
  display: none;
}

.split-content.community-advisory-group .left>ul>li:nth-child(odd) {
  background: var(--blue);
}

.split-content.community-advisory-group .left>ul>li:nth-child(even) {
  background: var(--dk-blue);
}

.split-content.community-advisory-group .left>ul>li>ul { margin: 1em 0; }
.split-content.community-advisory-group .left>ul>li>ul>li {
  line-height: 1;
  margin: 0 0 .5em;
  padding-left: 2em;
}

.split-content.community-advisory-group .left>ul>li>ul>li::before{
  left: 1em;
  top: .25em;
  width: .5em;
}




/* GRAPH RIBBON ------------------------------ */

.graph-ribbon {
  background: var(--lt-gray);
  padding-block: clamp(2.5em, 1.773em + 3.64vw, 4.5em);
}

.graph-ribbon .wrap {
  margin: 0 auto;
  max-width: calc(74em + 2 * var(--ws-gap));
  padding-inline: var(--ws-gap);
}

.graph-ribbon h2 {
  margin: 0 0 1.75em;
  text-align: center;
  text-transform: uppercase;
}

.graph-ribbon figure {
  margin: 0;
}

.graph-ribbon img {
  display: block;
  height: auto;
  margin: 0 auto 5em;
  max-width: 62.5rem;
  width: 100%;
}

.graph-ribbon h3 {
  color: var(--blue);
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
  margin: 0 0 1.25em;
}

.graph-ribbon .graph-wrap {
  margin: 0 0 3.125em;
}

.graph-ribbon .graph-wrap>div {
  margin: 0 0 0.6875em;
}

.graph-ribbon .graph-wrap>div>span {
  align-items: center;
  color: #000;
  display: flex;
  flex: 1 0 auto;
  font-family: 'Farro', sans-serif;
  font-weight: 700;
  position: relative;
}

.graph-ribbon .graph-wrap>div>span>span {
  display: block;
  margin-right: .5em;
  transition: all 1.5s ease;
  width: 0;
}

.graph-ribbon .graph-wrap>div:nth-child(3n+1)>span>span { background: #0068AA; }
.graph-ribbon .graph-wrap>div:nth-child(3n+2)>span>span { background: #22C883; }
.graph-ribbon .graph-wrap>div:nth-child(3n+3)>span>span { background: #E8AE49; }

/* Graph 1 */
.graph-ribbon .graph-1.animated>div:nth-child(1)>span>span { width: calc(100% * (5 / 39)); }
.graph-ribbon .graph-1.animated>div:nth-child(2)>span>span { width: calc(100% * (1 / 39)); }
.graph-ribbon .graph-1.animated>div:nth-child(3)>span>span { width: calc(100% * (9 / 39)); }
.graph-ribbon .graph-1.animated>div:nth-child(4)>span>span { width: calc(100% * (20 / 39)); }
.graph-ribbon .graph-1.animated>div:nth-child(5)>span>span { width: calc(100% * (39 / 39)); }

/* Graph 2 */
.graph-ribbon .graph-2.animated>div:nth-child(1)>span>span { width: calc(100% * (40 / 40)); }
.graph-ribbon .graph-2.animated>div:nth-child(2)>span>span { width: calc(100% * (32 / 40)); }
.graph-ribbon .graph-2.animated>div:nth-child(3)>span>span { width: calc(100% * (2 / 40)); }

/* Graph 3 */
.graph-ribbon .graph-3.animated>div:nth-child(1)>span>span { width: calc(100% * (12 / 38)); }
.graph-ribbon .graph-3.animated>div:nth-child(2)>span>span { width: calc(100% * (38 / 38)); }
.graph-ribbon .graph-3.animated>div:nth-child(3)>span>span { width: calc(100% * (22 / 38)); }
.graph-ribbon .graph-3.animated>div:nth-child(4)>span>span { width: calc(100% * (1 / 38)); }

/* Graph 4 */
.graph-ribbon .graph-4.animated>div:nth-child(1)>span>span { width: calc(100% * (1 / 37)); }
.graph-ribbon .graph-4.animated>div:nth-child(2)>span>span { width: calc(100% * (1 / 37)); }
.graph-ribbon .graph-4.animated>div:nth-child(3)>span>span { width: calc(100% * (2 / 37)); }
.graph-ribbon .graph-4.animated>div:nth-child(4)>span>span { width: calc(100% * (3 / 37)); }
.graph-ribbon .graph-4.animated>div:nth-child(5)>span>span { width: calc(100% * (6 / 37)); }
.graph-ribbon .graph-4.animated>div:nth-child(6)>span>span { width: calc(100% * (11 / 37)); }
.graph-ribbon .graph-4.animated>div:nth-child(7)>span>span { width: calc(100% * (13 / 37)); }
.graph-ribbon .graph-4.animated>div:nth-child(8)>span>span { width: calc(100% * (37 / 37)); }





/* WEB OF SYSTEMS IMPACTING YOUNG PEOPLE RIBBON ------------------------------ */

.split-content.web-of-systems p+ul {
  margin-block: -.5em 1.75em
}

.split-content.web-of-systems figure {
  margin: 0 0 2em;
}

.split-content.web-of-systems figcaption {
  font-size: clamp(1.125em, 1.082em + 0.19vw, 1.25em);
  margin: 0 0 1em;
  text-align: center;
}

.split-content.web-of-systems figcaption>i {
  display: block;
  font-weight: 300;
}

.split-content.web-of-systems .right p {
	text-align: center;
}



/* PROGRAMS RIBBON ------------------------------ */

.elevating-voices .programs .top {
  margin: 0 auto 4.5em;
}

.elevating-voices .programs h2 {
  text-wrap: balance;
}

.programs li.family::before { background-image: url('/images/elevating-voices/icons/family.svg'); }
.programs li.hands::before { background-image:  url('/images/elevating-voices/icons/hands.svg'); }
.programs li.dollar::before { background-image: url('/images/elevating-voices/icons/dollar-sign.svg'); }
.programs li.cap::before { background-image: url('/images/elevating-voices/icons/cap.svg');  }
.programs li.laptop::before { background-image: url('/images/elevating-voices/icons/laptop.svg'); }
.programs li.running::before { background-image: url('/images/elevating-voices/icons/running.svg'); }





/* SYSTEM IMPLICATIONS GROUP RIBBON ------------------------------ */

.split-content.system-implications .wrap {
  max-width: calc(70em + 2 * var(--ws-gap));
}




/* NEW MEDIA CENTER + HOMEPAGE NEWS RIBBON ---------------------------- */

.home-news {
  padding-block: clamp(3em, 2.273em + 3.64vw, 5em) 0;
}

:is(.home-news, .media-center) .news {
	text-align: center;
}

:is(.home-news, .media-center) .news>div.ws-flex {
	border-bottom: 0;
  display: flex;
  justify-content: center;
	margin-bottom: 2.5em;
	padding-bottom: 0;
	text-align: left;
}

.media-center .news div.textbox {
  border: 0;
  margin: 0 auto 3em;
  max-width: 41em;
}

.media-center h1>span.underlined {
	display: block;
	margin: 0;
}

.media-center h1>span.underlined::after {
	display: table;
	margin: .5em auto 0;
}

.media-center h1>span.underlined.animated::after {
	width: min(100%, 19.375rem);
}

.home-news .wrap {
  padding-inline: 1.5em;
}

.home-news h2 {
  text-align: left;
}




/* NEWS STYLES ------------------------------ /
* - (Moved out of News module style.css for homepage news ribbon)
*/

.news>div.ws-flex {
	border-bottom: 1px solid #CCC;
	margin-block: 2em;
	padding-bottom: 3em;
	--ws-gap: 1.5em;
}

.news article a {
	border: 2px solid #CCC;
	position:relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow:hidden
}

.news article a:is(:hover,:focus-visible) {
  background: rgba(0,128,195,.05);
  border-color: var(--blue);
}

.news article span.image {
	align-items: center;
	aspect-ratio: 200 / 80;
	border-bottom: 1px solid #CCC;
	display: flex;
	width: 100%;
}

.news article span.image>span {
	height: 100%;
	width: 100%;
	background: no-repeat center / contain;
	margin-inline: auto;
	max-width: max(calc(100% - 6em), 12em);
	max-height: max(calc(100% - 6em), 10em);
	display: block;
}

.news article a .textbox {
  flex: 1 0 auto;
  padding: 1.75em 1.25em 2.5em;
}


.newsArticle .byline, .news article time{
  color: rgba(0,0,0,.5);
  font-size:.8em;
}

#content .news article h2, .home-news article h3 {
	color: var(--gray);
	font-size: 1.25em;
	margin-block: .25em .5em;
}

#content .news article a:is(:hover,:focus-visible) h2,
.home-news article a:is(:hover,:focus-visible) h3 {
	color: var(--blue);
}

.news article span.news-outlet {
	color: #767676;
	display: block;
	font-style: italic;
	margin: 0 0 1em;
}

.news article p {
	margin-bottom: 0;
	color: #666;
}


.news>div:not(.ws-flex) {
  border-bottom: 1px solid rgba(0,0,0,.25);
  margin: 0 0 3em;
  display: table;
  width: 100%
}





/* KEY METRICS CHART ------------------------------ /
* - Results page
*/

#metrics {
  background-color: var(--lt-gray);
  padding-block: clamp(3em, 2.273em + 3.64vw, 5em);
}

.key-metrics-chart .row {
  align-items: center;
  display: flex;
  line-height: 1.394;
  margin: 0 0 .5em;
  position: relative;
}

.key-metrics-chart .label {
  color: #FFF;
  font-size: 1.125rem;
  margin: 0;
  padding: 0 .5em;
  position: absolute;
}

.key-metrics-chart .bar {
  align-self: stretch;
  transition: all 2s ease-in-out;
  width: 0%;
}

/* max(7rem,...) below keeps bars at least 7rem wide so white text is fully visible on small 320px wide mobile */
.key-metrics-chart .row.animated .bar.width-387 { width: max(7rem, calc(100% * (387 / 1147))); }
.key-metrics-chart .row.animated .bar.width-754 { width: max(7rem, calc(100% * (754 / 1147))); }
.key-metrics-chart .row.animated .bar.width-925 { width: max(7rem, calc(100% * (925 / 1147))); }
.key-metrics-chart .row.animated .bar.width-1147 { width: max(7rem, calc(100% * (1147 / 1147))); }

.key-metrics-chart .row:nth-child(odd) .bar { background: #0060DF; }
.key-metrics-chart .row:nth-child(even) .bar { background: #003EAA; }

.key-metrics-chart .value {
  background: var(--lt-gray);
  font-size: 2.0625rem;
  line-height: 1.394;
  margin: 0;
  padding-inline: .75rem 0;
  position: relative;
}

.key-metrics-chart .row:nth-child(odd) .value { color: #0060DF; }
.key-metrics-chart .row:nth-child(even) .value { color: #003EAA; }

.key-metrics-chart #key-metrics-description {
  font-size: 1.125rem;
  line-height: 1.25;
  margin: 1em 0 0;
}





/* =~  =~  =~  CT OPPORTUNITY PROJECT - STYLE.CSS  ~=  ~=  ~=  */