@media (orientation: landscape) {
    .filtros{
        width: 100%;
        height: auto;
        background-colokr: rgba(127, 255, 212, 0.425);
        display: block;
        padding: 10px;
    }
    .filtros input{
        border-radius: 20px;
        height: ;
        padding: 10px;
    }
    #add-pro{
        width: 50%;
        background-color: antiquewhite;
        position: fixed;
        left: 100px;
        top: 30px;

        display: flex; 
        flex-direction: column; /* Organiza los elementos verticalmente */ 
        align-items: center; /* Centra los elementos horizontalmente dentro del contenedor */
        display: none;

    }
    #add-pro img{
        width: 200px;
        min-height: 80px;
        background-color: aliceblue;
        overflow-y: hidden;
    }
    #adescripcion{
        width: 50%; min-height: 20px; max-height:150px;/* Altura mínima del textarea */ 
        resize: none; /* Desactiva el redimensionamiento manual */ 
        overflow: hidden; /* Oculta las barras de desplazamiento */ 
    }
    #edit-pro{
        width: 50%;
        background-color: antiquewhite;
        position: fixed;
        left: 100px;
        top: 30px;

        display: flex; 
        flex-direction: column; /* Organiza los elementos verticalmente */ 
        align-items: center; /* Centra los elementos horizontalmente dentro del contenedor */
        

    }
    #edit-pro img{
        width: 200px;
        min-height: 80px;
        background-color: aliceblue;
        overflow-y: hidden;
    }
    #edescripcion{
        width: 50%; min-height: 20px; max-height:150px;/* Altura mínima del textarea */ 
        resize: none; /* Desactiva el redimensionamiento manual */ 
        overflow: hidden; /* Oculta las barras de desplazamiento */ 
    }
    #dedit{
        
    }
    #btedit{
        
        widkth:100px;
        border: solid 2px rgb(255, 255, 255);
        display: block;
        position:absolute;
        margin: 0px;
        right: 0px;
        top: 0px;
        float:right;
        padding: 8px;
        border-radius: 30px;
        background-color: rgba(0, 0, 255, 0.63);
        color: white;
    }

}
@media (orientation: portrait) {

    .filtros{
        width: 100%;
        height: auto;
        background-color: rgba(127, 255, 212, 0.425);
        display: block;
        padding: 10px;
    }
    .filtros input{
        border-radius: 20px;
        height: ;
        padding: 10px;
    }
    #add-pro{
        width: 100%;
        background-color: antiquewhite;
        position: fixed;
        
        top: 30px;

        display: flex; 
        flex-direction: column; /* Organiza los elementos verticalmente */ 
        align-items: center; /* Centra los elementos horizontalmente dentro del contenedor */
        display: none;

    }
    #add-pro img{
        width: 200px;
        min-height: 80px;
        background-color: aliceblue;
        overflow-y: hidden;
    }
    #adescripcion{
        width: 50%; min-height: 20px; /* Altura mínima del textarea */ 
        resize: none; /* Desactiva el redimensionamiento manual */ 
        overflow: hidden; /* Oculta las barras de desplazamiento */ 
    }
    #edit-pro{
        width: 100%;
        background-color: antiquewhite;
        position: fixed;
        
        top: 30px;

        display: flex; 
        flex-direction: column; /* Organiza los elementos verticalmente */ 
        align-items: center; /* Centra los elementos horizontalmente dentro del contenedor */
        

    }
    #spimge{
        width: 150px; /* Ancho del contenedor */
        height: 150px; /* Alto del contenedor */
        overflow: hidden; /* Oculta cualquier exceso de la imagen */
        display: block;
        justify-content: center;
        align-items: center;
        position: relative;
        box-sizing: border-box;
    }
    #edit-pro img{
        width: 100%;
        height: 100%;
        object-fit: cover; /* Asegura que la imagen ocupe el contenedor sin deformarse */
        object-position: center; /* Centra la imagen en el contenedor */
    }
    #edescripcion{
        width: 50%; min-height: 20px; /* Altura mínima del textarea */ 
        resize: none; /* Desactiva el redimensionamiento manual */ 
        overflow: hidden; /* Oculta las barras de desplazamiento */ 
    }
    #dedit{
        
    }
    #btedit{
        
        widkth:100px;
        border: solid 2px rgb(255, 255, 255);
        display: block;
        position:absolute;
        margin: 0px;
        right: 0px;
        top: 0px;
        padding: 8px;
        border-radius: 30px;
        background-color: rgba(0, 0, 255, 0.63);
        color: white;
    }
}