html {width:100%;height:100%}
body {height:1224px;width:100%}
.app-viewport {position:absolute;top:0;bottom:0;width:100%}
html{background:#eeeeee}body{background:rgba(255,255,255,0);position:absolute;top:0px;bottom:0px;left:0px;right:0px;margin:auto}p,h1,h2,h3,h4,h5,h6{overflow:hidden}a:focus,.btn:focus,.btn:active:focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn.active.focus,input[type="radio"]:focus,input[type="checkbox"]:focus{outline:0}.nav,.pagination,.carousel,.panel-title a{cursor:pointer}.modal{overflow:auto}.modal-dialog{margin-top:0;margin-bottom:0;padding-top:10px}.modal-content{overflow:hidden}.modal-backdrop{opacity:.5}.pagination{margin:0}.input-group-btn{vertical-align:top}.input-group-btn>.btn{height:100%}.input-group>.form-control{height:100%}.input-group{padding:0}.neocheckbox [type="checkbox"]:not(:checked),.neocheckbox [type="checkbox"]:checked{position:absolute;left:-9999px}.neocheckbox [type="checkbox"]:not(:checked) + label,.neocheckbox [type="checkbox"]:checked + label{position:relative;padding-left:1.95em;cursor:pointer}.neocheckbox [type="checkbox"]:not(:checked) + label:before,.neocheckbox [type="checkbox"]:checked + label:before{content:'';position:absolute;left:0;top:0;width:1.25em;height:1.25em;border:0.15em solid #aaa;background:#fff;border-radius:4px}.neocheckbox [type="checkbox"]:not(:checked) + label:after,.neocheckbox [type="checkbox"]:checked + label:after{content:"\2713\0020";position:absolute;top:.2em;left:.2em;font-size:1.1em;line-height:0.8;color:#444444;transition:all .2s;font-family:'Lucida Sans Unicode','Arial Unicode MS',Arial}.neocheckbox [type="checkbox"]:not(:checked) + label:after{opacity:0;transform:scale(0)}.neocheckbox [type="checkbox"]:checked + label:after{opacity:1;transform:scale(1)}.neocheckbox [type="checkbox"]:disabled:not(:checked) + label:before,.neocheckbox [type="checkbox"]:disabled:checked + label:before{box-shadow:none;border-color:#bbb;background-color:#ddd}.neocheckbox [type="checkbox"]:disabled:checked + label:after{color:#999}.neocheckbox [type="checkbox"]:disabled + label{color:#aaa}.neocheckbox label:hover:before{border:0.15em solid #888!important}.neoradio [type="radio"]:not(:checked),.neoradio [type="radio"]:checked{position:absolute;left:-9999px}.neoradio [type="radio"]:not(:checked) + label,.neoradio [type="radio"]:checked + label{position:relative;padding-left:1.95em;cursor:pointer}.neoradio [type="radio"]:not(:checked) + label:before,.neoradio [type="radio"]:checked + label:before{content:'';position:absolute;left:0;top:0;width:1.25em;height:1.25em;border:0.15em solid #aaa;background:#fff;border-radius:100px}.neoradio [type="radio"]:not(:checked) + label:after,.neoradio [type="radio"]:checked + label:after{content:"\2713\0020";position:absolute;top:.2em;left:.2em;font-size:1.1em;line-height:0.8;color:#444444;transition:all .2s;font-family:'Lucida Sans Unicode','Arial Unicode MS',Arial}.neoradio [type="radio"]:not(:checked) + label:after{opacity:0;transform:scale(0)}.neoradio [type="radio"]:checked + label:after{opacity:1;transform:scale(1)}.neoradio [type="radio"]:disabled:not(:checked) + label:before,.neoradio [type="radio"]:disabled:checked + label:before{box-shadow:none;border-color:#bbb;background-color:#ddd}.neoradio [type="radio"]:disabled:checked + label:after{color:#999}.neoradio [type="radio"]:disabled + label{color:#aaa}.neoradio label:hover:before{border:0.15em solid #888!important}
#MenuSup {position:relative;width:768px;height:65px;background-color:#383838;border-style:solid;border-width:1px;padding-left:20px;padding-top:5px;overflow-x:hidden;overflow-y:hidden}
#TituloMenu {position:absolute;left:0.05%;width:99.9%;top:9px;height:52px;margin:0;color:#FFFFFF;text-align:left;padding-left:130px;padding-top:10px}
#Intro {position:relative;width:100%;height:100%;overflow:auto;;background-color:#FFF;background-attachment:fixed;background-image:url("../img/fondo1.png");background-position:center;background-repeat:no-repeat}
#IntroTimbre {position:absolute;left:0px;width:100%;top:231px;height:549px;margin:0;color:#000000;border-width:1px;padding-top:50px;overflow-x:hidden;overflow-y:hidden}
#playerintro {position:absolute;left:24.8697916666667%;width:45.703125%;top:1172px;height:46px;margin:0;border-width:1px;overflow-x:hidden;overflow-y:hidden}
#Portada {position:relative;width:100%;height:100%;overflow:auto;;background-color:#FFF;background-attachment:fixed;background-image:url("../img/fondo2.png");background-position:center center;background-repeat:no-repeat;overflow-y:auto}
#Pie {position:absolute;left:0;bottom:0;width:100%;height:46px;margin:10px 0 0 0;color:#E0E0E0;background-color:#383838;padding-top:10px;overflow-x:hidden;overflow-y:hidden}
#cont_portada {position:absolute;left:1.82291666666667%;width:96.3541666666667%;top:1px;height:1178px;margin:0;color:#000000;font-size:12pt;border-width:1px;overflow-y:scroll;overflow-x:hidden}
#Leer {position:relative;width:100%;height:100%;overflow:auto;;background-color:#FFF;overflow-y:auto}
#IFrameLeer {position:absolute;left:0px;width:100%;top:66px;height:1159px;margin:0;}
#Autor {position:relative;width:100%;height:100%;overflow:auto;;background-color:#FFF8DC;overflow-y:auto}
#Cont_Autor {position:absolute;left:0px;width:97.7864583333333%;top:56px;height:1169px;margin:0;border-width:1px;padding-left:40px;padding-right:40px;padding-top:25px;overflow-y:scroll;overflow-x:hidden}
#Introduccion {position:relative;width:100%;height:100%;overflow:auto;;background-color:#FFF8DC;overflow-y:auto}
#Cont_Intro {position:absolute;left:0px;width:100%;top:79px;height:1078px;margin:0;font-size:12pt;border-width:1px;padding-left:10px;padding-right:10px;padding-top:5px;overflow-y:scroll;overflow-x:hidden}
#Coloreables {position:relative;width:100%;height:100%;overflow:auto;;background-color:#FFF;overflow-y:auto}
#IFrame1 {position:absolute;left:0px;width:100%;top:66px;height:1159px;margin:0;}
#DialogContainer1 {margin-left:auto;margin-right:auto;width:100%;height:1024px;}
.form-div {background-color: #FFD966;border-radius: 15px;padding: 20px;text-align: center;width: fit-content;margin: 20px auto;box-shadow: 0 4px 8px rgba(0,0,0,0.2);font-family: Arial, sans-serif}

  .form-div a {display: inline-block;margin-top: 10px;text-decoration: none;color: white;background-color: #0078D7;padding: 10px 20px;border-radius: 10px;font-weight: bold}

  .form-div a:hover {background-color: #005A9E}

-------------------------
.video-container {position: relative;width: 100%;max-width: 800px;margin: auto;overflow: hidden;border-radius: 20px;box-shadow: 0 4px 10px rgba(0,0,0,0.3);}

    .video-container video {width: 390px;height: auto;display: block;border-radius:25px;}

--------------------
   .boton-animado {animation: mover 1.5s infinite ease-in-out;cursor: pointer}

    @keyframes mover {
      0%   {transform: translateY(0);}
      50%  {transform: translateY(15px);}
      100% {transform: translateY(0);}
    }

/* Contenedor padre: ocupa toda la pantalla y centra el contenido */
.containerMSJ {display: flex;justify-content: center;align-items: center;min-height: 100vh;padding: 20px;}

/* Caja glass responsive */
.glass {background: rgba(255, 255, 255, 0.45);border-radius: 16px;padding: 24px;height: 550px;width: 100%;max-width: 500px;box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);backdrop-filter: blur(5px);-webkit-backdrop-filter: blur(10px);border: 1px solid rgba(255, 255, 255, 0.3);text-align: center;overflow-y: auto}

/* Ajuste de tipografía y responsividad */
h2 {margin-top: 0;color: #222;font-size: clamp(1.2rem, 2.5vw, 1.8rem);}


-------------------

.btn {padding: 1rem;border: none;border-radius: 10px;cursor: pointer;transition: transform 0.2s, box-shadow 0.3s;color: grey}

    .btn:hover {transform: scale(1.05);box-shadow: 0 4px 8px rgba(0,0,0,0.2);}
    footer {margin-top: 2rem;font-size: 0.9rem;color: #000000;}

    @media (min-width: 600px) {
      .buttons {flex-direction: row;}

----------------
#cont_menu {width: 100%;}
#MenuSup {width: 100%;position: fixed;top: 0;z-index: 1000;}
#TituloMenu {width: 100%;}
#IntroTimbre {width: 100%;}
#Pie {width: 100%;}
#iFrameLeer {width: 100%;height: 100%;}
#Cont_BTN_INTRO {width: 100%;}
#Cont_Intro {width: 100%;}
#Cont_Autor {width: 100%;}