* {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 
  make the video fixed
*/
body > div:first-child {
  position: fixed !important;
}

:root {
  --app-height: 100%;
}

/* Fonts */
@font-face {
  font-family: 'Ferrari Sans';
  src:
    url('../fonts/Ferrari-SansRegular.woff2') format('woff2'),
    url('../fonts/Ferrari-SansRegular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

#background_video {
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
}

html {
  font-family: 'Ferrari Sans', Arial, Helvetica, sans-serif;
  font-size: calc(1 * 62.5%);
  color: var(--default-document-font-color);
  background-color: var(--funky-purple-8-black-pepper);
  min-width: 480px;
}

/* Layout */
body {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 24px 0 0 0;
  margin: 0;
}

::placeholder,
::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
:-moz-placeholder {
  color: var(--placeholder-color);
}

form {
  width: 480px;
  background-color: #181818;
  padding: 0;
}

.content {
  width: 480px;
  background-color: #181818;
  padding: 0 0 40px 0;
}

.content__headings {
  padding: 0 24px;
}

.content__title {
  margin: 0;
  font-family: 'Ferrari Sans', Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3rem;
  line-height: 3.6rem;
  letter-spacing: normal;
  text-align: center;
  text-transform: uppercase;
  word-break: break-word;
  color: #ffffff;
}

.content__text {
  margin: 16px;
  font-family: 'Ferrari Sans', Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.4rem;
  line-height: 2.6rem;
  letter-spacing: normal;
  text-align: center;
  text-transform: none;
  word-break: break-word;
  color: #ffffff;
}

.content__divider {
  padding: 56px 24px 56px 24px;
}

.content__divider hr {
  width: 100%;
  border: none;
  border-top: 1px solid #8f8f8f; /* Adjust color */
  margin: 0; /* Optional, remove extra spacing */
}

.content__form {
  padding: 0 24px;
}

.content__footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 24px 0 24px;
}

.gdpr {
  margin-top: 32px;
  font-family: 'Ferrari Sans', Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 1.2rem;
  line-height: 2.2rem;
  letter-spacing: normal;
  text-transform: none;
  word-break: break-word;
  color: #8f8f8f;
}

/* logo */
.logo .logo__image {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
}

.header__image {
  display: none;
  width: 100%;
  justify-content: center;
  align-items: center;
}

.button__container {
  margin: 40px 0 0 0;
}

.button {
  font-family: 'Ferrari Sans', arial, helvetica, sans-serif;
  font-size: 1.6rem;
  line-height: 2.4rem;
  letter-spacing: 0.016rem;
  font-weight: 400;
  background-color: #da291c;
  border: 0;
  color: #ffffff;
  padding: 16px;
  cursor: pointer;
  outline: inherit;
  width: 100%;
  transition: background-color 300ms ease-in-out;
  text-transform: uppercase;
}

/* Phone */
@media screen and (max-width: 480px) {
  #background_video {
    display: none;
  }

  body {
    padding: 0px;
  }

  .header__image {
    display: flex;
    margin-bottom: 40px;
  }
}