/* CSS Document */

body{
  /*  font-family:Arial, Helvetica, sans-serif;*/
}

#abrirModal{
   /* padding:15px 35px;
    font-size:18px;*/
    cursor:pointer;
}


/* Fondo oscuro */
.modalResultados{

    display:none;

    position:fixed;

    left:0;
    top:0;

    width:100%;
    height:100%;

    background:rgba(0,0,0,.75);

    z-index:9999;

    justify-content:center;
    align-items:center;

}


/* Ventana */
.modal-contenido{

    width:90%;
    max-width:900px;

    height:90vh;

    background:white;

    border-radius:15px;

    overflow:auto;

    padding:30px;

    position:relative;

    text-align:center;

    box-sizing:border-box;

}


/* Imagen */
/* .modal-contenido img{

    width:100%;
    max-height:55vh;

    object-fit:cover;

    border-radius:10px;

}*/

.modal-contenido img{

    width:100%;

    height:65vh;          /* ocupa hasta el 65% de la altura de la ventana */

    object-fit:contain;   /* muestra toda la imagen */

    object-position:center;

    display:block;

    margin:0 auto;

}


/* Botón */
.modal-contenido button{

    margin-top:25px;

    padding:15px 35px;

    border:none;

    background:#0d6efd;

    color:white;

    font-size:18px;

    border-radius:8px;

    cursor:pointer;

}

.modal-contenido button:hover{

    background:#0056d2;

}


/* X cerrar */

.cerrar{

    position:absolute;

    right:20px;

    top:15px;

    font-size:38px;

    cursor:pointer;

}


/* Celulares */

@media(max-width:768px){

    .modal-contenido{

        width:95%;
        height:92vh;

        padding:20px;

    }

    .modal-contenido button{

        width:100%;

        font-size:20px;

    }

}