:root {
    /* Colores */
    --color-claro: rgb(234, 224, 214);
    --color-neutro: rgb(179, 145, 115);
    --color-encabezados: #111;
    --color-contraste: rgb(20, 20, 21);
    /* --color-contraste: rgb(217,213,216); */
    --color-highlight: rgb(214, 176, 94);
    --color-principal: rgb(106, 23, 23);
    --blanco: #fff;


    /* Tamaños de letra */
    --texto-precio: 16pt;
    --texto-desc: 14pt;
    --texto-menu: 16pt;
    --texto-detalle: 10pt;
    --iconos: 18pt;

    /* Fondos / BG */

    --bg: var(--color-contraste);
    --bg-pagina: #fff;
    --bg-contraste: var(--color-neutro);
    --bg-claro: var(--color-claro);
    --bg-footer: var(--color-contraste);

}

/* LOGO */
.logo {display: inline-flex; max-width: 20vw; flex: 1; display: inline-flex; justify-content: flex-start; align-items: center; align-self: stretch; height: min(100%, 80px);}
.logo figure {height: 100%; background-size: contain;}


/* Loader */

#preloader {
    width: 100%;
    position: fixed;
    min-height: 100vh;
    overflow: hidden;
    z-index: 8888;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: var(--color-claro);
}

.loader {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 2px solid var(--color-contraste);
    border-top: 2px solid var(--color-highlight);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.error {
    color: #ff0000;
    text-align: center;
    padding: 20px;
}
/* Degradados */

.deg { background: rgb(0,0,0); background: -moz-linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.758140756302521) 99%); background: -webkit-linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.758140756302521) 99%); background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.758140756302521) 99%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="var(--color-contraste)000",endColorstr="var(--color-contraste)000",GradientType=1); opacity: .7; z-index: 1; width: 100%; min-height: 100%; position: absolute; top: 0; left: 0; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; -ms-transition: all 0.3s ease-in; }
