/* new css for bottom section */
  #middle {


  }
  
  @media (min-width: 1400px) {
    .container {
        max-width:1340px;
    }
    
    #bar-post .bkg-title h4 + div {
    display: none;
}

		#bar-post .bkg-title {
    margin-bottom: .75rem;
}
}
/* Changes ported from Hay page */
/* fix up page heading */
@media screen and (min-width: 992px) {
.carousel-caption {
    padding-top:121px;
}
}
  
      .col .breadcrumb .ml-auto.d-none.d-md-block .social-row {
        display: none;
    }

@media screen and (max-width: 1200px) and (min-width: 992px) {
    .col-lg-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 80%;
    }

}

@media screen and (max-width: 991px) {

    .carousel-caption:has(h1:empty) {
        display: none;
    }

    .breadcrumb-item.active {
        display: none;
    }

    .carousel-caption {
        background-color: #33266e;
    }
    .carousel-caption h1 {
        color: white;
    }
}

/* stop share button floating on mobile */
@media (max-width: 991.98px) {
   #content.container .share-button-hover {
border: 1px solid #33266e;
    color: #33266e;
    cursor: pointer;
    display: inline-block;
    position: relative;
    margin-top: 1rem;
    left: unset;
    bottom: unset;
    }
}

/* make in-page images span full width on smaller screens */
#content img {
    width: 100%;
    max-width: min(100%, 1000px)
}

/* lower the thickness of bolded text */
#content strong {
    font-weight: 600;
}

#content .text-content > .testimonial + p + p:has(img),
#content .text-content > p:has(img) + p + .testimonial,
#content .text-content > blockquote + p + .testimonial,
#content .text-content > .testimonial + p + blockquote {
    margin-top: 1.3rem;
  }
  
  
/* Remove social links in breadcrumbs */
.col .breadcrumb .ml-auto.d-none.d-md-block .social-row {
        display: none;
    }
  
/* Accordion styling */

.accordion {
  font-style: normal;
  font-weight: 400 !important;
  background-color: var(--primary-lighter);
  font-size: 100%;
  width: 100%;
  padding: 1.2rem 2rem 1.4rem 2rem;
  margin-left: auto;
  margin-right: auto;
  max-width: calc(100% - 6rem);
  box-sizing: border-box;
  border-radius: 10px;
  text-align: left;
  border: 1px solid var(--primary);
  margin-bottom: 1rem;
}

.accordion-body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 300ms ease;
}

.accordion-wrapper {
  overflow: hidden;
}

.accordion-body.open {
  grid-template-rows: 1fr;
}

.accordion .accordion-title-wrapper {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  align-items: center;
  align-content: stretch;
}

#content .accordion .accordion-title {
  font-weight: 600;
  color: var(--primary);
}

#content .accordion .accordion-title strong {
  font-weight: 800;
}

.accordion .accordion-button {
  background-color: transparent;
  border-radius: 4px;
  border-color: transparent;
  border-width: 2px;
  outline-color: transparent;
  border-style: solid;
  outline-width: 0;
}

.accordion .accordion-button,
.accordion .accordion-button:before {
  transition: border-color 0.2s, background-color 0.2s, color 0.2s;
}

.accordion .accordion-button:focus {
  border-color:  var(--primary);
  outline-color: transparent;
}

.accordion .accordion-button:focus-visible {
  background-color:  var(--primary);
  border-radius: 4px;
  border-color:  var(--primary);
  outline-width: 2px;
  outline-color:  var(--secondary);
  color: white;
  transition: border-color 0.2s, background-color 0.2s;
}

.accordion .accordion-button:before {
  line-height: 1.3em;
}

.accordion .accordion-button:focus-visible:before {
  color: white;
}

.accordion .accordion-button:before {
  transition: transform 0.2s;
}

.accordion:has(.open) .accordion-button:before {
  transform: rotate(180deg) translateY(-2px);
  transition: transform 0.2s;
}

.accordion .accordion-body .accordion-wrapper {
  padding-top: -1rem;
  transition: padding-top 0.4s;
}

.accordion .accordion-body.open .accordion-wrapper {
  padding-top: 1rem;
}

@media screen and (max-width: 776px) {
  #content .accordion .accordion-button {
    margin-left: -0.5rem;
    margin-right: 0.5rem;
  }
  #content .accordion .accordion-button:before {
  }
  #content .accordion-title-wrapper {
    gap: 0.5em;
  }
}

.accordion .accordion-button:before {
  content: "\f078";
  font-family: "FontAwesome";
  font-weight: 400;
  color: var(--primary);
  display: inline-flex;
  width: 1.5rem;
  font-size: 1.5rem;
}

.accordion .sr-text {
  visibility: hidden;
  font-size: 0;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  color: transparent;
}

@media screen and (max-width: 1199px) {
  #content .accordion {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
    max-width: 100%;
  }
}
  
  .accordion .accordion-body p:empty {
    margin: 0;
    padding: 0;
    display: none;
}
  
/* Testimonial styling */
 #content .testimonial {
     font-style: normal;
     font-weight: 400 !important;
     background-color: var(--primary-lighter);
     font-size: 100%;
     width: 100%;
     padding: 1.2rem 2rem 1.4rem 2rem;
     margin-left: auto;
     margin-right: auto;
     max-width: calc(100% - 6rem);
     box-sizing: border-box;
     border-radius: 10px;
     text-align: left;
}
 @media screen and (max-width: 1199px) {
     #content .testimonial {
         margin-left: 0;
         margin-right: 0;
         width: 100%;
         max-width: 100%;
    }
}
/* remove whitespace below last paragraph in a quote or testimonial */
 #content .testimonial p:last-of-type {
     margin-bottom: 0;
}
/* remove extra <p> tags added when parsing testimonials */
 .testimonial p:empty, #content p:has(+ .testimonial), #content .testimonial + p{
     display: none;
}

  /* remove whitespace below last paragraph in a quote or testimonial */
 #content .testimonial .testimonial-text > p:last-of-type:empty {
     display: block ;
}
  
  
 #content .testimonial {
     margin-bottom: 1rem;
     padding: 1.2rem 2rem 1.2rem 2rem;
}
 .testimonial .testimonial-contents {
     display: flex;
     flex-direction: row;
     gap: 1rem;
     align-items: center;
}
 .testimonial .testimonial-contents .testimonial-image {
     max-width: min(20%, 150px);
     margin-left: -.6rem;
     padding-right: .6rem;
     padding-top: .2rem;
}
 .testimonial .testimonial-contents .testimonial-image .image img {
     width: 100%;
     object-fit: cover;
     height: 100%;
     border-radius: 10px;
     aspect-ratio: 1;
     object-position: center center;
}
 .testimonial .testimonial-contents .testimonial-image {
     display: none;
}
 .testimonial .testimonial-contents .testimonial-image:has(.image img) {
     display: flex;
     align-items:center;
}
 .testimonial p.name {
     margin-bottom: 0;
     padding-top: 1rem;
     font-size: 90%;
     font-weight: 500;
     color: var(--primary);
     padding-bottom: .25rem;
}
 .testimonial p.name:before {
     content:"– ";
     font-weight:800;
}
 #content .testimonial-text:before {
     font-size: 110%;
     float: left;
     line-height: 1.36;
     align-content: baseline;
     margin-right: .5rem;
     content: '\f10d';
     font-family: 'FontAwesome';
     color: var(--primary);
}
 #content .testimonial-text p:last-of-type:after {
     content: '\f10e';
     font-family: 'FontAwesome';
     float: none;
     display: inline-block !important;
     font-size: 110%;
     margin-left: .4rem;
     color: var(--primary);
     line-height: 0;
}
  
  
 @media screen and (max-width: 767px) {
     .testimonial .testimonial-contents {
         flex-direction: column;
    }
     .testimonial .testimonial-contents .testimonial-image {
         max-width: min(70%, 130px);
         margin-left: 0rem;
         padding-right: 0rem;
         padding-top: 0rem;
    }
}
 #content .text-content > .testimonial + p + p:has(img), #content .text-content > p:has(img) + p + .testimonial {
     margin-top: 1.3rem;
}
 .testimonial .testimonial-contents .job {
     display: inline-block;
}
  
/* disable flag button */
.byline .flag {
    display: none;
}
  
/* fix 'read more' posts */

#bar-post {
    display: flex;
    flex-direction: column;
    max-width: 100%;
    overflow: hidden;
}

  
/* Video Specific Content */
.media-content-wrapper p:empty {
    display: none;
}

.media-content-wrapper {
        gap: 2rem;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        width: 100%;
        margin-bottom: 24px;
        max-width: 100%;
}

.testimonial-text .media-content-wrapper {
            margin-bottom: 1rem;
}

@media screen and (max-width: 767px) {
    .media-content-wrapper {
        flex-direction: column-reverse;
        gap: 1rem;
    }
}

.custom-wrapper {
    border-radius: 6px;
    width: auto;
    max-width: 100% !important;
    flex-basis: 50%;
    line-height: 0;
    max-height: unset !important;
}

.custom-wrapper--youtube iframe {
    max-height: 100% !important;
    max-width: 100% !important;
}

.custom-wrapper--spotify iframe {
    max-width: 100% !important;
}

.custom-wrapper--image > img,
.custom-wrapper--youtube > iframe{
    aspect-ratio: 16/9 !important;
    object-fit: cover;
    width: 100%;
    border-radius: 8px;
}  

.custom-wrapper--spotify {
  display: flex;
    flex-direction: column;
    justify-content: center;
}

.custom-wrapper--spotify > iframe{
    min-height: 152px;

    object-fit: cover;
    width: 100%;
    border-radius: 8px;
}  
  
/* try to ensure good spacing depending on where media-content ends up */
.media-content-wrapper:not(.testimonial-text .media-content-wrapper, .accordion-wrapper .media-content-wrapper) {
    margin-top: 28px;
}
  
/* Alter header height if no heading in the featured image slider */ 
#feature-1:has(.carousel-caption h1:empty) img {
    aspect-ratio: 9 / 2 !important;
    object-fit: cover;
    min-height: 200px;
    object-position: center;
}

@media screen and (min-width: 991px) {
#feature-1:has(.carousel-caption h1:empty) img {
    aspect-ratio: 9 / 2 !important;
    object-fit: cover;
    object-position: center;
}
}

.row.keep-reading-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-inline: 0;
    flex-wrap: wrap;
    align-items: flex-end;
}

.row.keep-reading-row h2 {
    margin: 0;
}

.row.keep-reading-row a {
    display: inline-block;
    margin-bottom: 3px;
}

#middle .share-button-hover .label i {
    margin-right: 0;
}

@media screen and (min-width:992px) {
#carousel-generic:has(h1:not(:empty)) .carousel-inner .carousel-caption:after
 {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000000;
    background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.24) 0%, transparent 100%), -webkit-linear-gradient(top, rgba(0, 0, 0, 0.24) 0%, transparent 100%);
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.24) 0%, transparent 100%), linear-gradient(180deg, rgba(0, 0, 0, 0.24) 0%, transparent 100%);
     backdrop-filter: brightness(0.65);
  }
  #carousel-generic:has(h1:not(:empty)) .carousel-inner .carousel-caption .container {
        z-index: 2;
    position: relative;
  }
 }

@media screen and (max-width: 991px) {
.carousel-inner .caption-box.pl-sm-4 {
    padding-left: 0 !important;
}
}

.next-prev {
    position: absolute;
    z-index: 9;
    color: var(--secondary);
    background-color: #ffffff;
    font-size: 1rem;
    line-height: 1.3em;
    padding: .35em 1em 0em 1em;
    font-weight: 600;
        bottom:0;
    margin-bottom: 0;
        text-decoration: underline;
    text-decoration-color: var(--secondary-transparent);
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
    transition: text-decoration-color 0.2s;
}

.next-prev.next-prev--prev {
    border-radius: 0px 6px 0px 0px;
    left: 0;
}

.next-prev.next-prev--prev:hover,
.next-prev.next-prev--prev:focus-visible,
.next-prev.next-prev--next:hover,
.next-prev.next-prev--next:focus-visible{
    text-decoration-color: var(--secondary-light);
}

.next-prev.next-prev--next {
    border-radius: 6px 0px 0px 0px;
    right: 0;
}

@media screen and (max-width: 694px) {
  .next-prev.next-prev--next {
    border-radius: 0px 6px 0px 0px;
    left: 0;
      right: unset;
}  
}

@media screen and (min-width: 695px) {
    #middle .container .custom-post-card--container:has(.custom-post-card-next):not(:has(.custom-post-card-prev)) .custom-post-card-next {
        flex-basis: calc(50% - 1.5rem);
        flex-grow: 0;
    }
    #middle .container .custom-post-card--container:has(.custom-post-card-prev):not(:has(.custom-post-card-next)) .custom-post-card-prev{
        flex-basis: calc(50% - 1.5rem);
        flex-grow: 0;
        
    }
}