Diferencias

Muestra las diferencias entre dos versiones de la página.

--- es:revistas:pcw_user [2026/05/12 12:14] – jesus
+++ es:revistas:pcw_user [2026/05/12 12:43] (actual) – jesus
@@ Línea 18: / Línea 18: @@
   @keyframes flicker-pcw { 0% { opacity: 0.97; } 100% { opacity: 1; } }
-  /* --- 1. FICHA TÉCNICA --- */
+  /* --- 1. FICHA TÉCNICA (CUADRADA) --- */
   .ficha-libro-crt {
     border: 10px solid #2a2a2a; border-radius: 15px; padding: 30px; margin-bottom: 20px;
@@ Línea 25: / Línea 25: @@
   }
   .portada-ficha-container {
-    width: 220px; height: 300px; background-color: #111; border: 4px solid #00ff00;
+    width: 300px; height: 300px; background-color: #111; border: 4px solid #00ff00;
-    padding: 2px; box-sizing: border-box; cursor: pointer;
+    padding: 2px; box-sizing: border-box; display: flex; align-items: center; justify-content: center;
+    cursor: default;
   }
-  .portada-ficha-container img { width: 100%; height: 100%; object-fit: cover; }
+  .portada-ficha-container img { max-width: 100%; max-height: 100%; object-fit: contain; }
   .datos-ficha { flex: 1; min-width: 300px; }
@@ Línea 40: / Línea 41: @@
   .dato-etiqueta { color: #008800; font-weight: bold; min-width: 130px; text-transform: uppercase; }
   .dato-valor { color: #00ff00; }
-  .link-editorial { color: #00ff00 !important; text-decoration: underline !important; font-weight: bold; }
   /* --- 2. BLOQUES DE SECCIÓN --- */
-  .pcw-section-box {
+  .pcw-section-box { background-color: #000b00; border: 2px solid #00ff00; margin: 20px 0; padding: 20px; }
-    background-color: #000b00; border: 2px solid #00ff00;
-    margin: 20px 0; padding: 20px;
-  }
   .pcw-section-title {
     background-color: #00ff00; color: #000; padding: 3px 12px;
@@ Línea 57: / Línea 54: @@
   .face-title { color: #008800; font-weight: bold; text-transform: uppercase; margin-top: 8px; display: block; padding-left: 10px; border-left: 2px solid #008800; }
   .program-list { list-style: none; padding-left: 25px; margin: 10px 0; }
-  .program-item { margin-bottom: 5px; line-height: 1.4; }
+  .program-item { margin-bottom: 5px; line-height: 1.4; color: #aaffaa; }
-  .program-name { color: #00ff00; font-weight: bold; text-shadow: 0 0 5px rgba(0,255,0,0.5); }
+  .program-name { color: #00ff00; font-weight: bold; }
-  .program-desc { color: #aaffaa; }
-  .disk-gallery { display: flex; gap: 15px; margin: 15px 0 30px 25px; flex-wrap: wrap; align-items: flex-end; }
+  .disk-gallery { display: flex; gap: 15px; margin: 15px 0 30px 25px; flex-wrap: wrap; align-items: center; }
-  .disk-thumb { width: 120px; height: auto; border: 1px solid #008800; padding: 2px; background: #111; cursor: pointer; transition: 0.3s; }
+  .disk-thumb, .cover-equilibrada { height: 120px; width: auto; border: 1px solid #008800; padding: 2px; background: #111; cursor: pointer; transition: 0.3s; }
-  .cover-thumb { width: 100px; height: auto; border: 1px solid #00ff00; padding: 2px; background: #111; cursor: pointer; transition: 0.3s; }
+  .disk-thumb:hover, .cover-equilibrada:hover { transform: scale(1.1); border-color: #00ff00; box-shadow: 0 0 15px #00ff00; }
-  .disk-thumb:hover, .cover-thumb:hover { transform: scale(1.1); border-color: #00ff00; box-shadow: 0 0 15px #00ff00; }
-  /* --- REJILLA DESCARGAS (ESTILO SOLICITADO) --- */
+  /* --- REJILLA DESCARGAS NEÓN --- */
-  .magazine-grid {
+  .magazine-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; margin-top: 20px; }
-    display: grid; grid-template-columns: repeat(5, 1fr);
+  .magazine-item-link { text-decoration: none !important; display: block; text-align: center; }
-    gap: 20px; margin-top: 20px;
+  .download-card { border: 2px solid #004400; padding: 10px; transition: 0.3s; background: rgba(0,0,0,0.3); }
-  }
+  .magazine-item-link:hover .download-card { border: 2px solid #00ff00; box-shadow: 0 0 20px #00ff00; background: rgba(0, 255, 0, 0.1); transform: translateY(-5px); }
-  .magazine-item {
+  .download-card img { width: 100%; height: auto; border: 1px solid #008800; margin-bottom: 10px; }
-    text-align: center; padding: 10px; border: 2px solid transparent; transition: 0.3s;
+  .magazine-label { display: block; color: #00ff00 !important; font-size: 1em; font-weight: bold; text-shadow: 0 0 8px #00ff00; }
-  }
-  .magazine-item:hover {
-    border: 2px solid #00ff00; background: rgba(0, 255, 0, 0.05);
-  }
-  .magazine-item img { width: 100%; height: auto; border: 1px solid #008800; margin-bottom: 10px; }
-  .magazine-label {
-    display: block; color: #0000ff !important; font-size: 1em; font-weight: bold;
-    text-shadow: 0 0 8px #00ff00; text-decoration: none;
-  }
   /* --- LIGHTBOX --- */
@@ Línea 90: / Línea 76: @@
   #pcw-lightbox img { max-width: 90%; max-height: 90%; border: 3px solid #00ff00; box-shadow: 0 0 30px #00ff00; }
-  @media (max-width: 700px) {
+  @media (max-width: 800px) { .magazine-grid { grid-template-columns: repeat(2, 1fr); } .ficha-libro-crt { flex-direction: column; align-items: center; } }
-    .ficha-libro-crt { flex-direction: column; align-items: center; }
-    .magazine-grid { grid-template-columns: repeat(2, 1fr); }
-  }
 </style>
@@ Línea 100: / Línea 83: @@
 <div class="pcw-page-container crt-effect">
   <div class="ficha-libro-crt">
-    <div class="portada-ficha-container" onclick="openLightbox(this.querySelector('img').src)">
+    <div class="portada-ficha-container">
-      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_1.jpg" alt="PCW User">
+      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user.jpg" alt="PCW User">
     </div>
     <div class="datos-ficha">
@@ Línea 109: / Línea 92: @@
       </div>
       <div class="dato-linea"><span class="dato-etiqueta">REVISTA:</span><span class="dato-valor">PCW User</span></div>
-      <div class="dato-linea"><span class="dato-etiqueta">EDITORIAL:</span><span class="dato-valor"><a href="doku.php?id=es:compañia:club_auser" class="link-editorial">Club Auser</a></span></div>
+      <div class="dato-linea"><span class="dato-etiqueta">EDITORIAL:</span><span class="dato-valor"><a href="doku.php?id=:editoriales:club_auser" style="color:#00ff00; text-decoration:underline;">Club Auser</a></span></div>
-      <div class="dato-linea"><span class="dato-etiqueta">DISTRIBUIDORA:</span><span class="dato-valor">Club Auser</span></div>
       <div class="dato-linea"><span class="dato-etiqueta">AÑO:</span><span class="dato-valor">1989 - 1990</span></div>
       <div class="dato-linea"><span class="dato-etiqueta">GÉNERO:</span><span class="dato-valor">Disco revista informática</span></div>
@@ Línea 149: / Línea 131: @@
   </div>
-  <!-- 3. CONTENIDO DETALLADO (ORIGINAL 100%) -->
+  <!-- 3. CONTENIDO POR NÚMERO (EQUILIBRADO VISUALMENTE) -->
   <div class="pcw-section-box">
-    <div class="pcw-section-title">B> COLECCIÓN Y PROGRAMAS</div>
+    <div class="pcw-section-title">A> COLECCIÓN Y PROGRAMAS</div>
     <!-- NÚMERO 1 -->
@@ Línea 157: / Línea 139: @@
     <span class="face-title">CARA A</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">3DFun:</span> <span class="program-desc">Programa para la realización de representaciones gráficas de funciones en 3D.</span></li>
+      <li class="program-item"><span class="program-name">3DFun:</span> Programa para la realización de representaciones gráficas de funciones en 3D.</li>
-      <li class="program-item"><span class="program-name">Graph:</span> <span class="program-desc">Primer lenguaje de programación de gráficos.</span></li>
+      <li class="program-item"><span class="program-name">Graph:</span> Primer lenguaje de programación de gráficos.</li>
-      <li class="program-item"><span class="program-name">Pokdis:</span> <span class="program-desc">Programa indispensable para la búsqueda de pokes.</span></li>
+      <li class="program-item"><span class="program-name">Pokdis:</span> Programa indispensable para la búsqueda de pokes.</li>
-      <li class="program-item"><span class="program-name">Volcador:</span> <span class="program-desc">Utilidad para volcados de pantalla por impresora.</span></li>
+      <li class="program-item"><span class="program-name">Volcador:</span> Utilidad para volcados de pantalla por impresora.</li>
     </ul>
     <span class="face-title">CARA B</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">Char:</span> <span class="program-desc">Generador de letras en modo 1 y 2 del CPC.</span></li>
+      <li class="program-item"><span class="program-name">Char:</span> Generador de letras en modo 1 y 2 del CPC.</li>
-      <li class="program-item"><span class="program-name">Medico:</span> <span class="program-desc">Programa médico para diagnosticar cualquier enfermedad.</span></li>
+      <li class="program-item"><span class="program-name">Medico:</span> Programa médico para diagnosticar cualquier enfermedad.</li>
-      <li class="program-item"><span class="program-name">Deimos:</span> <span class="program-desc">Juego donde deberemos enfrentarnos a mil laberintos.</span></li>
+      <li class="program-item"><span class="program-name">Deimos:</span> Juego donde deberemos enfrentarnos a mil laberintos.</li>
-      <li class="program-item"><span class="program-name">Draw:</span> <span class="program-desc">Conjunto de rutinas que generan las instrucciones Plot y draw.</span></li>
+      <li class="program-item"><span class="program-name">Draw:</span> Conjunto de rutinas que generan las instrucciones Plot y draw.</li>
     </ul>
     <div class="disk-gallery">
-      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_1.jpg" class="cover-thumb" onclick="openLightbox(this.src)" title="Carátula Nº 1">
+      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_1.jpg" class="cover-equilibrada" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_1_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 1 - Cara A">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_1_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_1_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 1 - Cara B">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_1_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
     </div>
@@ Línea 179: / Línea 161: @@
     <span class="face-title">CARA A</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">Paranoid:</span> <span class="program-desc">Juego intrépido de damas.</span></li>
+      <li class="program-item"><span class="program-name">Paranoid:</span> Juego intrépido de damas.</li>
-      <li class="program-item"><span class="program-name">Plot:</span> <span class="program-desc">Lo último en rutinas gráficas sin necesidad de utilizar el GSX.</span></li>
+      <li class="program-item"><span class="program-name">Plot:</span> Lo último en rutinas gráficas sin necesidad de utilizar el GSX.</li>
-      <li class="program-item"><span class="program-name">Volcador:</span> <span class="program-desc">Saca un listado por impresora a toda página de tus mejores pantallas en logo.</span></li>
+      <li class="program-item"><span class="program-name">Volcador:</span> Saca un listado por impresora a toda página de tus mejores pantallas en logo.</li>
-      <li class="program-item"><span class="program-name">Pixmap:</span> <span class="program-desc">Redefina sus propios caracteres y utilícelos después en sus programas.</span></li>
+      <li class="program-item"><span class="program-name">Pixmap:</span> Redefina sus propios caracteres y utilícelos después en sus programas.</li>
     </ul>
     <span class="face-title">CARA B</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">Funcion:</span> <span class="program-desc">Espectaculares representaciones matemáticas de un modo gráfico.</span></li>
+      <li class="program-item"><span class="program-name">Funcion:</span> Espectaculares representaciones matemáticas de un modo gráfico.</li>
-      <li class="program-item"><span class="program-name">Copyd:</span> <span class="program-desc">Copión para hacer copias de seguridad.</span></li>
+      <li class="program-item"><span class="program-name">Copyd:</span> Copión para hacer copias de seguridad.</li>
-      <li class="program-item"><span class="program-name">1X2:</span> <span class="program-desc">Programa que nos ayudará a realizar nuestras quinielas.</span></li>
+      <li class="program-item"><span class="program-name">1X2:</span> Programa que nos ayudará a realizar nuestras quinielas.</li>
-      <li class="program-item"><span class="program-name">Dagoba:</span> <span class="program-desc">Juego de miles de laberintos buscando el tesoro perdido.</span></li>
+      <li class="program-item"><span class="program-name">Dagoba:</span> Juego de miles de laberintos buscando el tesoro perdido.</li>
     </ul>
     <div class="disk-gallery">
-      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_2.jpg" class="cover-thumb" onclick="openLightbox(this.src)" title="Carátula Nº 2">
+      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_2.jpg" class="cover-equilibrada" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_2_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 2 - Cara A">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_2_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_2_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 2 - Cara B">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_2_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
     </div>
@@ Línea 201: / Línea 183: @@
     <span class="face-title">CARA A</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">Facturas:</span> <span class="program-desc">Aplicación desarrollada para la emisión y control de facturas.</span></li>
+      <li class="program-item"><span class="program-name">Facturas:</span> Aplicación desarrollada para la emisión y control de facturas.</li>
-      <li class="program-item"><span class="program-name">Libreta:</span> <span class="program-desc">Gestión de libretas de ahorro.</span></li>
+      <li class="program-item"><span class="program-name">Libreta:</span> Gestión de libretas de ahorro.</li>
-      <li class="program-item"><span class="program-name">TRJB:</span> <span class="program-desc">Cargador para obtener vidas infinitas en el juego James Bond 007.</span></li>
+      <li class="program-item"><span class="program-name">TRJB:</span> Cargador para obtener vidas infinitas en el juego James Bond 007.</li>
     </ul>
     <span class="face-title">CARA B</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">Mina:</span> <span class="program-desc">Juego donde deberemos surcar laberintos peligrosos.</span></li>
+      <li class="program-item"><span class="program-name">Mina:</span> Juego donde deberemos surcar laberintos peligrosos.</li>
-      <li class="program-item"><span class="program-name">Sub:</span> <span class="program-desc">Divertido juego del comecocos pero de una manera más original.</span></li>
+      <li class="program-item"><span class="program-name">Sub:</span> Divertido juego del comecocos pero de una manera más original.</li>
-      <li class="program-item"><span class="program-name">Label:</span> <span class="program-desc">Programa para efectuar impresión de etiquetas.</span></li>
+      <li class="program-item"><span class="program-name">Label:</span> Programa para efectuar impresión de etiquetas.</li>
     </ul>
     <div class="disk-gallery">
-      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_3.jpg" class="cover-thumb" onclick="openLightbox(this.src)" title="Carátula Nº 3">
+      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_3.jpg" class="cover-equilibrada" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_3_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 3 - Cara A">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_3_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_3_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 3 - Cara B">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_3_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
     </div>
@@ Línea 221: / Línea 203: @@
     <span class="face-title">CARA A</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">Banksal:</span> <span class="program-desc">Programa para el control de cuentas corrientes.</span></li>
+      <li class="program-item"><span class="program-name">Banksal:</span> Programa para el control de cuentas corrientes.</li>
-      <li class="program-item"><span class="program-name">TRHH:</span> <span class="program-desc">Cargador para obtener vidas infinitas e inmunidad en el juego Head Over Heels.</span></li>
+      <li class="program-item"><span class="program-name">TRHH:</span> Cargador para obtener vidas infinitas e inmunidad en el juego Head Over Heels.</li>
     </ul>
     <span class="face-title">CARA B</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">Test:</span> <span class="program-desc">Programa potente para la generación u corrección de tests.</span></li>
+      <li class="program-item"><span class="program-name">Test:</span> Programa potente para la generación u corrección de tests.</li>
-      <li class="program-item"><span class="program-name">Barcos:</span> <span class="program-desc">Juego clásico de los barcos.</span></li>
+      <li class="program-item"><span class="program-name">Barcos:</span> Juego clásico de los barcos.</li>
-      <li class="program-item"><span class="program-name">Biopcw:</span> <span class="program-desc">Generador para saber en todo momento tus bioritmos.</span></li>
+      <li class="program-item"><span class="program-name">Biopcw:</span> Generador para saber en todo momento tus bioritmos.</li>
     </ul>
     <div class="disk-gallery">
-      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_4.jpg" class="cover-thumb" onclick="openLightbox(this.src)" title="Carátula Nº 4">
+      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_4.jpg" class="cover-equilibrada" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_4_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 4 - Cara A">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_4_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_4_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 4 - Cara B">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_4_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
     </div>
@@ Línea 240: / Línea 222: @@
     <span class="face-title">CARA A</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">Sider:</span> <span class="program-desc">Potente conversor de ficheros.</span></li>
+      <li class="program-item"><span class="program-name">Sider:</span> Potente conversor de ficheros.</li>
-      <li class="program-item"><span class="program-name">Parchise:</span> <span class="program-desc">El popular juego del parchís.</span></li>
+      <li class="program-item"><span class="program-name">Parchise:</span> El popular juego del parchís.</li>
-      <li class="program-item"><span class="program-name">Naves:</span> <span class="program-desc">Juego apasionante de lucha contra seres de otro planeta.</span></li>
+      <li class="program-item"><span class="program-name">Naves:</span> Juego apasionante de lucha contra seres de otro planeta.</li>
     </ul>
     <span class="face-title">CARA B</span>
     <ul class="program-list">
-      <li class="program-item"><span class="program-name">Calc:</span> <span class="program-desc">Sencilla y útil calculadora.</span></li>
+      <li class="program-item"><span class="program-name">Calc:</span> Sencilla y útil calculadora.</li>
-      <li class="program-item"><span class="program-name">Dic:</span> <span class="program-desc">Programa para llevar el control de personas con direcciones y teléfonos.</span></li>
+      <li class="program-item"><span class="program-name">Dic:</span> Programa para llevar el control de personas con direcciones y teléfonos.</li>
-      <li class="program-item"><span class="program-name">Df:</span> <span class="program-desc">Programa en logo para la generación de figuras.</span></li>
+      <li class="program-item"><span class="program-name">Df:</span> Programa en logo para la generación de figuras.</li>
     </ul>
     <div class="disk-gallery">
-      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_5.jpg" class="cover-thumb" onclick="openLightbox(this.src)" title="Carátula Nº 5">
+      <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_5.jpg" class="cover-equilibrada" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_5_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 5 - Cara A">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_5_1.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
-      <img src="/lib/exe/fetch.php?media=revistas:discos:PCW_user_revista_disco_5_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)" title="Disco 5 - Cara B">
+      <img src="/lib/exe/fetch.php?media=revistas:discos:pcw_user_revista_disco_5_2.jpg" class="disk-thumb" onclick="openLightbox(this.src)">
     </div>
   </div>
-  <!-- 4. DESCARGA VISUAL (ESTILO NEÓN) -->
+  <!-- 4. ARCHIVO DE DESCARGAS (ESTILO NEÓN VERDE) -->
   <div class="pcw-section-box">
-    <div class="pcw-section-title">C> ARCHIVO DE DESCARGAS (ZIP)</div>
+    <div class="pcw-section-title">A> ARCHIVO DE DISCOS</div>
-    <p style="color: #008800; font-size: 0.9em; margin-bottom: 20px;">[ PULSE SOBRE EL NÚMERO PARA DESCARGAR EL ARCHIVO ]</p>
     <div class="magazine-grid">
-      <div class="magazine-item">
+      <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_1.zip" class="magazine-item-link">
-        <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_1.jpg" alt="Portada 1">
+        <div class="download-card">
-        <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_1.zip" class="magazine-label">Número 1</a>
+          <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_1.jpg">
-      </div>
+          <span class="magazine-label">Número 1</span>
-      <div class="magazine-item">
+        </div>
-        <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_2.jpg" alt="Portada 2">
+      </a>
-        <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_2.zip" class="magazine-label">Número 2</a>
+      <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_2.zip" class="magazine-item-link">
-      </div>
+        <div class="download-card">
-      <div class="magazine-item">
+          <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_2.jpg">
-        <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_3.jpg" alt="Portada 3">
+          <span class="magazine-label">Número 2</span>
-        <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_3.zip" class="magazine-label">Número 3</a>
+        </div>
-      </div>
+      </a>
-      <div class="magazine-item">
+      <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_3.zip" class="magazine-item-link">
-        <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_4.jpg" alt="Portada 4">
+        <div class="download-card">
-        <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_4.zip" class="magazine-label">Número 4</a>
+          <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_3.jpg">
-      </div>
+          <span class="magazine-label">Número 3</span>
-      <div class="magazine-item">
+        </div>
-        <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_5.jpg" alt="Portada 5">
+      </a>
-        <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_5.zip" class="magazine-label">Número 5</a>
+      <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_4.zip" class="magazine-item-link">
-      </div>
+        <div class="download-card">
+          <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_4.jpg">
+          <span class="magazine-label">Número 4</span>
+        </div>
+      </a>
+      <a href="/lib/exe/fetch.php?media=revistas:descargas:PCW_User_N_5.zip" class="magazine-item-link">
+        <div class="download-card">
+          <img src="/lib/exe/fetch.php?media=revistas:portadas:PCW_user_revista_caratula_5.jpg">
+          <span class="magazine-label">Número 5</span>
+        </div>
+      </a>
     </div>
   </div>