MIX · extractor de estilos
Template: aulavirtual/index.php · mtime: 2025-10-01 18:47
← Volver al álbum Descargar mixed.css Descargar manifest.json
CSS links: 2 Embebidos: 0 Externos: 2 Inline styles: 1 Missing: 0
CSS externos (no embebidos)
CSS embebidos (locales)
No se pudieron embebir CSS locales.
Preview de mixed.css
/* MIXED CSS PACK */
/* Template: aulavirtual/index.php */
/* Template mtime: 2025-10-01 18:47:14 */

/* external link (no embedded): https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css */
/* external link (no embedded): https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css */

/* ===== INLINE <style> BLOCK #1 ===== */
:root{--brand:#6c63ff;--brand2:#00c2ff;--muted:#6c757d}
    body{background:#f8f9fa;color:#212529}
    .navbar{background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.05)}
    .brand-gradient{background:linear-gradient(135deg,var(--brand),var(--brand2));
      -webkit-background-clip:text;-webkit-text-fill-color:transparent}
    .hero{background:linear-gradient(180deg,#e9ecef,#fff);padding:80px 0}
    .card-soft{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:12px}
    .btn-brand{background:var(--brand);color:#fff;border:none}
    .btn-brand:hover{background:#5a52ff}
    footer{background:#fff;border-top:1px solid #e9ecef}
    
    /* Estilos para el cubo 3D TRANSPARENTE */
    .cube-container {
      perspective: 1200px;
      width: 300px;
      height: 300px;
      margin: 40px auto;
    }
    
    .cube {
      width: 100%;
      height: 100%;
      position: relative;
      transform-style: preserve-3d;
      animation: rotateCube 25s infinite linear;
    }
    
    .cube-face {
      position: absolute;
      width: 100%;
      height: 100%;
      background: transparent;
      border: 1px solid rgba(0, 0, 0, 0.1);
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      backdrop-filter: blur(5px);
      -webkit-backdrop-filter: blur(5px);
    }
    
    .cube-face img {
      max-width: 80%;
      max-height: 80%;
      object-fit: contain;
      filter: drop-shadow(0 4px 8px rgba(0,0,0,0.1));
      transition: all 0.4s ease;
      opacity: 0.9;
    }
    
    .cube-face:hover img {
      transform: scale(1.08);
      opacity: 1;
      filter: drop-shadow(0 8px 16px rgba(0,0,0,0.15));
    }
    
    .cube-face-front { 
      transform: translateZ(150px); 
    }
    .cube-face-back { 
      transform: rotateY(180deg) translateZ(150px); 
    }
    .cube-face-right { 
      transform: rotateY(90deg) translateZ(150px); 
    }
    .cube-face-left { 
      transform: rotateY(-90deg) translateZ(150px); 
    }
    .cube-face-top { 
      transform: rotateX(90deg) translateZ(150px); 
    }
    .cube-face-bottom { 
      transform: rotateX(-90deg) translateZ(150px); 
    }
    
    @keyframes rotateCube {
      0% { transform: rotateY(0) rotateX(15deg); }
      16.6% { transform: rotateY(90deg) rotateX(15deg); }
      33.3% { transform: rotateY(180deg) rotateX(15deg); }
      50% { transform: rotateY(270deg) rotateX(15deg); }
      66.6% { transform: rotateY(360deg) rotateX(15deg); }
      83.3% { transform: rotateY(360deg) rotateX(75deg); }
      100% { transform: rotateY(360deg) rotateX(15deg); }
    }
    
    /* Responsive */
    @media (max-width: 768px) {
      .cube-container {
        width: 250px;
        height: 250px;
      }
      .cube-face-front { transform: translateZ(125px); }
      .cube-face-back { transform: rotateY(180deg) translateZ(125px); }
      .cube-face-right { transform: rotateY(90deg) translateZ(125px); }
      .cube-face-left { transform: rotateY(-90deg) translateZ(125px); }
      .cube-face-top { transform: rotateX(90deg) translateZ(125px); }
      .cube-face-bottom { transform: rotateX(-90deg) translateZ(125px); }
    }
    
    @media (max-width: 576px) {
      .cube-container {
        width: 200px;
        height: 200px;
      }
      .cube-face-front { transform: translateZ(100px); }
      .cube-face-back { transform: rotateY(180deg) translateZ(100px); }
      .cube-face-right { transform: rotateY(90deg) translateZ(100px); }
      .cube-face-left { transform: rotateY(-90deg) translateZ(100px); }
      .cube-face-top { transform: rotateX(90deg) translateZ(100px); }
      .cube-face-bottom { transform: rotateX(-90deg) translateZ(100px); }
    }

      
Manifest preview
{
    "template": "aulavirtual/index.php",
    "template_mtime": 1759344434,
    "template_mtime_human": "2025-10-01T18:47:14+00:00",
    "css_links_found": [
        "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css",
        "https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css"
    ],
    "css_links_external": [
        "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css",
        "https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css"
    ],
    "css_links_embedded": [],
    "inline_style_blocks": 1,
    "inline_imports_external": [],
    "inline_imports_embedded": [],
    "missing_css_files": []
}