@charset "utf-8";
/* CSS Document */


.bloques-cortos{
	text-align:center;
	display: inline-block;  /*Permite que se pongan uno al lado del otro */
    white-space: nowrap;   /* Evita que un aviso SE ROMPA por la mitad */
    margin-right: 5px;/* Espacio entre bloques */
}

:root {
    --texto-base: 18px;
    /* Escala por defecto (Comic, Verdana, Tahoma, etc.) */
    --h1-scale: 1.8;
    --h2-scale: 1.6;
    --h3-scale: 1.5;
    --h4-scale: 1.4;
    --h5-scale: 1.3;
    --h6-scale: 1.2;
}

.articulo {
    font-size: var(--texto-base);
    line-height: 1.6;
}

.articulo h1,
.articulo h2,
.articulo h3,
.articulo h4,
.articulo h5,
.articulo h6{
    line-height: 1.1;
    letter-spacing: 0.02em;
}


/*------------- FUENTES -------------- */
.fuente-Comic {
	font-family:"Comic Sans MS", cursive;
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.02;
    --h1-scale: 1.8;
    --h2-scale: 1.6;
    --h3-scale: 1.5;
    --h4-scale: 1.4;
    --h5-scale: 1.3;
    --h6-scale: 1.2;
}

.fuente-Verdana {
	font-family:"Verdana", "Geneva", sans-serif;
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.02;
	--h1-scale: 1.45;
    --h2-scale: 1.3;
    --h3-scale: 1.25;
    --h4-scale: 1.2;
    --h5-scale: 1.15;
    --h6-scale: 1.1;
}

.fuente-Lucida {
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.02;
	--h1-scale: 0.5;
    --h2-scale: 0.5;
    --h3-scale: 0.5;
    --h4-scale: 0.5;
    --h5-scale: 0.5;
    --h6-scale: 0.5;
}

.fuente-Tahoma {
	font-family:"Tahoma", "Geneva", sans-serif:
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.02;
	--h1-scale: 0.5;
    --h2-scale: 0.5;
    --h3-scale: 0.5;
    --h4-scale: 0.5;
    --h5-scale: 0.5;
    --h6-scale: 0.5;
}

.fuente-Palatino {
	font-family:"Palatino Linotype", "Book Antiqua", "Palatino", serif;
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.02;
	--h1-scale: 0.5;
    --h2-scale: 0.5;
    --h3-scale: 0.5;
    --h4-scale: 0.5;
    --h5-scale: 0.5;
    --h6-scale: 0.5;
}

.fuente-allura {
    font-family: 'Allura', cursive;
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.02;
	--h1-scale: 0.5;
    --h2-scale: 0.5;
    --h3-scale: 0.5;
    --h4-scale: 0.5;
    --h5-scale: 0.5;
    --h6-scale: 0.5;
}

.fuente-dynalight {
    font-family: 'Dynalight', cursive;
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.02;
	--h1-scale: 0.5;
    --h2-scale: 0.5;
    --h3-scale: 0.5;
    --h4-scale: 0.5;
    --h5-scale: 0.5;
    --h6-scale: 0.5;
}

.fuente-greatvibes {
    font-family: 'Great Vibes', cursive;
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.02;
	--h1-scale: 0.5;
    --h2-scale: 0.5;
    --h3-scale: 0.5;
    --h4-scale: 0.5;
    --h5-scale: 0.5;
    --h6-scale: 0.5;
}

.fuente-imperial {
    font-family: 'Imperial Script', cursive;
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.02;
	--h1-scale: 0.5;
    --h2-scale: 0.5;
    --h3-scale: 0.5;
    --h4-scale: 0.5;
    --h5-scale: 0.5;
    --h6-scale: 0.5;
}

.fuente-rochester {
    font-family: 'Rochester', cursive;
	line-height:1.6;
	font-size:14px;
	letter-spacing:0.2;
	--h1-scale: 0.5;
    --h2-scale: 0.5;
    --h3-scale: 0.5;
    --h4-scale: 0.5;
    --h5-scale: 0.5;
    --h6-scale: 0.5;
}

.fuente-tangerine {
    font-family: 'Tangerine', cursive;
	line-height:1.2;
	font-size:30px;
	letter-spacing:0.5;
	--h1-scale: 1.2;
    --h2-scale: 1.2;
    --h3-scale: 1.2;
    --h4-scale: 1.2;
    --h5-scale: 1.2;
    --h6-scale: 1.2;
}



.articulo h1 {
    font-size: calc(var(--texto-base) * var(--h1-scale));
}

.articulo h2 {
    font-size: calc(var(--texto-base) * var(--h2-scale));
}

.articulo h3 {
    font-size: calc(var(--texto-base) * var(--h3-scale));
}
.articulo h4 {
    font-size: calc(var(--texto-base) * var(--h4-scale));
}

.articulo h5 {
    font-size: calc(var(--texto-base) * var(--h5-scale));
}

.articulo h6 {
    font-size: calc(var(--texto-base) * var(--h6-scale));
}



<!--==================== TEXTO ======================-->
/* -------- FONDO TRANSPARENTE - TEXTO VERDE OSCURO --------- */

.div-texto {
	color:#000000;
	width:100%;
}

.span-texto {
	padding-left:30px;
	margin-left:30px;
	padding-right:30px;
	margin-right:30px;
}

.span-texto {
}

.font-texto {
}

.texto-aviso,
.texto-aviso:focus {
    padding: 0.5rem 0.5rem 0.35rem 0.5rem;
    position: relative;
    overflow: hidden;
    display: inline-block;
    margin-top: 5px;
    margin-bottom: 0px;
    line-height: 1.15rem;
    font-size: 0.80rem;
    font-weight: 900;
    text-transform: uppercase;
    text-shadow:
        0 2px 2px rgba(255, 255, 255, 0.5),
        0 -1px 1px rgba(0, 0, 0, 0.8);
    color: #000000;
    text-decoration: none;
	text-align:center;
	min-width:100PX;
	font-family:"Comic Sans MS";
}

.texto-aviso span {
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 1px 1px hsla(0, 0%, 50%, 1));
    text-shadow:
        0 2px 2px rgba(255, 255, 255, 0.5),
        0 -1px 1px rgba(0, 0, 0, 0.8);
}

.texto-aviso:hover {
    color: #FFF;
}

.texto-aviso::before {
    content: "";
    height: 0.17rem;
    position: absolute;
    /*display: block;*/
    top: 0.3rem;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 3rem);
    opacity: 0.6;
}

.texto-aviso::after {
    content: "";
    height: 0.17rem;
    position: absolute;
    /*display: block;*/
    bottom: 0.75rem;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 3rem);
    opacity: 0.05;
}

.texto-aviso-2,
.texto-aviso-2:focus {
    padding: 0.5rem 0.5rem 0.35rem 0.5rem;
    position: relative;
    overflow: hidden;
    display: inline-block;
    margin-top: 5px;
    margin-bottom: 0px;
    border-radius: 0.5rem;
    line-height: 1.15rem;
    font-size: 0.80rem;
    font-weight: 900;
    text-transform: uppercase;
    text-shadow:
        0 2px 2px rgba(255, 255, 255, 0.5),
        0 -1px 1px rgba(0, 0, 0, 0.8);
    border-top: 1px solid rgb(150, 150, 150);
    border-right: 1px solid rgb(70, 70, 70);
    border-bottom: 1px solid rgb(70, 70, 70);
    /*border-left: 1px solid rgb(130, 130, 130);*/
    background-color: rgb(50, 50, 50);
    background-image: linear-gradient(
        to bottom,
        rgb(130, 130, 130) 10%,
        rgb(50, 50, 50) 100%
    );
    color: #000000;
    box-shadow:
        1px 1px 8px #888888,
        1px 2px 1px #888888,
        1px 3px 1px #888888,
        1px 4px 1px #888888,
        1px 10px 4px rgba(16, 16, 16, 0.4),
        1px 14px 8px rgba(16, 16, 16, 0.4);
    text-decoration: none;
	text-align:center;
	min-width:100PX;
	font-family:"Comic Sans MS", cursive;
}

.texto-aviso-2 span {
    color: rgb(180, 180, 180);
    background: linear-gradient(
        to bottom,
        rgb(180, 180, 180) 0%,
        rgb(220, 220, 220) 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 1px 1px hsla(0, 0%, 50%, 1));
    text-shadow:
        0 2px 2px rgba(255, 255, 255, 0.5),
        0 -1px 1px rgba(0, 0, 0, 0.8);
}

.texto-aviso-2:hover {
    background-color: rgb(210, 210, 210);
    background-image: linear-gradient(
        to bottom,
        rgb(170, 170, 170) 5%,
        rgb(90, 90, 90) 100%
    );
    color: #FFF;
}

.texto-aviso-2::before {
    content: "";
    height: 0.17rem;
    position: absolute;
    /*display: block;*/
    top: 0.3rem;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 3rem);
    background: rgb(255, 255, 255);
    border-radius: 100%;
    opacity: 0.6;
    background-image: linear-gradient(
        -270deg,
        rgba(255, 255, 255, 0) 0%,
        rgb(255, 255, 255) 20%,
        rgb(255, 255, 255) 80%,
        rgba(255, 255, 255, 0) 100%
    );
}

.texto-aviso-2::after {
    content: "";
    height: 0.17rem;
    position: absolute;
    /*display: block;*/
    bottom: 0.75rem;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 3rem);
    background: rgb(255, 255, 255);
    border-radius: 100%;
    filter: blur(1px);
    opacity: 0.05;
    background-image: linear-gradient(
        -270deg,
        rgba(255, 255, 255, 0) 0%,
        rgb(255, 255, 255) 20%,
        rgb(255, 255, 255) 80%,
        rgba(255, 255, 255, 0) 100%
    );
}