(mantenimiento productos)
<meta name="viewport"  content="width=device-width, initial-scale=1.0">

<style>
    *{
        box-sizing: border-box;
    }
    
       .titre{
            width: 100%;    
            text-align: center;
            margin-top: 100px;
        }

        .main{
            display: flex;
            justify-content: center;
            align-items: center;
        }
        
        form{
            width: auto;
            padding: 20px;
            border: 1px solid black;
        }
  
        label{
            box-sizing: border-box;
            width: 50%;
            float: left;
        }
        
        input{
            box-sizing: border-box;
            width: 50%;
            text-align: center;
            float: left;
        }
        
        button{
            box-sizing: border-box;
            width: 50%;
            padding: 10px;
            margin-top: 10px;
            float: left;
        }
        
        /*@media (max-width: 880px) and (orientation:portrait){*/
        @media screen and (max-width: 680px){
        /*@media all and (orientation:portrait){*/
            .titre{
                margin-top: 10px;
                font-size: 48px;
                margin-bottom: 10px;
           }
  
            label{
                width: 100%;
                /*height: 100px;*/
                font-size: 24px;
                text-align: center;
           }

             input{
                width: 100%;
                /*height: 100px;*/
                font-size: 24px;
                padding: 10px;
                /*margin-top: -60px;*/
                /*margin-bottom: 20px;*/
                border: none;
                background: #ddd;
            }
            
            form{
                width: 75%;
                font-size: 24px;
            } 
            
            button{
                padding: 50px 0 50px 0;
                font-size: 18px;
            }
            
        }
</style>


    <p class="titre">login</p>
    
    <div style="clear:both;"></div>
    
<div class="main">
    <form action="verificateur.php" method="POST">
        <label>nombre de usuario:</label><input type="text" name="utilisateur" value="">
        <br><br>
        <label>clave de acceso:</label> <input type="password" name="contresignal" value="">
        <br><br>
        <button type="submit" name="btnsubmit" style="background: #afa;"> Acceder </button>
        <button type="reset" style="background: #faa;"> Limpiar </button>
    </form>
</div> 

<style>
    a{
        border: 1px solid black;
        width: auto;
        padding: 50px;
        float: left;
    }
    a:hover{
        background: #aaf;
    }
    
    
</style>