/***** Reset *****/
      :root {
        --stp-background-color: #f6fbff;
        --stp-primary-color: #0D4599;
        --black: #000;
        --white: #fff;
        --logos-border-width: 3px;
        --stp-alert-background-color: #d05416;
        --stp-alert-foreground-color: #fff;
      }
      *,
      *::before,
      *::after {
        box-sizing: border-box;
      }
      a {
        text-decoration: none;
      }

      .alert {
        background-color: var(--stp-alert-background-color);
        color: var(--stp-alert-foreground-color);
        padding: 1rem;
        font-size: 16px;
        line-height: 24px;
        font-weight: 400;
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: baseline;
        gap: 1rem;

        p {
          margin: 0;
        }
      }

      /***** Layout *****/
      body {
        background: var(--stp-background-color);
        display: flex;
        flex-direction: column;
        height: 100vh;
        width: 100vw;
        padding: 0;
        margin: 0;
      }
      footer {
        display: flex;
        flex-wrap: wrap;
        margin: 0 auto 1rem;
        overflow: hidden;
        row-gap: 1rem;
        text-align: center;
      }
      .content {
        padding: 1rem;
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      aside,
      main {
        max-width: 600px;
        display: flex;
        flex-direction: column;
        align-self: center;
      }
      aside {
        margin-right: 5rem;
      }
      main {
        width: 400px;
      }

      /***** Footer Content *****/
      .terms {
        flex: 1;
        align-content: center;
        margin: 0 clamp(1rem, 7vw, 3rem);
        white-space: nowrap;
        font-size: 0.8125rem;
      }

      /***** Aside Content *****/
      .heading {
        font-family: 'Open Sans', sans-serif;
        font-weight: 700;
        font-size: clamp(1rem, 4vw, 3rem);
        line-height: clamp(2rem, 6vw, 4.5rem);
        margin-bottom: clamp(2rem, 4vw, 3rem);
      }
      .stp {
        padding: 0 1rem;
        transform: translateY(-50%);
        position: absolute;
        top: 0;
        left: 1rem;

        .stp-svg {
          position: relative;
          z-index: 1;
        }

        .stp-background {
          background: var(--white);
          position: absolute;
          inset: 0;

          & div {
            background: var(--stp-background-color);
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: calc(50% + var(--logos-border-width));
          }
        }
      }
      .logos {
        border: var(--logos-border-width) solid var(--stp-primary-color);
        display: inline-flex;
        flex-wrap: wrap;
        gap: 2rem;
        border-radius: 10px;
        padding: 2rem 1.5rem;
        position: relative;
        background: var(--white);
        width: 100%;
      }
      .logo {
        display: inline-flex;
        align-items: center;

        & label {
          margin-left: 8px;
          font-weight: 700;
          font-size: 20px;
          line-height: 24px;
          color: var(--black);
        }
      }
      .caption {
        align-self: flex-start;
        font-weight: 400;
        font-size: 12px;
        line-height: 16px;
        margin-top: 0.5rem;
      }
      .coming-soon {
        margin: 1rem;

        & label {
          align-self: flex-start;
          display: flex;
          align-items: center;
          font-size: 14px;
        }

        & svg {
          margin-right: 1rem;
        }
      }

      @font-face {
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 700;
        src: url('https://cdn.showingtimeplus.com/auth0/OpenSans-Bold-webfont.woff2')
          format('woff2');
      }

      /***** Media *****/
      @media screen and (max-width: 1150px) {
        .logos {
          flex-direction: column;
        }

        .logo {
          justify-content: center;
        }
      }
      @media screen and (max-width: 875px) {
        body {
          background: var(--white);
        }

        aside,
        .banner {
          display: none;
        }

        ._prompt-box-outer div {
          box-shadow: none;
        }

        .main-wrapper {
          flex: 1;
          justify-content: center;
        }

        main {
          max-width: none;
        }
      }