:root { --Gris: #222220;
	--Fondo: #ffffff; 
      }

@font-face { font-family: "Mestiza Sans Bold";
             src: url("Mestiza_Sans_Bold.otf") format("opentype");
             font-style: italic;
           }
@font-face { font-family: "Ivy Style Sans";
             src: url("IvyStyle_Sans.otf") format("opentype");
             font-style: italic;
           }

body { /*display: inline-flex;*/
       margin-Left: -1mm;
       margin-Top: -1mm;
       font-family: "Mestiza Sans Bold", sans-serif;
       font-size: 18pt;
       overflow-x: hidden;
       overflow-y: hidden;
     }

.Boton1 { display: block;
          font-family: "Mestiza Sans Bold", sans-serif;
          font-size: calc(7pt + 0.7vw);
          padding: 0;
          border: none;
          background: none;
          text-align: left;
        }

.Boton1:hover { color: #e31313;
                text-shadow: 1px 1px 10px #777, -1px -1px 10px #777;
              }

.Boton2 { display: block;
          font-family: "Mestiza Sans Bold", sans-serif;
          font-size: calc(9pt + 0.7vw);
          color: #fff;
          padding: 0;
          border: none;
          background: none;
          text-align: left;
        }          

.Boton2:hover { color: #222220;
              }

.Boton3 { display: block;
          margin-top: 2%;
          margin-left: auto;
          margin-right: auto; 
          font-family: "Mestiza Sans Bold", sans-serif;
          font-size: 12pt;
          color: #fff;
          padding-left: 5mm;
          padding-right: 5mm;
          background-color: #e31313;
        }

.Boton3:hover { box-shadow: 1px 1px 10px #222220;
                color: #ddd;
              }

.Boton4 { display: block;
          margin-top: 2%;
          margin-left: auto;
          margin-right: auto; 
          font-family: "Mestiza Sans Bold", sans-serif;
          font-size: 12pt;
          color: #000;
          padding: 0;
          border: none;
          background: none;
        }

.Boton4:hover { text-shadow: 1px 1px 10px #222220;
              }

.Boton5 { margin-right: 2mm;
          background-color: #222220;
          color: #fff; 
          border-radius: 50%;
          padding-left: 5mm;
          padding-right: 5mm;
        }

.Boton5:hover { box-shadow: 0px 0px 10px #000;
              }

.Boton6 { position: absolute;
          display: block;
          right: 5mm;
          top: 7mm;  
          font-family: "Mestiza Sans Bold", sans-serif;
          font-size: 14pt;
          color: #fff;
          text-shadow: -1px -1px 1px #000, 1px 1px 1px #000;
          z-index: 2100;
          padding: 3% 0 0 0;
          border: none;
          background: none;
          opacity: 0.1;
        }

.Boton6:hover { color: #e31313;
                cursor: pointer;
              }

.Boton7 { display: block;
          float: right; 
          font-family: "Mestiza Sans Bold", sans-serif;
          font-size: 12pt;
          color: #000;
          padding: 12% 5% 2% 2%;
          border: none;
          background: linear-gradient(to right, #fff, #777);
        }

.Boton7:hover { text-shadow: 0 0 7px #222220;
                cursor: pointer;
              }

.Boton8 { display: inline-block;
          margin: 1vh auto 1vh auto;
          padding 0;
        }

.Boton8:hover { box-shadow: 0 0 7px #222220;
                cursor: pointer;
              }

.Botoneras { position: absolute;
             left: 0vw;
             top: 90vh;
             width: 100%;  
             text-align: center;
             z-index: 1100;
           }

.Campos { display: inline-block;
          width: 59%;
        }

.Campo1 { display: block;
          font-family: "Mestiza Sans Bold", sans-serif;
          font-size: 13pt;
          color: #000; 
          width: 100%;
          background-color: rgba(255, 255, 255, 0.5);
        }

.Campo2 { display: block;
          font-family: "Mestiza Sans Bold";
          font-size: 11pt;
          color: #000;
          padding: 0;
          margin: 0;
          width: 100%;
          border: none;
          border: 1px solid #777; 
        }

.Campo3 { font-size: 9pt;
          font-weight: 1;  
        }

.Campo4 { display: inline-block;
          max-width: 5cm;
        }

.Campo5 { display: inline-block;
          max-width: 7cm;
        }

.Cuadro1_1 { grid-column: 1; 
             grid-row: 1;
           }

.Cuadro1_2 { grid-column: 1; 
             grid-row: 2/6;
           }

.Cuadro2_1 { grid-column: 2;
             grid-row: 1/6;
             background-color: #777;
           }

.Cuadro3_1 { grid-column: 3; 
             grid-row: 1/6;
             position: relative; 
             background-color: #777;
           }

.CuadroBlanco { width: 100%;
                height: 15vw; 
                background-color: #fff;
                text-align: right;
              }

.Contacto { background-color: #777;
            overflow-x: auto;
            overflow-y: auto;
            margin-left: 0;
            text-align: center;
          }

.Directorio { display: block;
              width: 100%;
              margin-left: auto;
              margin-right: auto; 
              font-family: "Times New Roman";
              font-size: 10pt;
              border: 3px double #000;
              background-color: #fff;
            }
.Directorio a { text-decoration: none;
                color: #e31313;
                font-weight: bold; 
              }
.Directorio textarea { width: 100%;
                       height: 1.5cm;
                       font-family: "Mestiza Sans Bold";
                       margin: 0 1mm 0 1mm;
                       color: #000;
                     }
.Directorio tr { background-image: linear-gradient(to bottom, #fff, #ccc);
               }
.Directorio .Letreros { display: inline-block;
                        width: 11%;
                      }
.Directorio .Campos { display: inline-block;
                      width: 30%;
                    }
.Directorio .CampoTexto { display: inline-block;
                          width: 55%;
                        }
.Espacio { width: 90%;
           height: 40vh;
         }

.FoquitoApagado { display: inline-block;
                  width: 2mm;
                  height: 2mm;
                  border: 1px solid #000;
                  border-radius: 50%;
                  margin: 0 1px 0 1px;
                }

.FoquitoEncendido { display: inline-block;
                    width: 2mm;
                    height: 2mm;
                    border: 1px solid #000;
                    border-radius: 50%;
                    margin: 0 1px 0 1px;
                    background-color: #e31313;
                    box-shadow: 0px 0px 10px #e31313;
                  }

.Instrucciones { font-family: "Ivy Style Sans";
                 font-size: 12pt;
                 width: 100%;
                 background-color: #fff; 
               }
.Instrucciones ol { width: 80%;
                    text-align: left; 
                  }

.Letreros { display: inline-block;
            width: 39%;
          }

.Menu { list-style-type: none;
        margin-left: 0;
        padding: 0;
      }

.MenuTutoriales { width: 7cm;
                  height: 2cm; 
                  background-repeat: no-repeat;
                  background-size: contain; 
                }

.NoExiste { display: flex;
	    justify-content: center;
	    align-items: center;
	    width: 100vw;
	    height: 100vh;
	    background-image: url("../Imagenes/Logotipos/Virtual.png");
	    background-repeat: no-repeat;
	    background-size: contain;
	    background-position: center; 
	    color: #f00;
          }
.Nota { font-weight: bold;
        color: #e31313;
      }

.Pila { display: block;
        width: 50%;
        margin: 0 auto 0 auto;
      }

.Rejilla { position: absolute;
           left: 1mm;
           z-index: 200;
           width: 100%;
           min-width: 1024px;
           min-height: 768px; 
           display: grid;
           grid-template-columns: 1fr 1fr 2fr;
           grid-auto-rows: minmax(15vh, 15vw);
           /*grid-gap: 1px;*/
           /*border: 1px solid black;*/
         }

.Submenu { position: absolute;
           display: none; 
           list-style-type: none;
           margin-left: 0;  
           padding: 0;
           background-color: #fff;
         }

.Texto1 { font-family: "Mestiza Sans Bold", sans-serif;
          font-size: 12pt;
          text-align: right;
          color: #000;
          width: 100%;
          border: none; 
          background: none;
        }

.Texto2 { font-family: "Mestiza Sans Bold", sans-serif;
          font-size: 11pt;
          font-weight: bold; 
          color: #000; 
          text-align: right;
          width: 100%;
          border: none; 
        }

.Texto3 { display: inline-block;
          font-family: "Mestiza Sans Bold", sans-serif;
          font-size: 11pt;
          font-weight: bold; 
          color: #000; 
          text-align: right;
          max-width: 2cm;
          border: none; 
        }

.Texto4 { display: inline-block;
          max-width: 4cm;
        }

.Titulo1 { display: block;
           font-size: calc(14pt + 0.5vw);
           color: #fff;
           text-align: center;
           margin-bottom: 0;
         }

.Titulo2 { display: block;
           font-family: "Mestiza Sans Bold"; 
           font-size: calc(7pt + 1vw);
           color: #000;
           font-weight: bold;  
           text-align: center;
           margin-bottom: 0;
         }

#Cambio { background-color: #fff;
          width: 100%;
        }

#Codigo { display: none;
        }

#DatosPreliminares { display: block;
                   }

#Enfoque { display: none;
           position: absolute;
           right: 0;
           top: 0;
           max-width: 77.5vw;
           max-height: 100vh;
         }

#Imagen { display: none;
          width: 100%;
          height: 100%;
          background-repeat: no-repeat;
          background-size: cover; 
          
        }

#Logotipos { width: 90%;
             /*height: 40vh;*/
             margin-left: auto;
             margin-right: auto; 
             background-image: url("../Imagenes/Logotipos/LogotipoUJED2024.png");
             background-repeat: no-repeat;
             background-size: 75% 120%;
             background-position: 50% 25%;
             /*border: 1px solid gray;*/
           }


#Pantalla { position: absolute;
            /*top: 5vh;*/
            width: 100%;
            height: 100vh;
            mask-image: linear-gradient(to left, black, transparent);
            z-index: 100;
           
          }

#Plataformas { width: 90%;
               min-width: 247px;
               min-height: 70vh;
               margin-left: auto;
               margin-right: auto; 
             }

#Video { width: auto;
         height: auto;
         object-fit: cover;
        /* transform: scaleY(2.5);*/
       }