/* ############################
   #      SASS Variables      #
   #  Theming in Compiletime  #
   ############################ */
/* ############################
   #      CSS Variables       #
   #    Theming in Runtime    #
   ############################ */
:root {
  --kup-color-default: #1A3F73;
  --kup-color-accent: #CEC075;
  --kup-color-accent-light-01: #E9E0AD;
  --kup-color-accent-light-02: #EFEACA;
  --kup-color-blue-01: #5B7599;
  --kup-color-blue-02: #8596ad;
  --kup-color-blue-03: #f4f5f7;
  --kup-color-yellow: #F3E86F;
  --kup-color-green: #BEE991;
  --kup-color-flamingo: #FFAEAF;
  --kup-color-coral: #DF504B;
  --kup-color-light: #ededed;
  --kup-color-dark: #cccccc;
  --kup-color-styleguide: #556d6e;
  --kup-box-shadow: 1px 2px 5px 1px rgba(0,0,0, 0.15);
  --kup-gradient: linear-gradient(0deg, var(--kup-color-default) 0%, rgba(49, 119, 217, 0.00) 97.12%);
  --kup-border-radius: 25px;
  --kup-border-radius-small: 4px;
  --bs-gutter-x: calc(15px/2);
}

/* abstracts/breakpoints */
/* Better Font Rendering */
/* ---------------------------------- */
/* Headline Mixins */
/* ---------------------------------- */
.allow-extend-content {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  background: var(--kup-color-blue-02);
  color: #ffffff;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  padding: 30px;
  z-index: 3;
}
.aspect-ratio-9_16 .allow-extend-content {
  padding: 22.5px;
}
@media (max-width: 575px) {
  .allow-extend-content {
    padding: 15px;
  }
}
.allow-extend-content--header {
  max-height: 7%;
  margin-bottom: 15px;
}
@media (max-width: 767px) {
  .allow-extend-content--header {
    max-height: 10%;
  }
}
.allow-extend-content--header img {
  height: 100%;
  min-width: 3.75rem;
  max-height: 2.5rem;
}
.aspect-ratio-9_16 .allow-extend-content--header img {
  max-height: 1.875rem;
}
.allow-extend-content--main {
  margin: 0 auto;
  max-height: 70%;
  max-width: 37.5rem;
  overflow-y: auto;
  place-content: center;
  position: relative;
}
@media (max-width: 1199px) {
  .allow-extend-content--main {
    font-family: "FontDefault";
    font-size: 15px;
  }
}
@media (max-width: 767px) {
  .aspect-ratio-16_9 .allow-extend-content--main {
    font-size: 15px;
  }
}
.allow-extend-content--main:after {
  content: "";
  background-image: linear-gradient(to bottom, transparent, var(--kup-color-blue-02));
  bottom: 0;
  display: block;
  height: 1.875rem;
  left: 0;
  position: sticky;
  width: 100%;
}
.allow-extend-content--footer {
  align-items: center;
  display: flex;
  justify-content: center;
  flex-direction: column;
  left: 0;
  width: 100%;
}
.allow-extend-content--footer-cta {
  display: flex;
  white-space: nowrap;
  gap: 30px;
}
@media (max-width: 767px) {
  .allow-extend-content--footer-cta {
    flex-wrap: wrap;
    gap: 7.5px;
    justify-content: space-around;
    width: 100%;
  }
}
.aspect-ratio-9_16 .allow-extend-content--footer-cta {
  white-space: normal;
}
@media (max-width: 1199px) {
  .aspect-ratio-9_16 .allow-extend-content--footer-cta {
    flex-wrap: wrap;
    gap: 7.5px;
  }
}
@media (max-width: 1199px) {
  .aspect-ratio-9_16 .allow-extend-content--footer-cta--btn {
    border-radius: var(--kup-border-radius-small);
    padding: 15px 30px;
    background-color: var(--kup-color-default);
    color: #ffffff;
    opacity: 1;
    transition: opacity 0.3s ease 0s;
    display: block;
    flex: 1;
    margin: 0;
  }
}
@media (max-width: 1199px) and (max-width: 767px) {
  .aspect-ratio-9_16 .allow-extend-content--footer-cta--btn {
    font-family: "FontDefault";
    font-size: 15px;
    padding: 7.5px 15px;
  }
}
@media (max-width: 1199px) {
  .aspect-ratio-9_16 .allow-extend-content--footer-cta--btn:focus, .aspect-ratio-9_16 .allow-extend-content--footer-cta--btn:hover {
    opacity: 0.85;
  }
}

.section--external-item,
.section--video {
  position: relative;
}