.form {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: calc(100vh - #{$header-height});
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  background-size: cover;
  transform-origin: top center;
  transform: translateY(#{$header-height});

  .inner {
    width: 450px;
    margin: 10px;
    background-color: white;
    text-align: center;
    color: black;

    & > * {
      width: 100%;
    }

    .header {
      padding: 15px 30px;
      text-align: left;
      text-transform: uppercase;
      letter-spacing: 1px;
      font-weight: 500;
    }
    .body {
      padding: 20px 30px;
      font-weight: 400;
      text-align: left;

      .social-share {
        display: block;
        width: 100%;
        text-align: center !important;
        color: white;

        ul {
          list-style-type: none;
          margin: 0;
          padding: 0;

          li {
            display: inline-block;
            padding-right: 20px !important;

            i {
              font-size: 30px;
              color: white;
            }
          }
        }
      }

      label {
        display: block;
        margin-bottom: 7px;
        font-size: 12px;
        text-align: left;
        text-transform: uppercase;

        & > span {
          padding-left: 10px;
          text-transform: normal;
          color: $color-error;
        }
      }

      input {
        padding: 10px;
        width: 100%;
        outline: none;
        border-radius: $radius;
        border: 1px solid transparent;
        background-color: $color-primary;
        font-size: 16px;
        color: white;

        &:not([type='submit']) {
          margin-bottom: 20px;
          box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.2);

          &:hover {
            border-color: rgba(0, 0, 0, 0.2);
          }

          &:focus,
          &:active {
            border-color: $color-special;
          }
        }
      }
    }

    .footer {
      flex: 0 0 auto;
      padding: 10px;

      button {
        background-color: $color-primary;
        color: #fff;
        border: 0;
        outline: 0;
        cursor: pointer;
        font-size: 15px;
        padding: 10px 30px;
        margin: 5px;
        border-radius: 3px;
      }

      button:hover {
        opacity: 0.8;
      }
    }
  }
}
