/* ======================================================
   RESET BÁSICO
====================================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

/* ======================================================
   BASE
====================================================== */

html, body{
    background:#2f2f2f;
    color:#cfcfcf;
    font-family:Arial, Helvetica, Verdana, sans-serif;
    font-size:13px;
    line-height:1.35;
    overflow-x:hidden;
}

/* ======================================================
   WRAPPER 600px
====================================================== */

.wrapper{
    width:600px;
    margin:0 auto;
    background:#2f2f2f;
    border:1px solid #555;
    box-shadow:0 0 18px rgba(0,0,0,.7);
    position:relative;
}

/* ======================================================
   MENÚ PRINCIPAL
====================================================== */

.nav{
    list-style:none;
    display:flex;
    justify-content:flex-start;
    background:#000;
    padding:2px;
    z-index:1000;
    position:relative;
}

.nav > li{
    position:relative;
    margin:0 5px;
}

/* LINKS PRINCIPALES */

.nav li a{
    display:block;
    color:#fff;
    text-decoration:none;
    padding:2px 6px;
    font-size:11px;
    background:#000;
}

/* hover */

.nav li a:hover,
.nav ul li a:hover{
    background:#434343;
    box-shadow:
        0 0 15px rgba(255,223,0,.9),
        0 0 25px rgba(255,215,0,.8);
}

/* ======================================================
   SUBMENÚ GENERAL
====================================================== */

.nav ul{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    background:#000;
    list-style:none;
    min-width:160px;
    z-index:2000;
}

/* mostrar submenú */

.nav li:hover > ul,
.nav li:focus-within > ul{
    display:block;
}

/* items */

.nav ul li{
    width:100%;
}

.nav ul li a{
    display:block;
    padding:4px 6px;
    font-size:11px;
    color:#ddd;
    white-space:nowrap;
}

/* hover subitems */

.nav ul li a:hover{
    background:#555;
}

/* ======================================================
   GALERÍAS → SUBMENÚ HACIA LA IZQUIERDA
====================================================== */

.nav li.submenu-izq > ul{
    left:auto !important;
    right:0 !important;
}

/* ======================================================
   Z-INDEX FIX GENERAL
====================================================== */

#header{
    position:relative;
    z-index:1000;
}

.nav{
    z-index:1001;
}

.nav ul{
    z-index:1002;
}

/* ======================================================
   SEGURIDAD VISUAL
====================================================== */

.contenedor-fractal,
img,
table{
    max-width:100%;
}