/* ····· Constantes, Fuentes [tamaños, pesos, colores y alineados], Centradores, Separadores, 
Fades, Listas, Strokes, Bubbles, Columnas, Displays, Verticals alignments, Anchos, Altos, Paddings,
Margins, Redondeados, Sombras, Transiciones, Formularios, Botones, Backgrounds [colores e imagenes],
Media queries  ······· */

html,
body {
    margin: 0px;
    padding: 0px;
    height: 100%;
}

html {
    scroll-behavior: smooth;
}

section {
    justify-content: center;
    align-items: center;
}

button {
    cursor: pointer;
}

hr {
    margin-top: 50px;
    padding-bottom: 50px;
    width: 50%;
    border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}


* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    cursor: pointer !important;
}


img {
    width: 100%;
    vertical-align: middle;
    /* cursor: pointer; */
}

/*
img:hover{
    filter: brightness(123%);
}
*/

/* ···· FONTS ······· */


*,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.clearfix:before,
.clearfix:after {
    content: '';
    display: table;
}

.clearfix:after {
    clear: both;
}

body {
    font-weight: 400;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

.texto_nano {
    font-size: 12px;
}

.texto_mini {
    font-size: 14px;
}

.texto_peque {
    font-size: 16px;
}

.texto {
    font-size: 20px;
}

.texto_grande {
    font-size: 24px;
}

.subtitulo {
    font-size: 28px;
}

.titulo {
    font-size: 30px;
}

.megasubtitulo {
    font-size: 40px;
}

.megatitulo {
    font-size: 45px;
}

/* ······ strongs ··············· */

.strong1 {
    font-size: 24px;
}

.strong2 {
    font-size: 26px;
}

.strong3 {
    font-size: 28px;
}

.strong4 {
    font-size: 30px;
}

.strong5 {
    font-size: 30px;
}

.strong6 {
    font-size: 32px;
}

.strong7 {
    font-size: 34px;
}

.strong8 {
    font-size: 36px;
}

.strong9 {
    font-size: 38px;
}

.strong10 {
    font-size: 40px;
}

/* ······ Type colors ··············· */

.blanco {
    color: #fff;
}

.gris {
    color: #6E828B;
}

.azul {
    color: #1F4C7F !important;
}

.naranja {
    color: #F25023;
}

.amarillo {
    color: #FFD800;
}

.oxford {
    color: #3D5672 !important;
}

/* ·········· line-height PX ·············· */
.lh1 {
    line-height: 1px
}

.lh2 {
    line-height: 2px
}

.lh3 {
    line-height: 3px
}

.lh4 {
    line-height: 4px
}

.lh5 {
    line-height: 5px
}

.lh6 {
    line-height: 6px
}

.lh7 {
    line-height: 7px
}

.lh8 {
    line-height: 8px
}

.lh9 {
    line-height: 9px
}

.lh10 {
    line-height: 10px
}

.lh11 {
    line-height: 11px
}

.lh12 {
    line-height: 12px
}

.lh13 {
    line-height: 13px
}

.lh14 {
    line-height: 14px
}

.lh15 {
    line-height: 15px
}

.lh16 {
    line-height: 16px
}

.lh17 {
    line-height: 17px
}

.lh18 {
    line-height: 18px
}

.lh19 {
    line-height: 19px
}

.lh20 {
    line-height: 20px
}

.lh21 {
    line-height: 21px
}

.lh22 {
    line-height: 22px
}

.lh23 {
    line-height: 23px
}

.lh24 {
    line-height: 24px
}

.lh25 {
    line-height: 25px
}

.lh26 {
    line-height: 26px
}

.lh27 {
    line-height: 27px
}

.lh28 {
    line-height: 28px
}

.lh29 {
    line-height: 29px
}

.lh30 {
    line-height: 30px
}

.lh31 {
    line-height: 31px
}

.lh32 {
    line-height: 32px
}

.lh33 {
    line-height: 33px
}

.lh34 {
    line-height: 34px
}

.lh35 {
    line-height: 35px
}

.lh36 {
    line-height: 36px
}

.lh37 {
    line-height: 37px
}

.lh38 {
    line-height: 38px
}

.lh39 {
    line-height: 39px
}

.lh40 {
    line-height: 40px
}

.lh41 {
    line-height: 41px
}

.lh42 {
    line-height: 42px
}

.lh43 {
    line-height: 43px
}

.lh44 {
    line-height: 44px
}

.lh45 {
    line-height: 45px
}

.lh46 {
    line-height: 46px
}

.lh47 {
    line-height: 47px
}

.lh48 {
    line-height: 48px
}

.lh49 {
    line-height: 49px
}

.lh50 {
    line-height: 50px
}


/* ·········· line-height % ·············· */
.lh-porcent-5 {
    line-height: 5%
}

.lh-porcent-10 {
    line-height: 10%
}

.lh-porcent-15 {
    line-height: 15%
}

.lh-porcent-20 {
    line-height: 20%
}

.lh-porcent-25 {
    line-height: 25%
}

.lh-porcent-30 {
    line-height: 30%
}

.lh-porcent-35 {
    line-height: 35%
}

.lh-porcent-40 {
    line-height: 40%
}

/* ·········· ALINEADO ·············· */
.derecha {
    text-align: right;
}

.izquierda {
    text-align: left;
}

.centrado {
    text-align: center;
}

.justificado {
    text-align: justify;
}

/* ······ pesos ··············· */

.ligero {
    font-weight: 300;
}

.normal {
    font-weight: 400;
}

.negrita {
    font-weight: 600;
}

.negra {
    font-weight: 700;
}

.negrota {
    font-weight: 900;
}


/* ······ otros ··············· */

.description {
    position: relative;
    z-index: 500;
    padding: 0px 30px 0px 30px;
    color: #CD781D;
}


.llamado {
    padding: 0px 40px 0px 40px;
    color: #C8C8C8;
    font-size: 0.8em;
}


/* ···· general ······· */


#wrapper {
    margin: 0px;
    padding: 0px;
    min-height: 100% !important;
    width: 100%;
}

.clear {
    clear: both;
    width: 100%;
    height: 0;
    margin: 0;
    float: none;
    padding: 0;
    padding-top: 20px;
}

.centrador {
    margin: 0 auto;
}

.centrar_centrar {
    /*min-height: 100vh;*/
    display: flex;
    flex-direction: row;
    /* Horizontal centering (main axis): */
    justify-content: center;
    /* Vertical centering (cross axis): */
    align-items: center;
}

.centrar_arriba {
    min-height: 100vh;
    display: flex;
    flex-direction: row;
    /* Horizontal centering (main axis): */
    justify-content: flex-start;
    /* Vertical centering (cross axis): */
    align-items: center;
}

.centrar_enmedio {
    min-height: 100vh;
    display: flex;
    flex-direction: row;
    /* Horizontal centering (main axis): */
    justify-content: flex-start;
    /* Vertical centering (cross axis): */
    align-items: center;
}

.centrar_abajo {
    min-height: 100vh;
    display: flex;
    flex-direction: row;
    /* Horizontal centering (main axis): */
    justify-content: flex-end;
    /* Vertical centering (cross axis): */
    align-items: center;
}

/* ····· TABLAS  ·············· */

.tabla {
    margin: 0 auto !important;
    min-height: 100vh;
    display: flex;
    /* Horizontal centering (main axis): */
    justify-content: center;
    /* Vertical centering (cross axis): */
    align-items: center;
    padding: 0;
    margin: 0;

}

.tabla-inline {
    display: inline-table;
}

.celda {
    display: table-cell;

}


/* ····· POSICIONES  ·············· */
.absolute {
    position: absolute;
}

.relative {
    position: relative;
}

/* ····· DISPLAYS  ·············· */

.alado {
    display: inline !important;
    padding-left: 12px;
}

.inline {
    display: inline-block;
    padding-left: 12px;
}

.valign_top {
    float: center;
    vertical-align: top;
}

.valign_middle {
    display: table-cell;
    vertical-align: middle;
}

.valign_bottom {
    float: center;
    vertical-align: bottom;
}

/* ····· COLUMS  ·············· */

.colum {
    display: inline-block;
    margin-left: 20px;
}

.colum3 {
    display: inline-block;
    width: 25%;
    margin-left: 20px;
}

.mitadA {
    position: relative;
    display: inline-block !important;
}

.mitadB {
    position: relative;
    display: inline-block !important;
    float: right;
}

.fila {
    display: block;
    width: 98%;
}



/* ······ apareciendo y desapareciendo ········ */

.fade-in-section {
    opacity: 0;
    transform: translateY(100vh);
    visibility: hidden;
    transition: opacity 0.6s ease-out, transform 1.2s ease-out;
    will-change: opacity, visibility;
}

.fade-in-section.is-visible {
    opacity: 1;
    transform: none;
    visibility: visible;
}

/* ····· LISTAS  ·············· */
.lista_linea li {
    display: inline-block;
}

.bullets {
    list-style: disc !important;
}

.nobullets {
    list-style: none;
}


/* ····· STROKES ·············· */

.stroke-blanco {
    border: 1px solid #fff;
}

.bubble-right {
    position: relative;
    width: auto;
    height: auto;
    padding: 12px;
    line-height: auto;
    border: 1px solid #fff;

    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}

.bubble-right:after {
    content: '';
    position: absolute;
    display: block;
    width: 0;
    z-index: 1;
    border-style: solid;
    border-color: transparent #fff;
    border-width: 24px 20px 24px 0;
    top: 53%;
    left: -20px;
    margin-top: -24px;
}


.bubble-left {
    position: relative;
    width: auto;
    height: auto;
    padding: 12px;
    line-height: auto;
    border: 1px solid #fff;

    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}

.bubble-left:after {
    content: '';
    position: absolute;
    display: block;
    width: 0;
    z-index: 1;
    border-style: solid;
    border-color: transparent #fff;
    border-width: 24px 0px 24px 20px;
    top: 53%;
    right: -20px;
    margin-top: -24px;
}


.bubble-top {
    position: relative;
    width: auto;
    height: auto;
    padding: 12px;
    line-height: auto;
    border: 1px solid #fff;

    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}

.bubble-top:after {
    content: '';
    position: absolute;
    display: block;
    width: 0;
    z-index: 1;
    border-style: solid;
    border-color: #fff transparent;
    border-width: 20px 23px 0;
    bottom: -20px;
    left: 38%;
    margin-left: -23px;
}



/* ····· Anchos % ·············· */
.w_auto {
    width: auto
}

.w5 {
    width: 5%
}

.w10 {
    width: 10%
}

.w15 {
    width: 15%
}

.w20 {
    width: 20%
}

.w25 {
    width: 25%
}

.w30 {
    width: 30%
}

.w35 {
    width: 35%
}

.w40 {
    width: 40%
}

.w45 {
    width: 45%
}

.w50 {
    width: 50%
}

.w55 {
    width: 55%
}

.w60 {
    width: 60%
}

.w65 {
    width: 65%
}

.w70 {
    width: 70%
}

.w75 {
    width: 75%
}

.w80 {
    width: 80%
}

.w85 {
    width: 85%
}

.w90 {
    width: 90%
}

.w95 {
    width: 95%
}

.w100 {
    width: 100%
}

/* ····· Altos PX ·············· */
.h25 {
    height: 25px
}

.h30 {
    height: 30px
}

.h35 {
    height: 35px
}

.h40 {
    height: 40px
}

.h45 {
    height: 45px
}

.h50 {
    height: 50px
}

.h55 {
    height: 55px
}

.h60 {
    height: 60px
}

.h65 {
    height: 65px
}

.h70 {
    height: 70px
}

.h75 {
    height: 75px
}

.h80 {
    height: 80px
}

.h85 {
    height: 85px
}

.h90 {
    height: 90px
}

.h100 {
    height: 100px
}

.h110 {
    height: 110px
}

.h130 {
    height: 130px
}

.h150 {
    height: 150px
}

.h180 {
    height: 180px
}

.h200 {
    height: 200px
}

.h300 {
    height: 300px
}

.h400 {
    height: 400px
}

.h500 {
    height: 500px
}

.h600 {
    height: 600px
}

.h700 {
    height: 700px
}

.h800 {
    height: 800px
}

.h900 {
    height: 900px
}

/* ····· PADDINGS PX ·············· */


.padding0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.pt0 {
    padding-top: 3px;
}

.pt5 {
    padding-top: 5px
}

.pt10 {
    padding-top: 10px
}

.pt15 {
    padding-top: 15px
}

.pt20 {
    padding-top: 20px
}

.pt25 {
    padding-top: 25px
}

.pt30 {
    padding-top: 30px
}

.pt35 {
    padding-top: 35px
}

.pt40 {
    padding-top: 40px
}

.pt45 {
    padding-top: 45px
}

.pt50 {
    padding-top: 50px
}

.pt55 {
    padding-top: 55px
}

.pt60 {
    padding-top: 60px
}

.pt65 {
    padding-top: 65px
}

.pt70 {
    padding-top: 70px
}

.pt75 {
    padding-top: 75px
}

.pt80 {
    padding-top: 80px
}

.pt85 {
    padding-top: 85px
}

.pt90 {
    padding-top: 90px
}

.pt95 {
    padding-top: 95px
}

.pt100 {
    padding-top: 100px
}

.pt120 {
    padding-top: 120px
}

.pt130 {
    padding-top: 130px
}

.pt150 {
    padding-top: 150px
}

.pt180 {
    padding-top: 180px
}

.pt200 {
    padding-top: 200px
}

.pt300 {
    padding-top: 300px
}

.pt400 {
    padding-top: 400px
}

.pt500 {
    padding-top: 500px
}

.pt600 {
    padding-top: 600px
}

.pt700 {
    padding-top: 700px
}

.pt800 {
    padding-top: 800px
}

.pt900 {
    padding-top: 900px
}

.pt1000 {
    padding-top: 1000px
}

.pb0 {
    padding-bottom: 3px;
}

.pb5 {
    padding-bottom: 5px
}

.pb10 {
    padding-bottom: 10px
}

.pb15 {
    padding-bottom: 15px
}

.pb20 {
    padding-bottom: 20px
}

.pb25 {
    padding-bottom: 25px
}

.pb30 {
    padding-bottom: 30px
}

.pb35 {
    padding-bottom: 35px
}

.pb40 {
    padding-bottom: 40px
}

.pb45 {
    padding-bottom: 45px
}

.pb50 {
    padding-bottom: 50px
}

.pb55 {
    padding-bottom: 55px
}

.pb60 {
    padding-bottom: 60px
}

.pb65 {
    padding-bottom: 65px
}

.pb70 {
    padding-bottom: 70px
}

.pb75 {
    padding-bottom: 75px
}

.pb80 {
    padding-bottom: 80px
}

.pb85 {
    padding-bottom: 85px
}

.pb90 {
    padding-bottom: 90px
}

.pb95 {
    padding-bottom: 95px
}

.pb100 {
    padding-bottom: 100px
}

.pb120 {
    padding-bottom: 120px
}

.pb130 {
    padding-bottom: 130px
}

.pb150 {
    padding-bottom: 150px
}

.pb180 {
    padding-bottom: 180px
}

.pb200 {
    padding-bottom: 200px
}

.pb300 {
    padding-bottom: 300px
}

.pb400 {
    padding-bottom: 400px
}

.pb500 {
    padding-bottom: 500px
}

.pb600 {
    padding-bottom: 600px
}

.pb700 {
    padding-bottom: 700px
}

.pb800 {
    padding-bottom: 800px
}

.pb900 {
    padding-bottom: 900px
}

.pb1000 {
    padding-bottom: 1000px
}

.pr0 {
    padding-right: 3px;
}

.pr5 {
    padding-right: 5px
}

.pr10 {
    padding-right: 10px
}

.pr15 {
    padding-right: 15px
}

.pr20 {
    padding-right: 20px
}

.pr25 {
    padding-right: 25px
}

.pr30 {
    padding-right: 30px
}

.pr35 {
    padding-right: 35px
}

.pr40 {
    padding-right: 40px
}

.pr45 {
    padding-right: 45px
}

.pr50 {
    padding-right: 50px
}

.pr55 {
    padding-right: 55px
}

.pr60 {
    padding-right: 60px
}

.pr65 {
    padding-right: 65px
}

.pr70 {
    padding-right: 70px
}

.pr75 {
    padding-right: 75px
}

.pr80 {
    padding-right: 80px
}

.pr85 {
    padding-right: 85px
}

.pr90 {
    padding-right: 90px
}

.pr95 {
    padding-right: 95px
}

.pr100 {
    padding-right: 100px
}

.pr120 {
    padding-right: 120px
}

.pr130 {
    padding-right: 130px
}

.pr150 {
    padding-right: 150px
}

.pr180 {
    padding-right: 180px
}

.pr200 {
    padding-right: 200px
}

.pr300 {
    padding-right: 300px
}

.pr400 {
    padding-right: 400px
}

.pr500 {
    padding-right: 500px
}

.pr600 {
    padding-right: 600px
}

.pr700 {
    padding-right: 700px
}

.pr800 {
    padding-right: 800px
}

.pr900 {
    padding-right: 900px
}

.pr1000 {
    padding-right: 1000px
}

.pl0 {
    padding-left: 3px;
}

.pl5 {
    padding-left: 5px
}

.pl10 {
    padding-left: 10px
}

.pl15 {
    padding-left: 15px
}

.pl20 {
    padding-left: 20px
}

.pl25 {
    padding-left: 25px
}

.pl30 {
    padding-left: 30px
}

.pl35 {
    padding-left: 35px
}

.pl40 {
    padding-left: 40px
}

.pl45 {
    padding-left: 45px
}

.pl50 {
    padding-left: 50px
}

.pl55 {
    padding-left: 55px
}

.pl60 {
    padding-left: 60px
}

.pl65 {
    padding-left: 65px
}

.pl70 {
    padding-left: 70px
}

.pl75 {
    padding-left: 75px
}

.pl80 {
    padding-left: 80px
}

.pl85 {
    padding-left: 85px
}

.pl90 {
    padding-left: 90px
}

.pl95 {
    padding-left: 95px
}

.pl100 {
    padding-left: 100px
}

.pl120 {
    padding-left: 120px
}

.pl130 {
    padding-left: 130px
}

.pl150 {
    padding-left: 150px
}

.pl180 {
    padding-left: 180px
}

.pl200 {
    padding-left: 200px
}

.pl300 {
    padding-left: 300px
}

.pl400 {
    padding-left: 400px
}

.pl500 {
    padding-left: 500px
}

.pl600 {
    padding-left: 600px
}

.pl700 {
    padding-left: 700px
}

.pl800 {
    padding-left: 800px
}

.pl900 {
    padding-left: 900px
}

.pl1000 {
    padding-left: 1000px
}

/* ····· PADDINGS % ·············· */

.padding1 {
    padding: 1%
}

.padding2 {
    padding: 2%
}

.padding5 {
    padding: 5%
}

.padding10 {
    padding: 10%
}

.padding15 {
    padding: 15%
}

.padding20 {
    padding: 20%
}

.padding25 {
    padding: 25%
}

.padding30 {
    padding: 30%
}

.padding35 {
    padding: 35%
}

.padding40 {
    padding: 40%
}

.padding45 {
    padding: 45%
}

.padding50 {
    padding: 50%
}

.pt2_porcent {
    padding-top: 2%;
}

.pt5_porcent {
    padding-top: 5%
}

.pt10_porcent {
    padding-top: 10%
}

.pt15_porcent {
    padding-top: 15%
}

.pt20_porcent {
    padding-top: 20%
}

.pt25_porcent {
    padding-top: 25%
}

.pt30_porcent {
    padding-top: 30%
}

.pt35_porcent {
    padding-top: 35%
}

.pt40_porcent {
    padding-top: 40%
}

.pt45_porcent {
    padding-top: 45%
}

.pt50_porcent {
    padding-top: 50%
}

.pt55_porcent {
    padding-top: 55%
}

.pt60_porcent {
    padding-top: 60%
}

.pt65_porcent {
    padding-top: 65%
}

.pt70_porcent {
    padding-top: 70%
}

.pt75_porcent {
    padding-top: 75%
}

.pt80_porcent {
    padding-top: 80%
}

.pt85_porcent {
    padding-top: 85%
}

.pt90_porcent {
    padding-top: 90%
}

.pt95_porcent {
    padding-top: 95%
}

.pt100_porcent {
    padding-top: 100%
}

.pt120_porcent {
    padding-top: 120%
}

.pt130_porcent {
    padding-top: 130%
}

.pt150_porcent {
    padding-top: 150%
}

.pt180_porcent {
    padding-top: 180%
}

.pt200_porcent {
    padding-top: 200%
}

.pt300_porcent {
    padding-top: 300%
}

.pt400_porcent {
    padding-top: 400%
}

.pb2_porcent {
    padding-bottom: 2%;
}

.pb5_porcent {
    padding-bottom: 5%
}

.pb10_porcent {
    padding-bottom: 10%
}

.pb15_porcent {
    padding-bottom: 15%
}

.pb20_porcent {
    padding-bottom: 20%
}

.pb25_porcent {
    padding-bottom: 25%
}

.pb30_porcent {
    padding-bottom: 30%
}

.pb35_porcent {
    padding-bottom: 35%
}

.pb40_porcent {
    padding-bottom: 40%
}

.pb45_porcent {
    padding-bottom: 45%
}

.pb50_porcent {
    padding-bottom: 50%
}

.pb55_porcent {
    padding-bottom: 55%
}

.pb60_porcent {
    padding-bottom: 60%
}

.pb65_porcent {
    padding-bottom: 65%
}

.pb70_porcent {
    padding-bottom: 70%
}

.pb75_porcent {
    padding-bottom: 75%
}

.pb80_porcent {
    padding-bottom: 80%
}

.pb85_porcent {
    padding-bottom: 85%
}

.pb90_porcent {
    padding-bottom: 90%
}

.pb95_porcent {
    padding-bottom: 95%
}

.pb100_porcent {
    padding-bottom: 100%
}

.pb120_porcent {
    padding-bottom: 120%
}

.pb130_porcent {
    padding-bottom: 130%
}

.pb150_porcent {
    padding-bottom: 150%
}

.pb180_porcent {
    padding-bottom: 180%
}

.pb200_porcent {
    padding-bottom: 200%
}

.pb300_porcent {
    padding-bottom: 300%
}

.pb400_porcent {
    padding-bottom: 400%
}

.pr2_porcent {
    padding-right: 2%;
}

.pr5_porcent {
    padding-right: 5%
}

.pr10_porcent {
    padding-right: 10%
}

.pr15_porcent {
    padding-right: 15%
}

.pr20_porcent {
    padding-right: 20%
}

.pr25_porcent {
    padding-right: 25%
}

.pr30_porcent {
    padding-right: 30%
}

.pr35_porcent {
    padding-right: 35%
}

.pr40_porcent {
    padding-right: 40%
}

.pr45_porcent {
    padding-right: 45%
}

.pr50_porcent {
    padding-right: 50%
}

.pr55_porcent {
    padding-right: 55%
}

.pr60_porcent {
    padding-right: 60%
}

.pr65_porcent {
    padding-right: 65%
}

.pr70_porcent {
    padding-right: 70%
}

.pr75_porcent {
    padding-right: 75%
}

.pr80_porcent {
    padding-right: 80%
}

.pr85_porcent {
    padding-right: 85%
}

.pr90_porcent {
    padding-right: 90%
}

.pr95_porcent {
    padding-right: 95%
}

.pr100_porcent {
    padding-right: 100%
}

.pr120_porcent {
    padding-right: 120%
}

.pr130_porcent {
    padding-right: 130%
}

.pr150_porcent {
    padding-right: 150%
}

.pr180_porcent {
    padding-right: 180%
}

.pr200_porcent {
    padding-right: 200%
}

.pr300_porcent {
    padding-right: 300%
}

.pr400_porcent {
    padding-right: 400%
}

.pl2_porcent {
    padding-left: 2%;
}

.pl5_porcent {
    padding-left: 5%
}

.pl10_porcent {
    padding-left: 10%
}

.pl15_porcent {
    padding-left: 15%
}

.pl20_porcent {
    padding-left: 20%
}

.pl25_porcent {
    padding-left: 25%
}

.pl30_porcent {
    padding-left: 30%
}

.pl35_porcent {
    padding-left: 35%
}

.pl40_porcent {
    padding-left: 40%
}

.pl45_porcent {
    padding-left: 45%
}

.pl50_porcent {
    padding-left: 50%
}

.pl55_porcent {
    padding-left: 55%
}

.pl60_porcent {
    padding-left: 60%
}

.pl65_porcent {
    padding-left: 65%
}

.pl70_porcent {
    padding-left: 70%
}

.pl75_porcent {
    padding-left: 75%
}

.pl80_porcent {
    padding-left: 80%
}

.pl85_porcent {
    padding-left: 85%
}

.pl90_porcent {
    padding-left: 90%
}

.pl95_porcent {
    padding-left: 95%
}

.pl100_porcent {
    padding-left: 100%
}

.pl120_porcent {
    padding-left: 120%
}

.pl130_porcent {
    padding-left: 130%
}

.pl150_porcent {
    padding-left: 150%
}

.pl180_porcent {
    padding-left: 180%
}

.pl200_porcent {
    padding-left: 200%
}

.pl300_porcent {
    padding-left: 300%
}

.pl400_porcent {
    padding-left: 400%
}

/* ····· MARGINS PX ·············· */

.margin0 {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.mt0 {
    margin-top: 3px;
}

.mt5 {
    margin-top: 5px
}

.mt10 {
    margin-top: 10px
}

.mt15 {
    margin-top: 15px
}

.mt20 {
    margin-top: 20px
}

.mt25 {
    margin-top: 25px
}

.mt30 {
    margin-top: 30px
}

.mt35 {
    margin-top: 35px
}

.mt40 {
    margin-top: 40px
}

.mt45 {
    margin-top: 45px
}

.mt50 {
    margin-top: 50px
}

.mt55 {
    margin-top: 55px
}

.mt60 {
    margin-top: 60px
}

.mt65 {
    margin-top: 65px
}

.mt70 {
    margin-top: 70px
}

.mt75 {
    margin-top: 75px
}

.mt80 {
    margin-top: 80px
}

.mt85 {
    margin-top: 85px
}

.mt90 {
    margin-top: 90px
}

.mt95 {
    margin-top: 95px
}

.mt100 {
    margin-top: 100px
}

.mt120 {
    margin-top: 120px
}

.mt130 {
    margin-top: 130px
}

.mt150 {
    margin-top: 150px
}

.mt180 {
    margin-top: 180px
}

.mt200 {
    margin-top: 200px
}

.mt300 {
    margin-top: 300px
}

.mt400 {
    margin-top: 400px
}

.mt500 {
    margin-top: 500px
}

.mt600 {
    margin-top: 600px
}

.mt700 {
    margin-top: 700px
}

.mt800 {
    margin-top: 800px
}

.mt900 {
    margin-top: 900px
}

.mt1000 {
    margin-top: 1000px
}

.mb0 {
    margin-bottom: 3px;
}

.mb5 {
    margin-bottom: 5px
}

.mb10 {
    margin-bottom: 10px
}

.mb15 {
    margin-bottom: 15px
}

.mb20 {
    margin-bottom: 20px
}

.mb25 {
    margin-bottom: 25px
}

.mb30 {
    margin-bottom: 30px
}

.mb35 {
    margin-bottom: 35px
}

.mb40 {
    margin-bottom: 40px
}

.mb45 {
    margin-bottom: 45px
}

.mb50 {
    margin-bottom: 50px
}

.mb55 {
    margin-bottom: 55px
}

.mb60 {
    margin-bottom: 60px
}

.mb65 {
    margin-bottom: 65px
}

.mb70 {
    margin-bottom: 70px
}

.mb75 {
    margin-bottom: 75px
}

.mb80 {
    margin-bottom: 80px
}

.mb85 {
    margin-bottom: 85px
}

.mb90 {
    margin-bottom: 90px
}

.mb95 {
    margin-bottom: 95px
}

.mb100 {
    margin-bottom: 100px
}

.mb120 {
    margin-bottom: 120px
}

.mb130 {
    margin-bottom: 130px
}

.mb150 {
    margin-bottom: 150px
}

.mb180 {
    margin-bottom: 180px
}

.mb200 {
    margin-bottom: 200px
}

.mb300 {
    margin-bottom: 300px
}

.mb400 {
    margin-bottom: 400px
}

.mb500 {
    margin-bottom: 500px
}

.mb600 {
    margin-bottom: 600px
}

.mb700 {
    margin-bottom: 700px
}

.mb800 {
    margin-bottom: 800px
}

.mb900 {
    margin-bottom: 900px
}

.mb1000 {
    margin-bottom: 1000px
}

.mr0 {
    margin-right: 3px;
}

.mr5 {
    margin-right: 5px
}

.mr10 {
    margin-right: 10px
}

.mr15 {
    margin-right: 15px
}

.mr20 {
    margin-right: 20px
}

.mr25 {
    margin-right: 25px
}

.mr30 {
    margin-right: 30px
}

.mr35 {
    margin-right: 35px
}

.mr40 {
    margin-right: 40px
}

.mr45 {
    margin-right: 45px
}

.mr50 {
    margin-right: 50px
}

.mr55 {
    margin-right: 55px
}

.mr60 {
    margin-right: 60px
}

.mr65 {
    margin-right: 65px
}

.mr70 {
    margin-right: 70px
}

.mr75 {
    margin-right: 75px
}

.mr80 {
    margin-right: 80px
}

.mr85 {
    margin-right: 85px
}

.mr90 {
    margin-right: 90px
}

.mr95 {
    margin-right: 95px
}

.mr100 {
    margin-right: 100px
}

.mr120 {
    margin-right: 120px
}

.mr130 {
    margin-right: 130px
}

.mr150 {
    margin-right: 150px
}

.mr180 {
    margin-right: 180px
}

.mr200 {
    margin-right: 200px
}

.mr300 {
    margin-right: 300px
}

.mr400 {
    margin-right: 400px
}

.mr500 {
    margin-right: 500px
}

.mr600 {
    margin-right: 600px
}

.mr700 {
    margin-right: 700px
}

.mr800 {
    margin-right: 800px
}

.mr900 {
    margin-right: 900px
}

.mr1000 {
    margin-right: 1000px
}

.ml0 {
    margin-left: 3px;
}

.ml5 {
    margin-left: 5px
}

.ml10 {
    margin-left: 10px
}

.ml15 {
    margin-left: 15px
}

.ml20 {
    margin-left: 20px
}

.ml25 {
    margin-left: 25px
}

.ml30 {
    margin-left: 30px
}

.ml35 {
    margin-left: 35px
}

.ml40 {
    margin-left: 40px
}

.ml45 {
    margin-left: 45px
}

.ml50 {
    margin-left: 50px
}

.ml55 {
    margin-left: 55px
}

.ml60 {
    margin-left: 60px
}

.ml65 {
    margin-left: 65px
}

.ml70 {
    margin-left: 70px
}

.ml75 {
    margin-left: 75px
}

.ml80 {
    margin-left: 80px
}

.ml85 {
    margin-left: 85px
}

.ml90 {
    margin-left: 90px
}

.ml95 {
    margin-left: 95px
}

.ml100 {
    margin-left: 100px
}

.ml120 {
    margin-left: 120px
}

.ml130 {
    margin-left: 130px
}

.ml150 {
    margin-left: 150px
}

.ml180 {
    margin-left: 180px
}

.ml200 {
    margin-left: 200px
}

.ml300 {
    margin-left: 300px
}

.ml400 {
    margin-left: 400px
}

.ml500 {
    margin-left: 500px
}

.ml600 {
    margin-left: 600px
}

.ml700 {
    margin-left: 700px
}

.ml800 {
    margin-left: 800px
}

.ml900 {
    margin-left: 900px
}

.ml1000 {
    margin-left: 1000px
}


/* ····· MARGINS % ·············· */

.margin1 {
    margin: 1%
}

.margin2 {
    margin: 2%
}

.margin5 {
    margin: 5%
}

.margin10 {
    margin: 10%
}

.margin15 {
    margin: 15%
}

.margin20 {
    margin: 20%
}

.margin25 {
    margin: 25%
}

.margin30 {
    margin: 30%
}

.margin35 {
    margin: 35%
}

.margin40 {
    margin: 40%
}

.margin45 {
    margin: 45%
}

.margin50 {
    margin: 50%
}

/* ····· REDONDEADOS ······ */


.redondeado5 {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px
}

.redondeado10 {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px
}

.redondeado15 {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px
}

.redondeado20 {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px
}

.redondeado25 {
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px
}

.redondeado30 {
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px
}

.redondeado35 {
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px
}

.redondeado40 {
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px
}

.redondeado45 {
    -webkit-border-radius: 45px;
    -moz-border-radius: 45px;
    border-radius: 45px
}

.redondeado50 {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px
}

.esquinas_redondeadas {
    -webkit-border-radius: 33px;
    -moz-border-radius: 33px;
    border-radius: 33px;
}

/* ······ sombras ······· */

.sombra-ext {
    -webkit-box-shadow: 0px 6px 25px 2px rgba(0, 0, 0, 0.43);
    box-shadow: 0px 6px 25px 2px rgba(0, 0, 0, 0.43);
}


.sombra-int {
    -webkit-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    -moz-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
}

/* ···· transiciones ······· */


.trans1 {
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
}

.trans2 {
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    transition: all 0.1s;
}

/* ······· ToolTip ············ */


.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
    cursor: pointer;
}

.tooltip .tooltiptext {
    visibility: hidden;
    min-width: 200px;
    width: auto;
    padding: 15px 15px 15px 15px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    top: -50px;
    left: 105%;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

/* ···· FORMULARIOS ······· */

.hidden-with-pos {
    position: fixed;
    top: -500px;
    left: -500px;
}


.noutline {
    outline: none;
}

.noborder {
    border: none;
}

.losinputs {
    color: #5E5E5E !important;
    text-indent: 12px;
}

.textindent5 {
    text-indent: 5px;
}

.textindent10 {
    text-indent: 10px;
}

.textindent15 {
    text-indent: 15px;
}

.textindent20 {
    text-indent: 20px;
}

.textindent25 {
    text-indent: 25px;
}

.textindent30 {
    text-indent: 30px;
}

.losinputs:focus {
    background-color: #0086D2;
    color: #fff !important;
}

textarea {
    resize: none;
    overflow: hidden;
}

textarea:focus,
input:focus {
    outline: none;
}

select {
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
}

*:focus {
    outline: none;
}

/* -------- LOS ERRORES ---------------------------------------- */


#errorContainer {
    position: relative;
    display: none;
    width: 100%;
    height: auto;
    font-size: 1em;
    color: #fff;
    /*border: 1px solid #FF2323;*/
    text-align: left;
    margin-bottom: 5px;

    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;

    background-color: #FF2323;
    padding-top: 5px;
    padding-bottom: 5px;
}

#errorContainer label {
    float: none;
    width: auto;
}

#errorContainer ul {
    margin-left: 20px !important;
    margin-top: 10px;
    color: #fff;
    list-style: none;
}

input.error {
    border: 4px solid #FF2323;
}

select.error {
    background-color: #FF2323;
    border: 4px solid #FF2323;
}

#aviso.error {
    border: 4px solid #FF2323;
}

input[type=checkbox].error {
    outline: 3px solid #FF2323;
}

textarea.error {
    border: 4px solid #FF2323;
}

/* ········ Switches ···················· */

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.switch-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /*background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;*/

    background-color: #2C75BA;
    -webkit-transition: 0.2s;
    transition: opacity 0.2s;
    -webkit-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    -moz-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
}

.switch-slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked+.switch-slider {
    background-color: #2196F3;
}

input:focus+.switch-slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked+.switch-slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.switch-slider.round {
    border-radius: 34px;
}

.switch-slider.round:before {
    border-radius: 50%;
}


/* ·········· Range Sliders ······· */

.slideContainer {

    margin: 0 auto;
    /*border-radius: 33px;
  background-color: #AABAC9;*/
    margin-bottom: 12px;
}

.slider {
    -webkit-appearance: none;
    width: 70%;
    height: 63px;
    background-color: #2C75BA;
    /* background: linear-gradient(90deg, rgb(214,214,214) 60%, rgb(214,214,214) 60%); */
    outline: none;
    -webkit-transition: 0.2s;
    transition: opacity 0.2s;
    border-radius: 33px;
    -webkit-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    -moz-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
}

.slider:hover {
    background-color: #0086D2;

}

.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 90px;
    height: 90px;
    background-color: #439EDF !important;
    border: solid 12px #2E73B4;
    border-radius: 50%;
    cursor: grab;
}

.slider::-moz-range-thumb {
    width: 40px;
    height: 40px;
    background-color: #439EDF !important;
    border-radius: 50%;
    cursor: pointer;
}

input[type=text] {
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    outline: none;
}

.losinputs_range {
    background-color: #2C75BA;
    width: 100%;
    height: 63px;
    vertical-align: middle;

    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    transition: all 0.1s;

    outline: none;

    -webkit-border-radius: 33px;
    -moz-border-radius: 33px;
    border-radius: 33px;


    -webkit-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    -moz-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);

    margin-bottom: 4px;
    color: #fff !important;
    font-size: 2.8em;

    text-align: left;
    text-indent: 12px;
    border: none;
}

.losinputs_range:focus {
    background-color: #0086D2;
    color: #fff !important;
}

/* ········ BOTONES ···················· */

/* ········ font sizes ········· */


.bt5 {
    font-size: 5px
}

.bt6 {
    font-size: 6px
}

.bt7 {
    font-size: 7px
}

.bt8 {
    font-size: 8px
}

.bt9 {
    font-size: 9px
}

.bt10 {
    font-size: 10px
}

.bt11 {
    font-size: 11px
}

.bt12 {
    font-size: 12px
}

.bt13 {
    font-size: 13px
}

.bt14 {
    font-size: 14px
}

.bt15 {
    font-size: 15px
}

.bt16 {
    font-size: 16px
}

.bt17 {
    font-size: 17px
}

.bt18 {
    font-size: 18px
}

.bt19 {
    font-size: 19px
}

.bt20 {
    font-size: 20px
}

.bt21 {
    font-size: 21px
}

.bt22 {
    font-size: 22px
}

.bt23 {
    font-size: 23px
}

.bt24 {
    font-size: 24px
}

.bt25 {
    font-size: 25px
}

.bt26 {
    font-size: 26px
}

.bt27 {
    font-size: 27px
}

.bt28 {
    font-size: 28px
}

.bt29 {
    font-size: 29px
}

.bt30 {
    font-size: 30px
}

.bt31 {
    font-size: 31px
}

.bt32 {
    font-size: 32px
}

.bt33 {
    font-size: 33px
}

.bt34 {
    font-size: 34px
}

.bt35 {
    font-size: 35px
}

.bt36 {
    font-size: 36px
}

.bt37 {
    font-size: 37px
}

.bt38 {
    font-size: 38px
}

.bt39 {
    font-size: 39px
}

.bt40 {
    font-size: 40px
}


.close {
    color: #fff;
    font-size: 30px;
    cursor: pointer;
    width: 45px;
    height: 45px;
    padding-top: 0px;
    padding-bottom: 43px;
    text-align: center;

    border: 1px solid #fff;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;


}

.cerrar {
    color: #fff;
    position: absolute;
    z-index: 2000;
    right: 10px;
    top: 100px;
    font-size: 40px;
    cursor: pointer;

    border: 1px solid #fff;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;

    padding: 0px 18px 4px 18px;
}

.atras {
    color: #fff;
    position: absolute;
    z-index: 2000;
    left: 10px;
    top: 100px;
    font-size: 40px;
    cursor: pointer;

    border: 1px solid #fff;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;

    padding: 0px 15px 0px 15px;
}

.noutline {
    outline: none;
}

.noborder {
    border: none;
}

/* ··········· en desuso ················ */


.btn_redondo {
    text-decoration: none;

    text-align: center;
    vertical-align: middle;

    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    transition: all 0.1s;

    outline: none;

    -webkit-border-radius: 33px;
    -moz-border-radius: 33px;
    border-radius: 33px;
}


/* //////////  Botones 3D ///////////////  */


.btn-3D-amarillo {
    color: #8B3A17;
    font-weight: 600;
    background: #FFB728;
    border: solid 1px #FFBC05;

    -webkit-box-shadow: 0px 4px 0px #D06B00;
    -moz-box-shadow: 0px 4px 0px #D06B00;
    box-shadow: 0px 4px 0px #D06B00;
}

.btn-3D-amarillo:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #7E4100;
    -moz-box-shadow: 0px 1px 0px #7E4100;
    box-shadow: 0px 1px 0px #7E4100;
    position: relative;
    top: 5px;
}


.btn-3D-amarillo2 {
    color: #fff;
    font-weight: 600;
    background: #FF9107;
    border: solid 1px #FFAC43;

    -webkit-box-shadow: 0px 4px 0px #A24E00;
    -moz-box-shadow: 0px 4px 0px #A24E00;
    box-shadow: 0px 4px 0px #A24E00;
}

.btn-3D-amarillo2:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #572A02;
    -moz-box-shadow: 0px 1px 0px #572A02;
    box-shadow: 0px 1px 0px #572A02;
    position: relative;
    top: 5px;
}


.btn-3D-naranja {
    cursor: pointer;
    color: #FFF;
    background: #FF6500;
    border: solid 1px #FF7700;

    -webkit-box-shadow: 0px 4px 0px #DF3D00;
    -moz-box-shadow: 0px 4px 0px #DF3D00;
    box-shadow: 0px 4px 0px #DF3D00;
}

.btn-3D-naranja:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #A42D00;
    -moz-box-shadow: 0px 1px 0px #A42D00;
    box-shadow: 0px 1px 0px #A42D00;
    position: relative;
    top: 5px;
}


.btn-3D-agua {
    color: #FFF;
    background: #3CB7AD;
    border: solid 1px #00C5B5;

    -webkit-box-shadow: 0px 4px 0px #16847C;
    -moz-box-shadow: 0px 4px 0px #16847C;
    box-shadow: 0px 4px 0px #16847C;
}

.btn-3D-agua:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #00615A;
    -moz-box-shadow: 0px 1px 0px #00615A;
    box-shadow: 0px 1px 0px #00615A;
    position: relative;
    top: 5px;
}

.btn-3D-limon {
    color: #274900;
    font-weight: 600;
    background: #8BC62C;
    border: solid 1px #99D33A;

    -webkit-box-shadow: 0px 4px 0px #3F7500;
    -moz-box-shadow: 0px 4px 0px #3F7500;
    box-shadow: 0px 4px 0px #3F7500;
}

.btn-3D-limon:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #274900;
    -moz-box-shadow: 0px 1px 0px #274900;
    box-shadow: 0px 1px 0px #274900;
    position: relative;
    top: 5px;
}

.btn-3D-verde {
    color: #FFF;
    background: #009D63;
    border: solid 1px #00A669;

    -webkit-box-shadow: 0px 4px 0px #025D3B;
    -moz-box-shadow: 0px 4px 0px #025D3B;
    box-shadow: 0px 4px 0px #025D3B;
}

.btn-3D-verde:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #003824;
    -moz-box-shadow: 0px 1px 0px #003824;
    box-shadow: 0px 1px 0px #003824;
    position: relative;
    top: 5px;
}


.btn-3D-azul {
    color: #FFF;
    background: #008DE2;
    border: solid 1px #109FC6;

    -webkit-box-shadow: 0px 4px 0px #004E7D;
    -moz-box-shadow: 0px 4px 0px #004E7D;
    box-shadow: 0px 4px 0px #004E7D;
}

.btn-3D-azul:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #00305A;
    -moz-box-shadow: 0px 1px 0px #00305A;
    box-shadow: 0px 1px 0px #00305A;
    position: relative;
    top: 5px;
}


.btn-3D-azul2 {
    color: #FFF;
    background: #0C57A3;
    border: solid 1px #0C61B7;

    -webkit-box-shadow: 0px 4px 0px #164475;
    -moz-box-shadow: 0px 4px 0px #164475;
    box-shadow: 0px 4px 0px #164475;
}

.btn-3D-azul2:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #1F2A36;
    -moz-box-shadow: 0px 1px 0px #1F2A36;
    box-shadow: 0px 1px 0px #1F2A36;
    position: relative;
    top: 5px;
}


.btn-3D-azul3 {
    color: #FFF;
    background: #157BFF;
    border: solid 1px #3D8AEE;

    -webkit-box-shadow: 0px 4px 0px #093F84;
    -moz-box-shadow: 0px 4px 0px #093F84;
    box-shadow: 0px 4px 0px #093F84;
}

.btn-3D-azul3:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #002452;
    -moz-box-shadow: 0px 1px 0px #002452;
    box-shadow: 0px 1px 0px #002452;
    position: relative;
    top: 5px;
}


.btn-3D-rojo1 {
    color: #FFF;
    background: #DA393E;
    border: solid 1px #E4474C;

    -webkit-box-shadow: 0px 4px 0px #9C2226;
    -moz-box-shadow: 0px 4px 0px #9C2226;
    box-shadow: 0px 4px 0px #9C2226;
}

.btn-3D-rojo1:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #660E11;
    -moz-box-shadow: 0px 1px 0px #660E11;
    box-shadow: 0px 1px 0px #660E11;
    position: relative;
    top: 5px;
}


.btn-3D-guinda1 {
    color: #FFF;
    background: #A32A63;
    border: solid 1px #B2326E;

    -webkit-box-shadow: 0px 4px 0px #84204F;
    -moz-box-shadow: 0px 4px 0px #84204F;
    box-shadow: 0px 4px 0px #84204F;
}

.btn-3D-guinda1:hover {
    outline: none;
    -webkit-box-shadow: 0px 1px 0px #4F0D2E;
    -moz-box-shadow: 0px 1px 0px #4F0D2E;
    box-shadow: 0px 1px 0px #4F0D2E;
    position: relative;
    top: 5px;
}

/* ··················· botones flat ··················· */


.btn_blanco {
    background-color: #fff;
    color: #26578B;
}

.btn_blanco:hover {
    background-color: #0053A9;
    outline: none;
    color: #fff !important;
}

.btn-flat-azul2 {
    background-color: #0053A9;
    color: #fff;
}

.btn-flat-azul2:hover {
    background-color: #EFF3F8;
    outline: none;
    color: #26578B !important;
}

.btn-flat-azul3 {
    background-color: #157BFF;
    color: #fff;
}

.btn-flat-azul3:hover {
    background-color: #EFF3F8;
    outline: none;
    color: #26578B !important;
}

.btn-flat-rojo1 {
    background-color: #DA393E;
    color: #fff;
}

.btn-flat-rojo1:hover {
    background-color: #EFF3F8;
    outline: none;
    color: #26578B !important;
}

.btn-flat-amarillo2 {
    background-color: #FF9107;
    color: #fff;
}

.btn-flat-amarillo2:hover {
    background-color: #EFF3F8;
    outline: none;
    color: #26578B !important;
}

.btn-flat-guinda1 {
    background-color: #A32A63;
    color: #fff;
}

.btn-flat-guinda1:hover {
    background-color: #EFF3F8;
    outline: none;
    color: #26578B !important;
}

/* ------------  boton de espera ----------- */

.btn_espera {
    display: inline-block;
    border: none;
    margin-bottom: 4px;
    width: 29.5%;
    height: 37px;
    cursor: wait !important;
    background-color: #008CCD;
}

.btn_espera p {
    color: #fff;
    font-size: 1.1em;
    font-weight: 600;
    line-height: 0px;
    padding: 3px 15px 0px 35px;
}

.btn_espera img {
    float: right;
    margin-right: 15px;
    margin-top: 0px;
    width: 63px;
    height: auto;
}


/* ····· COLORES BACKGROUND ·············· */

.bg_blanco {
    background-color: #fff;
}

.bg_home {
    background-color: #F4F4F4;
}

.bg_naranja {
    background-color: #F25023;
}

.bg_blanco {
    background-color: #F4F4F4;
}

.bg_gris {
    background-color: #EDEDED;
}

.bg_azul {
    background-color: #043368;
}


/* ····· AZULES 2020 ········*/


.azul1 {
    background-color: #286FC7;
}

.azul2 {
    background-color: #2063B5;
}

.azul3 {
    background-color: #1C5EAF;
}

.azul4 {
    background-color: #0049A6;
}

.azul5 {
    background-color: #2378F2;
}


/* ····· ACENTOS 2020 ········*/


.contraste1 {
    background-color: #EA282E;
}

.contraste2 {
    background-color: #FD391A;
}

.contraste3 {
    background-color: #1C5EAF;
}

.contraste4 {
    background-color: #0049A6;
}

.contraste5 {
    background-color: #2378F2;
}


.gema {
    background: #E13612;

    -webkit-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    -moz-box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);
    box-shadow: inset 0px 8px 15px -8px rgba(3, 37, 87, 1);

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#17578b+0,b23809+71,e93c26+100 */
    background: #17578b;
    /* Old browsers */
    background: -moz-linear-gradient(top, #17578b 0%, #b23809 71%, #e93c26 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #17578b 0%, #b23809 71%, #e93c26 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #17578b 0%, #b23809 71%, #e93c26 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#17578b', endColorstr='#e93c26', GradientType=0);
    /* IE6-9 */
}

/* ------- MEDIA QUERIES ---------------------*/

@media screen and (max-width:480px) {

    html,
    body {
        height: auto;
    }

    .escondible {
        display: none;
    }

    .mitadA {
        display: block !important;
        width: 100%;

    }

    .mitadB {
        display: block !important;
        width: 100%;
        float: none;
    }

    .h700 {
        height: 500px !important;
    }

    .centrador {
        width: 96%;
    }

    .colum {
        display: block !important;
        clear: both !important;
        width: 100% !important;
        margin-left: 0px;
        margin-bottom: 18px !important;
        height: auto !important;
    }

    .colum3 {
        display: block !important;
        clear: both !important;
        width: 100% !important;
        margin-left: 0px;
        margin-bottom: 18px !important;
        height: auto !important;
    }

    .derecha {
        text-align: center;
    }

    .espacio {
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .lista_linea li {
        display: block;
        text-align: center;
    }

    .alado {
        display: block !important;
        width: 100%;
        clear: both;
        margin-bottom: 17px;
    }


    .w20,
    .w25,
    .w30,
    .w35,
    .w40,
    .w45,
    .w50,
    .w60,
    .w75,
    .w80,
    .w90,
    .w100 {
        width: 100% !important;
        padding: 5%;
    }

    .tabla {
        display: block;
    }

    .tabla-inline {
        display: block;
    }

    .celda {
        display: block;

    }


}

@media screen and (min-width:481px) and (max-width:768px) {
    .escondible {
        display: none;
    }

    .alado {
        display: block !important;
        width: 100%;
        clear: both;
        margin-bottom: 17px;
    }

    .centrador {
        width: 95%;
        margin: auto;
    }

    .colum {
        margin-left: 5px !important;
    }


    .espacio {
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .w25,
    .w30,
    .w35,
    .w40,
    .w45,
    .w50,
    .w60,
    .w70,
    .w75,
    .w80,
    .w90,
    .w100 {
        width: 100% !important;
        padding: 5%;
    }

    .tabla {
        display: block;
    }

    .tabla-inline {
        display: block;
    }

    .celda {
        display: block;

    }

}

@media screen and (min-width:769px) and (max-width:1024px) {


    .centrador {
        width: 93%;
    }

    .colum {
        margin-left: 33px !important;
    }


}


@media screen and (min-width:1025px) and (max-width:1054px) {
    .centrador {
        width: 85% !important;
    }
}

@media screen and (min-width:1055px) and (max-width:1202px) {
    .centrador {
        width: 85% !important;
    }
}

@media screen and (max-width:1200px) {}

@media screen and (min-width:1025px) and (max-width:1422px) {}


@media screen and (max-width:1435px) {}