@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&display=swap');



/* Variables */

:root {
    --azul-oscuro: #003041; /* <--- Al cambiarlo no cambia nada. Está pisado en otros lados*/
    --rosado     : #3F26C9; /*<--- Al cambiarlo no cambia nada. Se pisa en la línea 839*/
    --amarillo   : #f2ed45; /*<--- Al cambiarlo no cambia nada.*/
    --verde      : #d2681a; /*<--- Al cambiarlo no cambia nada.*/
}


/* General */

* {
    margin: 0;
    padding: 0;
}

html {
    overflow-x: hidden;
}

body {
    /*font-family: 'Titillium Web', sans-serif;*/
    color: #3a4848;
    font-family: 'Ubuntu', sans-serif;
}

.contenedor {
    padding: 0 90px;
}

.titulo {
    color        : var(--rosado);
    font-size    : 30px;
    margin-bottom: 15px;
    font-weight  : 700;
}




/* Menu */

nav {
    position           : fixed;
    width              : calc(100% - 180px);
    background-color   : var(--azul-oscuro);
    text-align         : center;
    padding            : 10px 90px;
    z-index            : 9999;
}







/* menu responsive*/

#menu {
    width    : 25px;
    height   : 18px;
    cursor   : pointer;
    display  : none;
    position : absolute;
    z-index  : 9999;
    right    : 90px;
    top      : 50%;
    transform: translateY(-50%);
}

.bar {
    height          : 2px;
    width           : 90%;
    background-color: var(--azul-oscuro);
    display         : block;
    border-radius   : 5px;
    transition      : 0.3s ease;
}

#menu .bar:nth-child(2) {
    margin: 6px 0;
}

.abrirMenu {
    left      : 0 !important;
    background: rgba(0, 0, 0, .85);
    height    : 100vh;
    width     : 100%;
    top       : 0;
    transition: .3s all;
}


/* logo */

nav img:nth-child(1) {
    width     : 500px;
    transition: .3s all;
}


/* imagenes de fondo en el menu */

#imgMenu {
    overflow: hidden;
    position: absolute;
    top     : 0;
    left    : 0;
    width   : 100%;
}

nav img:nth-child(3) {
    position: absolute;
    z-index: -1;
    width: 450px;
}


/* imagen de la izquierda */

nav img:nth-child(3) {
    top: -85%;
    left: -10%;
    transform: rotate(180deg);
}

nav ul {
    margin-top: 20px;
}

nav ul li {
    display: inline-block;
    margin: 0 2px;
    padding: 0 5px 10px 5px;
}

nav ul li a,
nav ul li span {
    color: white;
    /*color:  rgba(100, 161, 135, 1);*/
    text-decoration: none;
    transition: .3s all;
}

nav ul li a:hover {
    color: var(--amarillo);
}

.linkActivo {
    border-bottom: 1px solid var(--amarillo);
}

.linkActivo a {
    color: var(--amarillo);
}

.logoReducido {
    width: 130px !important;
}

nav ul li span {
    cursor: pointer;
}

nav ul li span img {
    width: 15px !important;
    transform: translateY(3px);
    margin-left: 5px;
    filter: brightness(0) invert(1);
}

.desplegable {
    position: relative;
}

.desplegableItem {
    position: absolute;
    /*background-color: var(--rosado);*/
    background-color: #112728;/*<--- Acá define color de opciones en posiciones pares de los menú desplegables*/
    z-index: 9999;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, .5);
    display: none;
    width: 120%;
}

.desplegableItem ul {
    margin-top: 0;
}

.desplegableItem ul li {
    display: block;
    margin: 0;
    padding: 10px 5px;
    font-size: 14px;
}

.desplegableItem ul li:nth-child(2n+1) {
    background-color: #112728; /*<--- Acá define color de opciones en posiciones impares de los menú desplegables*/
}

.desplegable:hover span {
    color: #8bc378 /*<--- Cambia el color con el que aparece el título del menú desplegable al posicionar el mouse encima*/
}

.desplegableItem ul li:hover {
    background-color: #8bc378;/*<--- Cambia el color con el que aparece ítem del menú desplegable al posicionar el mouse encima*/
}

.desplegable:hover span img {
    filter: brightness(0) saturate(100%) invert(67%) sepia(12%) saturate(1124%) hue-rotate(60deg) brightness(103%) contrast(93%); /*<--- Acá se cambia el color de la flecha. OJO, es un svg"*/

}
.menuAbierto {
    display: block !important;
}


/*seccion Bienvenidos*/

.contenedorIndex article:nth-of-type(2) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 100px;
    align-items: center;
}

.contenedorIndex article:nth-of-type(2) div:nth-child(2) {
    padding-right: 100px;
    /*border-left: 25px solid var(--amarillo);*/
    border-left: 25px solid #8bc378; /*<--- Cambia color de la barra izquierda del Tema Central*/
    padding-left: 20px;
    position: relative;
}

.contenedorIndex article:nth-of-type(2) div:nth-child(2)::after {
    content: "";
    position: absolute;
    height: 100%;
    width: 190px;
    /*background-color: var(--amarillo);*/
    background-color: #8bc378; /*<--- Cambia color de la barra derecha del Tema Central*/
    top: 0;
    left: calc(100% - 100px);
}

.contenedorIndex article:nth-of-type(2) div:nth-child(1) p {
    font-weight: normal;
}

.contenedorIndex article:nth-of-type(2) div:nth-child(2) p:nth-child(1) {
    color: var(--verde);
    font-weight: 700;
    font-size: 20px;
    position: relative;
    padding-bottom: 5px;
    margin-bottom: 25px;
}

.contenedorIndex article:nth-of-type(2) div:nth-child(2) p:nth-child(1)::after {
    content: "";
    position: absolute;
    left: 0;
    top: 100%;
    width: 50px;
    height: 2px;
    background-color: var(--rosado);
}

.contenedorIndex article:nth-of-type(2) div:nth-child(2) p:nth-child(3) {
    font-weight: 700;
    font-size: 18px;
    line-height: 25px;
    margin-top: 10px;
}

#masInfo,
#proxEventos {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 100px;
}

.contenedorIndex article:nth-of-type(2),
.contenedorIndex article:nth-of-type(3) {
    padding: 40px 90px;
}

.contenedorIndex article:nth-of-type(3) {
   /* background-color: var(--verde);*/
    background-color: #f2c765;/*<--- Al cambiarlo no cambia nada.*/
    color: white;
}

#proxEventos div {
    display: flex;
}

#proxEventos div img {
    width: 40px;
    margin-right: 10px;
    margin-bottom: 5px;
}

.contenedorProxEventos {
    display: flex;
    align-items: center;
}
.contenedorProxEventos span{
    font-size: .9rem;
}
.contenedorProxEventos div {
    display: flex;
    flex-direction: column;
    margin-right: 20px;
}

.actividades{
    margin-top: 30px;
}

/* cronograma */

#tituloPrograma {
    margin-top: 40px;
}

#contenedorFechas {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    width: 50%;
}

#contenedorFechas img {
    position: absolute;
    width: 700px;
    top: 5vh;
    left: -5%;
    z-index: -1;
    opacity: .2;
}

.unaFecha {
    display: grid;
    text-align: center;
    border: 2px solid var(--verde);
    border-radius: 5px;
    color: var(--verde);
    width: 80px;
    height: 80px;
    grid-template-rows: 30% 70%;
    align-items: center;
    cursor: pointer;
    transition: .3s all;
    padding: 5px;
    background-color: white;
}

.instituto {
    display: grid;
    text-align: center;
    border: 2px solid var(--verde);
    border-radius: 5px;
    color: var(--verde);
    width: 80px;
    grid-template-rows: 30% 70%;
    cursor: pointer;
    transition: .3s all;
    padding: 5px;
    background-color: white;
}



.unaFecha:hover {
    transform: scale(1.1);
}

.instituto:hover {
    transform: scale(1.1);
}

.fechaElegida {
    background-color: var(--verde) !important;
    color: white !important;
}

.unaFecha span:nth-child(2) {
    font-size: 35px;
    border-top: 1px solid var(--verde);
}

.fechaElegida span:nth-child(2) {
    border-top: 1px solid white;
}

.fechaCompleta {
    color        : var(--color-tit);
    font-size    : 22px;
    margin-bottom: 20px;
}

.contenidoActividad {
    margin: 60px 0;
}

.unaActividad {
    padding: 15px;
    display: grid;
    grid-template-columns: 5% 8% 87%;
    align-items: center;
    background-color: white;/*<--- Acá define el color de fondo de las actividades del programa que están en posiciones pares*/
}

.unaActividad:nth-child(2n+1) {
    background-color: #fff; /*<--- Acá define el color de fondo de las actividades del programa que están en posiciones impares*/
}

.unaActividad img {
    width: 30px;
    margin: 0 auto;
    filter: brightness(0) saturate(100%) invert(67%) sepia(12%) saturate(1124%) hue-rotate(60deg) brightness(103%) contrast(93%); 

}

.unaActividad span {
    font-size: 16px;
    color: #5d5fa6 !important; /*<--- Acá define el color de los títulos de las actividades de la sección Programa*/
}
.unaActividad .color,
.unaActividad .hora{
    color: #3a4848 !important /*<--- Acá define el color de los textos y horas de las actividades de la sección Programa*/
}

.unaActividad .btn{
    background-color: #8bc378 !important; /*<--- Acá define el color de fondo de los botones de las actividades de la sección Programa*/
    border:  1px solid #8bc378; /*<--- Acá define el color del borde de los botones de las actividades de la sección Programa*/
    margin-right: 10px;
}

.unaActividad .negrita {
    font-weight: 700;
}
.proyecto-titulo {
    font-weight: 700;
    color: #2cb3ad !important;
}

/* concurso videos 180 segundos*/

.concursoVideos,
.proyectosCovid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 50px;
}

#infoConcursoVideo,
#imgConcursoVideo,
.proyectosCovid div:nth-child(1),
.proyectosCovid div:nth-child(2) {
    margin: 50px 0;
}

#btnConcursoVideo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    justify-items: center;
    margin-top: 20px;
}

.concursoVideos .titulo {
    line-height: 35px;
}

.concursoVideos p:nth-last-child(1) {
    font-size: 20px;
    margin-top: 17px;
}

#basesCompletas {
    display: flex;
    border: 1px solid var(--verde);
    padding: 8px;
    border-radius: 8px;
    text-decoration: none;
    color: var(--verde);
    align-items: center;
    height: 25px;
    width: 180px;
    justify-content: center;
    transition: .3s all;
}

#fechaOculta {
    display: none;
}

#basesCompletas:hover {
    background-color: var(--verde);
    color: white;
}

#basesCompletas:hover img {
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
}

#basesCompletas img {
    width: 20px;
    margin-left: 10px;
}

.concursoVideos div img {
    max-width: 100%;
    /*min-height: auto !important;*/
}

#logoProyecto180 {
    animation: logoProyecto180 1.2s linear infinite;
}

#reglas {
    font-weight: 700;
}


/* Proyecto covid */

#videosProyectoCovid {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 30px;
}

@keyframes logoProyecto180 {
    0% {
        transform: scale(1);
    }
    25% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    75% {
        transform: scale(1);
    }
    100% {
        transform: scale(1);
    }
}


/* proyecto covid*/

.proyectosCovid {
    justify-items: center;
}

.proyectosCovid p:nth-child(3) {
    margin: 20px 0;
}

.proyectosCovid a {
    font-weight: 700;
    color: var(--azul-oscuro);
    text-decoration: none;
}

.proyectosCovid a:hover {
    text-decoration: underline;
}

.proyectosCovid img {
    height: 400px;
    max-width: 100%;
}


/*  footer */

footer {
    display: flex;
    justify-content: space-between;
    /*background-color: var(--azul-oscuro);*/
    background-color: rgba(241, 195, 92, 1.0);
    padding: 60px 90px;
    position: relative;
    overflow: hidden;
    align-items: center;
}

#footerBg {
    position: absolute;
    left: -15%;
    top: -130px;
    width: 700px;
    opacity: .5;
}

#instagram,
#youtube {
    width: 55px;
    position: relative;
    z-index: 1;
}

#youtube {
    margin-left: 10px;
}

#variosLogos {
    width: 900px;
    position: relative;
    z-index: 1;
}


/* premiacion*/

.premiacion .titulo {
    line-height: 25px;
    margin: 50px 0;
}

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

.premiacion section {
    margin-bottom: 50px;
}

.premiacion p span {
    font-size: 20px;
}

#primeraLinea {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 100px;
    margin-top: 75px;
}

#primeraLinea article {
    position: relative;
}

.subtituloPrimeraLinea {
    position: absolute;
    top: -40px;
    width: 250%;
}

.subtituloPremio {
    color: var(--verde);
}

.contenedorPremiacion {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 100px;
}

.subtitulo {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
}






/* Efecto para Galeria de fotos */

.grid {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    height: auto;
    width: 100%;
    margin: 0 auto;
}

.grid .item {
    white-space: nowrap;
    overflow: hidden;
    display: inline-flex;
}

.grid.x-3 .item {
    width: 33.3%;
    flex: 0 0 33.3%;
}

.grid .item img {
    width: 100%;
    height: auto;
}


/*FIX IMAGENES */

#imgConcursoVideo {
    width: 100%;
}

.fotos .item {
    width: 33.3332%;
    float: left;
    position: relative;
}

.fotos .item figure {
    width: 100%;
    height: 0;
    position: relative;
    padding-top: 75%;
}

.fotos .item figure img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
}

#primerContenidoIndex {
    padding-top: 152px !important;
}

#primerContenido {
    padding-top: 110px !important;
}

#primerContenido.pt-0{
    padding-top: 0 !important;
}
    #primerContenido.pt-0 div{
        margin:  0;
    }




#contenedorVideo {
    padding-top: 40%;
    height: 0;
    position: relative;
}

#contenedorVideo video {
    width: 100%;
    height: 100%;
   /* object-fit: cover;*/
    position: absolute;
    left: 0;
    top: 0;
}

#contenedorVideo iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 0;
    padding:  0;
}


/* proyectos*/

.paginaProyectos .titulo {
    margin-top: 30px;
}

#contenedorProyectos {
    margin-top: 50px;
}

#contenedorProyectos article {
    margin: 80px 0;
} 

.tituloProyecto {
    color: var(--verde);
    font-size: 20px;
    margin: 10px 0;
    font-weight: 600;
}

.txtProyecto {
    margin-bottom: 30px;
}

#contenedorProyectos article a {
    color: white;
    padding: 12px 24px;
    border-radius: 5px;
    background-color: var(--rosado);
    text-decoration: none;
    border: 1px solid var(--rosado);
    transition: .3s all;
}

#contenedorProyectos article a:hover {
    background-color: white;
    color: var(--rosado);
}


/********************************/









/* FIX 2021 */
:root {
    --color-tit  : #5d5fa6; /*<--- Acá define color de títulos principales y fecha de Programa*/
    --color-tit-2: #2cb3ad; /*<--- Al cambiarlo no cambia nada.*/
    --azul-oscuro: #3a4848; /*<--- Acá define el color de la letra (excepto para Programa)*/
    --gris       : #4D4D4D; /*<--- Al cambiarlo no cambia nada.*/
    --rosado     : #8bc378; /*<--- Cambia la línea de color debajo del título Tema central en el index*/
    --verde      : #8bc378; /*<--- Acá define color de títulos los botones de Más Información de Actividades (excepto el título principal) y los calendarios de Programa*/
}




/* tit */
.titulo.fix-color{
    color: var(--color-tit);
}
.titulo.fix-color-2{
    color: var(--color-tit);
}

.contenedorIndex article:nth-of-type(2) div:nth-child(2) p:nth-child(1){
    color: var(--color-tit);
}



/* btn */
.btn{
    width           : 130px;
    float           : left;
    padding         : 5px 10px;
    box-sizing      : border-box;
    color           : #fff; /*<--- Acá define el color de letra de los botones de la sección Programa*/
    background-color: var(--gris);
    border          : 1px solid var(--gris);
    text-decoration : none;
    text-align      : center;
    border-radius   : 5px;
    margin-top      : 10px;
    position        : relative;
}

    .btn:hover{
        opacity: .5;
    }

    .btn.fix{
        width: auto;
    }


.btn-2{
    background-color: var(--verde) !important;
    border: 1px solid  var(--verde) !important;
}

    .btn-2:hover{
        background-color: #fff !important;
        color: var(--verde) !important;
    }


/* cabezal */
nav{
    background-color: #112728; /* <--- El color del header lo toma de acá*/
    background-image: none;
   
}

    nav ul li a, 
    nav ul li span{
        color: #fff; /*<--- Acá define el color de los títulos del encabezado*/
        font-weight: 600;
        font-size: .9rem;
    }
    nav ul li a:hover, 
    nav ul li span:hover{
        color: #8bc378; /*<--- Acá define el color de los títulos de menú (excepto menú desplegable) al posicionar el mouse encima*/
    }

    .desplegableItem a{
        color: #fff !important; /*<--- Acá define el color del texto de las opciones del menú desplegable */
    }

    .linkActivo{
        border-bottom: 1px solid #8bc378; /*<--- Acá define el color de la barra del botón de menú del header de la sección en la que estoy posicionado*/
    }
    .linkActivo a{
        color: #8bc378; /*<--- Acá define el color del texto del botón de menú del header de la sección en la que estoy posicionado*/
    }


    

    /* logo */
    #logo{
        max-width: 180px ;
        max-height: 180px;
    }

    /* menu */
    nav div{
        z-index     : 980;
    }

    /* fondo */
    nav section{
        position: absolute;
        z-index : -1;
        width   : 100%;
        height  : 100%;
        top     :  0;
        left    : 0;
    }

    nav section:before,
    nav section:after{
        content          : '';
        position         : absolute;
        top              : 0;
        bottom           : 0;
        height           : 100%;
        width            : 100%;
        background-size  : contain;
        background-repeat: no-repeat;
    }

    nav section:before{
        background-image   : url(img/header-before.png);
        left               : 0;
        background-position: left;
    }
    nav section:after{
        background-image   : url(img/header-after.png);
        right              : 0;
        background-position: right;
    }

    .menuScrolled section:before{
        background-image   : url(img/header-before-scroll.png);
    }
    .menuScrolled section:after{
        background-image   : url(img/header-after-scroll.png);
    }




/* prox eventos */
.contenedorProxEventos *{
    color      : #4b5462;
    font-weight: 600;
}



/* footer */
footer{
    background-color: #112728; /*<--- Acá define el color de fondo del footer */
    justify-content: space-around;
    padding: 0;
    width: 100%;

}

    footer img{
        width: auto;
        max-width: 100%;
    }



    


    .redes{
        position: relative;
        width   : 50%;
        float   : left;

        display: flex;
        align-items: center;
        justify-content: center;
    }

        .redes section{
            position : absolute;
            z-index  : 900;
            margin   : auto;
            transform: translateX(101%) translateY(9px);
            top: 0;
            bottom: 0;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        

    


    .logos{

        width: 50%;
        float: left;
        display         : flex;
        align-items     : center;
        justify-content : center;
        background-color: #112728;
        flex-direction: column;
        background-image: url('img/Footer der.png');
        background-size: contain;
  
    }





.sec-video{
    width     : 100%;
    overflow  : hidden;
    box-sizing: border-box;
    margin-top: 60px;
}


    .sec-video .video,
    .sec-videos .contenedor .random-video{
        width        : 100%;
        height       : 0;
        padding-top  : 56.25%;
        position     : relative;
        overflow     : hidden;
        box-sizing   : border-box;
        margin-bottom: 0;
    }
    .sec-video iframe,
    .sec-videos .contenedor iframe{
        position: absolute;
        top     : 0;
        left    : 0;
        width   : 100%;
        height  : 100%;
    }

    .sec-videos{
        margin-top   : 0;
        width        : 100%;
        margin-bottom: 60px;
    }

    .sec-videos .contenedor{
        /*display              : grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        column-gap           : 30px;*/
        align-items          : center;
        overflow: hidden;
        position: relative;
    }
    .sec-video .contenedor{
        display              : grid;
        grid-template-columns: 1fr 1fr;
        column-gap           : 30px;
        align-items          : center;
    }


    .video.random-video{
        margin-bottom: 30px;
    }



/* premiacion */
.row-tab{
    width: 100%;
    float: left;
    margin-bottom: 60px;
}


/* #TAB's */
.tabs{
    width: 100%;
    float: left;
    margin-bottom: 40px
}
    
    /* link */
    .tab-link{
        width       : auto;
        opacity     : 1;
        cursor      : pointer;
        list-style  : none;
        float       : left;
        cursor      : pointer !important;
        margin-right: 80px;
        opacity: .6;

    }


        .tab-link img{
            height    : 130px;
            transition: all .3s ease;
            image-rendering: -webkit-optimize-contrast;
        }

        .tab-link:hover img,
        .tab-link.activo img{
            transform: scale(1.35);
            opacity: 1;
        }






    
    /* content */
    .tab-content{
        width     : 100%;
        visibility: hidden;
        opacity   : 0;
        height    : 0;
        padding   : 0 5px;
        margin    : 0;
        float     : left;
    }

        .tab-content .col-left{
            width  : 35%;
            display: inline-block;
            float  : left;
        }

        .tab-content .col-right{
            width  : 60%;
            display: inline-block;
            float  : right;
        }

            .tab-content section{
                margin-bottom: 15px;
                width: 100%;
                float: left;
            }
            .tab-content .col-right article{
                width  : 49%;
                float  : left;
            }
            .tab-content .col-right article:nth-of-type(1){
                padding-right: 15px;
                box-sizing: border-box;
            }
            .tab-content .col-right article:nth-of-type(2){
                left: 15px;
                box-sizing: border-box;
            }


        .tab-content header{
            width        : 100%;
            margin-bottom: 30px;
        }

            .tab-content header h4{
                color    :  var(--rosado);
                font-size: 1.5rem;
            }
        

        .tab-content article{
            margin-bottom: 15px;
        }

        .tab-content .subtituloPremio{
            margin-bottom: 5px;
            font-weight  : 600;
        }


    /* hover - activo */
    .tab-link:hover,
    .tab-link.activo{
        opacity: 1 !important;
        color  : red !important
    }

    .tab-content.activo{
        opacity   : 1;
        visibility: visible;
        height    : auto;
    }






.menuScrolled {
    display        : flex;
    justify-content: center;
    align-items    : center;
}

nav.menuScrolled{
    height: 83px;
}

    .menuScrolled .logo{
        
        margin-right: 25px;
    }
        .menuScrolled .logo #logo {
            width: 130px !important;
        }

    nav.menuScrolled div{
        margin-right: 0;
    }





body{
    overflow: hidden;
}

.owl-carousel, 
.owl-carousel .owl-stage-outer, 
.owl-carousel .owl-stage, 
.owl-carousel .owl-item,
.owl-carousel .item,
.owl-carousel .item-video{
    height: 100%;
}

    .sec-videos .owl-carousel{
        padding:  0 40px;
        box-sizing: border-box;
    }
    
    /* video */
    .owl-carousel .owl-video{
        position: absolute;
        left    : 0;
        top     : 0;
        height  : 100%
    }
    .owl-carousel .owl-video-wrapper{
        position: absolute;
        width   : 100%;
        top     : 0
    }

    .owl-controls,
    .owl-dots{
        display:none;
    }

    /* nav's */
    .prev,
    .next{ 
        position           : absolute;
        top                : 0;
        width              : 19px;
        height             : 100%;
        font-size          : 0;
        z-index            : 907;
        cursor             : pointer;
        display            : flex;
        align-items        : center;
        background-position: center;
        background-repeat  : no-repeat;
        background-size    : contain;
        transform          : translateY(0);
    }

    .prev{
        background-image: url(img/prev.svg);
        left            : 90px;
    }
    .next{
        background-image: url(img/next.svg);
        right           : 90px
    }

    .disabled,
    .disabled:hover{
        opacity: .3 !important;
        cursor : default !important;
    }
    
        /* hover */
        .prev:hover,
        .next:hover{
            opacity: .7
        }

    /* dots */
    .owl-dots{
        position  : absolute;
        width     : 100%;
        height    : 20px;
        bottom    : 15px;
        right     : 30px;
        margin    : auto;
        text-align: center;
        z-index   : 9090
    }
    .owl-dots{
        width     : 100%;
        text-align: center
    }

        .owl-dot{
            width     : 13px;
            height    : 13px;
            float     : left;
            margin    : 0 6px;
            background: #000;
            transition: ease-in 0.4s;
            float     : none;
            display   : inline-block
        }

        /* activo */
        .owl-dot.active{
            background: #DA251C
        }

/* responsive */

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



    /* logo */
    #logo{
        height: 30%;
        width: 30%;
    }



    /* menú */
    nav ul li a, nav ul li span{
        font-size: .9rem;
    }

    .menuScrolled nav ul li{
        margin: 0;
    }

    .menuScrolled section{
        opacity: 1;
    }

    nav.menuScrolled .logo{
        
    }
    nav.menuScrolled div{
        /*margin-right: 0;*/
    }

    /* video */
    #contenedorVideo {
        padding-top: 45%;
    }

    /* redes */
    .redes section{
        transform: translateX(101%) translateY(6px)
    }

    #instagram, #youtube{
        width: 35px;
    }

    #variosLogos{
        width: 240px;
    }



    .tab-link{
        margin-right: 50px;
    }

        .tab-link img{
            height:110px;
        }





}




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

    nav section,
    .menuScrolled section{
        opacity: 0;
    }
    nav.menuScrolled .logo{
        
    }
    nav.menuScrolled div{
        margin-right: 0;
    }

    #primerContenidoIndex{
        padding-top: 100px !important;
    }

}




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

    /* menu */
    nav {
        overflow: initial;
        padding: 10px 90px 10px 90px;
        background-repeat: no-repeat;
        background-size: cover;
    }
    nav img:nth-child(3),
    nav img:nth-child(4) {
        display: none;
    }


    #primerContenido,
    #primerContenidoIndex {
       
    }
    .menuScrolled {
        align-items: center;
    }
    #ulMenu {
        position: absolute;
        right: -500%;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 0;
        padding-top: 50px;
    }
    .desplegableItem {
        background-color: #000;
        overflow-y: scroll;
        height: auto;
        width: 1000px;
    }
    #desplegablePrograma {
        z-index: 2;
    }
    #desplegableEdicionesAnteriores {
        z-index: 1;
    }
    .desplegableItem ul li {
        background-color: rgba(0, 0, 0, .3);

    }
    .desplegableItem ul li:nth-child(2n+1) {
        background-color: rgba(0, 0, 0, .5);
    }
    #ulMenu li {
        margin: 10px 0;
    }
    #menu {
        display: block;
    }
    .contenedorIndex article:nth-of-type(2) {
        grid-template-columns: 1fr;
        row-gap: 50px;
    }
    .contenedorIndex article:nth-of-type(2) div:nth-child(2) {
        border-right: 25px solid var(--verde);
        padding-right: 0;
    }
    .contenedorIndex article:nth-of-type(2) div:nth-child(2)::after {
        display: none;
    }
    #masInfo,
    #proxEventos {
        grid-template-columns: 1fr;
        row-gap: 50px;
    }
    #contenedorFechas {
        width: 100%;
        justify-items: center;
    }
    .unaActividad {
        grid-template-columns: 8% 13% 79%;
    }
    .concursoVideos,
    .proyectosCovid {
        grid-template-columns: 1fr;
        justify-items: center;
    }
    .concursoVideos div div {
        justify-items: center;
    }
    .subtitulo {
        font-size: 16px;
    }
    #contenedorTitulos {
        column-gap: 30px;
    }
    #infoConcursoVideo {
        order: 1;
    }
    .concursoVideos p:nth-last-child(1) {
        order: 2;
        top: 0;
        margin: 0;
    }
    #imgConcursoVideo {
        order: 3;
    }
    .contenedorPremiacion {
        grid-template-columns: 1fr 1fr;
        row-gap: 50px;
    }
    #primeraLinea {
        grid-template-columns: 1fr 1fr;
        row-gap: 75px;
    }
    #primeraLinea article:nth-of-type(3) {
        order: 2;
    }
    #primeraLinea article:nth-of-type(2) {
        order: 1;
    }
    #primeraLinea article:nth-of-type(1) {
        order: 3;
    }


    nav section{
        display: none;
    }
    
    nav ul li a, 
    nav ul li span{
        color: #fff !important;
    }

    .linkActivo a{
        color: var(--color-tit) !important;
    }

    nav.menuScrolled .logo{
       left:  auto;
    }
    nav.menuScrolled div{
       margin-right: inherit;
    }

    .menuScrolled{
        justify-content: inherit;
    }



    footer{
        padding:  0 !important;
        display: block;
        width: 100%;
    }

    .redes{
        width: 100%;
    }

    .logos{
        width: 100%;
        padding:  40px 0;
    }

        .logos img{
            width: 220px;
        }

    #variosLogos{
        width: 290px;
    }

    #instagram, #youtube{
        width: 30px !important;
    }





    .tab-content .col-left,
    .tab-content .col-right,
    .tab-content .col-left article,
    .tab-content .col-right article{
        width: 100%;
        padding:  0;
    }

    .sec-video .contenedor{
        display: block;
    }

        .sec-video .contenedor .video{
            margin-bottom: 15px;
        }

    .sec-videos .contenedor{
        grid-template-columns: 1fr 1fr;
    }

        .sec-video .video, .sec-videos .contenedor div{
            margin-bottom: 0;
        }


    .tab-link{
        margin-right: 30px;
    }

        .tab-link img{
            height:90px;
        }


    .sec-videos .owl-carousel{
        padding:  0 25px;
        box-sizing: border-box;
    }

        .prev{
            width: 15px;
            left:  30px;
        }
        .next{
            width: 15px;
            right: 30px;
        }
    .item,
    .random-video{
        margin-bottom: 0;
    }

}




@media screen and (max-width: 600px) {
    nav {
        padding: 10px 30px 10px 30px;
        width: calc(100% - 60px);
    }
    .contenedor {
        padding: 0 30px;
    }
    .contenedorIndex article:nth-of-type(2),
    .contenedorIndex article:nth-of-type(3),
    .contenedorIndex article:nth-of-type(4) {
        padding: 40px 30px;
    }
    #menu {
        right: 30px;
    }
    #contenedorFechas img {
        display: none;
    }
    .unaActividad {
        grid-template-columns: 9% 17% 74%;
    }
   

    #primeraLinea,
    .contenedorPremiacion {
        column-gap: 30px;
    }


}





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



    #contenedorFechas {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .contenedor {
        padding: 0 15px;
    }
    nav {
        padding: 10px 15px 10px 15px;
        width: calc(100% - 30px);
    }
    #menu {
        right: 15px;
    }
   



    .titulo {
        font-size: 25px;
    }
    .contenedorIndex article:nth-of-type(2),
    .contenedorIndex article:nth-of-type(3),
    .contenedorIndex article:nth-of-type(4) {
        padding: 40px 15px;
    }
    #fechaOculta {
        display: block;
    }
    .concursoVideos p:nth-last-child(1) {
        order: 2
    }
    #basesCompletas {
        order: 3;
    }
    .unaActividad {
        grid-template-columns: 1fr;
        justify-items: center;
        row-gap: 5px;
    }
    #btnConcursoVideo {
        grid-template-columns: 1fr;
        row-gap: 50px;
    }
    #instagram,
    #youtube {
        width: 40px;
    }
    #variosLogos {
        width: 200px;
    }
    .subtituloPrimeraLinea {
        width: 215%;
    }
    .subtituloPrimeraLinea {
        top: -50px;
    }
    #primerSubtitulo {
        top: -30px;
    }
    .unaFecha {
        margin-bottom: 30px;
    }
    #contenedorProyectos article iframe {
        width: 100% !important;
    }


    .logos{
        padding:  20px 0;
    }

        .logos img{
            width: 200px;
        }


}





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

    .unaFecha {
        width: 65px;
        height: 65px;
    }
    
    #primeraLinea,
    .contenedorPremiacion {
        grid-template-columns: 1fr;
    }
    
    .subtituloPrimeraLinea {
        width: 100%;
    }
    #primeraLinea {
        row-gap: 20px;
    }
    #primeraLinea article:nth-of-type(1) {
        margin-top: 90px;
    }
    .titulo {
        font-size: 20px;
    }
    .unaFecha span:nth-child(2) {
        border: none;
    }

}