@import url('https://fonts.googleapis.com/css2?family=Anton&family=Barlow:wght@300;400;500;600&family=Oswald:wght@400;500;600;700&display=swap');

:root {
  --swiper-theme-color: #fff;
}

a {
  text-decoration: none;
  color: inherit;
}

body {
  color: white;
  background-color: black;
  font-family: 'Anton', sans-serif;

  margin: 0px;

  display: flex;
  flex-direction: column;
}

#bg-video {
  position: fixed;
  top: 0px;

  z-index: -10;
}

body section {
  background-color: #e21c21;
  color: black;
  padding: 3.75em 2.5em;
  font-family: 'Times New Roman', serif;
  /*text-align: justify;*/

  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 10px;

  margin-bottom: 20vh;
}

body section.content.reverse {
  flex-direction: row-reverse;
}

body section div.column {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 40%;
}

body section div.heading {
  text-align: left;
  font-family: 'Anton', sans-serif;
  font-size: 2em;
  align-items: flex-start;
}
body section.content.reverse div.heading {
  text-align: right;
  align-items: flex-end;
}

body section div.column div.p {
  padding-left: 1.25em;
  padding-right: 1.25em;
}

nav {
  position: fixed;
  right: 5%;
  top: 50%;
  transform: translateY(-50%);
  text-align: right;
  z-index: 10;
}

nav a:hover {
  opacity: 0.8;
  cursor: pointer;
  user-select: none;
}

nav a.active {
  opacity: 0.8;
  cursor: pointer;
}

#title {
  font-size: 2em;
  padding: 2em 0px 0px 1.25em;
  line-height: 1em;
  border-left: 4px solid white;
}

#landing {
  display: flex;
  align-items: center;
  justify-content: unset;
  padding: 0px;
  padding-left: 10%;
  height: 100vh;
  background-color: unset;
  color: inherit;
  font-family: inherit;
  margin-bottom: 0px;
}

body section.content div.column .emphasis {
  font-family: 'Anton', sans-serif;
  font-size: 1em;
  padding-left: 1.25em;
  line-height: 1.5em;
  border-left: 4px solid black;
  border-right: none;
  text-align: left;
}

body section.reverse div.column .emphasis {
  font-family: 'Anton', sans-serif;
  font-size: 1em;
  padding-right: 1.25em;
  line-height: 1.5em;
  border-right: 4px solid black;
  border-left: none;
  text-align: right;
}

#lookbook,
#trailer,
#publicity,
#interview,
#imdb,
#contact {
  flex-direction: column;
}

#imdb .column.heading {
  display: flex;
  width: 100%;
  flex-direction: row;
  gap: 15px;
}

.material-symbols-rounded {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
}

iframe {
  width: 100%;
  aspect-ratio: 16/9;
}

#book #Schiffer-Publishing {
  mix-blend-mode: normal;
  width: 70%;
  margin-top: 7px;
}

@media only screen and (max-width: 480px) {
  body section.content,
  body section.content.reverse {
    flex-direction: column;
  }

  body section.content div.column,
  body section.content div.heading {
    width: 100%;
  }
  body section.content.reverse div.heading {
    text-align: left;
  }

  body section {
    padding: 1em 0.75em;
  }
}

footer {
  font-family: 'Barlow', sans-serif;
  background-color: #e21c21;
  padding: 3em 2em;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
