@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Onest:wght@100;200;300;400;500;600;700;800;900&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
	--yellow: #ffc107;
	--lightyellow: #ffe085;
	--lightgrey: #f7f7f7;
	--darkgrey: #242424;
}

.z-auto { z-index: auto!important }
.z-0 { z-index: 0!important }
.z-10 { z-index: 10!important }
.z-20 { z-index: 20!important }
.z-30 { z-index: 30!important }
.z-40 { z-index: 40!important }
.z-50 { z-index: 50!important }

.tall-line-height { line-height: 2 }
.shortish-line-height { line-height: 1.2 }
.short-line-height { line-height: 1 }

.tight-letter-spacing { letter-spacing: -1px }
.loosish-letter-spacing { letter-spacing: .1rem }
.loose-letter-spacing { letter-spacing: .15rem }

body {
	font-family: 'Montserrat', sans-serif;
}

h1,h2 {
	font-family: 'Raleway', sans-serif;
}

h1 {
	font-size: calc(18px + 4.2vmin);
	line-height: 1;
}

h2 {
	font-size: calc(12px + 1vmin);
	font-weight: 400;
	letter-spacing: .3rem
}

h3,h4,h5,h6 {
	font-weight: bold;
}

p {
	margin-bottom: 0;
	padding-bottom: 1.5em;
	font-family: 'Onest', sans-serif;
}

hr {
	width: 72px;
	opacity: 100% !important;
	margin: 15px auto;
}

header {
  width: 100%;
  height: 88vh;
  overflow: hidden;
}

header:after {
	content: '';
  position: absolute;
  width: 100%;
  left: 0;
  z-index: 1;
  height: 100%;
  top: 0;
  background-image: linear-gradient(to bottom right, rgb(43 142 88 / 90%), rgb(146 101 8 / 90%));
}

header {
	position: relative;
}

section {
	padding: 2em 0;
}

mark {
  all: unset;
  background-image: linear-gradient(peachpuff, var(--yellow));
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 100% 40%;
}

/** BEGIN SECTIONS **/

#pre-letter {
	background-image: linear-gradient(var(--darkgrey), grey);
	height: 15vmin;
}

#letter {
	background-image: linear-gradient(grey, var(--lightgrey), white, white, white, white, white, white);
}

#quote1 {
	background-color: white;
}

#stories {
	background-image: linear-gradient(white, white, var(--yellow));
}

#result-areas {
	background-image: linear-gradient(var(--yellow), var(--lightyellow), var(--lightgrey), var(--lightgrey));
}

#clients {
	background-color: var(--lightgrey);
}

#stats {
	background-image: linear-gradient(var(--yellow), var(--lightyellow), white, white, white);
}

#highlights {
	background-image: linear-gradient(white, white, white, var(--lightyellow));
}

#outcomes {
	background-image: linear-gradient(var(--lightyellow), var(--yellow), var(--lightyellow));
}

#stories2 {
	background-image: linear-gradient(var(--lightyellow), var(--lightgrey), var(--lightgrey));
}

#financials {
	background-image: linear-gradient(var(--lightgrey), var(--lightgrey), white);
}

#partners {
	background-color: white;
}

#quote2 {
	background-color: white;
}

#commissioners {
	background-image: linear-gradient(white, var(--lightgrey), white);
}

#staff {
	background-color: white;
}

#board {
	background-image: linear-gradient(white, white, white, #ffe085);
}

#footer {
	background-image: linear-gradient(#ffe085, #ffc107, #ffe085);
}

/** END SECTIONS **/

/** BEGIN BG VIDEO **/

#bgvid {
  position: relative;
  min-height: 100vh;
}

#bgvid video {
	left: -9999px;
  right: -9999px;
  margin: auto;
  position: absolute;
  top: -9999px;
  bottom: -9999px;
  min-width: 100vw;
  min-height: 100vh;
}

#bgvid {
	overflow: hidden;
  min-width: 100%;
}

/** END BG VIDEO **/

/** BEGIN HEADER BOXES **/

.link-boxes {
	top: -14vmin;
	z-index: 1000;
	/*width: 65%;
	margin: auto;*/
}

.link-boxes-black {
	z-index: 2000;
	/*width: 40%;*/
	height: 28vmin;
}

.link-boxes-y1 {
	z-index: 1000;
	/*width: 30%;*/
	height: 24vmin;
}

.link-boxes-y2 {
	z-index: 1000;
	/*width: 30%;*/
	height: 24vmin;
}

.header-space {
	height: 16vmin;
}

@media screen and (max-width: 1200px) {
	.link-boxes {
		visibility: hidden;
	}
	#pre-letter {
		height: 0;
	}
}

/** END HEADER BOXES **/

.black-border {
	border: 3px solid black;
	border-radius: 20px;
}

.clientsChart-wrapper,
.financialsChart-wrapper {
	margin: 30px 0;
}

.colorblock {
  width: 45px;
  height: 30px;
  background: #000;
  margin: 5px;
}

.colorblock2 {
  width: 30px;
  height: 30px;
  background: #000;
  margin: 5px;
}

.vizblue {
  background-color: #02A9EA;
}

.vizgrey {
  background-color: #50514F;
}

.vizpink {
  background-color: #FF01FB;
}

.vizyellow {
  background-color: #FAC748;
}

.vizpale {
  background-color: #F9E9EC;
}

.vizsalmon {
  background-color: #EE9480;
}

.vizgreen {
  background-color: #49DCB1;
}

.vizred {
  background-color: #dc4949ff;
}

.vizevergreen {
  background-color: #00a244ff;
}

.outcomes img {
	width: 200px;
}

.partners img {
	width: 200px;
}

.reach-data {
	font-size: calc(18px + 3.5vw);
	font-family: 'Raleway', sans-serif;
}

.stats-data {
	font-size: calc(18px + 3vw);
	font-weight: bold;
	font-family: 'Raleway', sans-serif;
}

.results img {
	width: 130px;
}

.stats img {
	margin:  2rem auto;
	width: 130px;
}

.sub {
	width: 27%;
	min-width: 350px;
	margin: 2rem auto;
}

.subtitle {
	padding: 1.4rem .4rem;
	border: 2px solid white;
	border-radius: 15px;
}

.program-highlights img {
	width: 100%;
}

.story p {
	padding-bottom: 0;
}

.quote {
	font-weight: bold;
	text-align: center;
}

.watermark {
	background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  text-align: center;
}

.watermark h3 {
  font-size: calc(12px + 2.5vw);
  line-height: 9rem;
}

.white-box {
	background-color: white;
}

/** BEGIN HEADERS **/
#letter .watermark {
  background-image: url('/annualreport2023/img/watermark-letter.png');
  margin-top: 4vmin;
  margin-bottom: 2em;
}
#result-areas .watermark {
  background-image: url('/annualreport2023/img/watermark-results.png');
  margin-bottom: 5em;
}
#stats .watermark {
  background-image: url(/annualreport2023/img/watermark-stats.png);
  margin-top: 4em;
  margin-bottom: 4em;
}
#highlights .watermark {
  background-image: url(/annualreport2023/img/watermark-highlights.png);
  margin-top: 4em;
  margin-bottom: 4em;
}
#outcomes .watermark {
  background-image: url(/annualreport2023/img/watermark-outcomes.png);
  margin-top: 4em;
  margin-bottom: 5em;
}
#financials .watermark {
  background-image: url(/annualreport2023/img/watermark-financials.png);
  margin-top: 4em;
  margin-bottom: 4em;
}
#footer .watermark {
  background-image: url(/annualreport2023/img/watermark-our-thanks.png);
  margin-top: 4em;
  margin-bottom: 3em;
}
/** END HEADERS **/

::-moz-selection { /* selection code for Firefox */
  color: black;
  background: var(--yellow);
}
::selection {
  color: black;
  background: var(--yellow);
}