@media only screen and (min-width: 769px) {
.modal{
  background-color: rgba(0,0,0,0.9);
  position:absolute;
  z-index: 100;
  /*top:0;
  right:0;
  bottom:0;
  left:0;*/
    width: 100%; height:100%;
  opacity:0;
  /*pointer-events:none;*/
  transition: all 1s;
}

.modal-contenedor{width: 80%; margin:0 auto; padding:40px 0; box-sizing: border-box;height:100%; display:flex; align-items: center; }

.contenedor{width: 100%; display:flex; align-items: center; /*height:100%;*/ }

.modal-texto{width:38%; float:left;  color:#333; padding:0 20px 0 20px;; box-sizing:border-box; font-size:16px; display:flex; align-items:flex-end;flex-wrap: wrap;height:100%;line-height: 25px;  margin-left:20px; }
.modal-texto .conttexto{width:100%;}
.modal-texto .conttexto p.textop{width:100%;background:#FFF; padding:6px 10px; box-sizing: border-box;border-radius: 20px; float:left;display:block; font-size:16px;}
.modal-texto span{font-size:20px; }

.modal-texto .conttexto p.cerrar{width:100%; background:none;padding:0; border-radius: 0; text-align: right;}
.modal-texto .conttexto p.cerrar a.cerrar{font-size:28px; color:#FFF; display: block; width:50px; height:50px; border-radius:50%; border:solid 3px #FFF; text-decoration: none; text-align: center;padding:10px 0 5px 0; box-sizing: border-box; float:right; margin-bottom:30px;}
.modal-contenido{
 width:50%;
  display:flex;
  align-items: center;
    justify-content: flex-end;
  box-sizing:border-box;
  position: relative;
  float:left;
height:550px;
}
.modal-contenido img{border:5px solid #FFF; box-sizing: border-box; display:block;  }

#miModal{
  opacity:1;
  /*pointer-events:auto;*/
}
}



@media (max-width: 768px) {
    .modal{display:none;}       
}