@font-face { font-family: "Open Sans"; src: url("https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-muw.woff2") format("woff2"); font-style: normal; font-weight: 400; font-stretch: 100%; unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; display: swap;}
@font-face { font-family: "Dosis"; src: url("https://fonts.gstatic.com/s/dosis/v27/HhyaU5sn9vOmLzloC_U.woff2") format("woff2"); font-style: normal; font-weight: 300; unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; display: swap;}
@font-face { font-family: 'WindSong'; src: url('../fonts/WindSong-Medium.ttf') format('truetype'); font-weight: normal; font-style: normal; display: swap;}
@font-face { font-family: 'JosefinSans'; src: url('../fonts/JosefinSans-Light.ttf') format('truetype'); font-weight: normal; font-style: normal; display: swap;}
@font-face { font-family: 'Gelasio'; src: url('../fonts/Gelasio-VariableFont_wght.ttf') format('truetype'); font-weight: 400 700; display: swap;}
@font-face { font-family: 'Gelasio Italic'; src: url('../fonts/Gelasio-Italic-VariableFont_wght.ttf') format('truetype'); font-weight: 400 700; display: swap;}
@font-face { font-family: 'Quicksand'; src: url('../fonts/Quicksand-VariableFont_wght.ttf') format('truetype'); font-weight: 300 700; display: swap;}

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');

/* Globals */
:root {
  --wt-black: #1F1D28;
  --wt-dark: #1D1E3E;
  --wt-udeep: #091C5B;
  --wt-deep: #295c88;
  --wt-mid: #3A71A0;
  --wt-light: #96AAD5;
  --wt-bright: #CBECFD;

  --wt-navbar-height: 5.5rem;
}

.emphasis {
  font-weight: bold; 
  color: var(--wt-udeep);
}

.pt-6 {
  padding-top: 6rem !important;
}
.pb-6 {
  padding-bottom: 6rem !important;
}
.pb-2 {
  padding-bottom: 2rem !important;
}
.mt-6 {
  margin-top: 6rem !important;
}

/* Preloader - spinner that vanishes after page load */
.se-pre-con {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9000 !important;
    background: url(/img/preloader.gif) center no-repeat #ffffff;
}

/* Give it a little starter background */
.content {
  background-size: initial;
  background-position: center top;
  background-repeat: no-repeat;
  background-image: url("/img/content-bg.jpg") !important;
}

/*** Introductory video on landing page ***/
#intro-video {
  position: relative;
  width: 100%;
  min-height: calc(100vh - var(--wt-navbar-height));
  overflow: hidden;
  /* stuff that might not be neccessary, try if a browser is being stupid
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin: 0;
  padding: 6rem calc(7.142857% + 2rem);
  z-index: 1;
  */
}

#intro-video video {
  position: absolute;
  min-width: 100%;
  /* More seemingly unneeded stuff
  width: auto;
  min-width: 100%;
  height: auto;
  min-height: 100%;
  display: block;
  margin: 0;
  padding: 0;
  */

  /* This helps neatly center the video */
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  
  backface-visibility: hidden;
}

/** All the parts that float over the video **/
#intro-video .intro-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#intro-video .intro-text {
  width: 100%;
  color: var(--wt-udeep);
  font-weight: 900;
  text-shadow: 0px 4px 6px var(--wt-dark);
  opacity: 0;
  animation: intro-text-glide 4s forwards;
  word-wrap: normal;
}

#intro-logo-zoom {
  background-image: url(/img/intro/logo-dark-opt.png);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  animation: intro-logo-zoom 4s 0.3s forwards;
  animation-delay: 2s;
  width: 75%;
  height: 75%;
}

#intro-powerful-stories {
  font-size: 2.3vw;
  letter-spacing: 1vw;
  animation-delay: 3s !important;
}

#intro-making-waves {
  font-size: 2.5vw;
  letter-spacing: 0.5vw;
  animation-delay: 6.5s !important;
}

#intro-fulllogo-fadein {
  background-image: url(/img/intro/logo-text-opt.png);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  width: 75%;
  height: 75%;
  animation-delay: 10s !important;
  animation: intro-fullogo-fadein 6s forwards;
  opacity: 0;
}

#intro-logo-fadein {
  background-image: url(/img/intro/logo-dark-opt.png);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  width: 50%;
  height: 50%;
  animation-delay: 16s !important;
  animation: intro-logo-outro 3s forwards;
  opacity: 0;
}

@keyframes intro-logo-zoom {
  to {
    transform: translate(-50%, -700%) scale(200);
  }
}

@keyframes intro-text-glide {
  30% {
    opacity: 1;
  }
  80% {
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.5);
    opacity: 0;
  }
}

@keyframes intro-fullogo-fadein {
  0% {
    transform: translate(-50%, -50%) scale(0.25);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes intro-logo-outro {
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.5);
  }
}

#mainNav .navbar-nav {
  align-items: center;
}

#footer > div > div > div:nth-child(2) > ul.footer-nav {
  list-style-type: none;
}

#footer ul.footer-nav li {
  padding: 0.5rem 0;
}

#footer ul.footer-nav a, #footer a {
  text-decoration: none;
  color: white;
  font-weight: bold;
  transition: all 0.3s ease-in-out
}

#footer ul.footer-nav a:hover, #footer a:hover {
  padding-left: none !important;
  color: var(--wt-udeep);
  transition: all 0.3s ease-in-out
}

#navbarResponsive {
  justify-content: center;
}

#mainNav .navbar-collapse.collapse .navbar-nav > li:last-child {
  margin-bottom: 1rem;
  margin-left: 1rem;
  margin-right: 1rem;
}

#mainNav .navbar-collapse.collapse.show .navbar-nav > li:last-child {
  margin-right: 0;
  padding: 0;
} 

#mainNav .navbar-collapse.collapse.show .navbar-nav > li:last-child a {
  margin: 0 auto;
}

#mainNav .nav-item {
  max-width: 200px;
  text-align: center;
  line-height: 1.1;
}

#mainNav .nav-link.active {
  background-color: #e2e7ff;
  border-radius: 15px;
}

#merch .merch-banner {
  background-color: var(--wt-light);
  background-image: url(/img/merch-banner-v2.png);
  height: 400px;
  background-size: cover;
  background-position: center center;
  background-repeat: repeat;
  animation: bannermove 60s linear infinite;
  border-radius: 5%;
}

#merch .button-store {
  animation: wiggle 4s linear infinite;
}
#merch .button-store a {
  background-color: var(--wt-udeep);
  padding: 15px 25px !important;
  border-radius: 25px;
  color: white !important;
  text-decoration: none;
  font-weight: 900;
}
#merch .button-store a:hover {
  opacity: 0.8;
}

#sponsorship .button-sponsor a {
  background-color: var(--wt-udeep);
  padding: 15px 25px !important;
  border-radius: 25px;
  color: white !important;
  text-decoration: none;
  font-weight: 900;
}

#sponsorship .button-sponsor a:hover {
  opacity: 0.8;
}


.button-donate a {
  display: block;
  background-color: var(--wt-udeep);
  padding: 15px 25px !important;
  border-radius: 25px;
  color: white !important;
  text-decoration: none;
  font-weight: 900;
  width: auto;
  margin: 0 auto;
  max-width: fit-content;
}

@keyframes bannermove {
  0% {
    background-position-x: 0;
  }
  50% {
    background-position-x: 150%;
  }
  100% {
    background-position-x: 0;
  }
}

.section-header {
  background-color: var(--wt-light) !important; 
  color: white !important;
  padding: 2.5rem;
  max-width: 1080px;
  margin: auto;
  margin-bottom: 2rem;
}

.section-header.shadowed {
  box-shadow: 0px 20px 45px -15px rgba(0,0,0,0.5);
}
.section-header.shadowed:hover {
  box-shadow: 0px 32px 105px -15px rgba(0,0,0,0.5);
}

.section-header h2 {
  font-size: 44px;
  font-weight: 500;
  font-family: 'Didact Gothic',Helvetica,Arial,Lucida,sans-serif !important;
  letter-spacing: normal;
}

.section-header h4 {
  line-height: 1.2;
  font-weight: 600;
  font-size: 20px;
  line-height: 2em;
  padding: 2rem;
}

section .social-container {
  max-width: 500px;
  margin: 0 auto;
}

section .social-wrapper {
  min-width: 8rem;
  transform: translateY(-1rem);
}

section .social {
  transition: all 0.35s ease-in-out;
  height: 50px;
}
section .social:hover {
  transform: scale(1.2);
}

section .collab {
  transition: all 0.35s ease-in-out;
}
section .collab:hover {
  transform: scale(1.2);
}

.tns-item a {
  height: 140px;
  display:grid;
  align-items: center;
  justify-items: center;
  padding: 20px 0;
}

img.collab {
  max-height: 75px;
  max-width: 150px;
  display: block;
  margin: 0 auto;
}

.tns-nav, .tns-controls {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items:center;
}

@media screen and (max-width: 550px) {
  .tns-nav {display: none;}
  img.collab {max-width: 100%;}
}

.tns-nav button {
  padding: 8px;
  margin: 20px;
  border: none;
  border-radius: 50%;
  box-shadow: 0px 1px 5px slategrey;
}

button.tns-nav-active {
  background-color: grey;
  box-shadow: 0px 1px 5px black;
}

.tns-controls button {
  margin: 20px;
  padding: 10px 20px 12px 20px;
  border: none;
  border-radius: 5px;
  box-shadow: 0px 1px 5px slategrey;
}

.team-frame {
  height: 500px;
  max-width: 500px;
}

.team-frame .team-image {
  height: 100%;
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 10%;
}

.overlay-video {
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  opacity: 0;
  -ms-transition: opacity 600ms ease-in;
  transition: opacity 600ms ease-in;
  -ms-transition: opacity .6s;
  transition: opacity .6s;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, .7);
  z-index: 999999;
}

.o1 {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  opacity: 1;
  -ms-transition: opacity 600ms ease-out;
  transition: opacity 600ms ease-out;
  -ms-transition: opacity .6s;
  transition: opacity .6s;
}

.videoWrapperExt {
  position: relative;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  max-width: 982px;
  padding: 0 20px;
}

.videoWrapper {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
}

.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.close {
 background-image:url(../img/mark.png);
 background-position: 0 44px;
 background-repeat: no-repeat;
 padding-bottom: 3em;
  position: absolute;
  top: -50px;
  right: 0px;
  cursor: pointer;
  z-index: 9999;
  height: 40px;
  width: 40px;
  background-size: 40px;
}

#team .team-frame {
  position: relative;
  height: 300px;
  width: unset;
}

#team .team-frame .team-image {
  position: absolute;
  border-radius: 10%;
  transition: all 0.35s ease-in-out;
}

#team .team-frame:hover .team-image {
  filter: grayscale(1);
  opacity: 0.25;
  transform: scale(1.05);
}

#team .team-title-frame {
  position: absolute;
  height: 100%;
  width: 100%;
  opacity: 0.5;
  border-radius: 10%;
  color: black;
  pointer-events: none;
  opacity: 0;
  transition: all 0.35s ease-in-out;
}
#team .team-title-frame h3 {
  font-size: 1.5rem;
  position: relative;
  top: 50%;
  font-weight: 900;
  text-shadow: -2px -2px 0 rgb(255, 255, 255), 2px -2px 0 rgb(255, 255, 255), -2px 2px 0 rgb(255, 255, 255), 2px 2px 0 rgb(255, 255, 255);
  transform: translateY(-50%);
}

#team .team-frame:hover .team-title-frame {
  opacity: 1;
}

#signup-area {
  max-width: 700px;
}

#signup-area input {
  width: 100%;
  height: 3rem;
}

@media screen and (min-width:600px) {
  

#signup-area form {
  display: grid;
  grid-template-columns: repeat(2,auto);
  grid-template-rows: repeat(7,auto);
  grid-template-areas: 'title title'
  'fname lname'
  'email phone'
  'message1 message2'
  'disclosure disclosure'
  'button button'
  'recaptcha recaptcha'  
  ;
  height: 100%;
  min-height: 400px;
  column-gap: 1em;
} 

#signup-area form label {
  margin-bottom: 4px;
}

#signup-area .ctct-form-header {
  grid-area: title;
}

#signup-area #email_address_field_1 {
  grid-area: email
}

#signup-area #first_name_field_1 {
  grid-area: fname
}

#signup-area #last_name_field_1 {
  grid-area: lname
}

#signup-area #phone_field_1 {
  grid-area: phone
}

#signup-area #error_message_1 {
  grid-area: message1
}

#signup-area #network_error_message_1 {
  grid-area: message2
}

#signup-area #gdpr_text {
  grid-area: disclosure
}

#signup-area #button {
  grid-area: button;
}

#signup-area #ctct_recaptcha_1 {
  grid-area: recaptcha;
}

div.ctct-form-embed form.ctct-form-custom div.ctct-form-field {
  margin-bottom: 0px !important;
}

div.ctct-form-embed div.ctct-form-defaults p.ctct-gdpr-text {
  margin-bottom: 0px !important;
}

#signup-area > div > div > div > p {padding-top: 0 !important;}

}

#signup-area h2 {
  line-height: 1.1;
  font-size: 1.5em;
}

#signup-area button {
  max-width: 150px;
  justify-self: center;
  background-color: var(--wt-udeep);
  font-size: 20px;
  border-radius: 15px;
  transition: all .2s ease-in-out;
  padding: 5px;
}

#signup-area button:hover {
  background-color: #38456A;
  transition: all .2s ease-in-out;
}


.fixed-separator {
  height: 30rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.owl-carousel .owl-stage {
  display: flex;
  align-items: center;
  justify-items: center;
}
.owl-carousel {
  margin-bottom: 0;
}

.owl-nav.disabled {
  display: none;
}

#sponsership .package-frame {
  position: relative;
  height: 100%;
  min-height: 600px;
}

#sponsership .package-frame:hover img {
  opacity: 0.5;
  transform: scale(1.02);
}

#sponsership .package-frame img {
  position: absolute;
  max-height: 100%;
  transition: all 0.35s ease-in-out;
}

#sponsership .package-frame .package-details {
  position: absolute;
  text-shadow: -2px -2px 0 rgb(255, 255, 255), 2px -2px 0 rgb(255, 255, 255), -2px 2px 0 rgb(255, 255, 255), 2px 2px 0 rgb(255, 255, 255);
  color:black;
  font-size: 4rem;
  line-height: 6rem;
  pointer-events: none;
  padding-left: 5px;
  padding-right: 5px;
}
@media (max-width: 1200px) {
  #sponsership .package-frame .package-details {
    font-size: 3rem;
    line-height: 4rem;
  }
}
@media (max-width: 400px) {
  #sponsership .package-frame .package-details {
    font-size: 2rem;
    line-height: 3rem;
  }

  #sponsership .package-frame {
    min-height: 450px;
  }
}


.blurb {
  color: rgb(92, 92, 92);
}
.blurb h2 {
  color: black;
  font-size: 1.75rem;
  font-weight: 500;
  font-family: "JosefinSans", "Dosis", arial, sans-serif
}

@media (max-width: 800px) {
  .blurb h2 {
    font-weight: 600;
  }
}

.blurb .title-text {
  font-weight: 0;
  color:rgb(143, 143, 143);
}

.blurb .title-text-dark {
  letter-spacing: 0.25rem;
  font-weight: 500;
}

.blurb .title-text-dark h4 {
  font-weight: 900;
}

.title-text.inverse {
  color: white;
}

.blurb p {
  font-size: 1.15rem;
  line-height: 2.3rem;
  font-family: "Open Sans", arial, sans-serif;
  
  letter-spacing: 0.08rem;
}

.blurb video {
  max-width: 100%;
}




.blurb-link {
  padding: 1rem;
  margin: 4px;
  border: 2px solid #8888b8;
  transition: all 0.35s ease-in-out;
}
.blurb-link:hover {
  transform: scale(1.05);
  box-shadow: 0px 0px 8px 8px  var(--wt-bright);
}

.blurb-link a {
  text-decoration: none;
  font-size: 1.25rem;
  color: var(--wt-mid);
}

#past_projects .title-text {
  font-size: 1.5rem;
  text-align: center;
  text-transform: uppercase;
  font-family: arial, sans-serif;
  letter-spacing: 0.1rem;
  margin-bottom: 2rem;
}

#past_projects .blurb.title {
  padding-bottom: 0;
}


.blurb-iframe-frame {
  position:relative;
  height: 500px;
  overflow: hidden;
}
.blurb-iframe-frame iframe {
  position:absolute;
  height: 500px;
  pointer-events: none;
}

.blurb-iframe-frame .blurb-iframe-overlay {
  padding: 2rem;
  background-color: rgb(255, 255, 255, 0.95);
  position: absolute;
  cursor: pointer;
  height: 500px;
  opacity: 0;
  transition: all 0.35s ease-in-out;
}

.blurb-iframe-frame .blurb-iframe-overlay p {
  font-size: 1.2rem;
  line-height: 1.8rem;
  font-family: "Open Sans", arial, sans-serif;
  font-weight: 300;
  font-style: normal;
  color: rgb(119, 119, 119);
  letter-spacing: 0.8px;
}

.blurb-iframe-frame:hover .blurb-iframe-overlay {
  opacity: 1
}

@media (max-width: 1400px) {
  #past_projects .title-text {
    font-size: 1.8rem;
  }
  .blurb-iframe-frame .blurb-iframe-overlay p {
    font-size: 1rem;
    line-height: 1.4rem;
  }
}
@media (max-width: 1200px) {
  .blurb-iframe-frame .blurb-iframe-overlay p {
    font-size: 1rem;
    line-height: 1.2rem;
  }
}

@media (max-width: 1000px) {
  #past_projects .title-text {
    font-size: 1.5rem;
  }
  .blurb-iframe-frame .blurb-iframe-overlay p {
    font-size: 1.8rem;
    line-height: 2rem;
  }
}

@media (max-width: 800px) {
  #past_projects .title-text {
    font-size: 1.5rem;
  }
  .blurb-iframe-frame .blurb-iframe-overlay p {
    font-size: 1.5rem;
    line-height: 1.8rem;
  }
}

.col-md-6.wow.fadeInLeft img, .col-md-6.wow.fadeInLeft iframe {
  max-width: 100%;
}

.col-md-6.wow.fadeInLeft img {
  height: auto;
}

@media screen and (min-width:768px) and (max-width: 991px) {
  section#current_project .container.blurb.p-5 { 
    margin: 0 auto;
  }
}

#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif;} 

@media screen and (max-width:768px) {
  #mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; width: 100%;}
}

section#team {
  width: 100%;
  padding: 5em 0;
}

#teamContainer {
  display: grid; 
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(4, 1fr)
}

@media screen and (max-width: 575px) {
  #teamContainer {
    display: grid; 
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(4, 1fr)
  }
  
}

#teamContainer .imgBox img {
  max-width: 100%;
  max-height: 100%;
  height: 100%;
}

.modal-content {
  display: block !important;
  border-radius: 10px !important;
  padding-left: 30px !important;
}

@media screen and (max-width: 600px) {
  .modal-content {
    width: 90% !important;

  }
}

@media screen and (min-width: 601px) {
  .modal-content {
    width: 80% !important;
  }
}

@media screen and (min-width: 901px) {
  .modal-content {
    width: 60% !important;

  }
}


.imgBox {
  cursor:pointer;
  aspect-ratio: 600/480;
}

#joinUs {
background-image: url(../img/team-new/joinUs.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    cursor: unset;}

section#about {
  margin-bottom: 0 !important;
  padding-bottom: 3em !important;
}

section#current_project {
  margin-top: 5em !important;
}

#past_projects .blurb-comment.wow {
  display: grid;
  grid-template-columns: 1;
  grid-template-rows: 1fr auto 115px;
  align-items:last baseline;
}

@media screen and (min-width: 700px) and (max-width: 991px) {
  #past_projects .blurb {
    padding: 5em;
  }
  #past_projects .blurb-comment.wow {
    grid-template-rows: repeat(3, auto);
  }

  #ctct_form_0 {
    grid-template-rows: repeat(9, auto);
    grid-template-areas: "header header header header"
    "field1 field1 field1 field1"
    "field2 field2 field2 field2"
    "field3 field3 field3 field3"
    "field4 field4 field4 field4"
    "error error error error"
    "error1 error1 error1 error1"
    ". button button .";
  }

}

#mc_embed_signup .button {
  display: block;
  margin: 0 auto;
}

#mc_embed_signup .button-row {
  display: flex;
  justify-content: center;
}

@media screen and (min-width: 768px) and (max-width: 999px) {
  #signup-area .signup {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (min-width: 1000px) {
  #signup-area .signup {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
  }
}

#collabBox {
  overflow: hidden;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 100px;
  padding: 1em !important;
  gap: 1em;
}

#collabBox div {
  display: flex;
  align-items: center;
  justify-content: center;
}

.imgBox.placeH {
  background-color:#DFE8FF;
  cursor:auto;
}

#joinUs {
  cursor: pointer;
}

#joinUs img {
  display: block;
  margin: 0 auto;
}

#testimonials, #commercial {
  background-color:#1D1E3E;
  padding: 2rem 0 5rem 0;
}

/* #commercial {
  background-color:#1D1E3E;
  padding: 2rem 0 5rem 0;
} */

#testimonials .blurb h2, #commercial .blurb h2 {
  color: aliceblue;
  text-align: center;
  padding: 3rem 0 0 0;
}

#commercial .commercial-info {
  color: aliceblue;
  max-width: 800px;
  margin: 3em auto 0 auto;
}

#commercial .blurb h2 {
  color: aliceblue;
  text-align: center;
  padding: 3rem 0 0 0;
}

.testimonialRow {
  position: relative;
  overflow: hidden;
}

.owl-carousel#owl2 .owl-stage{
  overflow-x: hidden;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}

.owl-carousel#owl2 .owl-stage-outer {
  margin: 0 auto;
}

.owl-carousel#owl2 .owl-item {
  margin:0 auto;
  color: aliceblue;
}

.owl-carousel#owl2 .owl-item .blurb-comment {
  width: 80%;
  max-width: 80%;
  text-align: left;
  margin:0 auto;
}

.owl-carousel#owl2 .owl-item .blurb-testimonial {
  width: 100%;
  margin: 0 auto;
  text-align: left;
}

.owl-carousel#owl2 .owl-nav {
  width: 100%;
  height: 40px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  padding: 0 1rem;
  top: 0;
}

.owl-carousel#owl2 .owl-nav .owl-prev {
  /* margin-left: -30px; */
  color: aliceblue;
}

/* .owl-carousel#owl2 .owl-nav .owl-next {
   margin-right: -30px; 
} */

.owl-carousel#owl2 .owl-nav button {
  height: 80px;
  margin-bottom: 0;
  background: none;
  border: none;
}

.owl-carousel#owl2 .owl-nav button {
  fill: rgb(240 248 255 / 30%);
}

.owl-carousel#owl2 .testimonial-box .details {
  margin: 2.5em auto;
  width: auto;
  text-align: center;
}

.testimonial-box .details .name {
  font-style: italic;
  font-family:Georgia, 'Times New Roman', Times, serif;
  margin-bottom: 0;
  line-height: 1;
}

.testimonial-box .details .tagline {
  font-style: italic;
  font-family: 'Montserrat', Helvetica, sans-serif;
  margin-top: 12px;
  font-size: .8em;
  line-height: 1;
}

@media screen and (min-width: 650px) {
  .owl-carousel#owl2 .owl-nav {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    top: 0;
  }

  .owl-carousel#owl2 .owl-nav button {
    margin-bottom: 120px;
  }
}

#scroll .button {
  padding: 11px 25px 13px 25px;
  background-color:#1F1D28;
  color:aliceblue;
  text-decoration: none;
  border: none;
  /* there is a border radius */
  border-radius: 8px;
  transition: all .2s ease-in-out;
}

#scroll .button:hover {
  background-color: #0d236c;
  transition: all .2s ease-in-out;
}

.articles {
  padding: 0 0 6rem 0;
}

.articles .article {
  max-width: 800px;
  padding: 2rem 2rem 0rem 2rem;
  /* max-width: 1000px;
  max-height: 200px;
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  grid-template-rows: 1fr;*/
  margin: 0 auto;
  /* gap: 2em;  */
}

.articles .img-box {
  max-height: 100%;
  max-width: 600px;
  overflow: hidden;
  margin: 0 auto;
  margin-bottom: 2rem;
}

.articles .img-box img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: top center;
}

.article .preview {
  line-height: 1.8;
}

.article .preview p:last-of-type {
  display: inline;
}

.article a.read-more {
  font-style: italic;
  text-decoration: none;
  transition: all .2s ease-in-out;
}

.article a.read-more:visited {
  color: #bbbbfe;
}

.article a.read-more:hover {
  color: #77befb;
  transition: all .2s ease-in-out;
}

@media screen and (min-width: 1050px) {
  .articles .article {
  max-width: 1000px;
  max-height: 200px;
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  grid-template-rows: 200px;
  gap: 2rem;
  margin-top: 3rem;
  }

  .articles .img-box {
    margin-bottom: 0;
  }

  .articles .preview {
    font-size: .8rem;
  }
}

.current .blurb-comment.wow {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr auto 115px;
  align-items: last baseline;
}

.vidblock {
  max-width: 600px;
  padding: 0;
  margin: 0 auto;
}

.current .textbox {
  margin-top: 2rem;
  margin-bottom: 4rem;
}

.current .blurb-comment.wow .blurb {
  align-self: start;
}

.blurb-comment.wow .blurb .name {
  font-weight: 600;
  color:#8888b8;
}

.row.founder {
  display: block;
  margin: 0 auto;
}

.row.founder .blurb-comment {
  margin: 0 auto;
}

.current .blurb-iframe-frame img {
  position: absolute;
  z-index: 1;
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.current .blurb-iframe-frame img.playbutton {
  position: absolute;
  z-index: 10;
  object-position: center;
  width: 100px;
  left: 50%;
  margin-left: -50px;
  top: 50%;
  margin-top: -50px;
  height: auto;
}

.current .blurb-iframe-frame {
  cursor: pointer;
}

.current.feature .blurb-comment {
  margin: 0 auto;
}

@media screen and (max-width: 600px) {
.current.row img {
  min-height: 216px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}
}

@media screen and (min-width: 900px) {
  .vidblock {
    width: 100%;
    max-width: 1000px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 2rem;
    margin-bottom: 4rem;
    min-height: 600px;
  }

  #vid1, #vid3, #vid5 {
    grid-template-columns: 300px 1fr;
  }

  #vid2, #vid4 {
    grid-template-areas: "text video";
    grid-template-columns: 1fr 300px;
  }

  #vid4 {
    grid-template-columns: 1fr 2fr;
  }

  #vid1 {
    grid-template-rows: 600px;
  }

  #vid2 {
    max-height: 100%;
  }

  #vid2 .video, #vid4 .video {
    grid-area: video;
  }

  #vid2 .textbox, #vid4 .textbox {
    grid-area: text;
  }

  .vidblock .video {
    max-height: 90%;
  }

  .current .textbox {
    margin-top: 0rem;
    margin-bottom: 0rem;
  }
}

.future .teaser {
  background-color: #E3E3D8;
  color: black;
  padding: 2rem;
  min-height: 425px;
  display: grid;
  grid-template-rows: auto 1fr auto;
  max-width: 800px;
  margin: 0 auto;
  border-radius: 5px;
}

.future .teaser .opening {
  text-transform: uppercase;
  margin: 0 auto;
  text-align: center;
  font-weight: 600;
}

.future .story {
  align-self: center;
}

.future .teaser .title {
  text-transform: uppercase;
    font-family: 'Bebas Neue', sans-serif;
    font-size: 5rem;
    line-height: 1em;
    letter-spacing: -1px;
    font-weight: 600;
    margin: 0 auto;
    text-align: center;
    color: #1D1E3E;
}

.future .future-content {
  max-width: 500px;
  margin: 0 auto;
  --animate-duration: 2500ms;
  animation-duration: 2500ms;
}

.future .future-content p {
  font-size: 1em;
  line-height: normal;
  font-weight: 700;
  letter-spacing: -1px;
  margin-bottom: 0;
}

.future .teaser:first-of-type {
  margin-bottom: 3rem;
}

.future img {
  max-width: 120px;
  margin-bottom: -5px;
}

.future .info-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

@media screen and (max-width: 420px) {
  .future .info-row {
    flex-direction: column;
  }

  .future .teaser {
    padding: 1rem;
  }

  .future .teaser .title {
    font-size: 4em;
  }
}

.future a {
  display: block;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: 600;
  font-size: .8em;
  letter-spacing: .05em;
  color: #0d236c;
  transition: all .2s ease-in-out;
  font-family: 'Bebas Neue', sans-serif;
}

.future a:hover {
  color: #295c88;
  transition: all .2s ease-in-out;
}

.commvid div {
  margin: 0 auto;
}




#ctct_form_0 {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(9, auto);
  grid-template-areas: "header header header header"
  "field1 field1 field1 field1"
  "field2 field2 field2 field2"
  "field3 field3 field3 field3"
  "field4 field4 field4 field4"
  "error error error error"
  "error1 error1 error1 error1"
  "text text text text"
  ". button button .";
}

@media screen and (min-width: 992px) {
  #ctct_form_0 {
    grid-template-rows: repeat(6, auto);
    column-gap: 10px;
    grid-template-areas: "header header header header"
      "field1 field2 field3 field4"
      "error error error error"
      "error1 error1 error1 error1"
      "text text text text"
      ". button button .";
  }

  #collabBox {
    grid-template-columns: repeat(5, 1fr)
  }
}

#gdpr_text {
  grid-area: text;
  max-width: 630px;
  justify-self: center;
}

#error_message_0 {
  grid-area: error;
}

#network_error_message_0 {
  grid-area: error1;
}

.ctct-form-button {
  grid-area: button;
  justify-self: center;
}

.ctct-form-header {
  grid-area: header;
  column-span: all;
  color: var(--wt-udeep);
}

#first_name_field_0 {
  grid-area: field1;
}

#last_name_field_0 {
  grid-area: field2;
}

#phone_field_0 {
  grid-area: field3;
}

#email_address_field_0 {
  grid-area: field4;
}

div.ctct-form-embed form.ctct-form-custom .ctct-form-required:before {
  left: 45px !important;
  top: -6px !important;
}

#sponsorship .tiers-section {
  background-color:#222A53;
}

#sponsorship .sponsor-heading {
  background-image: url('../../img/film-theme/5.jpg');
  background-size: cover;
  background-position: right center;
  text-align: center;
}

#sponsorship .sponsor-heading .text-box {
  background-color:rgba(22, 47, 127, 0.35);
}

.bebas-neue-regular {
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.smooch-regular {
  font-family: "Smooch", cursive;
  font-weight: 400;
  font-style: normal;
}

#sponsorship .sponsor-heading h3 span.primary {
    text-transform: uppercase;
    line-height: 0.9;
    font-size: calc(16pt + 4vw);
    display: block;
    color: rgba(255, 255, 255,0.5);
    font-family: "Bebas Neue", sans-serif;
    font-weight: 400;
    font-style: normal;
}

#sponsorship .sponsor-heading h3 span.secondary {
  font-size: calc(30pt + 4vw);
  line-height: 1;
  margin-top: -2rem;
  display: block;
  color:#8fc8f1;
  font-family: "Smooch", cursive;
  font-weight: 400;
  font-style: normal;
}

#sponsorship h2, #sponsorship p, #sponsorship li {
  color: white;
}

#sponsorship .why-sponsor {
  background-color: none;
}

#sponsorship .why-sponsor p {
  color: black;
}

#sponsorship .why-sponsor h2 {
  color: var(--wt-udeep);
  font-weight: bold;
  margin-bottom: 1.5em;
}

#sponsorship .tiers {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(6, auto);
  gap: 1rem;
  row-gap: 5rem;
  padding: 1rem 1rem 5rem 1rem;
}

#sponsorship .tiers .tier {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr 90px;
}

#sponsorship .tiers .tier .amount-box {
  background-image: url('/img/brush-stroke.png');
  background-color: transparent;
  background-position: center;
  /* margin-right: 20%; */
  background-size: contain;
  background-repeat: no-repeat;
}

#sponsorship .tiers .tier .amount {
  text-align: center;
  color: #091C5B;
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
  padding-top: 2rem;
  font-size: 4rem;
}

#sponsorship .tiers .tier ul { justify-self: center;}

#sponsorship .new {
  font-weight: semibold;
  color:#8fc8f1;
}

#sponsorship .tiers .tier .title {
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3rem;
  letter-spacing: 0.2rem;
  text-align: center;
  /* margin-right: 20%; */
  line-height: 0.9;
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #8fc8f1;
}

#sponsors h2 {
  font-weight: 600;
}

@media only screen and (min-width: 730px) {
  #sponsorship .tiers {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, auto);
    row-gap: 3rem;
  }

  #sponsorship .tiers .tier {
    grid-template-rows: 105px 1fr 90px;
  }
}

@media only screen and (min-width: 1050px) {
  #sponsorship .tiers {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, auto);
    gap: 3rem;
    row-gap: 4rem;
  }
}

@media only screen and (min-width: 300px) {

  #sponsorship .sponsor-heading h3 span.primary {
    font-size: calc(16pt + 6vw);
  }

  #sponsorship .sponsor-heading h3 span.secondary {
    font-size: calc(30pt + 8vw);
  }
}

@media only screen and (min-width: 500px) {
  #sponsorship .sponsor-heading h3 span.primary {
    font-size: calc(16pt + 8vw);
  }
  #sponsorship .sponsor-heading h3 span.secondary {
    font-size: calc(30pt + 10vw);
  }
}

@media only screen and (min-width: 650px) {
  #sponsorship .sponsor-heading h3 span.primary {
    font-size: 5rem;
  }

  #sponsorship .sponsor-heading h3 span.secondary {
    font-size: 10rem;
  }

}

#scroll a img {
  aspect-ratio: 2 / 1;
  max-width: 300px;
  object-fit: cover;
  object-position: center center;
}

.founder .blurb-iframe-overlay {
    background-color: rgb(255, 255, 255, 0.35);
    width: 100%;
}

#teaser .teaser {
  background-image: url('../../img/teaser/film-background.png');
  background-size: cover;
  background-position: right center;
  text-align: center;
  height: 300px;
}

#teaser .teaser-heading {
  height: 300px;
  max-height: 100%;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-content: space-between;
}

#teaser .teaser .text-box {
  color: white;
  max-height: 300px;
  flex-grow: 1;
  display:flex;
  flex-direction: column;
  justify-content:center;
  align-content:center;
}

#teaser .uppercase {
  text-transform: uppercase;
}

#teaser .teaser .pre-title {
  font-size: calc(1.5rem + 2vw);
  padding: 0 0.5rem;
}

#teaser .teaser .changemaker-heading {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(2, auto);
}

#teaser .teaser .changemaker {
  font-size: calc(3rem + 2vw);
  font-family: Gelasio;
  text-align: center;
  line-height: 1;
}

#teaser .teaser span.maker {
  color: white; 
}

#teaser .teaser span.series {
  font-family: Montserrat !important;
  color: var(--wt-udeep);
  font-weight: 400;
  text-shadow: -2px -2px 0 #99aad8, 2px -2px 0 #99aad8, -2px 2px 0 #99aad8, 2px 2px 0 #99aad8;
  font-size: calc(3rem + 2vw);
}

#teaser .detail-box {
  max-height: 100%;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

#teaser .detail-box .img-box {
  height: 100px;
  max-height: 100%;
}

#teaser .detail-box .img-box img {
  max-height: 100%;
}

#teaser .detail-box p {
  margin: 0;
  color: white;
}

#teaser .teaser-heading .text-box .accent {
  color: #99aad8
}

#teaser p {
  margin: 0;
}

.yt-imgbox {
  height: 75px;
  max-height: 100%;
  padding: 5% 10% 10% 10%;
}

.yt-icon {
  max-height: 100%;
}

.series-link {
  display: flex;
  flex-direction: column;
  height: 100px;
  max-height: 100%;
}

.series-link a {
  display: block;
  margin-bottom: 12px;
  text-decoration: none;
  font-weight: bold;
  color: white;
  transition: all 0.3s ease-in-out;
  align-self: end;
  font-size: 0.8rem;
}

.series-link a:hover {
  color: var(--wt-light);
  transition: all 0.3s ease-in-out;
}

#publications h2 {
  text-align:center;
}

.social-container .title {
  font-size: 2em;
  line-height: 1.2em;
  margin: 0;
}



#get-involved h2 {
  color: var(--wt-udeep);
  font-weight: 600;
}

#get-involved h4 {
  margin-top: 1em;
  color: var(--wt-light);
  font-weight: 600;
  font-family: "JosefinSans", "Dosis", arial, sans-serif;
}

#connect-container {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  row-gap: 5em
}

.actions .emphasis {
  color: var(--wt-light);
  font-weight: 600;
  user-select:none;
}

.actions .action-link {
  text-decoration: none;
  color: var(--wt-udeep);
  transition: all 0.3s ease-in-out;
  font-family: "Open Sans", arial, sans-serif;
    letter-spacing: 0.08rem;
}

.actions li {
  font-family: "Open Sans", arial, sans-serif;
    letter-spacing: 0.08rem;
    line-height: 2rem;
}

.actions .action-link:hover {
  color: var(--wt-light);
  transition: all 0.3s ease-in-out;
}

@media screen and (min-width: 500px) {
  
  #teaser .teaser .changemaker {
    font-size: calc(4rem + 2vw);
    font-family: Gelasio;
    text-align: center;
  }
  
  #teaser .teaser .teaser-heading {
    display: grid;
    grid-template-rows: repeat(2, auto);
    grid-template-columns: 1fr;
    row-gap: 2em;
    padding: 2em;
  }

  #teaser .teaser-heading .text-box {
    max-height: 300px;
    display:grid;
    grid-template-rows: repeat(2, auto);
    align-content:center;
  }

  #teaser .teaser-heading .text-box .pre-title {
    line-height: 1em;
  }
  
  #teaser .teaser span.maker {
    margin-left: -1rem;
  }

  #teaser .teaser span.series {
    align-self: start;
    margin-top: -0.25em
  }

  
#teaser .detail-box {
  height: 125px;
  max-height: 100%;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

#teaser .detail-box .img-box, #teaser .detail-box .series-link {
  height: 125px;
  max-height: 100%;
}

#teaser .detail-box .yt-imgbox {
  height: 100px;
}

}

#message .blurb-iframe-frame {
  margin: 0 auto;
  max-width: 80vw;
  height: auto;
  aspect-ratio: 16 / 9;
}


#message .blurb-iframe-frame iframe {
  margin: 0 auto;
  width: 100%;
  max-width: 80vw;
  height: auto;
  aspect-ratio: 16 / 9;
}

#footer section .social-container {
  margin: 0 auto;
  max-width: 100%;
}

#footer .center {
  text-align: center;
  margin: 0 auto;
}

h2, #mission h2, #about h2, #publications h2, #team h2, #founder h2, #current_project h2, #sponsors h2, #collab h2, #contact h2, .transformative h2 {
  color: var(--wt-udeep);
  font-weight: bold;
}

#partners {
  background-image: url('../../img/teaser/film-background.png');
  background-size: cover;
  background-position: right center;
  text-align: center;
  height: 300px;
}

#partners .advocacy-partners {
  height: 100%;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(2, auto);
  align-content: center;
  align-items: center;
  justify-content: center;
  column-gap: 1rem;
}

#partners .advocacy-partners {
  font-size: calc(3rem + 2vw);
  font-family: Gelasio;
  text-align: center;
  line-height: 1;
}

#partners .advocacy-partners {
  color: white; 
}


#partners .advocacy-partners .accent {
  color: #99aad8
}

#partners p {
  margin: 0;
}

@media screen and (min-width: 500px) {

  #partners .advocacy-partners {
    grid-template-columns: repeat(2,auto);
    grid-template-rows: 1fr;
  }

}

#partner h3 {
  font-size: 2rem;
  color:#295c88
}

#partner ul {
  display: flex;
  flex-direction: row;
  gap: 24px;
  padding-left: 1em;
}

#partner ul.social {
  list-style-type: none;
  padding-left: 0;
}

#partner  ul.social li {
  height: 50px;
}

#partner  ul.social li img {
  max-height: 50px;
}

#partner .partner-img-block {
  height: 300px;
}

#partner .partner-img-box {
  /* height: 100%;
  width: 100%;
  max-height: 300px; */
  display: grid;
  align-content: center;
  align-items: center;
  grid-template-columns: 1fr;
  grid-template-rows: minmax(100px,300px);
  /* display: flex;
  align-content: center; */
}

#partner .partner-img-box img {
  width: auto;
  max-height: 100%;
  max-width: 100%;
  /* object-fit: contain; */
}



#partner h3, #partner h4 {
  font-weight: 600;
  font-family: "JosefinSans", "Dosis", arial, sans-serif;
  letter-spacing: normal;
}

/* Cutting Costs Section */

#unhealthycuts {
  position: relative ;
  min-height: 150px;
  max-height: 300px;
  height: calc(3rem + 18vw);
}

#unhealthycuts .teaser-background {
  position: absolute;
  height: 100%;
  width: 100%;
}

#unhealthycuts .teaser-background img {
  object-position: center;
  object-fit: cover;
  height: 100%;
  width: 100%;
  z-index: -10;
}

#unhealthycuts .text-content {
  position: absolute;
  z-index: 10;
  background: #000000;
  background: linear-gradient(179deg,rgb(9, 28, 91, 0.68) 0%, rgba(9, 28, 91, 0.78) 55%, rgba(5, 21, 75, 0.85) 100%);
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  gap: 0.5rem;
  color: white;
  text-align:center;
}

#unhealthycuts .text-box {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  column-gap: 0.5rem;
  padding: 0 2em 0 2em;
  margin: 0 auto;
}

#unhealthycuts .text-box p {
  font-family: 'Montserrat', Arial, Helvetica, sans-serif;
  font-size: calc(0.25rem + 6vw);
  line-height: calc(0.25rem + 6vw);
  letter-spacing: 2px;
  margin-bottom: 0;
}

#unhealthycuts .text-box p.uppercase {
  text-transform: uppercase;
}

#unhealthycuts .text-box .text1 {
  display: flex;
  flex-direction: row;
  flex-wrap:nowrap;
  gap: 0.5em;
  align-items: center;
}

#unhealthycuts .text-box .text2 {
  font-weight: 800;
  color: #99aad8;
}

#unhealthycuts .text-box .img-box {
  height: calc(0.25rem + 6vw);
}

#unhealthycuts .text-box .img-box img {
  height: 100%;
}

#unhealthycuts .text-content .subtitle p {
  font-style:italic;
  font-family:Georgia, 'Times New Roman', Times, serif;
  font-size: calc(1rem + 1vw);
  line-height: calc(1rem + 1vw);
  color: white;
  margin-bottom: 0;
}

@media screen and (min-width: 800px) {

  #unhealthycuts {
    height: calc(0.25rem + 23vw)
  }
  #unhealthycuts .text-box p {
  font-family: 'Montserrat', Arial, Helvetica, sans-serif;
  font-size: calc(2rem + 4vw);
  line-height: calc(2rem + 4vw);
  margin-bottom: 0;
  letter-spacing: 2px;
}

  #unhealthycuts .text-box .img-box {
  height: calc(2rem + 3vw);
}
}

details { 
  margin-bottom: 2em;
}

details summary {
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  font-size: 1.2rem;
  text-decoration: underline;
  color:#8888b8;
}

details > summary:first-of-type {
  list-style: none;
}

/* Unhealthy Cuts */

#cuttinglives {
  position: relative ;
  height: 300px;
}

#cuttinglives .teaser-background {
  position: absolute;
  height: 100%;
  width: 100%;
}

#cuttinglives .teaser-background img {
  object-position: center;
  object-fit: cover;
  height: 100%;
  width: 100%;
  z-index: -10;
}

#cuttinglives .text-content {
  position: absolute;
  z-index: 10;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-content: center;
  gap: 0.5rem;
  color:#091C5B;
  text-align:center;
}

#cuttinglives .text-box {
  width: 280px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  column-gap: 0.5rem;
  padding: 0 2em 0 2em;
  margin: 1rem auto;
}

#cuttinglives .text-box p {
  font-family: 'Montserrat', Arial, Helvetica, sans-serif;
  font-size: 2.5rem;
  line-height: 3rem;
  font-weight: 600;
}

#cuttinglives .text-box p span {
  font-weight: 400;
}

#cuttinglives .text-box p.uppercase {
  text-transform: uppercase;
}

#cuttinglives .text-box .text1 {
  display: flex;
  flex-direction: row;
  flex-wrap:nowrap;
  gap: 0.5em;
  align-items: center;
}

#cuttinglives .text-box .text2 {
  font-weight: 800;
  color: #99aad8;
}

#cuttinglives .text-box .img-box {
  height: 150px;
}

#cuttinglives .text-box .img-box img {
  height: 100%;
}

@media screen and (min-width: 400px) {
  #cuttinglives .text-box p {
    font-size: 3.5em;
    line-height: 3.5rem;
  }
}