
/* Header */

header .fullscreen-bg {
    width : 100%;
    height : 100vh;
}

header .fullscreen-bg video {
    position : absolute;
    bottom : 50%;
    left : 50%;
    -webkit-transform: translate(-50%, 50%);
       -moz-transform: translate(-50%, 50%);
        -ms-transform: translate(-50%, 50%);
        transform: translate(-50%, 50%);
    z-index : -100;
    overflow: hidden;
}

@media (max-aspect-ratio: 16/9) {
    header .fullscreen-bg video { 
        width : auto;
        height : 100vh;
    }
}

@media (min-aspect-ratio: 16/9) {
    header .fullscreen-bg video {
        width :102%;
        height : auto;
    }
}

@media (max-width: 767px) {
    header .fullscreen-bg {
        background: url('../img/common/fallback_mobile.jpg') center center / cover no-repeat;
    }

    header .fullscreen-bg video {
        display: none;
    }
}

header .content {
    position: absolute;
    top: 80px;
    width: 100%;
    height : calc(100% - 80px);
    color : rgba(255,255,255,1);
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
}

header .content div:nth-child(1) {
    font-size : 1.25rem;
}

header .content div:nth-child(2) {
    font-size : 2.0rem;
}

header .content div:nth-child(2) span {
    display : initial;
}

@media (min-width : 450px) {
    header .content div:nth-child(2) span {
        display : block;
    }
}

header .content div:nth-child(3) {
    font-size : 1.00rem;
    font-weight: 400;
}

/*header .content .pill-btn {
    font-family : 'Roboto Condensed', sans-serif;
}*/

/* Header - End */


/* Main - Eventos */

.eventos .container-xl {
    padding-top : 2rem;
}

.eventos .title {
    border-top : solid 5px rgba(2,156,73,1);
    padding-top : 20px;
    padding-bottom : 20px;
    color : rgba(2,156,73,1);
    font-size : 1.75rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
}

.eventos .left-col {
    position : relative;
}

.eventos .left-col > div {
    position: absolute;
    top : 12%;
    left : 8%;
    right : 8%;
    font-size : 1.50rem;
    font-weight : bold;
    font-family : 'Montserrat', sans-serif;
    color : rgba(2,156,73,1);
    text-transform : uppercase;
}

.eventos .left-col .event-type {
    font-weight : normal;
    font-style : italic;
}

.eventos .left-col .event-action {
    position: absolute;
    top: calc(50% - 20px);
    right: 0%;
    left : auto;
    font-size: 1.25rem;
    font-weight: bold;
    font-family: 'Montserrat', sans-serif;
    color: rgba(255,255,255,1);
    text-transform: uppercase;
    background-color : rgba(2,156,73,1);
    display : inline-block;
    padding : 8px 64px 8px 16px;
}

.eventos .fila-evento {
    padding-top: 16px;
    padding-bottom: 16px;
    border-bottom: solid 1px rgba(2,156,73,1);
}

.eventos .fila-evento .fecha {
    color : rgba(0,0,0,1);
    font-size : 1.75rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
    text-transform: lowercase;
    width : 130px;
    min-width : 130px;
}

.eventos .fila-evento .fecha .gratis {
    text-align : center;
    background-color : rgba(133,196,65,1);
    color : rgba(255,255,255,1);
    font-size : 0.75rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    padding : 2px 8px;
}

.eventos .fila-evento .descripcion {
    color : rgba(0,0,0,1);
    font-style: italic;
    font-size : 1.375rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
}

.eventos .fila-evento .descripcion span:nth-child(2) {
    font-weight: 300;
    display : block;
}

.eventos .fila-evento .link a {
    color : rgba(2,156,73,1);
    font-size : 1.50rem;
    width : 25px;
}
/* Main - Eventos - END */


/* Main - Reels */
.reels {
    /* background-color : rgba(35,31,32,1); */
    background-image : linear-gradient(to bottom, rgba(95,90,90,1), rgba(0,0,0,1));
}

.reels .reel-player {
    padding-bottom : 2.00rem;
    margin-left : auto;
    margin-right : auto;
    width : 100%;
}

@media (min-width : 1200px) {
    .reels .reel-player {
        width : 75%;
    }
}

#modalReel .video-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}

#modalReel .video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#modalReel .modal-body .pill-btn {
    width : 232px;
}

.reels .title {
    color : rgba(2,156,73,1);
    font-size : 1.75rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    padding-bottom : 16px;
}

.reels .separator {
    background-image: url('../img/back-reels.png');
    background-position : center center;
    height : 59px;
}

.reels .reels-slider {
    margin-top : 16px;
    width : calc(100% - 40px);
    margin-left : auto;
    margin-right : auto;
}

.reels .reels-slider .slider-item {
    padding-left : 10px;
    padding-right : 10px; 
}

.reels .reel-title {
    padding-top : 0.75rem;
    color : rgba(255,255,255,1);
}
/* Main - Reels - END */
