body, html {
      height: 100%;
      margin: 0;        
    }

    /* Estilo general */
    .login-wrapper {      
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: #0f1f35;
      color: white;
    }

    /* Estilo escritorio */
    @media (min-width: 768px) {
      .login-wrapper {
        height: 100vh;
        background: url('/Images/BG.png') no-repeat center center;
        background-size: cover;
        justify-content: flex-end;
      }

      .login-box {
        width: 80%;
        height: 100%;
        background-color: rgba(15, 31, 53, 0.95);
        top: 0;
        clip-path: polygon(100% 0, 100% 100%, 80% 100%, 0 0);
        position: absolute;

      }
      .login-box2 {
        width: 25vw;
        margin-left: 60%;
        margin-top: 17vw;   
        margin-right: 0;
      

      }
      .SGMVAEscritorio{
        position: absolute;
        z-index: 9;
        max-width: 53vw;
        height: auto;
        top: -15.7vw;
        right: 3vw;
      }
    }

    /* Estilo móvil */
    @media (max-width: 767.98px) {
    .login-wrapper {      
      height: 100%;
    }
      .login-box {
        width: 70%;
        background-color: transparent;
        text-align: center;
        margin: 0%;
      }

      .logo {
        max-width: 200px;
        margin-bottom: 20px;
      }
      .logoSGMVA {
        max-width: 200px;

      }
      .H2{
        font-size: 2rem;
      }
      .P{
        font-size: 1.2rem;
      }
    }

    .form-control {
      background-color: transparent;
      border: 1px solid #ccc;
      margin-top: 30px;
      color: white;
    }

    .form-control::placeholder {
      color: #aaa;
    }

    .btn-primary {
      margin-top: 20px;        
      background-color: #007bff;
      border: none;
    }

    .footer {
      position: absolute;
      bottom: 0px;
      width: 100%;
      text-align: center;
      font-size: 1rem;
      color: white;
      background-color: black;
    }