@charset "UTF-8";

/* Web Solutions 4.0 Compatible */

:root {
  --ws-grid: minmax(0,1fr) [wrap-start] repeat(9,minmax(0,var(--ws-column-width))) [wrap-end] minmax(0,1fr);
}


/* TYPOGRAPHIC ELEMENTS ------------------------------*/
.twoCol, .threeCol, .resCol {
  column-rule: 1px outset rgba(0,0,0,.15);
}

.twoCol {
  columns: 2;
}

.threeCol {
  columns: 3;
}

.resCol {
  columns: auto;
  column-width: 13em;
}

.formTable td {
  padding: 0 0 .5em .5em;
  width: 50%;
}

.formTable td:first-child {
  padding: 0 .5em .5em 0;
}

.formTable td[colspan="2"] {
  padding-right: 0;
}

.photoright {
  margin: 0 0 2em 2em;
}

.photoleft {
  margin: 0 4em 3em 0;
}

.wsManagementLogin td:first-child {
  text-align: right;
  width: 40%;
}


/* HEADER ------------------------------*/
body>header {
  align-items: center;
  background: #FFF;
  display: flex;
  padding-block: 0 .875em;
  position: sticky;
  top: -2.5em;
  z-index: 3;
}


body>header::after {
  background: url('/theme-two/images/multicolor-border.svg') repeat-x left top / auto 100%;
  content: '';
  height: .3125em;
  left: 0;
  position: absolute;
  top: 100%;
  width: 100%;
}


body.management>header {
  top: -0.6125rem;
}

body>header #brand {
	display: block;
	grid-column: wrap-start / 4;
	grid-row: 2/3;
	max-width: clamp(12.25em, -0.154em + 26.46vw, 23em); /* 750 - 1400 */
	width: 100%;
}

body>header #brand :is(svg, img) {
	display: block;
	height: auto;
  max-height: 6em;
	max-width: 100%;
  width: auto;
}

/* nav */
body>header nav ul {
  margin: 0;
}

body>header #navContainer {
  display: contents;
}

#mainnav {
  display: flex;
  justify-content: flex-end;
  grid-column: 4 / wrap-end;
  grid-row: 2 / 3;
}

#mainnav>ul {
  display: flex;
  margin: 0;
  overflow: visible;
  padding: 0;
  text-align: center;
}

#mainnav li {
  display: inline-block;
  position: relative
}

#mainnav>ul>li {
  margin-left: 1px;
}

#mainnav a {
  border-radius: .25rem;
  color: var(--ws-gray-2);
  display: inline-block;
  font-size: clamp(0.938em, 0.649em + 0.62vw, 1.188em); /* 750 - 1400 */
  line-height: 1.2;
  padding: .75em clamp(0.5em, 0.139em + 0.77vw, 0.813em) .625em;  /* 750 - 1400 */
  text-decoration: none;
}

/* Donate */
#mainnav>ul>li:last-child a {
  background: var(--ws-light);
  color: var(--ws-blue);
  letter-spacing: 1.43px;
  margin: 0 0 0 clamp(0.25em, -0.327em + 1.23vw, 0.75em); /* 750 - 1400 */
  padding-inline: clamp(0.75rem, -0.115rem + 1.85vw, 1.5rem); /* 750 - 1400 */
  position: relative;
  text-transform: uppercase;
}

#mainnav>ul>li:last-child a::after {
  background: url('/theme-two/images/logo-people.svg') no-repeat center / cover;
  content: '';
  height: 1.3125em;
  left: 50%;
  position: absolute;
  top: -.8125em;
  transform: translateX(-50%);
  width: 2.25em;
}

#mainnav>ul>li:last-child a::before {
	aspect-ratio: 1;
    background: var(--ws-light);
    border-radius: 50%;
    content: "";
    position: absolute;
    right: 50%;
    top: -.75em;
    transform: translateX(50%);
    transition: background-color .2s ease;
    width: 2.25em;
    z-index: -1;
}


#mainnav>ul>li:hover>a,
#mainnav>ul>li>a:focus {
  background: var(--ws-yellow);
  color: var(--ws-blue);
}

#mainnav>ul>li:last-child a:is(:hover, :focus-visible)::before {
	background: var(--ws-yellow);
}

#mainnav>ul>li.on>a {
  background: var(--ws-blue-2);
  color: #fff;
}

/* drop-down menu */
#mainnav li ul {
  background: #FFF;
  box-shadow: 0 1px 1px rgb(0 0 0 / 2%), 0 2px 2px rgb(0 0 0 / 2%), 0 4px 4px rgb(0 0 0 / 2%), 0 8px 8px rgb(0 0 0 / 2%), 0 16px 16px rgb(0 0 0 / 2%);
  height: auto;
  opacity: 0;
  overflow: auto;
  padding: .625em 0;
  position: absolute;
  transition: ease .2s opacity 0.35s;
  top: -200vh;
  visibility: hidden;
  width: 16.875em;
  z-index: -1;
}

#mainnav>ul>li:nth-last-child(2)>ul {
  left: auto;
  right: 0;
}

#mainnav li:hover ul,
#mainnav>ul>li>a.tapped + ul {
  opacity: 1;
  top: auto;
  visibility: visible;
  z-index: 1;
}

#mainnav li ul li {
  display: block;
  width: 100%;
}

#mainnav ul li ul li a {
  background: none;
  border-radius: 0;
}

#mainnav li ul li a {
  display: block;
  font-size: 1em;
  line-height: 1.1em;
  padding: .4375em .5em;
  text-align: left;
  width: 100%;
}

#mainnav li ul li a:is(:hover, :focus) {
  background: var(--ws-blue);
  color: #FFF;
}

/* ancillary */
#ancillary {
  font-size: clamp(0.9em, 0.745em + 0.29vw, 1em); /* 850 - 1400 */
}

#ancillary .social strong {
  color: #FFF;
  margin: 0 .25em 0 0;
}

#ancillary {
  background: var(--ws-blue);
  grid-column: 1 / -1;
  grid-row: 1 / 2;
  width: 100%;
}

#ancillary div:nth-of-type(2) {
  align-items: center;
  display: flex;
  grid-column: 5 / wrap-end;
  margin-left: auto;
}

#ancillary :is(ul, li) {
  display: inline
}

#ancillary label {
  color: #FFF;
  font-size: .875em;
  line-height: 1.25;
  text-transform: uppercase;
  white-space: nowrap;
}

#ancillary a {
  color: #FFF;
  display: inline-block;
  font-size: .875em;
  height: 100%;
  line-height: 1.25;
  padding: .804em clamp(0.5em, 0.212em + 0.62vw, 0.75em); /* 750 - 1400 */
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
  z-index: 0;
}

#ancillary div:not(.social) a::after {
  color: rgba(255,255,255,.7);
  content: '\007C';
  position: absolute;
  right: -.3125em;
}

#ancillary li.on a {
  background: var(--ws-blue-2);
  color: #FFF;
  text-decoration: none;
}

#ancillary .email-signup {
  align-items: center;
  display: flex;
  height: 1.875em;
  margin: 0 0 0 1em;
}

#ancillary .email-signup>a {
  line-height: .75;
}

#ancillary .email-signup>a::after {
  display: none !important;
}

#ancillary form {
  align-items: center;
  display: flex;
  height: 1.875em;
}

#ancillary input {
  height: 100%;
  margin: 0 0 0 .875em;
  padding: .25em 1em;
}

#ancillary button {
  height: 100%;
}

#ancillary button:is(:hover, :focus) {
  background: #FFF;
  color: var(--ws-blue);
}

#ancillary a:is(:hover, :focus) {
  background: var(--ws-yellow);
  color: var(--ws-blue);
}

#ancillary .social a:is(:hover, :focus) svg {
  fill: var(--ws-blue);
}


/* mobile */
.menu, body>header #mobilenav {
  display: none;
}


/* PAGEHEADER ------------------------------ */
.pageHeader .image {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}



/* SOCIAL ------------------------------ */
#ancillary .social {
  align-items: center;
  display: flex;
  grid-column: wrap-start / 4;
  margin-right: auto;
}

.social ul {
  display: inline-flex;
}

:is(#ancillary, body>footer) .social ul {
  display: inline-flex;
}

:is(#ancillary, body>footer) .social a {
  align-items: center;
  display: flex;
  font-size: 1em;
  height: 2.5em;
  justify-content: center;
  padding: 0;
  width: clamp(2.25em, 1.962em + 0.62vw, 2.5em); /* 750 - 1400 */
}


/* MAIN ------------------------------ */
main.interior { overflow: hidden; }

main.interior > .content-wrap {
  margin: 0 auto;
  max-width: calc(60.375em + 2 * var(--ws-gutter));
  position: relative;
  width: 100%;
}

main.interior > .content-wrap::before {
  background: linear-gradient(180deg, var(--ws-light-2) 0%, #FFF 100%) no-repeat center top / 100% 75em;
  bottom: 0;
  content: '';
  left: -50vw;
  position: absolute;
  right: -50vw;
  top: -1.5em;
  z-index: 0;
}

main>div>aside {
  float: left;
  margin: 0;
  overflow: hidden;
  padding-right: clamp(1.5em, -1.529em + 6.46vw, 4.125em); /* 750 - 1400 */
  width: clamp(14em, 10.971em + 6.46vw, 16.625em); /* 750 - 1400 */
}

main>div>#content {
  float: right;
  min-height: 37.5em;
  overflow: hidden;
  padding: 0 0 5em;
  position: relative;
  width: calc(100% - clamp(14em, 10.971em + 6.46vw, 16.625em)); /* 750 - 1400 */
}

body.fullWidth main>div>#content {
  float: none;
  margin: 0 auto;
  width: 100%;
}

.content ul.threeColImage li::before {
  display: none;
}
.content .threeColImage li {width: 32%;display: inline-block;text-align: center;}
.content .threeColImage li img { padding: 4%; }
.content .threeColImage a:is(:hover, :focus) img {
  opacity: .5;
}

/* FOOTER ------------------------------ */
body>footer {
  padding-block: 3.75em 1.25em;
}

body>footer .fatFooter {
  margin: 0 0 3em;
}


body>footer nav,
body>footer .copyright p {
  display: inline-block;
}

body>footer .column-2 {
  padding-inline: 1em;
}

body>footer .logos {
  align-items: center;
  display: flex;
  margin: 0 0 2em;
}

body>footer .logos>:is(a + img, img + a, img + img) {
  margin-left: clamp(1.25em, -2.417em + 5.33vw, 2.25em); /* 1100 - 1400 */
}

#web-solutions {
  float: right;
  font-size: .875rem;
  margin-left: .625em;
  position: relative;
  top: .25em;
}

.social a:is(:hover, :focus) svg {
  fill: rgba(255,255,255,.8);
}


/* TRANSITION DELAYS ------------------------------ */
.circle-image.small,
#cta h2>span:nth-of-type(2),
#blog ul li:nth-of-type(3n+2),
#welcome h2>span:nth-of-type(2),
.text-image :is(.image, .video),
#at-a-glance ul li:nth-of-type(4n+2),
#grid-section>div>section:nth-of-type(2n+2) {
  transition-delay: .15s;
}

#blog ul li:nth-of-type(3n+3),
#at-a-glance ul li:nth-of-type(4n+3) {
  transition-delay: .3s;
}

#at-a-glance ul li:nth-of-type(4n+4) {
  transition-delay: .45s;
}




/* SHARED ------------------------------ */
.inner-grid {
  display: grid;
  gap: 1em;
  grid-template-columns: repeat(9, 1fr);
}


ul.ws-columns.ws-flex {
  --ws-column-count: 3;
}




/* HERO (HOME) ------------------------------ */
#hero h1 {
  font-size: clamp(1.75em, 1.317em + 0.92vw, 2.125em); /* 750 - 1400 */
  margin: 0 0 1.75rem;
}


/* AT A GLANCE (HOME) ------------------------------ */
#at-a-glance ul {
  grid-gap: 4em clamp(1.5em, -1.096em + 5.54vw, 3.75em); /* 750 - 1400 */
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

#at-a-glance .info {
  padding: 2em 1.25em 3em;
}


/* TEXT IMAGE (HOME PROGRAM MODEL AND FEATURED VIDEO)----------------------------- */
.text-image>div {
  display: grid;
  grid-gap: clamp(1.5em, -1.096em + 5.54vw, 3.75em); /* 750 - 1400 */
  grid-template-columns: 1fr 1fr;
}

.text-image .textbox {
  align-self: center;
  max-width: 32em;
}

/* Overrides */
#program-model {
  background: var(--ws-light-2);
}


/* HORIZON BLOG (HOME) ------------------------------ */
#blog ul {
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: clamp(1.5em, -1.096em + 5.54vw, 3.75em); /* 750 - 1400 */
}

#blog ul li .button:is(:hover, :focus) {
  color: #FFF;
}

#blog ul li:nth-of-type(3n+1) .button:is(:hover, :focus) {
  background-color: var(--ws-orange);
}

#blog ul li:nth-of-type(3n+2) .button:is(:hover, :focus) {
  background-color: var(--ws-purple);
}

#blog ul li:nth-of-type(3n+3) .button:is(:hover, :focus) {
  background-color: var(--ws-green);
}


/* MEDIA (HOME) ------------------------------ */
#media .left {
  grid-column: 1 / 5;
}

#media .right {
  grid-column: 6 / 10;
}


/* WELCOME (HOME) ----------------------------- */
#welcome .textbox {
  grid-column: 1 / 5;
  padding-right: 1.5em;
}

#welcome .image {
  display: grid;
  grid-column: 5 / -1;
}


/* OUR VALUES (LANDING) ----------------------------- */
#values .textbox {
  grid-column: 1 / 5;
}

#values .image {
  grid-column: 5 / 10;
}

#values .circle-image {
  margin-left: auto;
}


/* SECTION GRID (LANDING) ------------------------------ */
#grid-section>div {
  grid-gap: clamp(2.5em, -0.168em + 5.69vw, 4.813em) clamp(2.5em, -2.332em + 10.31vw, 6.688em); /* 750 - 1400*/
  grid-template-columns: 1fr 1fr;
}

#grid-section .section-body {
  padding: 1.5em clamp(0.625em, -4.207em + 10.31vw, 4.813em) 0 .625em; /* 750 - 1400*/
}

#grid-section section:nth-of-type(2n+1) {
  grid-column: 1 / 2;
}

#grid-section section:nth-of-type(2n+2) {
  grid-column: 2 / 3;
}

#grid-section section:nth-of-type(4n+1) .button:is(:hover, :focus) {
  background: var(--ws-purple);
  color: #FFF;
}

#grid-section section:nth-of-type(4n+2) .button:is(:hover, :focus) {
  background: var(--ws-orange);
  color: #FFF;
}

#grid-section section:nth-of-type(4n+3) .button:is(:hover, :focus) {
  background: var(--ws-yellow);
}

#grid-section section:nth-of-type(4n+4) .button:is(:hover, :focus) {
  background: var(--ws-green);
  color: #FFF;
}


/* BG-CALLOUT (LANDING) ----------------------------- */
#bg-callout::after {
  background: linear-gradient(90deg, rgba(var(--ws-off-white-rgb),1) 0%, rgba(var(--ws-off-white-rgb),1) 50%, rgba(var(--ws-off-white-rgb),0) 75%);
}

#bg-callout .textbox {
  max-width: 30.25em;
}

#bg-callout .image {
  grid-column: none;
  left: 50%;
  width: 50%;
}


/* CALL-TO-ACTION (LANDING) ----------------------------- */
#cta .inner-grid {
  align-items: center;
}

#cta .image {
  grid-column: 1 / 5;
}

#cta .textbox {
  grid-column: 5 / -1;
  max-width: 32em;
  padding-left: .625em;
}

#cta h2 {
  margin-inline: -2.25em 0;
}


/* COLORED SQUARES (Impact Page)------------------------------ */
#colored-squares.ws-flex {
  --ws-column-count: 3;
}


/* MAX WIDTH MEDIA QUERIES ------------------------------ */

/* 1200px */
@media (max-width: 75em) {
  #blog ul {
    grid-template-columns: 1fr 1fr
  }
}


/* 1100px */
@media (max-width: 68.75em) {
  body>footer .logos {
    flex-direction: column;
    align-items: center;
  }

  body>footer .logos>:is(a + img, img + a) {
    margin: 0;
  }

  body>footer :is(img, .logos>img) {
    margin: 1em 0 0;
  }
}


/* 1024px */
@media (max-width: 64em) {
  body>footer nav {
    display: block;
  }

  body>footer nav span:first-of-type {
    display: none;
  }

  #media>div {
    grid-template-columns: 1fr 1fr;
    gap: 1.5em;
  }

  #media .left {
    grid-column: 1 / 2;
  }

  #media .right {
    grid-column: 2 / 3;
  }
}


/* 950 */
@media (max-width: 59.375em) {
  #ancillary .social {
    grid-column: 1 / 3;
    grid-row: 1 / 2;
  }

  #ancillary div:nth-of-type(2) {
    grid-column: wrap-start / wrap-end;
    grid-row: 1 / 2;
  }

  #ancillary .social strong {
    display: none;
  }

  #ancillary input {
    width: 9.375em;
  }
}

/* 900 */
@media (max-width: 56.25em) {
  body>footer .fatFooter { flex-wrap: wrap; }
  body>footer .fatFooter > * { width: calc(50% - .75em); }
  body>footer .column-1 { margin: 0 0 2em; order: 1; }
  body>footer .column-2 { margin: 0 0 2em; order: 2; padding: 0; }
  body>footer .form-social { order: 3; }
  body>footer .logos { flex-direction: row; order: 4; }
  body>footer .logos>img { margin-right: 1em; }
  body>footer .fatFooter .column-2:empty + .logos { justify-content: center; margin-top: 2em; width: 100%; }

  #at-a-glance ul {
    grid-template-columns: 1fr 1fr;
  }

  #at-a-glance ul li p .info {
    font-size: 1.25em;
    padding-inline: 1.625em;
  }
}


/* 850px */
@media (max-width: 53.125em) {
  #bg-callout::after {
    background: rgba(var(--ws-off-white-rgb),.85);
  }

  #bg-callout .image {
    grid-column: none;
    left: 0;
    width: 100%;
  }

  #bg-callout .textbox {
    max-width: 100%;
  }

	#colored-squares.ws-flex {
	  --ws-column-count: 2;
	}

  ul.ws-columns.ws-flex {
    --ws-column-count: 2;
  }

}


/* MIN WIDTH MEDIA QUERIES ------------------------------ */
@media (min-width: 1800px) {
  body { font-size: 1.1em; }
}

@media (min-width: 2400px) {
  body { font-size: 1.2em; }
}


/* ************ STYLE-D.CSS ************ */