@media screen and (min-width: 300px) {
    body{
        font-family: 'Poppins';
        background-image: url("../img/background-mind.webp");
        background-position: center center;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: cover;
        margin: 0;
        padding: 0;
        height: 100vh;
        width: 100%;
        overflow: hidden;
      }
      input, #boton {
          border-radius: 15px;
          margin: 15px 0px 15px 0px;
          padding: 5px 5px 5px 5px;
          background-color: #29215A !important;
          border: 1px solid #29215A;
          color: #fff;
      }
    
      input, #boton:hover {
          border-radius: 15px;
          margin: 15px 0px 15px 0px;
          padding: 5px 5px 5px 5px;
          background-color: #29215A;
          border: 1px solid #29215A;
          color: #fff;
      }
  
      .backlogin{
          background-color: rgba(41, 33, 90, 0.5);
      }
      .topsite{
          margin-top: 40px;
      }
      img, #logoimg {
          max-width: 100px;
          margin: 10px 2px 10px 2px;
      }
      
      #botonentrar {
          background-color: #e2cf93 !important;
          color: #29215A;
          font-weight: 600;
          font-size: 18px;
          padding: 11px;
      }
      a {
          color: #fff;
          font-size: 18px;
          margin: 5px 2px 10px 2px;
      }
      a:hover {
          color: #fff;
          font-size: 18px;
          margin: 5px 2px 10px 2px;
      }

}

@media screen and (min-width: 768px) {
    body{
        font-family: 'Poppins';
        background-image: url("../img/background-mind.jpg");
        background-position: center center;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: cover;
        margin: 0;
        padding: 0;
        height: 100vh;
        width: 100%;
        overflow: hidden;
      }
      input, #boton {
          border-radius: 15px;
          margin: 15px 0px 15px 0px;
          padding: 5px 5px 5px 5px;
          background-color: #29215A !important;
          border: 1px solid #29215A;
          color: #fff;
      }
    
      input, #boton:hover {
          border-radius: 15px;
          margin: 15px 0px 15px 0px;
          padding: 5px 5px 5px 5px;
          background-color: #29215A;
          border: 1px solid #29215A;
          color: #fff;
      }
  
      .backlogin{
          background-color: rgba(41, 33, 90, 0.5);
          min-width: 639px;
      }
      .topsite{
          margin-top: 40px;
      }
      img, #logoimg {
          max-width: 230px;
          margin: 10px 2px 10px 2px;
      }

      #centered-element {
        margin: 0;
        margin-left: 0px;
        position: absolute;
        top: 39%;
        transform: translateY(-50%);
        margin-left: 192px;
      }         
      
      #botonentrar {
          background-color: #e2cf93 !important;
          color: #29215A;
          font-weight: 600;
          font-size: 18px;
          padding: 11px;
      }
      a {
          color: #fff;
          font-size: 18px;
          margin: 5px 2px 10px 2px;
      }
      a:hover {
          color: #fff;
          font-size: 18px;
          margin: 5px 2px 10px 2px;
      }

}

@media screen and (min-width: 1200px) {
    body{
        font-family: 'Poppins';
        background-image: url("../img/background-mind.jpg");
        background-position: center center;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: cover;
        margin: 0;
        padding: 0;
        height: 100vh;
        width: 100%;
        overflow: hidden;
      }
      input, #boton {
          border-radius: 15px;
          margin: 15px 0px 15px 0px;
          padding: 5px 5px 5px 5px;
          background-color: #29215A !important;
          border: 1px solid #29215A;
          color: #fff;
      }
    
      input, #boton:hover {
          border-radius: 15px;
          margin: 15px 0px 15px 0px;
          padding: 5px 5px 5px 5px;
          background-color: #29215A;
          border: 1px solid #29215A;
          color: #fff;
      }
  
      .backlogin{
          background-color: rgba(41, 33, 90, 0.5);
      }
      .topsite{
          margin-top: 40px;
      }
      img, #logoimg {
          max-width: 250px;
          margin: 10px 2px 10px 2px;
      }

      #centered-element {
        margin: 0;
        position: absolute;
        top: 35%;
        transform: translateY(-50%);
      }      
      
      #botonentrar {
          background-color: #e2cf93 !important;
          color: #29215A;
          font-weight: 600;
          font-size: 18px;
          padding: 11px;
      }
      a {
          color: #fff;
          font-size: 18px;
          margin: 5px 2px 10px 2px;
      }
      a:hover {
          color: #fff;
          font-size: 18px;
          margin: 5px 2px 10px 2px;
      }

}
    
@media screen and (min-width: 1920px) {
    
    body{
      font-family: 'Poppins';
      background-image: url("../img/background-mind.jpg");
      background-position: center center;
      background-repeat: no-repeat;
      background-attachment: fixed;
      background-size: cover;
      margin: 0;
      padding: 0;
      height: 100vh;
      width: 100%;
      overflow: hidden;
    }
    input, #boton {
        border-radius: 15px;
        margin: 15px 0px 15px 0px;
        padding: 5px 5px 5px 5px;
        background-color: #29215A !important;
        border: 1px solid #29215A;
        color: #fff;
    }
  
    input, #boton:hover {
        border-radius: 15px;
        margin: 15px 0px 15px 0px;
        padding: 5px 5px 5px 5px;
        background-color: #29215A;
        border: 1px solid #29215A;
        color: #fff;
    }

    .backlogin{
        background-color: rgba(41, 33, 90, 0.5);
    }
    .topsite{
        margin-top: 40px;
    }
    img, #logoimg{
        max-width: 250px;
        margin: 10px 2px 10px 2px;
    }

    #centered-element {
        margin: 0;
        position: absolute;
        top: 35%;
        transform: translateY(-50%);
      }       
    
    #botonentrar {
        background-color: #e2cf93 !important;
        color: #29215A;
        font-weight: 600;
        font-size: 18px;
        padding: 11px;
    }
    a {
        color: #fff;
        font-size: 18px;
        margin: 5px 2px 10px 2px;
    }
    a:hover {
        color: #fff;
        font-size: 18px;
        margin: 5px 2px 10px 2px;
    }    

}