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

/* Botones estilo Andarines (Basado en tus archivos) 
.btn-andarines {
    display: inline-block;
    padding: 10px 10px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    text-shadow: 0px 1px 2px rgba(0,0,0,0.5);
    box-shadow: 1px 2px 8px rgba(5,5,5,0.3);
    transition: all 0.3s;
    margin: 10px;
}*/

/* Colores extraídos de tu configuración bt01-bt06 */
.bt-naranja { background: #FF9619; color: white; } /* bt01 */
.bt-azul    { background: #1996FF; color: white; } /* bt02 */
.bt-verde   { background: #96FF19; color: #0000FF; } /* bt03 original */
.bt-rojo    { background: #FF1919; color: white; } /* bt04 */



/*==========================================================*/
/*--------------- bt01  BOTON NARANJA TERMINADO ------------*/
/*==========================================================*/

.bt01,
.bt01:focus {
    padding: 0.25rem 0.25rem 0.30rem 0.5rem;
    position: relative;
    overflow: hidden;
	display: inline-block;
    margin-top: 5px;
    margin-bottom:0px;
    border-radius: 0.5rem;
	/**zoom: 1;*/
    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(255, 170, 70);
    border-right: 1px solid rgb(150, 50, 0);
    /*border-bottom: 1px solid rgb(150, 50, 0);*/
	border-bottom:#CC6600;
    /*border-left: 1px solid rgb(255, 150, 0);*/
    background-color: rgb(255, 150, 0);
    background-image: linear-gradient(
        to bottom,
        rgb(255, 150, 50) 10%,
        rgb(125, 50, 0) 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;
}

.bt01 span {
    color: rgb(255, 210, 75);
    background: linear-gradient(
        to bottom,
        rgb(255, 185, 85) 0%,
        rgb(175, 65, 0) 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 1px 1px hsla(290, 50%, 70%, 1));
    text-shadow:
        0 2px 2px rgba(255, 255, 255, 0.5),
        0 -1px 1px rgba(0, 0, 0, 0.8);
}

.bt01:hover {
    background-color: rgb(255, 225, 50);
    background-image: linear-gradient(
        to bottom,
        rgb(255, 220, 120) 5%,
        rgb(200, 90, 0) 100%
    );
    color: #FFF;
}

.bt01::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%
    );
}

.bt01::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%
    );
}

/*==========================================================*/
/*--------------- bt01-2  BOTON NARANJA TERMINADO ------------*/
/*==========================================================*/

.bt01-2,
.bt01-2:focus {
    padding: 0.1rem 0.25rem 0.30rem 0.5rem;
    position: relative;
    overflow: hidden;
	display: inline-block;
    margin-top: 8px;
    margin-bottom:0px;
    border-radius: 0.5rem;
	/**zoom: 1;*/
    line-height: 0.9rem;
	border-color:transparent;
    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(255, 170, 70);
    border-right: 1px solid rgb(150, 50, 0);
    /*border-bottom: 1px solid rgb(150, 50, 0);*/
	border-bottom:#CC6600;
    /*border-left: 1px solid rgb(255, 150, 0);*/
    background-color: rgb(255, 150, 0);
    background-image: linear-gradient(
        to bottom,
        rgb(255, 150, 50) 10%,
        rgb(125, 50, 0) 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;
}

.bt01-2 span {
    color: rgb(255, 210, 75);
    background: linear-gradient(
        to bottom,
        rgb(255, 185, 85) 0%,
        rgb(175, 65, 0) 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 1px 1px hsla(290, 50%, 70%, 1));
    text-shadow:
        0 2px 2px rgba(255, 255, 255, 0.5),
        0 -1px 1px rgba(0, 0, 0, 0.8);
}

.bt01-2:hover {
    background-color: rgb(255, 225, 50);
    background-image: linear-gradient(
        to bottom,
        rgb(255, 220, 120) 5%,
        rgb(200, 90, 0) 100%
    );
    color: #FFF;
}

.bt01-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%
    );
}

.bt01-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%
    );
}


/*==========================================================*/
/*------------------ bt02  BOTON AZUL TERMINADO-------------*/
/*==========================================================*/

.bt02,
.bt02: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(80, 80, 255);
    border-right: 1px solid rgb(0, 50, 100);
    border-bottom: 1px solid rgb(0, 50, 100);
    /*border-left: 1px solid rgb(0, 150, 255);*/
    background-color: rgb(0, 150, 255);
    background-image: linear-gradient(
        to bottom,
        rgb(0, 0, 255) 10%,
        rgb(0, 0, 125) 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;
}

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

.bt02:hover {
    background-color: rgb(150, 225, 255);
    background-image: linear-gradient(
        to bottom,
        rgb(100, 150, 255) 5%,
        rgb(0, 0, 255) 100%
    );
    color: #FFF;
}

.bt02::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%
    );
}

.bt02::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%
    );
}


/*==========================================================*/
/*--------------- bt03  BOTON VERDE TERMINADO --------------*/
/*==========================================================*/

.bt03,
.bt03:focus {
    padding: 0.5rem 0.5rem 0.35rem 0.5rem;
    position: relative;
    display: inline-block;
    overflow: hidden;
    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(80, 255, 80);
    border-right: 1px solid rgb(30, 90, 30);
    border-bottom: 1px solid rgb(30, 90, 30);
    /*border-left: 1px solid rgb(80, 180, 80);*/
    background-color: rgb(80, 180, 80);
    background-image: linear-gradient(
        to bottom,
        rgb(0, 180, 0) 10%,
        rgb(0, 80, 0) 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;
}

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

.bt03:hover {
    background-color: rgb(180, 225, 180);
    background-image: linear-gradient(
        to bottom,
        rgb(0, 255, 0) 5%,
        rgb(0, 150, 0) 100%
    );
    color: #FFF;
}

.bt03::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%
    );
}

.bt03::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%
    );
}


/*==========================================================*/
/*------------------ bt04  BOTON ROJO TERMINADO-------------*/
/*==========================================================*/

.bt04,
.bt04: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(255, 80, 80);
    border-right: 1px solid rgb(150, 30, 30);
    border-bottom: 1px solid rgb(150, 30, 30);
    /*border-left: 1px solid rgb(180, 80, 80);*/
    background-color: rgb(100, 0, 0);
    background-image: linear-gradient(
        to bottom,
        rgb(180, 0, 0) 10%,
        rgb(80, 0, 0) 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;
}

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

.bt04:hover {
    background-color: rgb(225, 150, 150);
    background-image: linear-gradient(
        to bottom,
        rgb(255, 0, 0) 5%,
        rgb(150, 0, 0) 100%
    );
    color: #FFF;
}

.bt04::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%
    );
}

.bt04::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%
    );
}


/*==========================================================*/
/*------------- bt05  BOTON MAGENTA TERMINADO --------------*/
/*==========================================================*/

.bt05,
.bt05: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(255, 180, 255);
    border-right: 1px solid rgb(100, 0, 100);
    border-bottom: 1px solid rgb(100, 0, 100);
    /*border-left: 1px solid rgb(180, 80, 180);*/
    background-color: rgb(180, 80, 180);
    background-image: linear-gradient(
        to bottom,
        rgb(210, 140, 210) 10%,
        rgb(100, 0, 100) 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;
}

.bt05 span {
    color: rgb(210, 140, 210);
    background: linear-gradient(
        to bottom,
        rgb(210, 140, 210) 0%,
        rgb(240, 200, 240) 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 1px 1px hsla(300, 50%, 60%, 1));
    text-shadow:
        0 2px 2px rgba(255, 255, 255, 0.5),
        0 -1px 1px rgba(0, 0, 0, 0.8);
}

.bt05:hover {
    background-color: rgb(225, 150, 225);
    background-image: linear-gradient(
        to bottom,
        rgb(240, 200, 240) 5%,
        rgb(120, 30, 120) 100%
    );
    color: #FFF;
}

.bt05::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%
    );
}

.bt05::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%
    );
}


/*==========================================================*/
/*----------------- bt06  BOTON GRIS terminado -------------*/
/*==========================================================*/

.bt06,
.bt06:focus {
    padding: 0.1rem 0.25rem 0.30rem 0.5rem;
    position: relative;
    overflow: hidden;
	display: inline-block;
    margin-top: 8px;
    margin-bottom:0px;
    border-radius: 0.5rem;
	/**zoom: 1;*/
    line-height: 0.9rem;
	border-color:transparent;
    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;
}

.bt06 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);
}

.bt06: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;
}

.bt06::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%
    );
}

.bt06::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%
    );
}

.bt06-2,
.bt06-2:focus {
    padding: 0.1rem 0.25rem 0.30rem 0.5rem;
    position: relative;
    overflow: hidden;
	display: inline-block;
    margin-top: 8px;
    margin-bottom:0px;
    border-radius: 0.5rem;
	/**zoom: 1;*/
    line-height: 1.25rem;
	border-color:transparent;
    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;
}

.bt06-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);
}

.bt06-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;
}

.bt06-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%
    );
}

.bt06-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%
    );
}

/*==========================================================*/
/*------------- bt07  BOTON AMARILLO TERMINADO -------------*/
/*==========================================================*/

.bt07,
.bt07: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(255, 255, 0);
    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(255, 255, 0) 10%,
        rgb(100, 100, 0) 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;
}

.bt07 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, 150, 0.5),
        0 -1px 1px rgba(125, 125, 25, 0.8);
}

.bt07:hover {
    background-color: rgb(210, 210, 210);
    background-image: linear-gradient(
        to bottom,
        rgb(255, 255, 150) 5%,
        rgb(150, 150, 50) 100%
    );
    color: #FFF;
}

.bt07::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%
    );
}

.bt07::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%
    );
}


/*=====================================*/
/*------------MENÚ  HORIZONTAL---------*/
/*=====================================*/

.menu-horizontal{
	display: grid;
	/*max-height:50px;*/
    line-height: 1.15rem;
	height:auto;
	margin-bottom: 5px;
	text-align:center;
	alignment-baseline:middle;
	alignment-adjust:central;
}


/*=========================================*/
/*------------- MENÚ  VERTICAL ------------*/
/*=========================================*/

.menu-vertical {
	list-style: none;
	padding: 5px;
	margin-right:5px;
	height:auto;
	background-size: 50%;
	background-image:url(../imagen/web/marmol-verde.jpg);
	border-radius: 8px;
	border:2px;
    /*display: block;*/
	border-style:solid 3px;
	border-radius: 10px;
	border-color:#FFFF00;
    box-shadow: 0px 5px 8px 0px rgba(1,1,1,1.2);
	margin-bottom:15px;
}

.titulo-menu-inicio a {
    text-decoration: none;
	height:auto;
    line-height: 1.15rem;
	padding-left:5px;
	padding-top:5px;
	padding-right:5px;
	padding-bottom:5px;
}

.menu-vertical ul {
    text-decoration: none;
	list-style: none; 
	padding-left: 15px; 
    line-height: 1.15rem;
	padding-left:5px;
	padding-top:0px;
	padding-right:5px;
	padding-bottom:0px;
}

.menu-vertical a {
	text-decoration: none; 
	list-style: none; 
	padding-left: 15px; 
    line-height: 1.15rem;
	padding-left:5px;
	padding-top:5px;
	padding-right:5px;
	padding-bottom:5px;
}

.menu-vertical a:hover {
}

/*=========================================*/
/*---------------   BARRAS   --------------*/
/*=========================================*/

.barra {
	margin-left:10px;
	width: calc(100% - 20px);  /*10px + 10px*/ 
	height: 30px;
	text-align: center;
}

.barra img {
	max-width: 100%;
	height: auto;
}