/* -------------------------------------
    (carga previa: normalize.css)
    HOJA DE ESTILOS PARA FONDOS
    (cc) 3con14.pro
----------------------------------------*/

*, *::after, *::before { box-sizing: border-box; }
* { margin:0; padding:0; border: 0 none transparent; }

html { font: 16px/1.3 sans-serif; color: #ddd; }

body {
    max-width  : 100vw;
    min-height : 100vh;
    position   : relative;
}
body::after {
  content    : "";
  width      : 100%;
  min-height : 100%;
  position   : absolute;
  top        : 0;
  left       : 0;
  z-index    : -100;

 /* FONDO CON DIFERENTE OPACIDAD */ 
    /* opacity  : 1; */

 /* FONDO CON PATRONES */
    /* PATRÓN carbon fibre */
    
        background :
          radial-gradient(black 15%, transparent 16%) 0 0,
          radial-gradient(black 15%, transparent 16%) 8px 8px,
          radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
          radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
        background-color :#282828;
        background-size  :16px 16px;
        opacity: 0.8;

    /* PATRÓN blueprint grid */
    /* 
        background-color:#269;
        background-image:
            linear-gradient(white 2px, transparent 2px),
            linear-gradient(90deg, white 2px, transparent 2px),
            linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
            linear-gradient(90deg, rgba(255,255,255,.3) 1px, transparent 1px);
        background-size:100px 100px, 100px 100px, 20px 20px, 20px 20px;
        background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px
    */
}

#container {
    width            : 94vw;
    max-width        : 960px;
    min-height       : 100vh;
    margin           : auto;
    padding          : 1em;
    background-color : rgba(0,0,0,0.1);
}

.centro {
    padding          : 0.5em;
    text-align       : center;
    background-color : rgba(165, 42, 42, 0.1);
}

.blink { animation: parpadeo 3s infinite steps(3); color: hsla(60, 100%, 25%, 1);}
@keyframes parpadeo { 50% {visibility: hidden; } }