.holder > * {
  width: 50%;
}

.holder > .column {
  padding-right: 4rem;
}

.holder .announcements .swiper-wrapper > * {
  width: 100%;
  height: 100%;
}

/*

  Icon with Brief Message

*/

.holder .icon-with-label {
  margin: 0;
  height: 100%;
}

.holder .icon-with-label {
  height: 100%;
  border-radius: .25rem;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  flex-shrink: 0;
  display: flex !important;
  margin: 0;
}

  .holder .icon-with-label img {
    width: 6rem;
    height: 6rem;
  }

  .holder .icon-with-label .label {
    color: var(--color-6);
    margin-top: 1rem;
    text-align: center;
    display: block;
  }
/*

  End

*/

/*

  Title with Message

*/

.holder .title-with-message {
  margin: 0;
  height: 100%;
  border-radius: .25rem;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  flex-shrink: 0;
  display: flex !important;
  margin: 0;
  }

 .holder .title-with-message .title {
   text-align: center;
   font-size: 2rem;
   color: var(--color-6);
   font-weight: 700;
   padding: 0 1rem;
 }

  .holder .title-with-message p {
    text-align: center;
    font-size: 1rem;
    margin: .5rem;
    padding: 0 1rem;
    display: block;
  }

  .holder .title-with-message p * {
    display: revert;
  }

  .holder div[class=""],
  .holder .message-only,
  .holder .title-with-message .column {
    flex-direction:column;
    overflow-y: auto;
  }

    .holder div[class=""] *,
    .holder .message-only *,
    .holder .title-with-message .column * {
      display: revert;
    }
    /*

  End

*/
    /*

  Message

*/

    .holder .message-only {
  margin: 0;
  height: 100%;
  border-radius: .25rem;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  flex-shrink: 0;
  display: flex !important;
  margin: 0;
}

.holder .message-only p {
  text-align: center;
  font-size: 1rem;
  margin: .5rem;
  padding: 0 1rem;
  display: block;
}

.holder .message-only p * {
  display: revert;
}

/*

  End

*/

/*

 One Liner

*/

.holder .one-liner {
  margin: 0;
  height: 100%;
  border-radius: .25rem;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  flex-shrink: 0;
  display: flex !important;
  margin: 0;
}

  .holder .one-liner p {
    text-align: center;
    font-size: 1.5rem;
    margin: .5rem;
    padding: 0 1rem;
    display: block;
  }

.holder .one-liner p * {
  display: revert;
}


/*

  End

*/

.holder .announcements .slick-slide > * a {
  color: var(--color-2);
}

.announcements .slick-slide > a:hover {
  background: var(--color-7);
}

.holder .announcements {
  height: auto;
  overflow: hidden;
  overflow-y: clip;
  position: relative;

}

.holder .announcements .swiper-pagination {
  left: 50% !important;
  transform: translateX(-50%);
  width: auto !important;
  display: flex;
  justify-content: center;
}

.holder .announcements .swiper-pagination-bullet-active {
  background: var(--blue-5);
}


  .holder .announcements * {
    display: flex;
  }

    .holder {
      width: 100%;
      max-width: var(--max-width);
      background: white;
      height: 100%;
      border-radius: .25rem;
      box-shadow: var(--float-close);
      padding: 2rem 4rem;
      align-items: center;
      justify-content: space-between;
  }

      .holder h3 {
          font-weight: 600;
          font-style: italic;
          font-size: 1.5rem;
          color: var(--color-6);
      }

      .holder h1 {
          font-weight: 900;
          font-size: 3rem;
          color: #1D3749;
          padding-bottom: 2rem;
          text-transform: uppercase;
      }

      .holder .slick-dots {
        height: min-content;
        transform: translateY(-3rem);
        justify-content: center;
      }


.slick-dots button {
  font-size: 0;
  line-height: 0;
  width: 20px;
  height: 20px !important;
  padding: 5px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
  margin: .5rem .25rem;
  flex-shrink: 0;
  box-shadow: none;
  position: relative;
}

.slick-dots li button:before {
  font-family: 'slick';
  font-size: 38px;
  /* line-height: 20px; */
  /* position: absolute; */
  /* top: 0; */
  /* left: 0; */
  width: 20px;
  height: 20px;
  content: '•';
  text-align: center;
  opacity: .25;
  color: white;
  z-index: 10;
  -webkit-font-smoothing: antialiased;
}

.slick-dots li.slick-active button:before {
  opacity: 1;
}


@media screen and (max-width: 820px) {
  .landing {
    height: 42rem;
  }

  .holder > * {
    width: 100%;
  }
  .holder {
    flex-direction:column;
  }
  .holder .announcements {
    margin-top: 2rem;
  }
}

@media screen and (max-width: 480px) {
  .announcements {
    margin-top: 1rem;
  }

.holder > .column {
    padding-right: 0rem; 
}

  .holder > *,
  .announcements .slick-list.draggable,
  .announcements .slick-track {
    width: 100% !important;
  }

  .announcements .slick-slide {
    display:flex !important;
    min-width: 100% !important;
    box-shadow: none !important;
    padding: 0rem;
  }
}


/*************************************************************

  C O L O R S

*/

.holder .announcements .blue *, .holder .announcements .blue {
  --color: var(--government) !important;
  --color-lt: var(--government-lt) !important;
  --color-med: var(--government-med) !important;
  --color-dark: var(--government-dark) !important;
}


.holder .announcements .green *,
.holder .announcements .green  {
  --color: var(--business) !important;
  --color-lt: var(--business-lt) !important;
  --color-med: var(--business-med) !important;
  --color-dark: var(--business-dark) !important;
}

.holder .announcements .purple *,
.holder .announcements .purple {
  --color: var(--admin) !important;
  --color-lt: var(--admin-lt) !important;
  --color-med: var(--admin-med) !important;
  --color-dark: var(--admin-dark) !important;
}

.holder .announcements .red *,
.holder .announcements .red {
  --color: var(--resident) !important;
  --color-lt: var(--resident-lt) !important;
  --color-med: var(--resident-med) !important;
  --color-dark: var(--resident-dark) !important;
}

.holder .announcements .yellow *,
.holder .announcements .yellow  {
  --color: var(--visitor) !important;
  --color-lt: var(--visitor-lt) !important;
  --color-med: var(--visitor-med) !important;
  --color-dark: var(--visitor-dark) !important;
}


.holder :is(.blue, .purple, .green, .red, .yellow) {
  background: var(--color-9);
  color: var(--compare);
}

.holder .light {
  background: var(--compare);
  color: var(--contrast);
}

.holder .light img[src*="white"],
.holder :is(.blue, .purple, .green, .red, .dark, .yellow) img:not([src*="white"]) {
  filter: invert(100);
}

.holder .dark {
  background: var(--compare);
  color: var(--contrast);
}

.holder .slick-slide,
.holder .single > *{
  height: 100%;
  border-radius: .25rem;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  flex-shrink: 0;
  display: flex !important;
  margin: 0;
}

.holder .ad {
  align-items: center;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  width: 100%;
}

.holder .ad img {
  max-width: 100%;
  object-fit: contain;
}


.holder .swiper-wrapper > * {
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}