@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Averia+Serif+Libre:ital,wght@0,400;0,700;1,400;1,700&display=swap");
/*** Breakpoints ***/
/*** Colors ***/
/*
 * Retina Sprites for Compass
 * by:              Gaya Kessler
 * last update:     03/11/14
 *
 * Usage:
 * 1. create two folders in your image directory (in this case 'icons' and 'icons-2x').
 * 2. adjust the foldernames defined below if you use different names.
 * 3. create sprite images for pixel ratio 1 screens and put them in the first folder.
 * 4. create sprite images for pixel ratio 2 screens and put them in the second folder, use the same filenames.
 * 5. use the sprite-image in your Sass/Scss using: '@include use-sprite(<sprite-name>)'
 */
/**
 * Create pseudo element that clears the float.
 */
/**
 * Distribute block elements equily on the horizontal line.
 *
 * @param $elements A list of selectors.
 * @param $gap      A width of the gap between elements.
 */
/* line 4, ../../sass/partials/block--block-with-panels.scss */
body:not(.path-frontpage) .block-with-panels-container {
  border-top: 2px solid #eeeeee;
}

/* line 9, ../../sass/partials/block--block-with-panels.scss */
.block-with-panels-container {
  border-bottom: 1px solid #EEEEEE;
}
/* line 11, ../../sass/partials/block--block-with-panels.scss */
.block-with-panels-container .round-button {
  margin: 0.5em 0;
}
@media (min-width: 600px) {
  /* line 9, ../../sass/partials/block--block-with-panels.scss */
  .block-with-panels-container {
    border-bottom: none;
    padding-bottom: 0;
  }
  /* line 17, ../../sass/partials/block--block-with-panels.scss */
  .block-with-panels-container h2 {
    margin-bottom: 0;
  }
  /* line 20, ../../sass/partials/block--block-with-panels.scss */
  .block-with-panels-container .round-button {
    display: none;
  }
}

/* line 26, ../../sass/partials/block--block-with-panels.scss */
.the-issues {
  display: none;
}
@media (min-width: 600px) {
  /* line 26, ../../sass/partials/block--block-with-panels.scss */
  .the-issues {
    display: block;
    margin-top: 30px;
  }
}
@media (min-width: 1024px) {
  /* line 26, ../../sass/partials/block--block-with-panels.scss */
  .the-issues {
    position: relative;
    overflow: hidden;
    display: flex;
    display: -ms-flexbox;
    height: 566px;
  }
  /* line 38, ../../sass/partials/block--block-with-panels.scss */
  .the-issues:before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -37.5px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 37.5px 0 37.5px;
    border-color: #ffffff transparent transparent transparent;
    z-index: 3;
  }
}

/* line 55, ../../sass/partials/block--block-with-panels.scss */
.panel {
  display: block;
  background-color: #eee;
  width: 100%;
  height: 154px;
  border-top: 1px solid #999;
  border-bottom: 1px solid #999;
  text-decoration: none;
  color: #FFF;
  font-weight: bold;
  font-size: 1.1875em;
  /* 19/16 */
  position: relative;
  overflow: hidden;
}
/* line 68, ../../sass/partials/block--block-with-panels.scss */
.panel:first-child {
  border-top: none;
}
/* line 71, ../../sass/partials/block--block-with-panels.scss */
.panel:last-child {
  border-bottom: none;
}
/* line 74, ../../sass/partials/block--block-with-panels.scss */
.panel .inner-container {
  z-index: 2;
  opacity: 0.7;
  transition: opacity 0.3s ease-in-out;
}
/* line 80, ../../sass/partials/block--block-with-panels.scss */
.panel:hover .inner-container {
  opacity: 1;
}
/* line 83, ../../sass/partials/block--block-with-panels.scss */
.panel:hover img.grayscale {
  opacity: 0;
}
/* line 88, ../../sass/partials/block--block-with-panels.scss */
.panel .panel-icon {
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
/* line 92, ../../sass/partials/block--block-with-panels.scss */
.panel .panel-text {
  margin: 0 !important;
}
/* line 95, ../../sass/partials/block--block-with-panels.scss */
.panel h5 {
  display: none;
  font-size: 15px;
  width: 90%;
  max-width: 310px;
  margin: 1em auto;
}
/* line 105, ../../sass/partials/block--block-with-panels.scss */
.panel img.panel-bg {
  position: absolute;
  width: 100%;
  height: auto;
  top: 0;
  left: 0;
  transition: all 0.3s ease-in-out;
}
/* line 113, ../../sass/partials/block--block-with-panels.scss */
.panel img.grayscale {
  z-index: 1;
}
/* line 116, ../../sass/partials/block--block-with-panels.scss */
.panel img.full-color {
  z-index: 0;
}
@media (min-width: 600px) and (max-width: 1023px) {
  /* line 122, ../../sass/partials/block--block-with-panels.scss */
  .panel .inner-container {
    position: relative;
    top: 50%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  /* line 125, ../../sass/partials/block--block-with-panels.scss */
  .panel .panel-icon {
    left: 10%;
  }
}
@media (min-width: 1024px) {
  /* line 55, ../../sass/partials/block--block-with-panels.scss */
  .panel {
    -webkit-flex: 1;
    flex: 1;
    -webkit-justify-content: center;
    justify-content: center;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    height: auto;
    border-top: none;
    border-bottom: none;
    border-left: 1px solid #999;
    border-right: 1px solid #999;
    font-size: 1.3125em;
    /* 21/16 */
    transition: flex 0.3s cubic-bezier(0.61, -0.19, 0.7, -0.11), background 0.3s;
  }
  /* line 143, ../../sass/partials/block--block-with-panels.scss */
  .panel:first-child {
    border-left: none;
  }
  /* line 146, ../../sass/partials/block--block-with-panels.scss */
  .panel:last-child {
    border-right: none;
  }
  /* line 149, ../../sass/partials/block--block-with-panels.scss */
  .panel:hover {
    flex: 1.5;
  }
  /* line 151, ../../sass/partials/block--block-with-panels.scss */
  .panel:hover h5 {
    opacity: 1;
    bottom: 0px;
  }
  /* line 156, ../../sass/partials/block--block-with-panels.scss */
  .panel .inner-container {
    height: 213px;
  }
  /* line 159, ../../sass/partials/block--block-with-panels.scss */
  .panel .icon-container {
    height: 100px;
    position: relative;
  }
  /* line 163, ../../sass/partials/block--block-with-panels.scss */
  .panel h5 {
    display: inline-block;
    position: relative;
    opacity: 0;
    bottom: -300px;
    transition: opacity 0.5s ease-in-out, bottom 0.5s ease-in-out;
  }
  /* line 173, ../../sass/partials/block--block-with-panels.scss */
  .panel img.panel-bg {
    position: absolute;
    left: 50%;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: auto;
  }
}
@media all and (min-width: 1024px) and (-ms-high-contrast: none), (min-width: 1024px) and (-ms-high-contrast: active) {
  /* line 55, ../../sass/partials/block--block-with-panels.scss */
  .panel {
    flex: auto;
    -ms-flex: auto;
    display: -ms-flexbox;
    width: 20%;
    transition: width 0.3s ease-in-out;
  }
  /* line 185, ../../sass/partials/block--block-with-panels.scss */
  .panel:hover {
    flex: auto;
    -ms-flex: auto;
    width: 25%;
  }
}

@media (min-width: 600px) and (max-width: 1023px) {
  /* line 197, ../../sass/partials/block--block-with-panels.scss */
  .panel:hover img.panel-bg {
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  /* line 204, ../../sass/partials/block--block-with-panels.scss */
  .panel-homeless-in-america img.panel-bg {
    top: -97%;
  }

  /* line 209, ../../sass/partials/block--block-with-panels.scss */
  .panel-human-trafficking img.panel-bg {
    top: -82%;
  }

  /* line 214, ../../sass/partials/block--block-with-panels.scss */
  .panel-continuum-of-care img.panel-bg {
    top: -170%;
  }

  /* line 219, ../../sass/partials/block--block-with-panels.scss */
  .panel-advocacy img.panel-bg {
    top: -116%;
  }

  /* line 224, ../../sass/partials/block--block-with-panels.scss */
  .panel-sleep-out img.panel-bg {
    top: auto;
    bottom: -45%;
  }
}
@media (min-width: 1024px) and (max-width: 1299px) {
  /* line 235, ../../sass/partials/block--block-with-panels.scss */
  .panel-homeless-in-america img.panel-bg {
    left: 17%;
  }

  /* line 240, ../../sass/partials/block--block-with-panels.scss */
  .panel-human-trafficking img.panel-bg {
    left: 7%;
  }

  /* line 245, ../../sass/partials/block--block-with-panels.scss */
  .panel-sleep-out img.panel-bg {
    left: 37%;
    bottom: auto;
  }
}

/*# sourceMappingURL=block--block-with-panels.css.map */