@import url("https://use.typekit.net/cds8lje.css");


/* Radikal Light */
@font-face {
  font-family: "Chinook";
  src: url("https://umb-4553t5.s3.eu-west-1.amazonaws.com/8891/fonts/Chinook-Regular.woff2") format("woff2"),
    url("https://umb-4553t5.s3.eu-west-1.amazonaws.com/8891/fonts/Chinook-Regular.woff") format("woff"),
    url("https://umb-4553t5.s3.eu-west-1.amazonaws.com/8891/fonts/Chinook-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

.din-2014{
font-family: "din-2014", sans-serif;
  font-weight: 400 700;
  font-style: normal;
}
:root {
  --max-w: 1600px;
  --din: "din-2014", sans-serif;
  --red: #E70000;
  --dark-red: #B80000;
  --blue:#1C2E63;
  --grey: #6F6F6F;
  --gold: linear-gradient(90deg, #B58540 0%, #A9914F 100%);
  --chinook: "Chinook",serif;
}


body {
  font-family: var(--din);
  font-weight: 700;
  font-size: 18px;
  color: var(--blue);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  background-color: var(--dark-red);
}
.modal-header,
.modal-footer{
  background-color: var(--red);
  color: white;
}
.btn-close {

  filter: invert(1);
}


.fw-800{font-weight: 700!important;}
.fw-400 {font-weight: 400 !important;}

.btn.btn-light {
  height: 41px;
  border-radius: 60px;
  background: #FFFFFF;
  font-family: var(--chinook);
  font-weight: 800;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  transition: all 0.2s ease;
  color: var(--red);
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.20);
}

.btn.btn-light:hover,
.btn.btn-light:focus,
.btn.btn-light:active,
.btn.btn-light:focus-visible,
.btn.btn-light:first-child:active,
:not(.btn-check)+.btn.btn-light:active {
  background: #dfdfdf;
  filter: brightness(1.15);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
  border: none;
  outline: none;
}

.btn.btn-danger {
  height: 41px;
  border-radius: 60px;
  font-family: var(--chinook);
  font-weight: 800;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  border-radius: 60px;
  background: var(--red);
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.20);
  border: none;
}

.btn.btn-danger:hover,
.btn.btn-danger:focus,
.btn.btn-danger:active,
.btn.btn-danger:focus-visible,
.btn.btn-danger:first-child:active,
:not(.btn-check)+.btn.btn-danger:active {

  filter: brightness(1.15);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
  border: none;
  outline: none;
}

a,
a:hover,
a:focus {
  color: inherit;
}

.main-text{
  font-family: var(--chinook);
  line-height: normal;
  font-weight: 800;
}

.main-text {
  font-size: 18px;
  line-height: 26px;
}

.small {
  font-size: 14px !important;
}
.short-terms{
  font-size: 12px;
  font-weight: 400;
}

.copyright{
  font-size: 15px;
  font-weight: 400;
}
.dark-red{
  background-color: var(--dark-red);
}

.text-primary {
  color: var(--blue)!important;
}

.form-text {
  font-size: 16px;
  font-weight: 400;
  font-family: var(--din);
  color: var(--blue);
}

/* FORM */
.form-control,
.form-select
{
  color: var(--blue);
  border-radius: 38px;
  border: 2px solid var(--blue);
  background-color: #fff;
  height: 38px;
  font-size: 15px;
  font-weight: 400;
  font-family: var(--din);
}

.form-floating>.form-control,
.form-floating>.form-control-plaintext,
.form-floating>.form-select {
  height: 40px !important;
  padding-bottom: 5px !important;
  font-weight: 400;
  font-family: var(--din);
}

.form-floating>.form-control,
.form-floating>.form-control-plaintext,
.form-floating>.form-select {
  line-height: 1.25;
}

.form-floating>.form-select {
  /* padding-top: 12px !important; */
  padding-top: 6px !important;

}

.form-floating>.form-control-plaintext:focus,
.form-floating>.form-control-plaintext:not(:placeholder-shown),
.form-floating>.form-control:focus,
.form-floating>.form-control:not(:placeholder-shown) {
  padding-top: 1.1rem;
}

.form-floating>label {
  top: -9px;
  font-family: var(--din);
  font-weight: 400;

}

.form-check-input {
  border-radius: 5px !important;
  width: 22px;
  height: 22px;
}

.form-check .form-check-input {
  margin-left: -25px;
  margin-top: 4px;
  border-radius: 1rem !important;
  border: 2px solid var(--blue);
}

.form-check-label {
  padding-top: 3px !important;
  padding-left: 3px;
  font-weight: 400;
  font-size: 15px;
}

.upload-label {
  cursor: pointer;
  padding: 7px 10px;
  color: var(--blue);
  border-radius: 38px;
  border: 2px solid var(--blue);
  font-size: 16px;
  font-weight: 500;
  background-color: #fff;
}

.form-check-input.is-valid~.form-check-label,
.was-validated .form-check-input:valid~.form-check-label {
  color: inherit;
}

.site-wrapper {
  max-width: 1800px;
  width: 100%;
  margin: 0 auto;
  box-shadow:
  -16px 0 24px -18px rgba(0, 0, 0, 0.35),
  16px 0 24px -18px rgba(0, 0, 0, 0.35);
}

.site-header {
  position: relative;
  z-index: 1;
}

.site-hero,
.site-hero__image {
  width: 100%;
}

.site-hero__image {
  display: block;
  height: auto;
}

.site-main {
  position: relative;
  margin-top: 0;
  padding-top: 0;
  border-top: 10px solid transparent;
  border-image: linear-gradient(90deg, #B58540 0%, #A9914F 100%) 1;
  background-color: #f1f0ee;
  background-image: url("https://umb-4553t5.s3.eu-west-1.amazonaws.com/8891/media/greyBg.avif");
  background-position: center top;
  background-repeat: repeat-y;
  background-size: 100% auto;
  min-height: 300px;
}

.site-main::before {
  content: none;
}

.site-footer {
  min-height: 400px;
  background: var(--red);
  width: 100%;
  color: white;
}

.site-content-layout {
  position: relative;
  width: 100%;
}

/* Mobile */
.snacks-mobile {
  padding-bottom: 24px;
}

.snacks-mobile__image {
  display: block;
  width: 100%;
  max-width: 340px;
  height: auto;
  margin-inline: auto;
}

@media (min-width: 768px) {

  .copyright {
      font-size: 17px;
    }

  .site-footer{
    min-height: 308px;
  }

  .site-content-layout--snacks {
    --content-half: 29.166667%;
    --snack-gap: 16px;
  }

  .site-content-layout--snacks .snacks-desktop__image {
    position: absolute;
    top: 24px;

    width: calc(50% - var(--content-half) - var(--snack-gap));
    max-width: 440px;
    height: auto;
    pointer-events: none;
  }

  .site-content-layout--snacks .snacks-desktop__image--left {
    left: auto;
    right: calc(50% + var(--content-half) + var(--snack-gap));
  }

  .site-content-layout--snacks .snacks-desktop__image--right {
    right: auto;
    left: calc(50% + var(--content-half) + var(--snack-gap));
  }

  .site-main {
    margin-top: -5.3%;
    padding-top: 5.3%;
  }

}


/* Desktop */

@media (min-width: 1300px) {
  .site-content-layout--snacks .snacks-desktop__image {
    width: min(440px,calc(min(50vw, 900px) - 25% - 48px));
    max-width: none;
    height: auto;
    top: 24px;
  }

  .site-content-layout--snacks .snacks-desktop__image--left {
    left: auto;
    right: calc(75% + 24px);
  }

  .site-content-layout--snacks .snacks-desktop__image--right {
    right: auto;
    left: calc(75% + 24px);
  }
}



.trailer-video {
  position: relative;
  height: auto;
  border-radius: 16px;
  overflow: hidden;
}

.trailer-video .ratio {
  min-height: 0;
}

#trailerPlayer {
  display: block;
  border: 0;
}

#trailerSound {
  position: absolute;
  top: 12px;
  right: 12px;
  left:auto;
  z-index: 2;

  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;

  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  font-size: 18px;
  cursor: pointer;
}

#trailerSound:hover {
  background: rgba(0, 0, 0, 0.9);
}

#trailerSound:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -4px;
}

#trailerSound:disabled {
  opacity: 0.5;
  cursor: default;
}