.events
  .events-content

    .event-info
      width: column(10, 12)
      margin-left: column(1, 12)
      max-width: 800px

      +respond-to-width(1200)
        width: 100%
        margin-left: 0


    .content
      h2
        font-size: 1.2rem
        line-height: 1.2
        color: $semiBlack
        font-weight: semi-bold()
        margin: 0 0 32px

      p
        font-size: 0.8rem
        color: $darkGray

    .events-form
      background: linear-gradient(90deg, $blackGradient)
      margin-top: 40px
      margin-left: 0
      margin-right: 0
      width: 100% 
      max-width: none
      padding: 60px column(2, 14) 40px

      .contact-form
        max-width: 1680px

      .form
        >p
          margin: 60px 0 30px
          font-size: 1rem
          line-height: 1.2
          color: white
          font-weight: bold()

          &:first-of-type
            margin-top: 0

        .form-element.checkboxes
          label
            +flex(space-between, center)

            span
              width: calc(100% - 25px)

            input
              width: 12px
              margin-right: 15px

        .form-element
          .error-message
            +respond-to-width(640)
              position: relative
              margin-bottom: 12px

      +respond-to-width(1200)
        padding: 60px column(1, 14) 40px

      h2
        font-size: 1.4rem
        line-height: 1.2
        color: $lightGray
        font-weight: semi-bold()
        margin: 0


.error-message__wrapper
  display: grid
  padding-block: 20px
  color: $red