span,
label {
  display: initial;
}
main {
  width: 100%;
  padding: 1rem 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  > h2 {
    text-align: center;
    font-size: 5rem;
  }
}

form.forms {
  width: 45%;
  padding: 2rem;
  display: flex;
  gap: 1rem;
  flex-direction: column;
  background-color: #eee;
  margin-bottom: 2rem;
  border-radius: 5px;
  border: 1px solid #222;
  justify-content: center;
  align-items: center;
  span {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 95%;

    > input {
      padding: 0.8rem;
      border-radius: 5px;
      border: 1px solid #ddd;
    }
  }

  span.check-container {
    flex-direction: row;
    padding: 1rem 0;
    align-items: center;
    gap: 5px;

    > input {
      width: 1rem;
      height: 1rem;
    }
  }

  > button {
    border-radius: 5px;
    padding: 0.9rem 2rem;
    height: auto;
    margin-top: 1rem;
    width: min-content;
    background-color: #222;
  }

  > button:hover {
    background-color: #424242;
  }
  > button:active {
    transform: scale(0.95);
  }
}

@media screen and (max-width: 600px) {
  main {
    gap: 2rem;
    h2 {
      font-size: 2.5rem;
    }
    form.forms {
      padding: 2rem 0.7rem;
      width: 100%;

      .check-container {
        margin-top: 1rem;
        input {
          width: 30px;
          height: 30px;
        }

        label {
          font-size: 0.7rem;
        }
      }

      button {
        margin-top: 3rem;
      }

      button:disabled {
        background-color: #424242;
      }
    }

     img.img-sorteo {
      width: 100%;
      object-fit: scale-down;
    }
  }
  
}

main {
  .img-sorteo {
    width: 750px;
    object-fit: scale-down;
  }
}