/*----- SLIDESHOW - Join Now - Open -----*/
#presentation .slide-btn-pos .apb-ss-content-inner {
  position: static !important;
}
#presentation .slide-btn-pos .btn-indigo {
  bottom: 1.5rem;
  font-size: 1.5rem;
  padding: 1rem 1.5rem;
  position: absolute;
}
/*----- SLIDESHOW - Join Now - Close -----*/

/* CARD - OPEN*/
#page .card-wrapper {
  background-color: #fff;
  height: 100%;
  transition: all 300ms;
}

#page .fhf-news-page .card-wrapper {
  background-color: var(--color-primary-50);
}

#page .card-wrapper:hover .card-content .poster-image img {
  transform: scale(1.1);
}

#page .card-wrapper .card {
  height: 100%;
  display: flex;
  flex-direction: column;
}

#page .card-wrapper .card-content {
  position: relative;
  overflow: hidden;
}

#page .card-wrapper .card-content .content {
  background-color: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  transition: all 300ms;
}
#page .fhf-news-page .card-wrapper .card-content .content {
  background-color: var(--color-primary-50);
}

#page .card-wrapper .card-content .content .body {
  height: 0;
  padding: 0px 1.5rem;
}

#page .card-wrapper .card-content .poster-image img {
  width: 352px;
  height: 232px;
  margin: 0;
  object-fit: cover;
  object-position: center;
  transition: all 500ms ease-out;
}

#page .card-wrapper .card-content .content .body .date {
  font-family: "droid-serif";
  display: flex;
  gap: 0.5rem;
  align-items: center;
  color: #563e96;
  font-size: 1rem;
  line-height: normal;
  margin-bottom: 0.5rem;
}

#page .card-wrapper .card-content .content .body .date::before {
  font-family: "Font Awesome 6 Pro";
  font-size: 1rem;
  font-weight: 700;
  content: "\e0d5";
  display: block;
  color: #a69c5b;
}

#page .card-wrapper .card-content .content .title,
#page .card-wrapper .card-content .title-clone {
  font-family: "droid-serif";
  color: #563e96;
  font-size: 1.25rem;
  line-height: 140%;
  padding: 24px;
  transition: all 300ms;
}

#page .card-wrapper .card-content .title-clone {
  opacity: 0;
}

#page .card-wrapper .card-content .content .body .description {
  font-family: var(--font-family-primary);
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
}

#page .card-wrapper .card-content .content .body .description p {
  margin: 0 !important;
}

#page .card-wrapper .card-content .content .body .description strong {
  font-weight: 400 !important;
}

#page .card-wrapper .card .read-more {
  margin-top: auto;
  padding: 0.25rem 24px 28px 24px;
}

#page .card-wrapper .card .read-more a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #fff;
  background-color: #563e96;
  padding: 0.5rem 0.75rem;
  line-height: normal;
  width: fit-content;
  transition: all 300ms;
}

#page .card-wrapper .card .read-more a::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

#page .card-wrapper .card .read-more a:hover {
  color: #fff;
  background-color: var(--color-secondary);
  text-decoration: none;
}

/* CARD GRID - OPEN */

#page .card-grid .view-content {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  row-gap: 3rem;
  column-gap: 2rem;
}

#page .card-grid .view-content,
#page .card-grid .view-content .views-row > div {
  height: 100%;
}

#page
  .card-grid
  .view-content
  .views-row
  .card-wrapper
  .card-content
  .poster-image
  img {
  width: 100%;
}

@media screen and (min-width: 768px) {
  #page .card-grid .view-content {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (min-width: 1024px) {
  #page .card-grid .view-content {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* CARD GRID - CLOSE */

/* EVENTS HOME - OPEN */
#page .events-carousel .owl-carousel .owl-stage {
  display: flex;
}

#page .events-carousel .owl-carousel .owl-nav {
  margin-top: 30px !important;
}

#page .events-carousel .owl-carousel .owl-nav button {
  border-radius: 4px;
  padding: 2px 8px !important;
  background: #563e96;
  color: white;
  transition: all 300ms;
}

#page .events-carousel .owl-carousel .owl-nav button:hover {
  background-color: #a69c5b;
  color: white;
}

#page .events-carousel .owl-carousel .owl-nav .owl-prev:before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f053";
  display: block;
}

#page .events-carousel .owl-carousel .owl-nav .owl-next:before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f054";
  display: block;
}

#page .events-carousel .owl-carousel .owl-dots .owl-dot.active span {
  background: #563e96;
}

#page .events-carousel .owl-carousel .owl-dots .owl-dot:hover > span {
  background: #563e96;
}

#page .events-carousel .owl-carousel .owl-dots .owl-dot span {
  background: #869791;
}

#page .events .view-content .views-row .field-content,
#page .events .view-content .views-row .views-field,
#page .events .view-content .views-row {
  height: 100%;
}

#page .events .wrapper {
  background: #f7f5fd;
  background: linear-gradient(0deg, #ffffff 10%, #f7f5fd 75%);
  border-top: 2px solid #ece7fc;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 1.25rem 1.5rem 1.5rem 1.5rem;

  /* -webkit-box-shadow: 0px 0px 11px 2px rgba(0, 0, 0, 0.13);
	-moz-box-shadow: 0px 0px 11px 2px rgba(0, 0, 0, 0.13);
	box-shadow: 0px 0px 11px 2px rgba(0, 0, 0, 0.13); */
}

.homepage #page .events .wrapper {
  background: rgba(255, 255, 255, 0.5);
  background: linear-gradient(
    0deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.75) 75%
  );
  border: none;
}

#page .events .wrapper .title {
  color: #563e96;
  font-family: var(--font-family-secondary);
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  margin-bottom: 1rem;
}

#page .events .wrapper .description {
  color: #343336;
  font-family: var(--font-family-primary);
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  margin-bottom: 1.25rem;
}

#page .events .wrapper .description p {
  margin: 0;
  font-weight: 400;
}

#page .events .wrapper .description strong {
  font-weight: 400;
}

#page .events .wrapper .date {
  font-family: "droid-serif";
  display: flex;
  gap: 0.5rem;
  align-items: center;
  /* color: #563e96; */
  color: #a69c5b;
  font-size: 1rem;
  line-height: normal;
  margin-bottom: 0.5rem;
}

#page .events .wrapper .date::before {
  font-family: "Font Awesome 6 Pro";
  font-size: 1rem;
  font-weight: 700;
  content: "\e0d5";
  display: block;
  color: #a69c5b;
}

#page .events .wrapper .read-more {
  margin-top: auto;
  /* padding: 0.25rem 24px 28px 24px; */
}

#page .events .wrapper .read-more a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #fff;
  background-color: #563e96;
  padding: 0.5rem 0.75rem;
  line-height: normal;
  width: fit-content;
  transition: all 300ms;
}

#page .events .wrapper .read-more a::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

#page .events .wrapper .read-more a:hover {
  color: #fff;
  background-color: var(--color-secondary);
  text-decoration: none;
}

#page .events .card-wrapper .card-content .card-header,
#page .events .card-wrapper .card-content .card-header-clone {
  padding: 24px;
}

#page .events .card-wrapper .card-content .content .title,
#page .events .card-wrapper .card-content .title-clone {
  font-family: "droid-serif";
  color: #563e96;
  font-size: 1.25rem;
  line-height: 140%;
  padding: 0 0 0.6rem 0;
  transition: all 300ms;
}

#page .events .card-wrapper .card-content .title-clone {
  opacity: 0;
}

#page .events .card-wrapper .card-content .card-header .date,
#page .events .card-wrapper .card-content .card-header-clone .date {
  font-family: "droid-serif";
  display: flex;
  gap: 0.5rem;
  align-items: center;
  color: var(--color-secondary);
  font-size: 1rem;
  font-weight: 700;
  line-height: normal;
}

#page .events .card-wrapper .card-content .card-header .date::before,
#page .events .card-wrapper .card-content .card-header-clone .date::before {
  font-family: "Font Awesome 6 Pro";
  font-size: 1rem;
  font-weight: 700;
  content: "\e0d5";
  display: block;
  color: #a69c5b;
}

#page .events-placeholder {
  display: none;
}

#page .events-home-section {
  /* background: linear-gradient(180deg, #f7f5fd 0%, #e0dcec 100%); */
  background: #cbbde0 url(/sites/default/files/theme/images/bg-section-03-4.jpg)
    no-repeat top center;
  background-attachment: fixed;
  background-size: cover;
  padding: 4rem 2rem;

  /* FORCE FULL WIDTH */
  left: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  max-width: none !important;
  position: relative !important;
  right: 50% !important;
  width: 100vw !important;
}

#page .events-home-section .views-element-container {
  margin: 0 auto;
  max-width: 1170px;
}

#page .events-home-section .views-element-container .view-apb-simple-content {
  gap: 0 !important;
}
/* #page .events-home-section::before,
#page .events-home-section::after {
	content: '';
	width: 9999px;
	top: 0;
	bottom: 0;
	position: absolute;
	transform: translateX(-100%);
	background: linear-gradient(180deg, #f7f5fd 0%, #e0dcec 100%);
}

#page .events-home-section::before {
	left: 0;
	transform: translateX(-100%);
}

#page .events-home-section::after {
	right: 0;
	transform: translateX(100%);
}
   */

/* EVENTS INTRO - CLOSE */
#page .events-home-section a.btn-white {
  width: fit-content;
  border: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}

#page .events-home-section a.btn-white::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

#page .events-home-section .columns-grid .columns-grid-column:last-child {
  justify-self: start;
}

@media screen and (min-width: 768px) {
  #page .events-home-section .columns-grid .columns-grid-column:last-child {
    justify-self: end;
  }
}
/* EVENTS INTRO - OPEN */

/* EVENTS HOME - CLOSE */

/* EVENTS - OPEN */

#page .field.field--name-field-evt-start,
#page .field.field--name-field-evt-end,
#page .field.field--name-field-loc-address,
#page .field.field--name-field-loc-phone {
  margin-bottom: 1rem;
}

#page .evt-page-footer {
  /* background-color: var(--color-primary-50); */
  border-top: 1px solid var(--color-primary-100);
  display: flex;
  gap: 0.5rem;
  justify-content: space-between;
  margin-top: 0.5rem;
  padding: 2rem 1.5rem 0 1.5rem;
}
/* EVENTS - CLOSE */

/*----- NEWSLETTER - Open -----*/
#page .newsletter-home-section {
  background: var(--color-primary);
  background: linear-gradient(
    130deg,
    rgba(86, 62, 150, 1) 0%,
    rgba(53, 45, 81, 1) 100%
  );
  margin-bottom: 5.5rem !important;
  margin-top: 6rem !important;
  padding: 5rem 2rem;

  left: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  max-width: none !important;
  position: relative !important;
  right: 50% !important;
  width: 100vw !important;
}
#page .newsletter-home-section .views-element-container {
  margin: 0 auto;
  max-width: 1170px;
  padding: 0 10px;
  position: relative;
  width: 100%;
}
#page .newsletter-home-section .apb-sc-body-wrapper h2 {
  color: var(--color-white);
  font-size: 3.25rem;
}
#page .newsletter-home-section .apb-sc-body-wrapper {
  color: var(--color-white);
}

#page .view-newsletter-page .view-content {
  display: grid;
  column-gap: 1rem;
  row-gap: 1rem;
  grid-template-columns: 1fr;
}
#page .view-newsletter-home .view-content .views-row,
#page .view-newsletter-page .view-content .views-row {
  background-color: var(--color-white);
  border: 1px solid var(--color-primary-100);
  padding: 1rem;
  position: relative;
  text-align: center;
  z-index: 2;
}
#page .view-newsletter-home .view-content .views-row {
  border: none;
  margin: 0.5rem;
}
#page .view-newsletter-home .view-content {
  position: relative;
}
#page .view-newsletter-home .view-content::after {
  background-color: var(--color-primary-200);
  content: "";
  display: block;
  height: 100%;
  left: 1rem;
  position: absolute;
  top: 1rem;
  width: 100%;
}
#page .view-newsletter-home .views-field-flipbook-cover__target-id a {
  display: flex;
  justify-content: center;
}
#page .view-newsletter-home .views-field-flipbook-cover__target-id a img,
#page .view-newsletter-page .views-field-flipbook-cover__target-id a img {
  border: 4px solid #a69c5b00;
  display: block;

  -webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  -ms-transition: all 200ms ease-in-out;
  -o-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
}
#page .view-newsletter-home .views-field-flipbook-cover__target-id a:hover img,
#page .view-newsletter-page .views-field-flipbook-cover__target-id a:hover img {
  border: 4px solid #a69c5b;
}

/* Responsive */

@media screen and (min-width: 681px) {
  #page .view-newsletter-page .view-content {
    column-gap: 2rem;
    row-gap: 3rem;
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (min-width: 981px) {
  #page .view-newsletter-page .view-content {
    column-gap: 2rem;
    row-gap: 3rem;
    grid-template-columns: repeat(5, 1fr);
  }
}
/*----- NEWSLETTER - Close -----*/

/* PAGINATION - OPEN */
#main nav.pager ul.pager__items .pager__item a {
  color: #352d51;
  background: #e0dcec;
  border-radius: 0;
  padding: 0.3125rem 0.75rem;
}

#main nav.pager ul.pager__items .pager__item a:hover {
  color: #fff;
  background-color: var(--color-secondary);
}

#main nav.pager ul.pager__items .pager__item.is-active a {
  color: white;
  background: #563e96;
}

#main nav.pager ul.pager__items .pager__item.is-active a:hover {
  color: #fff;
  background-color: var(--color-secondary);
}

#main nav.pager ul.pager__items .pager__item.pager__item--first a::before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f323";
  font-size: 0.8rem;
}

#main nav.pager ul.pager__items .pager__item.pager__item--last a::before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f324";
  font-size: 0.8rem;
}

#main nav.pager ul.pager__items .pager__item.pager__item--previous a::before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f053";
  font-size: 0.8rem;
}

#main nav.pager ul.pager__items .pager__item.pager__item--next a::before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f054";
  font-size: 0.8rem;
}

#main nav.pager ul.pager__items .pager__item.pager__item--previous a span,
#main nav.pager ul.pager__items .pager__item.pager__item--next a span,
#main nav.pager ul.pager__items .pager__item.pager__item--first a span,
#main nav.pager ul.pager__items .pager__item.pager__item--last a span {
  display: none;
}

@media screen and (min-width: 768px) {
  #main nav.pager ul.pager__items .pager__item a {
    padding: 0.3125rem 0.9375rem;
  }
}
/* PAGINATION - CLOSE */

/* EDUCATION RESOURCES - OPEN */

#page .educational-resources-home-section {
  background: var(--color-primary)
    url("/sites/default/files/theme/images/bg-section-02-2.jpg") no-repeat top
    center;
  background-size: cover;
  left: 50% !important;
  margin-bottom: 0 !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  margin-top: 0 !important;
  max-width: none !important;
  padding: 5rem 1rem 5.5rem 1rem;
  position: relative !important;
  position: relative;
  right: 50% !important;
  width: 100vw !important;
}

#page .educational-resources-home-section > .views-element-container {
  margin-left: auto;
  margin-right: auto;
  max-width: 1150px;
  width: 100%;
}

/* RESOURCES INTRO - OPEN */
#page
  .educational-resources-home-section
  .educational-resources-intro
  .columns-grid {
  align-items: center;
}

#page
  .educational-resources-home-section
  .columns-grid
  .columns-grid-column:last-child {
  justify-self: start;
}

@media screen and (min-width: 768px) {
  #page
    .educational-resources-home-section
    .columns-grid
    .columns-grid-column:last-child {
    justify-self: end;
  }
}

#page .educational-resources-home-section .educational-resources-intro h1 {
  color: var(--color-secondary) !important;
  /* margin: 0 !important; */
}

#page .educational-resources-home-section .educational-resources-intro a {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}

#page
  .educational-resources-home-section
  .educational-resources-intro
  a.btn-indigo::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

/* RESOURCES INTRO - CLOSE */

#page .educational-resources .card-wrapper {
  border: 1px solid #a69c5b;
}

#page .educational-resources .card-wrapper:hover {
  border: 1px solid #fff;
}

#page
  .educational-resources.card-grid
  .view-content
  .views-row
  .card-wrapper
  .card-content
  .poster-image
  img {
  height: 264px;
}

#page .educational-resources .card-wrapper .card-content .content {
  background-color: #a69c5bcc;
}

#page .educational-resources .card-wrapper .card-content .content .title {
  padding: 1.5rem 1.5rem 1.75rem 1.5rem;
  color: #fff;
  font-family: var(--font-family-secondary);
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 400;
  line-height: 110%;
}

#page .educational-resources .card-wrapper:hover .card-content .content .title {
  padding: 24px;
}

#page .educational-resources .card-wrapper .card-content .content .body {
  color: #fff;
}

#page
  .educational-resources
  .card-wrapper
  .card-content
  .content
  .body
  .description {
  margin-bottom: 1.5rem;
}

#page .educational-resources .card-wrapper .card .read-more {
  padding: 0;
}

#page .educational-resources .card-wrapper .card .read-more a {
  color: var(--color-text);
  background-color: #fff;
}

#page .educational-resources .card-wrapper .card .read-more a::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
  color: #a69c5b;
}

#page .educational-resources .card-wrapper .card .read-more a:hover::after {
  color: #fff;
}

#page .educational-resources .card-wrapper .card .read-more a:hover {
  color: #fff;
  background-color: var(--color-primary);
}

@media screen and (min-width: 768px) {
  #page .educational-resources.card-grid .view-content {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (min-width: 1024px) {
  #page .educational-resources-home-section .educational-resources-intro {
    padding-left: 33.3%;
  }

  #page .educational-resources.card-grid .view-content {
    grid-template-columns: repeat(2, 1fr);
    padding-left: 33.3%;
  }

  #page
    .educational-resources.educational-resources-page.card-grid
    .view-content {
    grid-template-columns: repeat(3, 1fr);
    padding-left: 0;
  }
}

@media screen and (min-width: 1440px) {
  #page .educational-resources-home-section {
    padding: 5rem 0 5.5rem 0;
  }
}

/* EDUCATION RESOURCES - CLOSE */

/*----- EDUCATION RESOURCES PAGE - Open -----*/
#page .view-edu-res-cat > .view-content {
  column-gap: 2rem;
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  row-gap: 2rem;
}

#page .view-edu-res-cat > .view-content > .views-row {
 border: 1px solid #ECE7FC;
}

#page .view-edu-res-cat > .view-content > .views-row > .views-field-name h3 {
  color: #563E96;
  font-family: var(--font-family-secondary);
  line-height: 129%;
  background: var(--color-light);
  padding: 1rem 1.5rem;
  font-size: 1.75rem;
  margin: 0 !important;

}

#page .view-edu-res-cat > .view-content > .views-row > .views-field-nothing .edres-cat-wrapper {
  padding: 1rem 1.5rem;
  display: flex;
  gap: 2rem;
  justify-content: space-between;
  align-items: center;
}


#page .view-edu-res-cat > .view-content > .views-row > .views-field-nothing .edres-cat-wrapper .edres-cat-desc p {
  margin: 0;
  font: var(--font-family-primary);
  font-size: 1rem;
  line-height: 160%;
  color: #343336;
}

#page .view-edu-res-cat > .view-content > .views-row > .views-field-nothing .edres-cat-wrapper a.edress-cat-btn {
  display: flex;
  gap: 0.5rem;
  background-color: #563E96;
  color: #fff;
  font: var(--font-family-primary);
  font-size: 1rem;
  line-height: 160%;
  font-weight: 500;
  padding: 0.5rem 0.75rem;
}

#page .view-edu-res-cat > .view-content > .views-row > .views-field-nothing .edres-cat-wrapper a.edress-cat-btn:hover {
  background-color: var(--color-secondary);
}

#page .view-edu-res-cat > .view-content > .views-row > .views-field-nothing .edres-cat-wrapper a.edress-cat-btn::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

.edu-res-cat-popup .mfp-content {
  padding: 0;
}

.edu-res-cat-popup .mfp-content .popup-wrapper .popup-header {
  background: linear-gradient(90deg, #563E96 0%, #563E96 100%);
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
}

.edu-res-cat-popup .mfp-content .popup-wrapper .popup-header h2 {
  color: #fff;
  margin: 0 !important;
  font-family: var(--font-family-secondary);
  line-height: 120%;
  font-size: 2.5rem;
}

.edu-res-cat-popup .mfp-content .popup-wrapper .popup-header .popup-close {
  font-size: 28px;
  color: #F7F5FD;
  cursor: pointer;
  transition: all 300ms;
}

.edu-res-cat-popup .mfp-content .popup-wrapper .popup-header .popup-close:hover {
  color: var(--color-secondary);
}

.edu-res-cat-popup .mfp-content .popup-wrapper .links {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 2rem;
  padding: 2rem 2rem 3.875rem 2rem;
}

.edu-res-cat-popup .mfp-content .popup-wrapper .links .coming-soon {
  font-size: 1.125rem;
  color: var(--color-secondary);
  font-weight: 500;
}

.edu-res-cat-popup .mfp-content .popup-wrapper .links a {
  font-family: var(--font-family-primary);
  font-size: 1rem;
  line-height: 140%;
  font-weight: 500;
  color: #563E96;
  border-bottom: 1px solid #A69C5B;
  padding-bottom: 1rem;
}

.loading::after {
  content: '';
  position: fixed;
  top: 50%;
  left: 50%;
  width: 50px;
  height: 50px;
  border: 5px solid var(--color-primary);
  border-top: 5px solid var(--color-secondary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  z-index: 9999;
}

body.loading #apb-wrapper {
  opacity: .2;
}

@keyframes spin {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}


@media screen and (min-width: 1024px) {
  #page .view-edu-res-cat > .view-content {
    grid-template-columns: repeat(2, 1fr);
  }

  .edu-res-cat-popup .mfp-content .popup-wrapper .popup-header {
    align-items: center;
    padding: 1rem 2rem;
  }

  .edu-res-cat-popup .mfp-content .popup-wrapper .links {
    grid-template-columns: repeat(2, 1fr);
  }
}

/*----- EDUCATION RESOURCES PAGE - Close -----*/

/* EDUCATION FREEDMENS HEIRS NEWS - OPEN */

#page .freedmen-heirs-news-section-home {
  position: relative;
  padding: 5rem 0 5.5rem 0;
  margin-top: 0 !important;
  background: linear-gradient(180deg, #f7f5fd 0%, #e0dcec 100%);
}

#page .freedmen-heirs-news-section-home::before,
#page .freedmen-heirs-news-section-home::after {
  content: "";
  width: 50vw;
  top: 0;
  bottom: 0;
  position: absolute;
  transform: translateX(-100%);
  background: linear-gradient(180deg, #f7f5fd 0%, #e0dcec 100%);
}

#page .freedmen-heirs-news-section-home::before {
  left: 0;
  transform: translateX(-100%);
}

#page .freedmen-heirs-news-section-home::after {
  right: 0;
  transform: translateX(100%);
}

/* INTRO - OPEN */

#page .freedmen-heirs-news-section-home a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  width: fit-content;
  border: none;
}

#page .freedmen-heirs-news-section-home a:hover {
  border: none;
}

#page .freedmen-heirs-news-section-home a.btn-white::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

#page
  .freedmen-heirs-news-section-home
  .columns-grid
  .columns-grid-column:last-child {
  justify-self: start;
}

@media screen and (min-width: 768px) {
  #page
    .freedmen-heirs-news-section-home
    .columns-grid
    .columns-grid-column:last-child {
    justify-self: end;
  }
}

/* INTRO - CLOSE */

#page .freedmen-heirs-news .card-wrapper:hover {
  background-color: var(--color-primary);
}

#page .freedmen-heirs-news .card-wrapper:hover .card-content .content {
  background-color: var(--color-primary);
}

#page .freedmen-heirs-news .card-wrapper .card-content .content .title,
#page .freedmen-heirs-news .card-wrapper .card-content .title-clone {
  padding: 1.5rem;
}

#page .fhf-news-page .card-wrapper .card-content .content .title .news-date {
  align-items: center;
  color: var(--color-secondary);
  display: flex;
  font-family: var(--font-family-primary);
  font-size: 0.875rem;
  font-weight: 600;
  gap: 0.5rem;
  margin-bottom: 0.25rem;
  text-transform: uppercase;
}
#page
  .fhf-news-page
  .card-wrapper
  .card-content
  .content
  .title
  .news-date::before {
  font-family: "Font Awesome 6 Pro";
  font-size: 1rem;
  font-weight: 900;
  content: "\e0d5";
  display: block;
}
#page
  .fhf-news-page
  .card-wrapper:hover
  .card-content
  .content
  .title
  .news-date {
  color: var(--color-white);
}

#page .freedmen-heirs-news .card-wrapper:hover .card-content .content .title,
#page .freedmen-heirs-news .card-wrapper:hover .card-content .title-clone {
  color: white;
}

#page .freedmen-heirs-news .card-wrapper .card-content .content .body {
  color: white;
  padding: 0 1.5rem;
}

#page .freedmen-heirs-news .card-wrapper .card .read-more {
  padding: 0.25rem 1.5rem 1.75rem 1.5rem;
}

#page
  .freedmen-heirs-news
  .view-content
  .views-row
  .card-wrapper:hover
  .card
  .read-more
  a {
  background-color: #fff;
  color: var(--color-primary);
}
/* EDUCATION FREEDMENS HEIRS NEWS - CLOSE */

/*----- NEWS PAGE - Open -----*/
#page .field--type-datetime {
  align-items: center;
  color: var(--color-secondary);
  display: flex;
  font-size: 0.875rem;
  font-weight: 600;
  gap: 0.5rem;
  /* margin-bottom: 0.25rem; */
  text-transform: uppercase;
}
#page .field--type-datetime::before {
  color: var(--color-secondary);
  content: "\e0d5";
  display: block;
  font-family: "Font Awesome 6 Pro";
  font-size: 1rem;
  font-weight: 700;
}

/*----- NEWS PAGE - Close -----*/

/*----- IN THE NEWS - Open -----*/
#page .fhf-in-the-news .view-content {
  display: grid;
  column-gap: 1rem;
  row-gap: 1rem;
  grid-template-columns: 1fr;
}
#page .fhf-in-the-news .view-content img {
  display: block;
  border-bottom: 0.5rem solid var(--color-primary);
  margin-bottom: 0.5rem;
}
#page .fhf-in-the-news .views-field-title a {
  font-family: var(--font-family-secondary);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 140%;
}
#page .views-field-field-news-date {
  align-items: center;
  color: var(--color-secondary);
  display: flex;
  font-size: 0.875rem;
  font-weight: 600;
  gap: 0.5rem;
  margin-bottom: 0.25rem;
  text-transform: uppercase;
}
#page .views-field-field-news-date::before {
  color: var(--color-secondary);
  content: "\e0d5";
  display: block;
  font-family: "Font Awesome 6 Pro";
  font-size: 1rem;
  font-weight: 700;
}

/* Responsive */

@media screen and (min-width: 681px) {
  #page .fhf-in-the-news .view-content {
    column-gap: 2rem;
    row-gap: 3rem;
    grid-template-columns: repeat(3, 1fr);
  }
}
/*----- IN THE NEWS - Close -----*/

/* OUR MISSION AND VISION - OPEN */

#page .our-mission-vision-intro {
  margin: 3rem 0 1.25rem 0 !important;
}

#page .our-mission-vision-feature-box {
  margin: 0 0 5.5rem 0 !important;
}

#page
  .our-mission-vision-feature-box
  .views-element-container
  .views-row.apb-fb-landscape {
  margin: 0 !important;
}

#page .our-mission-vision-feature-box .apb-fb-button a {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border: none !important;
  background-color: #fff !important;
  color: var(--color-primary) !important;
  padding: 0.5rem 0.75rem;
  margin: 0;
}

#page .our-mission-vision-feature-box .apb-fb-button a::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

#page .our-mission-vision-feature-box .apb-fb-button a:hover {
  color: #fff !important;
  background-color: var(--color-secondary) !important;
}

/* OUR MISSION AND VISION - CLOSE */

/* MEMBERS BENEFITS - OPEN */

#page .members-benefits-home-section {
  margin: 5rem 0 5.5rem 0 !important;
}
#page .members-benefits-home-section .apb-section-title {
  color: var(--color-heading) !important;
  font-size: 3.25rem !important;
  text-align: center;
}

#page .members-benefits-home-section h1 {
  color: var(--color-secondary);
}

#page .members-benefits-home-section a.btn-white {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  width: fit-content;
}

#page .members-benefits-home-section a.btn-white::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

/* MEMBERS BENEFITS - CLOSE */

/* BLOG HOME - OPEN */

#page .blog-home-section {
  margin: 5rem 0 5.5rem 0 !important;
}

/* INTRO - OPEN */

#page .blog-home-section a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  width: fit-content;
  background-color: var(--color-primary-50);
  border: none;
}

#page .blog-home-section a:hover {
  border: none;
}

#page .blog-home-section a.btn-white::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

#page .blog-home-section .columns-grid .columns-grid-column:last-child {
  justify-self: start;
}

@media screen and (min-width: 768px) {
  #page .blog-home-section .columns-grid .columns-grid-column:last-child {
    justify-self: end;
  }
}

/* INTRO - CLOSE */

#page .blog .card-wrapper .card-content .content .body {
  padding: 0;
}

#page .blog .card-wrapper .card-content .content .title,
#page .card-wrapper .card-content .title-clone {
  padding: 1.5rem 0;
}

#page .blog .card-wrapper .card .read-more {
  margin-top: auto;
  padding: 0.25rem 0rem 1.75rem 0rem;
}

/* BLOG HOME - CLOSE */

/* BLOG - OPEN */

#page .blog-sidebar .sidebar {
  border-bottom: 1px solid var(--color-secondary);
  margin-bottom: 1rem;
  padding-bottom: 1rem;
}

#page .blog-sidebar .view-content .views-row:last-child .sidebar {
  margin-bottom: 0;
  border: none;
}

#page .blog-sidebar .date {
  font-family: var(--font-family-primary);
  display: flex;
  gap: 0.5rem;
  align-items: center;
  color: var(--color-secondary);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 0.5rem;
}

#page .blog-sidebar .date::before {
  font-family: "Font Awesome 6 Pro";
  content: "\e0d5";
  display: block;
  color: #a69c5b;
}

#page .blog-sidebar .title {
  font-family: var(--font-family-secondary);
  color: var(--color-primary);
  font-size: 1rem;
  line-height: 140%;
  font-weight: 500;
  transition: all 300ms;
}

#page .blog-sidebar .view-footer a.view-more {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #fff;
  background-color: #563e96;
  padding: 0.5rem 0.75rem;
  line-height: normal;
  width: fit-content;
  transition: all 300ms;
}

#page .blog-sidebar .view-footer a.view-more:hover {
  color: #fff;
  background-color: var(--color-secondary);
  text-decoration: none;
}

#page .blog-sidebar .view-footer a.view-more::after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  content: "\f061";
  display: block;
}

/* BLOG - CLOSE */

/*----- BLOG - MENU - Open -----*/
#page .blog-menu-block {
  padding-top: 3rem;
}
#page .blog-menu-block .views-row {
  margin-bottom: 1.25rem;
}
#page .blog-menu-block .views-row:last-child {
  margin-bottom: 0;
}
#page .blog-menu-block .views-row .title a {
  display: block;
  font-family: "droid-serif";
  font-size: 1.125rem;
  line-height: 130%;
}
#page .blog-menu-block .views-row .date {
  align-items: center;
  color: var(--color-secondary);
  display: flex;
  font-family: var(--font-family-primary);
  font-size: 0.8125rem;
  font-weight: 600;
  gap: 0.5rem;
  margin-bottom: 0;
  text-transform: uppercase;
}
#page .blog-menu-block .views-row .date::before {
  font-family: "Font Awesome 6 Pro";
  font-size: 1rem;
  font-weight: 900;
  content: "\e0d5";
  display: block;
}
/*----- BLOG - MENU - Close -----*/
