/* @group Banner
------------------------------------ */
.banner_container {
    background: #35475d;
    position: fixed;
    bottom: -100vh;
    width: 100%;
    left: 0;  
    z-index: 999999;
    -webkit-transition: max-height 0.3s linear, bottom .3s linear;
    -moz-transition: max-height 0.3s linear, bottom .3s linear;
    -ms-transition: max-height 0.3s linear, bottom .3s linear;
    -o-transition: max-height 0.3s linear, bottom .3s linear;
    transition: max-height 0.3s linear, bottom .3s linear;
    transition: bottom 0.5s ease-in-out;
}
.showMeBanner .banner_container:not(.hiddenBar) { bottom: 0; }
.showMeBanner:not(.showMeSurvey) .banner_container:not(.hiddenBar) { bottom: 0!important; }
.banner_container .close {
    position: absolute;
    top: 26px;
    right: 59px;
    color: #ffffff;
    font-size: 69px;
    -webkit-text-stroke: 14px #35475d;
    opacity: 1;
    text-shadow: 3px 3px 0 #6aa1a1, -1px -1px 0 #6aa1a1, 1px -1px 0 #6aa1a1, -1px 1px 0 #6aa1a1, 1px 1px 0 #6aa1a1;
    z-index: 4;
}
.banner_container h2 { color: #ffffff; font-family: 'Yeseva One'; font-size: 46px; letter-spacing: .025em; margin: 0; text-transform: uppercase; }
.banner_container p { font-family: 'Proxima Nova Lt'; color: #ffffff; font-size: 18px; line-height: 27px; margin: 0; }
.banner_container p a { color: #ffffff; }
.banner_container p a:hover { color: #ffffff; text-decoration: underline!important; }
.hideSpecials .banner_container,
.banner_container.hiddenBar { bottom: -100vh!important; }
/* @end */

/* Grid
----------------------*/
.banner_container .row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; margin: 0 auto; align-items: baseline; } /* Se pone el display flex y se deja que cada columna tenga su propia altura. */

/* Horizontal Align - Row
----------------------------------- */
.banner_container .row.reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }
.banner_container .row.left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
.banner_container .row.center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.banner_container .row.right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }
.banner_container .row.around { -ms-flex-pack: distribute; justify-content: space-around; } /* Distribuir items uniformemente.  Los items tienen el mismo espacio a su alrededor  */
.banner_container .row.between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } /* Distribuir items uniformemente. El primer item al inicio, el último al final */

/* Vertical Align - Row
----------------------------------- */
.banner_container .row.top { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
.banner_container .row.middle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.banner_container .row.bottom { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
.banner_container .row.stretch { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }/* Estira los elementos para ajustarlos */

@media only screen
and (min-width : 769px) {
    .banner_container .col-24-20 { padding: 2rem 2.4rem; }
}
@media only screen
and (min-width : 0)
and (max-width : 768px) {
    .banner_container .close { top: .423em; right: .656em; font-size: 90px; -webkit-text-stroke: .223em #35475d;
    text-shadow:
                3px 3px 0 #6aa1a1,
                -1px -1px 0 #6aa1a1,
                1px -1px 0 #6aa1a1,
                -1px 1px 0 #6aa1a1,
                1px 1px 0 #6aa1a1;
    }
}
@media (max-width: 480px) {
    .banner_container:not(.hidden_banner) + .header_section { top: 260px; }
    .banner_container:not(.hidden_banner):after { height: 256px; width: 268px; right: -12px; }
    .banner_container article { margin: 46.5px 0!important; }
    .banner_container .close { font-size: 45px; }
    .banner_container h2 { font-size: 23px; }
    .banner_container p { font-size: 14px; }
}