start:html [GDE Provincia de Santa Cruz]

Esta página es de solo lectura. Puedes ver la fuente pero no puedes cambiarla. Pregunta a tu administrador si crees que esto es incorrecto.
<html>
<style>
/* --- Estilos globales --- */
body {
  font-family: Arial, sans-serif;
  line-height: 1.6;
  background: #f0f4f8;
  color: #333;
  padding: 20px;
}

h1, h2, h3 {
  color: #575756;
  margin-bottom: 10px;
}

hr {
  border: 0;
  height: 1px;
  background: #aaccee;
  margin: 20px 0;
}

/* --- Tarjetas --- */
.tarjeta {
  background: #e6f0fa;
  border: 2px solid #2a6ebb;
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 20px;
  transition: box-shadow 0.3s, transform 0.3s;
}

.tarjeta:hover {
  box-shadow: 0 8px 20px rgba(42,110,187,0.4);
  transform: translateY(-5px);
}

/* --- Botones --- */
.boton {
  background-color: #2a6ebb;
  color: white;
  padding: 10px 20px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: bold;
  display: inline-block;
  margin-top: 10px;
  transition: transform 0.3s, background-color 0.3s;
}

.boton:hover {
  background-color: #1d4a8c;
  transform: scale(1.05);
}

/* --- Video responsive --- */
.video-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
  margin-bottom: 20px;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* --- Encabezado con fondo --- */
.encabezado {
  background: linear-gradient(to right, #2a6ebb, #aaccee);
  color: white;
  padding: 15px;
  border-radius: 10px;
  text-align: center;
}

/* --- Lista destacada --- */
.lista-destacada {
  background: #d9e9fc;
  border-left: 5px solid #2a6ebb;
  padding: 10px 15px;
  margin-bottom: 15px;
}

/* --- Panel expandible simulado --- */
.panel {
  background: #eef6fc;
  border: 1px solid #2a6ebb;
  border-radius: 10px;
  padding: 15px;
  margin-bottom: 20px;
  cursor: pointer;
  transition: background 0.3s;
}

.panel:hover {
  background: #d4e7fb;
}

</style>

<!-- --- Ejemplos --- -->

<div class="encabezado">
  <h1>Bienvenido a la Biblioteca de Tutoriales de GDE</h1>
</div>

<hr>

<div class="tarjeta">
  <h2>Tarjeta Informativa</h2>
  <p>Este panel muestra información importante sobre los módulos del GDE.</p>
  <a href="/doku.php?id:start" class="boton">Ir a Inicio</a>
</div>

<div class="tarjeta">
  <h2>Video Tutorial</h2>
  <div class="video-container">
    <iframe src="" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  </div>
  <a href="/doku.php?id:intro" class="boton">Ver más Tutoriales</a>
</div>

<div class="lista-destacada">
  <h3>Lista de Módulos</h3>
  <ul>
    <li>Escritorio Único (EU)</li>
    <li>Comunicaciones Oficiales (CCOO)</li>
    <li>Generador Electrónico de Documentos (GEDO)</li>
    <li>Expediente Electrónico (EE)</li>
  </ul>
</div>

<div class="panel">
  <h3>Panel Expandible Simulado</h3>
  <p>Pasa el mouse sobre este panel para ver el efecto de hover. Se puede usar para secciones interactivas.</p>
</div>

<div class="tarjeta">
  <h2>Preguntas Frecuentes</h2>
  <p>Consulta sobre Documento, Expediente Electrónico, Interoperabilidad, Normativa y Reglamentación.</p>
</div>
</html>