.cerrar{
      margin: 10px;
      padding: 0;
      background: #007bff;
      color: white;
      border: none;
      border-radius: 5px;
      cursor: pointer;
      font-size: 16px;
      position:absolute;
      width:42px;
      height:100%;
      margin:0;
    }
    .svgpan{width:20px; height: auto; opacity:0.8}

    @media (max-width: 767px) {
        .cerrar{width:100%; height:42px; bottom:0;}

 
    }

   

   
    /* Iframepan DESLIZANTE A PANTALLA COMPLETA */
    .Iframepan {
      position: fixed;
      top: 0;
      right: -100%; /* fuera de pantalla */
      width: 100%;
      height: 100vh; /* ocupa toda la pantalla */
      background: white;
      box-shadow: -4px 0 12px rgba(0,0,0,0.3);
      transition: right 0.5s ease;
      z-index: 1001;
      display: flex;
      flex-direction: column;
    }

    .pan1{z-index: 1000;}

    .Iframepan.open {
      right: 0; /* aparece */
    }

    /* FONDO OSCURECIDO */
    .overlay {
      display: none;
      position: fixed;
      top: 0; 
      left: 0;
      width: 100%; 
      height: 100%;
      background: rgba(0,0,0,0.5);
      z-index: 1000;
    }

    .overlay.show {
      display: block;
    }

    /* BOTONES */
    

    /* IFRAME A TODA PANTALLA */
    iframe {
      width: 100%;
      height: calc(100% - 50px); /* excepto el espacio del botón */
      border: none;
    }