@font-face {
    font-family: FontNormal;
    font-weight: normal;
    src: url("font-normal.otf") format("opentype");
}

@font-face {
    font-family: FontBold;
    font-weight: bold;
    src: url("font-bold.otf") format("opentype");
}

* {
    margin: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}

body {
    font-family: 'FontNormal', serif;
    font-size: 1.2rem;
}

h1,
h2,
h3,
h4,
h5 {
    font-family: 'FontBold', serif;
}

h1,
.as-h1 {
    font-size: 3.7rem;
}

h2,
.as-h2 {
    font-size: 3rem;
}

h3,
.as-h3 {
    font-size: 2.4rem;
}

h4,
.as-h4 {
    font-size: 1.6rem;
}

h5,
.as-h5 {
    font-size: 1.3rem;
}

hr {
    float: left;
    width: 100%;
    height: 2px;
}

hr.hr-4px {
    height: 4px;
}

hr.hr2 {
    width: 2.5rem;
    margin: 0;
}

a.no-estilo {
    text-decoration: none;
}

p {
    line-height: 1.5rem;

}

img {
    max-width: 100%;
}

li {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

/* 	IDs */

#subrayado {
    background-color: black;
}

#fondo-m {
    background-attachment: fixed;
    background-image: url('assets/01/fondo.svg');
    background-repeat: no-repeat;
    background-size: 100%;
}

#fondo-2 {
    background-attachment: fixed;
    background-image: url('assets/02/fondo.svg');
    background-repeat: no-repeat;
    background-size: 70%;
    background-position: 50% 8rem;
}

#popup-inicio {
    max-width: 50rem;
    height: 80%;
}

@keyframes logotop {
    0% {
        -webkit-transform: translateY(-150%);
        transform: translateY(-150%);
        -ms-transform: translateY(-150%);
    }

    40% {
        -webkit-transform: translateY(-150%);
        transform: translateY(-150%);
        -ms-transform: translateY(-150%);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -ms-transform: translateY(0);
    }
}

#logo-footer {
    animation: beat2 1s ease-in-out infinite;
}

@keyframes beat2 {
    0% {
        -webkit-transform: scale(1.05, 1.05);
        transform: scale(1.05, 1.05);
        -ms-transform: scale(1.05, 1.05);
    }

    95% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        -ms-transform: scale(1, 1);
    }

    100% {
        -webkit-transform: scale(1.05, 1.05);
        transform: scale(1.05, 1.05);
        -ms-transform: scale(1.05, 1.05);
    }
}


#bloque-1 .contenido-centrado {
    transition: all 0.5s ease-out;
    opacity: 0;
}

#bloque-2 .contenido-centrado {
    transition: all 0.5s ease-out;
    -webkit-transform: translateY(10rem);
    transform: translateY(10rem);
    -ms-transform: translateY(10rem);
    opacity: 0;
}

/* 	CLASES */

.ctm-background-color {
    background-color: #cbbda3;
}

.ctm-background-img {
    background-image: url('assets/04/fondo.svg');
    background-repeat: no-repeat;
    background-position-y: 6rem;
    background-size: 100%;
    background-color: #cbbda3;
}

.ctm-centrado-x {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.ctm-amua-fest-logo {
    width: 12rem;
}

.ctm-doan-gratis {
    width: 7rem;
}

.custom-title {
    font-size: 12rem;
}

.ctm-social-icon {
    width: 4rem;
}

.ctm-footer-icon {
    height: 7rem;
}

.ctm-popup {
    z-index: 999;
    position: fixed;
    top: 50%;
    left: 50%;
    height: 90%;
    transform: translate(-50%, -50%);
}

.ctm-popup__cartel {
    height: 100%;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 0 50px black
}

.ctm-contenido-programa {
    width: 90%;
    margin-left: 5%;
    position: relative;
    top: -5rem;
    padding-top: 2.5rem;
}




.border {
    box-shadow: 0px 0px 0px 2px black;
}

.border-white {
    box-shadow: 0px 0px 0px 1px white;
}

.border-black {
    box-shadow: 0px 0px 0px 1px black;
}

.boton-simple,
.boton-arrow,
.boton-border {
    padding: 0.7rem 2.5rem;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 0.5rem 0.1rem;
    cursor: pointer;
    transition: background-color ease-out 0.3s;
}

.boton-border:hover,
.boton-simple:hover,
.boton-arrow:hover {
    background-color: rgb(245, 190, 30) !important;
}

.boton-border {
    box-shadow: 0px 0px 0px 1px grey;
}

.boton-arrow b::after {
    content: ">>";
    position: absolute;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -ms-transform: translateX(100%);
    opacity: 0;
    transition: all ease-out 0.3s;
}

.boton-arrow:hover b::after {
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    -ms-transform: translateX(50%);
    opacity: 1;
}

.border-round {
    border-radius: 0.5rem;
}

.box-texto {
    position: absolute;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    animation: boxtexto 0.6s ease-out;
}

@keyframes boxtexto {
    from {
        -webkit-transform: translate(-100%, -50%);
        transform: translate(-100%, -50%);
        -ms-transform: translate(-100%, -50%);
    }

    to {
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
    }
}

.box-texto .texto {
    margin-left: 2rem;
    margin-right: 2rem;
}

.box-texto.left {
    left: 0;
}

.box-texto.right {
    right: 0;
}

.aviso {
    width: 100%;
    position: fixed;
    z-index: 999;
    bottom: 0;
    left: 0;
}

.aviso .close {
    position: absolute;
    top: -0.9rem;
    left: 50%;
    width: 1rem;
    height: 1rem;
    border-radius: 1rem;
    padding: 0.3rem;
    cursor: pointer;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.box-margen-05 {
    float: left;
    width: calc(100% - 1rem);
    margin: 0.5rem;
}

.box-margen-10 {
    float: left;
    width: calc(100% - 2rem);
    margin: 1rem;
}

.box-margen-20 {
    float: left;
    width: calc(100% - 4rem);
    margin: 2rem;
}

.box-margen-30 {
    float: left;
    width: calc(100% - 6rem);
    margin: 3rem;
}


.bloque-fondo-parallax {
    overflow: hidden;
}


.bloque-menu {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 900;
}

.bloque-menu .nav {
    height: 6rem;
    transition: height 0.3s;
}

.bloque-menu-responsive .tab,
.bloque-menu .tab {
    position: relative;
    top: 40%;
}

.bloque-menu-responsive .tab::after,
.bloque-menu .tab::after {
    position: absolute;
    top: -10px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    content: "";
    width: 0;
    height: 0;
    border-radius: 6px;
    background-color: rgb(0, 100, 130);
    transition: all 0.2s ease-out;
}

.bloque-menu-responsive .tab::after {
    top: 0.5rem;
    left: 20%;
}

.bloque-menu-responsive .tab.active::after,
.bloque-menu .tab.active::after,
.bloque-menu .tab:hover::after {
    width: 6px;
    height: 6px;
    -webkit-transform: translate(-50%, -3px);
    transform: translate(-50%, -3px);
    -ms-transform: translate(-50%, -3px);
}

.bloque-menu-responsive {
    position: fixed;
    top: 100%;
    left: 0;
    z-index: 800;
    width: 100%;
    height: 100%;
    transition: all 0.3s ease-out;
}

.bloque-menu-responsive nav {
    position: absolute;
    bottom: 7rem;
}

.bloque-logo-responsive {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 700;
}

.burger {
    position: absolute;
    right: 0;
    width: 6rem;
    height: 6rem;
}

.burger svg {
    width: 100%;
    height: 100%;
}

.container {
    float: left;
    width: 100%;
}

.contenido-centrado {
    width: 100%;
    max-width: 76rem;
    margin-left: auto;
    margin-right: auto;
    display: table;
}

.col-12 {
    float: left;
    width: 12%;
    min-height: 1rem;
}

.col-16 {
    float: left;
    width: 16%;
    min-height: 1rem;
}

.col-20 {
    float: left;
    width: 20%;
    min-height: 1rem;
}

.col-25 {
    float: left;
    width: 25%;
    min-height: 1rem;
}

.col-33 {
    float: left;
    width: 33%;
    min-height: 1rem;
}

.col-40 {
    float: left;
    width: 40%;
}

.col-50 {
    float: left;
    width: 50%;
    min-height: 1rem;
}

.col-60 {
    float: left;
    width: 60%;
    min-height: 1rem;
}

.col-67 {
    float: left;
    width: 67%;
    min-height: 1rem;
}

.col-80 {
    float: left;
    width: 80%;
    min-height: 1rem;
}

.col-90 {
    float: left;
    width: 90%;
    min-height: 1rem;
}

.col-100 {
    float: left;
    width: 100%;
    min-height: 1rem;
}

.color-background-azul {
    background-color: #006b96;
}

.color-background-verde {
    background-color: #0d7542;
}

.color-background-amarillo {
    background-color: rgb(255, 220, 0);
}

.color-background-naranja {
    background-color: rgb(245, 190, 30);
}

.color-background-marron {
    background-color: #7F5612;
}

.color-background-morado {
    background-color: #493585;
}

.color-background-rosa {
    background-color: #e84a61;
}

.color-background-rojo {
    background-color: #e4261e;
}

.color-background-blanco {
    background-color: white;
}

.color-background-gris {
    background-color: rgb(240, 240, 240);
}

.color-background-dark {
    background-color: rgb(75, 75, 75);
}

.color-background-blanco-alfa {
    background-color: rgba(255, 255, 255, 0.8);
}

.color-background-negro {
    background-color: black;
}

.color-background-negro-alfa {
    background-color: rgba(0, 0, 0, 0.5);
}

.color-font-negro {
    color: black !important;
}

.color-font-amarillo {
    color: rgb(255, 223, 0) !important;
}

.color-font-naranja {
    color: #f9ae00 !important;
}

.color-font-morado {
    color: #774294;
}

.color-font-rojo {
    color: #e4261e;
}

.color-font-rosa {
    color: #e84a61;
}

.color-font-blanco {
    color: white !important;
}

.color-font-gris {
    color: rgb(200, 200, 200) !important;
}

.color-font-verde {
    color: #0d7542;
}

.color-font-azul {
    color: #006b96 !important;
}

.ficha {
    width: 25rem;
}

.fixed-height {
    position: relative;
    height: calc(76rem * 0.56);
    max-height: calc(100vw * 0.56);
    overflow: hidden;
}

.full-height {
    height: 100%;
}

.height-10 {
    height: 10rem;
}

.height-15 {
    height: 15rem;
}

.height-20 {
    height: 20rem;
}

.img-full-width {
    float: left;
    object-fit: cover;
    width: 100%;
}

.img-cover {
    float: left;
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.img-fondo {
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    height: 100%;
    width: 100%;
    z-index: -99;
}

.img-fondo-parallax {
    float: left;
    position: absolute;
    top: 0;
    object-fit: cover;
    height: 120%;
    width: 100%;
    z-index: -99;
}

.logo {
    width: 20rem;
}

.logo-redes {
    width: 4rem;
    margin-right: 2.5rem;
    margin-top: 1rem;
}

.layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.layer .layer-circulo {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1%;
    height: 1%;
    border-radius: 100%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transition: all 0.3s linear;
}

.layer .layer-texto {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transition: all 0.3s linear;
    opacity: 0;
}

.layer:focus .layer-texto,
.layer:hover .layer-texto {
    opacity: 1;
}

.layer:focus .layer-circulo,
.layer:hover .layer-circulo {
    width: 150%;
    height: 150%;
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

.loading-mask {
    display: initial;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    /*animation: cambiarfondo 4s infinite;*/
}

@keyframes cambiarfondo {
    0% {
        background-color: #e74011;
    }

    50% {
        background-color: #774294;
    }

    100% {
        background-color: #0d7542;
    }
}

.left {
    float: left;
}

.loading-mask #logo {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 15rem;
}

.loading-mask #logo {
    animation: beat 1s ease-in-out infinite;
}

.loading-mask img:nth-of-type(1) {
    -webkit-transform: translate(-50%, -50%) scale(1.05, 1.05);
    transform: translate(-50%, -50%) scale(1.05, 1.05);
    -ms-transform: translate(-50%, -50%) scale(1.05, 1.05);
}


@keyframes beat {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(1.05, 1.05);
        transform: translate(-50%, -50%) scale(1.05, 1.05);
        -ms-transform: translate(-50%, -50%) scale(1.05, 1.05);
    }

    95% {
        -webkit-transform: translate(-50%, -50%) scale(1, 1);
        transform: translate(-50%, -50%) scale(1, 1);
        -ms-transform: translate(-50%, -50%) scale(1, 1);
    }

    100% {
        -webkit-transform: translate(-50%, -50%) scale(1.05, 1.05);
        transform: translate(-50%, -50%) scale(1.05, 1.05);
        -ms-transform: translate(-50%, -50%) scale(1.05, 1.05);
    }
}

.no-display {
    display: none;
}

.menu {
    width: 100%;
    height: 0;
    transition: all 0.3s ease-in;
    overflow: hidden;
}

.menu-content {
    display: none;
}

.margen-05 {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.margen-10 {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.margen-20 {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.margen-25 {
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
}

.margen-35 {
    margin-top: 3.5rem;
    margin-bottom: 3.5rem;
}

.margen-45 {
    margin-top: 4.5rem;
    margin-bottom: 4.5rem;
}

.margen-left-right-00 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.margen-left-05 {
    margin-left: 0.5rem;
}

.margen-left-10 {
    margin-left: 1rem;
}

.margen-left-20 {
    margin-left: 2rem;
}

.margen-left-25 {
    margin-left: 2.5rem;
}

.margen-left-35 {
    margin-left: 3.5rem;
}

.margen-left-45 {
    margin-left: 4.5rem;
}

.margen-right-05 {
    margin-right: 0.5rem;
}

.margen-right-10 {
    margin-right: 1rem;
}

.margen-right-20 {
    margin-right: 2rem;
}

.margen-right-25 {
    margin-right: 2.5rem;
}

.margen-right-35 {
    margin-right: 3.5rem;
}

.margen-right-45 {
    margin-right: 4.5rem;
}

.margen-top-05 {
    margin-top: 0.5rem;
}

.margen-top-10 {
    margin-top: 1rem;
}

.margen-top-20 {
    margin-top: 2rem;
}

.margen-top-25 {
    margin-top: 2.5rem;
}

.margen-top-35 {
    margin-top: 3.5rem;
}

.margen-top-45 {
    margin-top: 4.5rem;
}

.margen-bottom-05 {
    margin-bottom: 0.5rem;
}

.margen-bottom-10 {
    margin-bottom: 1rem;
}

.margen-bottom-20 {
    margin-bottom: 2rem;
}

.margen-bottom-25 {
    margin-bottom: 2.5rem;
}

.margen-bottom-35 {
    margin-bottom: 3.5rem;
}

.margen-bottom-45 {
    margin-bottom: 4.5rem;
}

.mobile-only-display {
    display: none;
}

.pointer {
    cursor: pointer;
}


.popup {
    z-index: 999;
    position: fixed;
    top: 50%;
    left: 50%;
    width: 100%;
    max-width: 76rem;
    height: 90%;
    transform: translate(-50%, -50%);
}

.popup-close {
    position: absolute;
    top: -2rem;
    right: -2rem;
    cursor: pointer;
    font-weight: bold;
}

.popup-fondo {
    z-index: 900;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.pos-relative {
    position: relative;
}

.pos-absolute {
    position: absolute;
}

.pos-centrado {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

.pos-centrado-y {
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.pos-centrado-x {
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.pos-bottom {
    position: absolute;
    bottom: 0;
}

.portada .img-fondo {
    animation: portadafx 10s ease-out;
    -webkit-transform: matrix(1.1, 0, 0, 1.1, 60, 0);
    transform: matrix(1.1, 0, 0, 1.1, 60, 0);
    -ms-transform: matrix(1.1, 0, 0, 1.1, 60, 0);
}

.portada .flecha-abajo {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 3rem;
    animation: portadaflecha 1s ease-out infinite;
    -webkit-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    opacity: 0;
}

@keyframes portadafx {
    from {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
    }

    to {
        -webkit-transform: matrix(1.1, 0, 0, 1.1, 60, 0);
        transform: matrix(1.1, 0, 0, 1.1, 60, 0);
        -ms-transform: matrix(1.1, 0, 0, 1.1, 60, 0);
    }
}

@keyframes portadaflecha {
    0% {
        opacity: 0;
        -webkit-transform: translate(-50%, -20%);
        transform: translate(-50%, -20%);
        -ms-transform: translate(-50%, -20%);
    }

    25% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        -webkit-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%);
        -ms-transform: translate(-50%, 0%);
    }
}

.right {
    float: right;
}

.shadow {
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.15), 0 6px 30px 0 rgba(0, 0, 0, 0.15);
}

.shadow-2 {
    box-shadow: 10px 10px 30px 0 rgba(0, 0, 0, 0.15);
}

.slider-imagenes {
    position: relative;
    width: 100%;
    overflow: initial;
    height: 55vw;
    box-shadow: 0px 0px 0px 1px white;
}

.slider-col-50 {
    height: 45rem;
    width: calc(100% - 1rem);
}

.slider-imagenes__viewport {
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: -webkit-grab;
    position: absolute;
    top: 0;
    left: 0;
}

.slider-imagenes__img {
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%;
}

.slider-imagenes__img:nth-of-type(1) {
    left: 0;
}

.slider-imagenes__flecha {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 4rem;
    cursor: pointer;
}

.slider-imagenes__flecha--left,
.slider-imagenes__flecha--right {
    -moz-transition: all 0.4s;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.slider-imagenes__flecha--left {
    left: 2rem;
}

.slider-imagenes__flecha--right {
    right: 2rem;
}

.slider-imagenes__flecha--left:hover {
    transform: translate(-20%, -50%);
    -ms-transform: translate(-20%, -50%);
}

.slider-imagenes__flecha--right:hover {
    transform: translate(20%, -50%);
    -ms-transform: translate(20%, -50%);
}

.slider-imagenes__content {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.slider-imagenes__dots {
    position: absolute;
    right: 0;
    bottom: -2rem;
}

.slider-imagenes__dot {
    float: left;
    margin-left: 0.5rem;
}

.slider-imagenes__dot--on,
.slider-imagenes__dot--off {
    float: left;
}

.shadow-font-negro {
    text-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.3);
}

.shadow-font-blanco {
    text-shadow: 0 0 0.5rem rgba(255, 255, 255, 0.4);
}

.scrollable-y {
    overflow: auto;
}

.scrollable-x {
    overflow: auto;
}

.tachado {
    text-decoration: line-through;
}

.transition-borde-rosa,
.transition-borde-blanco {
    transition: box-shadow 0.2s;
}

.transition-borde-rosa:hover {
    box-shadow: 0px 0px 0px 3px #e84a61;
}

.transition-borde-blanco:hover {
    box-shadow: 0px 0px 0px 3px white;
}

.transition-opacity {
    opacity: 1;
    transition: opacity 0.2s;
}

.transition-opacity:hover {
    opacity: 0.6;
}

.transition-font-blanco {
    transition: color ease-out 0.3s;
}

.transition-font-blanco:hover {
    color: white !important;
    text-decoration: underline;
}

.transition-font-negro {
    transition: color ease-out 0.3s;
}

.transition-font-negro:hover {
    color: black !important;
}

.transition-bg-negro:hover {
    transition: color ease-out 0.3s;
    background-color: black;
}

.texto-center {
    text-align: center;
}

.texto-justify {
    text-align: justify;
}

.texto-right {
    text-align: right;
}

.texto-espaciado {
    line-height: 1.5rem;
}

.texto-espaciado div {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}

.texto-espaciado a {
    text-decoration: underline;
}

.texto-uppercase {
    text-transform: uppercase;
}

.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    width: 8rem;
    text-align: center;
    border: 1px solid rgb(230, 56, 18) !important;
    background-color: white;
    border-radius: 6px;
    padding: 0.3rem 0.3rem;
    position: absolute;
    z-index: 1;
    bottom: 120%;
    left: 50%;
    margin-left: -4.3rem;
    opacity: 0;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    transform-origin: 50% 0%;
    -ms-transform-origin: 50% 0%;
    -webkit-transform-origin: 50% 100%;
}


.tooltip .tooltiptext:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: white transparent transparent transparent !important;
}

.tooltip .tooltiptext:before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -6px;
    border-width: 6px;
    border-style: solid;
    border-color: rgb(230, 56, 18) transparent transparent transparent !important;
}

.tooltip:hover .tooltiptext {
    opacity: 1;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    -ms-transform: scale(1, 1);
}

.video-cover {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

/* horizontal tablets */
@media screen and (max-width:1050px) {

    #cartel {
        float: left;
    }

    h1,
    .as-h1 {
        font-size: 2.4rem;
    }

    h2,
    .as-h2 {
        font-size: 1.6rem;
    }

    h3,
    .as-h3 {
        font-size: 1.4rem;
    }

    h4,
    .as-h4 {
        font-size: 1.2rem;
    }

    h5,
    .as-h5 {
        font-size: 1.1rem;
    }

    .articulo-img-preview {
        height: calc(100vw * 0.35);
    }

    .md-col-10 {
        float: left;
        width: 10% !important;
    }

    .md-col-14 {
        float: left;
        width: 14.28% !important;
    }

    .md-col-16 {
        float: left;
        width: 16.66% !important;
    }

    .md-col-20 {
        float: left;
        width: 20% !important;
    }

    .md-col-25 {
        float: left;
        width: 25% !important;
    }

    .md-col-33 {
        float: left;
        width: 33.33% !important;
    }

    .md-col-40 {
        float: left;
        width: 40% !important;
    }

    .md-col-50 {
        float: left;
        width: 50% !important;
    }

    .md-col-60 {
        float: left;
        width: 60% !important;
    }

    .md-col-67 {
        float: left;
        width: 66.67% !important;
    }

    .md-col-75 {
        float: left;
        width: 75% !important;
    }

    .md-col-80 {
        float: left;
        width: 80% !important;
    }

    .md-col-100 {
        float: left;
        width: 100% !important;
    }

    .md-no-display {
        display: none;
    }

    .md-only-display {
        display: initial;
    }

    .md-center {
        text-align: center;
    }

    .md-right {
        float: right;
    }

    .md-left {
        float: left;
    }

    .md-texto-left {
        text-align: initial;
    }

    .md-no-margen {
        margin: 0;
    }

    .md-contenido-centrado {
        width: 85% !important;
        margin-left: 7.5% !important;
        margin-right: 7.5% !important;
    }

    .md-height-initial {
        height: initial;
        max-height: initial;
    }

    .md-height-13 {
        height: 13rem;
    }

    .md-height-20 {
        height: 20rem;
    }

    .md-height-30 {
        height: 30rem;
    }

    .md-height-40 {
        height: 40rem;
    }

    .md-height-50 {
        height: 50rem;
    }

    .md-height-60 {
        height: 60rem;
    }

    .md-margen-0 {
        margin-top: 0rem;
        margin-bottom: 0rem;
    }

    .md-margen-05 {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .md-margen-10 {
        margin-top: 1rem;
        margin-bottom: 1rem;
    }

    .md-margen-20 {
        margin-top: 2rem;
        margin-bottom: 2rem;
    }

    .md-margen-25 {
        margin-top: 2.5rem;
        margin-bottom: 2.5rem;
    }

    .md-margen-35 {
        margin-top: 3.5rem;
        margin-bottom: 3.5rem;
    }

    .md-margen-45 {
        margin-top: 4.5rem;
        margin-bottom: 4.5rem;
    }

    .md-margen-left-right-0 {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .md-margen-left-0 {
        margin-left: 0rem;
    }

    .md-margen-left-05 {
        margin-left: 0.5rem;
    }

    .md-margen-left-10 {
        margin-left: 1rem;
    }

    .md-margen-left-20 {
        margin-left: 2rem;
    }

    .md-margen-left-25 {
        margin-left: 2.5rem;
    }

    .md-margen-left-35 {
        margin-left: 3.5rem;
    }

    .md-margen-left-45 {
        margin-left: 4.5rem;
    }

    .md-margen-right-0 {
        margin-right: 0rem;
    }

    .md-margen-right-05 {
        margin-right: 0.5rem;
    }

    .md-margen-right-10 {
        margin-right: 1rem;
    }

    .md-margen-right-20 {
        margin-right: 2rem;
    }

    .md-margen-right-25 {
        margin-right: 2.5rem;
    }

    .md-margen-right-35 {
        margin-right: 3.5rem;
    }

    .md-margen-right-45 {
        margin-right: 4.5rem;
    }

    .md-margen-top-0 {
        margin-top: 0rem;
    }

    .md-margen-top-05 {
        margin-top: 0.5rem;
    }

    .md-margen-top-10 {
        margin-top: 1rem;
    }

    .md-margen-top-20 {
        margin-top: 2rem;
    }

    .md-margen-top-25 {
        margin-top: 2.5rem;
    }

    .md-margen-top-35 {
        margin-top: 3.5rem;
    }

    .md-margen-top-45 {
        margin-top: 4.5rem;
    }

    .md-margen-bottom-0 {
        margin-bottom: 0rem;
    }

    .md-margen-bottom-05 {
        margin-bottom: 0.5rem;
    }

    .md-margen-bottom-10 {
        margin-bottom: 1rem;
    }

    .md-margen-bottom-20 {
        margin-bottom: 2rem;
    }

    .md-margen-bottom-25 {
        margin-bottom: 2.5rem;
    }

    .md-margen-bottom-35 {
        margin-bottom: 3.5rem;
    }

    .md-margen-bottom-45 {
        margin-bottom: 4.5rem;
    }

    .md-pos-relative {
        position: relative;
    }

    .md-pos-absolute {
        position: absolute;
    }

    .md-pos-centrado {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
    }

    .md-pos-centrado-x {
        left: 50%;
        transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        position: relative;
    }

    .md-pos-centrado-y {
        top: 50%;
        transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        position: relative;
    }

    .md-pos-initial {
        position: relative;
        top: initial;
        left: initial;
        transform: initial;
        -ms-transform: initial;

    }

    .slider-col-50 {
        width: 100%;
        height: 55vw;
    }

}

/* vertical tablets y horizontal smartphones */
@media screen and (max-width:800px) {

    .ctm-contenido-programa {
        width: 100%;
        margin-left: 0;
        position: relative;
        top: 0;
        padding-top: 1rem;
    }

    h1,
    .as-h1 {
        font-size: 1.8rem;
    }

    h2,
    .as-h2 {
        font-size: 1.6rem;
    }

    h3,
    .as-h3 {
        font-size: 1.4rem;
    }

    h4,
    .as-h4 {
        font-size: 1.2rem;
    }

    h5,
    .as-h5 {
        font-size: 1rem;
    }

    .logo-redes {
        width: 9%;
        margin-right: 2%;
        margin-left: 2%;
    }

    .burger {
        width: 4rem;
        height: 4rem;
    }

    .ctm-popup {
        width: 90%;
        height: initial;
    }

    .ctm-popup__cartel {
        height: initial;
        width: 100%;
    }

    .sm-col-10 {
        float: left;
        width: 10% !important;
    }

    .sm-col-14 {
        float: left;
        width: 14.28% !important;
    }

    .sm-col-16 {
        float: left;
        width: 16.66% !important;
    }

    .sm-col-20 {
        float: left;
        width: 20% !important;
    }

    .sm-col-25 {
        float: left;
        width: 25% !important;
    }

    .sm-col-33 {
        float: left;
        width: 33.33% !important;
    }

    .sm-col-40 {
        float: left;
        width: 40% !important;
    }

    .sm-col-50 {
        float: left;
        width: 50% !important;
    }

    .sm-col-60 {
        float: left;
        width: 60% !important;
    }

    .sm-col-67 {
        float: left;
        width: 66.67% !important;
    }

    .sm-col-75 {
        float: left;
        width: 75% !important;
    }

    .sm-col-80 {
        float: left;
        width: 80% !important;
    }

    .sm-col-100 {
        float: left;
        width: 100% !important;
    }

    .sm-no-display {
        display: none;
    }

    .sm-center {
        text-align: center;
    }

    .sm-right {
        float: right;
    }

    .sm-left {
        float: left;
    }

    .sm-texto-left {
        text-align: initial;
    }

    .sm-only-display {
        display: initial;
    }

    .sm-no-margen {
        margin: 0;
    }

    .sm-no-padding {
        padding: 0;
    }

    .sm-contenido-centrado {
        width: 90% !important;
        margin-left: 5% !important;
        margin-right: 5% !important;
    }

    .sm-height-initial {
        height: initial;
        max-height: initial;
    }

    .sm-height-13 {
        height: 13rem;
    }

    .sm-height-20 {
        height: 20rem;
    }

    .sm-height-30 {
        height: 30rem;
    }

    .sm-height-40 {
        height: 40rem;
    }

    .sm-height-50 {
        height: 50rem;
    }

    .sm-height-60 {
        height: 60rem;
    }

    .sm-margen-0 {
        margin-top: 0rem;
        margin-bottom: 0rem;
    }

    .sm-margen-05 {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .sm-margen-10 {
        margin-top: 1rem;
        margin-bottom: 1rem;
    }

    .sm-margen-20 {
        margin-top: 2rem;
        margin-bottom: 2rem;
    }

    .sm-margen-25 {
        margin-top: 2.5rem;
        margin-bottom: 2.5rem;
    }

    .sm-margen-35 {
        margin-top: 3.5rem;
        margin-bottom: 3.5rem;
    }

    .sm-margen-45 {
        margin-top: 4.5rem;
        margin-bottom: 4.5rem;
    }

    .sm-margen-left-right-0 {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .sm-margen-left-0 {
        margin-left: 0rem;
    }

    .sm-margen-left-05 {
        margin-left: 0.5rem;
    }

    .sm-margen-left-10 {
        margin-left: 1rem;
    }

    .sm-margen-left-20 {
        margin-left: 2rem;
    }

    .sm-margen-left-25 {
        margin-left: 2.5rem;
    }

    .sm-margen-left-35 {
        margin-left: 3.5rem;
    }

    .sm-margen-left-45 {
        margin-left: 4.5rem;
    }

    .sm-margen-right-0 {
        margin-right: 0rem;
    }

    .sm-margen-right-05 {
        margin-right: 0.5rem;
    }

    .sm-margen-right-10 {
        margin-right: 1rem;
    }

    .sm-margen-right-20 {
        margin-right: 2rem;
    }

    .sm-margen-right-25 {
        margin-right: 2.5rem;
    }

    .sm-margen-right-35 {
        margin-right: 3.5rem;
    }

    .sm-margen-right-45 {
        margin-right: 4.5rem;
    }

    .sm-margen-top-0 {
        margin-top: 0rem;
    }

    .sm-margen-top-05 {
        margin-top: 0.5rem;
    }

    .sm-margen-top-10 {
        margin-top: 1rem;
    }

    .sm-margen-top-20 {
        margin-top: 2rem;
    }

    .sm-margen-top-25 {
        margin-top: 2.5rem;
    }

    .sm-margen-top-35 {
        margin-top: 3.5rem;
    }

    .sm-margen-top-45 {
        margin-top: 4.5rem;
    }

    .sm-margen-bottom-0 {
        margin-bottom: 0rem;
    }

    .sm-margen-bottom-05 {
        margin-bottom: 0.5rem;
    }

    .sm-margen-bottom-10 {
        margin-bottom: 1rem;
    }

    .sm-margen-bottom-20 {
        margin-bottom: 2rem;
    }

    .sm-margen-bottom-25 {
        margin-bottom: 2.5rem;
    }

    .sm-margen-bottom-35 {
        margin-bottom: 3.5rem;
    }

    .sm-margen-bottom-45 {
        margin-bottom: 4.5rem;
    }

    .sm-pos-relative {
        position: relative;
    }

    .sm-pos-absolute {
        position: absolute;
    }

    .sm-pos-centrado {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
    }

    .sm-pos-centrado-x {
        left: 50%;
        transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        position: relative;
    }

    .sm-pos-centrado-y {
        top: 50%;
        transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        position: relative;
    }

    .sm-pos-initial {
        position: relative;
        top: initial;
        left: initial;
        transform: initial;
        -ms-transform: initial;

    }


}

/* vertical moviles */
@media screen and (max-width:500px) {

    .col-20,
    .col-16 {
        width: 48.5%;
    }

}