/**
 SASS files that don't get compiled into CSS. Do not put element selectors in here.
 Every file not starting with '_' should import this file if you want to use functions and mixins.
 */
/**
 * SASS variables
 *
 These are only used in the properties and abstract SASS files.
 */
/**
 Breakpoints and columns
 */
/**
 Text
 */
/**
Fill in the header styles, only write the properties you want to override.
 */
/**
 Form
 */
/**
  Buttons
 */
/**
 Breakpoints

 @param {Keyword} $breakpoint - The breakpoint name of the minimum width. Can be any of the names in the $breakpoint variable
 */
/**
  Custom column size.
  Especially handy inside other columns.

  @param {Number|string} $size - the size in columns or 'expand'/'shrink'.
  @param {number} $total - the total size in columns. Ignored when size is 'expand'/'shrink'
 */
/**
  Custom offset size.
  Especially handy inside other columns.

  @param {Number|string} $size - the size of the offset.
  @param {number} $total - the total size in columns.
  @param {string} - the side from the offset.
 */
.paragraph--type--video-intro {
  max-width: 1640px;
  position: relative;
  border: solid 20px var(--white);
  border-radius: 24px;
  align-items: flex-end;
}
.paragraph--type--video-intro .field--name-field-video-back {
  grid-column: 1/-1;
  border-radius: 24px;
  grid-row: 1;
  overflow: hidden;
}
.paragraph--type--video-intro .field--name-field-video-back video {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.paragraph--type--video-intro .video-banner {
  padding: 24px;
  border-radius: 24px;
  background-color: var(--primary-color);
  margin-top: -25px;
  z-index: 1;
}
@media (min-width: 768px) {
  .paragraph--type--video-intro .video-banner {
    margin-top: -50px;
  }
}
@media (min-width: 992px) {
  .paragraph--type--video-intro .video-banner {
    grid-row: 1;
    background: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(20px);
    grid-column: 1/span 18;
    margin-left: 20px;
    margin-bottom: 20px;
    margin-top: 0px;
  }
}
@media (min-width: 1200px) {
  .paragraph--type--video-intro .video-banner {
    padding: 48px;
    grid-column: 1/span 16;
  }
}
@media (min-width: 1440px) {
  .paragraph--type--video-intro .video-banner {
    grid-column: 1/span 14;
  }
}
.paragraph--type--video-intro .video-banner h3 {
  color: var(--white);
  margin-bottom: 15px;
  text-transform: uppercase;
}
.paragraph--type--video-intro .video-banner h4 {
  color: var(--white);
  margin-bottom: 40px;
}
@media (min-width: 1200px) {
  .paragraph--type--video-intro .video-banner h4 {
    margin-bottom: 80px;
  }
}
.paragraph--type--video-intro .video-banner .field--name-field-trump {
  color: var(--white);
}
.paragraph--type--video-intro .video-banner .field--name-field-trump > .field__items {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
}
.paragraph--type--video-intro .video-banner .field--name-field-trump > .field__items .field__item {
  padding: 6px 10px 6px 30px;
  border: solid 1px var(--white);
  border-radius: 500px;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='11' viewBox='0 0 12 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.7569 0.0925831C11.8773 0.173499 11.961 0.299306 11.9894 0.442333C12.0178 0.585359 11.9886 0.733892 11.9083 0.855259L5.35539 10.7554C5.31056 10.823 5.25138 10.8798 5.18213 10.9217C5.11288 10.9635 5.03528 10.9893 4.95491 10.9973C4.87455 11.0053 4.79342 10.9953 4.71738 10.9679C4.64134 10.9405 4.57228 10.8965 4.51517 10.839L0.146561 6.43893C0.0501019 6.33466 -0.00241101 6.19676 8.50764e-05 6.05427C0.00258116 5.91178 0.0598914 5.77583 0.159942 5.67506C0.259993 5.57429 0.394971 5.51657 0.536442 5.51405C0.677913 5.51154 0.81483 5.56443 0.918348 5.66158L4.81587 9.58716L10.9996 0.244385C11.0801 0.123147 11.205 0.0390497 11.347 0.0105835C11.489 -0.0178828 11.6364 0.011612 11.7569 0.0925831Z' fill='%23FFFBF8'/%3E%3C/svg%3E%0A");
  background-size: 12px 11px;
  background-repeat: no-repeat;
  background-position: left 10px center;
  line-height: 16px;
}