@charset "utf-8";

:root {
 --verde1: #2E7438;
 --verde2: #4E943D;
 --amarillo1: #E4EA30;
 --amarillo2: #E4EC73;
 --rojo: #831B17;

 --gris: #D7D7D7;

 --txt: #373737;
}

body, td, th, input, select, textarea, p, h1, h2, h3, h4, h5, h6, a, li{
    font-family: 'Montserrat', sans-serif;
    color:#666666;
}
body, td, th, input, select, textarea{
    font-size:14px;
}


h1{color:#2E7438;}
h2{color:#2E7438;}
h3{color:#4E943D;}
h4{color:#373737;}
h5{color:#373737;}
h6{color:#373737;}

/* Estilos para las zebras */
.zebra { margin-top:15px; margin-bottom:20px;}
.zebra td { border-bottom: 1px solid #f1f1f1;}
.zebra tr.alt td {      background: #f7f7f7;}
.zebra tr.over td { background: #c0ecc0;}
.zebra tr.title td { background-color: #c0ecc0; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #999; }
/* Retoques al jQuery UI*/
.ui-state-default, .ui-widget-content .ui-state-default { background: #2E7438; color:#FFF; border:none; }
.ui-state-active, .ui-widget-content .ui-state-active { color:#FFF; border:none; background-color: #2E7438; background-image:none; }
.ui-state-default, .ui-widget-content .ui-state-default * { color:#FFF; border:none; }
.ui-state-active, .ui-widget-content .ui-state-active * { color:#FFF; border:none; }
.ui-widget-header, .ui-widget-content { border:none; background:#FFF; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color:#FFF; }
.ui-tabs-nav { border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: #808080; padding-bottom:5px; border:none; }
.ui-tabs .ui-tabs-nav li a{ padding:5px;}
.margin{margin: 5px;}
.clear{clear: both;}
#MenuVertical{padding: 0; margin: 0; width: 172px; float: left;  margin-right: 27px;}
#MenuVertical li { list-style-position: inside; list-style-type: none; padding: 0px; margin-top: 3px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; list-style-image: url(vineta.gif); }
#MenuVertical li a { color: #2E7438; display: inline; list-style-position: inside; list-style-type: none; padding: 0px; font-size: 13px; font-weight: normal; text-decoration: none; margin: 0px; }
.btn-default.disabled, .btn-default.disabled.active, .btn-default.disabled.focus, .btn-default.disabled:active, .btn-default.disabled:focus, .btn-default.disabled:hover, .btn-default[disabled], .btn-default[disabled].active, .btn-default[disabled].focus, .btn-default[disabled]:active, .btn-default[disabled]:focus, .btn-default[disabled]:hover, fieldset[disabled] .btn-default, fieldset[disabled] .btn-default.active, fieldset[disabled] .btn-default.focus, fieldset[disabled] .btn-default:active, fieldset[disabled] .btn-default:focus, fieldset[disabled] .btn-default:hover{
    background: #4E943D!important;
}
.btn-default {
    color: #fff;
    background-color: #4E943D;
    border-color: #4E943D;
    transition: all .3s ease;
}
.btn-default:hover{
    background-color: #2E7438;
    transition: all .3s ease;
    color: #fff;
}
#dashboardPG .dashboard-item .dashboard-item-container a:hover {
    background: linear-gradient(90deg, #fff, #2e74382e );
}

/* Paddings */

.p-x{padding-left: 0px!important; padding-right: 0px!important;}
.p-y{padding-top:0px!important; padding-bottom:0px!important;}
.p-0{padding: 0px}
.p-1{padding: 1em;}
.p-2{padding: 2em;}
.p-3{padding: 3em;}
.p{
    padding: 1em;
}

.d-flex{display: flex;}

/* Tags */
p {
    font-weight: 300;
    line-height: 1.5;
    text-align: justify;
}
a {
    transition: all 0.3s ease-in-out;
}
a:hover{
    text-decoration: none;
    color: var(--azul);
}
a:visited,a:active,a:focus{
    text-decoration: none !important;
}
*:focus{
    outline: none !important;
}

/*------------*/
section.home-section {
    padding-top: 64px;
}
.site-content {
    padding-top: 74px;
}
.site-content, .my-container{
    max-width: 1200px;
    margin: 0 auto;
}
/*------------*/

.w-100{
    width: 100%;
}

/* HEADER */
header.home {
   position: fixed;
   width: 100%;
   z-index: 100;
   top: 0px;
   left: 0px;
   transition: all .3s ease;
   background: rgb(255, 255, 255);
   box-shadow: rgba(0, 0, 0, 0.19) 0px 2px 4px;
   padding: 0.5rem 15px;
   border-top: 8px solid rgb(81, 133, 50);
}

.header-content {
    justify-content: space-between;
    align-items: center;
    transition: all .3s ease;
}
.nav-brand {
    max-width: 140px;
    transition: all .3s ease;
}
.nav-brand img{
    transition: all .3s ease;
    width: 100%;
}

/*para quitar los submenus en la vista responsive*/
.social-links, .main-nav-mobile {
    display: none;
}
/*para quitar los submenus en la vista de escritorio*/
#menu-main> li > ul {
    display: none;
}

a.toogle-menu, a.toogle-search { /*boton del menu responsive*/
    color: var(--verde1);
    font-size: 25px;
    padding: 0 5px;
    line-height: 1;
}
.mm-menu {
    background: var(--verde2);
    border-color: rgba(0,0,0,.1);
    color: rgb(255, 255, 255);
}
ul.mm-listview {display: block !important;}
.mm-menu .mm-navbar a, .mm-menu .mm-navbar>* {
    font-weight: bold;
    color: var(--txt);
}
.mm-menu .mm-listview .mm-btn_next::after {
    border-color:var(--txt);
}
.mm-menu .mm-btn::after, .mm-menu .mm-btn::before {
    border-color: var(--txt);
}
.mm-menu .mm-listview a:not(.mm-btn_next){
 color: var(--txt)!important;
}
.navbar-header{
    display: none;
}
.datos-menu .fa-mobile {
    font-size: 24px;
}
.mm-navbars_bottom>.mm-navbar:not(.mm-navbar_has-btns) {
    padding: 0;
    height: 45px;
}
.mm-navbars_bottom>.mm-navbar>:not(img):not(.mm-btn), .mm-navbars_top>.mm-navbar>:not(img):not(.mm-btn){
    background: var(--verde);
}
.mm-panel_has-navbar .mm-navbar {
    display: block;
    background: var(--amarillo);
}
.mm-navbars_bottom {
    height: 70px;
}
.mm-menu_navbar_top-1 .mm-panels {
    top: 120px;
    background: #fff;
}
.mm-navbars_top{border: none!important;}
.datos-menu {
    display: block;
    height: 120px;
    padding: 1rem;
}
.datos-menu >h3 {
    color: #fff;
    font-weight: bold;
    text-align: left;
    margin: 0;
    font-size: 12px;
    padding: 1rem 0;
}
.datos-menu > p {
    color: #fff;
    text-align: left;
    margin: 0;
    font-size: 12px;
    font-weight: 400;
}

.log {
    color: #fff!important;
    display: block;
    text-align: left;
    padding-top: 4px;
    font-size: 13px;
}

.mm-navbars_bottom {
    height: 46px;
}
m-menu .mm-listview a:not(.mm-btn_next){
    color: var(--txt)!important;
    font-weight: 600;
}

.bg-icon {
    border-radius: 100%;
    height: 27px;
    width: 27px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    color: #fff;
}



/* Slider Home */
.slick-arrow {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    z-index: 50;
    color: #fff;
    font-size: 20px;
    padding-top: 0px;
    line-height: 0;
    cursor: pointer;
    transition: all .3s ease-in-out;
    background: rgb(255 255 255 / 57%);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    text-align: center;
    margin: 0 25px;
}
span.arrow-right.slick-arrow {
    right: 0;
    left: auto;
}
.slick-arrow:hover{
    background: var(--verde2);
    color: #fff;
}


/*dots slider*/

.slick-dots {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 1rem 0;
    list-style-type: none;
}
.slick-dots li {
    margin: 0 0.25rem;
}
.slick-dots button {
    display: block;
    width: 10px;
    height: 10px;
    padding: 0;
    border-radius: 100%;
    background-color: var(--gris);
    text-indent: -9999px;
    border: none;
}
.slick-dots li.slick-active button {
    background-color: var(--verde2);
}


/*searcher ----------------*/

.searcher {
    position: fixed;
    width: 100%;
    background: var(--gris);
    left: 0;
    top: 0;
    padding: 15px;
    z-index: 101;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s cubic-bezier(0.45, 0.05, 0.55, 0.95);
    transform: translateY(-100%);
}
.search-content {
    width: 100%;
}
.search-content form {
    display: flex;
    border-bottom:1px solid var(--verde1);
    transition: opacity .3s ease .4s;
    opacity: 0;
}
.search-content form input {
    background: none;
    border: none;
    color: var(--verde1);
    font-size: 22px;
    font-weight: 200;
    outline: none;
    box-shadow: none !important;
}
.search-content form button {
    background: none;
    border: none;
    color: var(--verde1);
    font-size: 22px;
}
.search-content-active {
    transform: translateY(0%);
}
.search-content-active .search-content form  {
    opacity: 1;
}
.close-searcher {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0 14px;
    font-size: 30px;
    color: var(--verde1) !important;
}


/*FOOTER --------------------------*/

.poner, .footer-bottom{
    padding: 1em;
}
.footer-portal{
    display: inline-block;
    width: 100%;
}
.page-footer div{
    padding: 0;
}
.footer {
    background: #FAFAFA;
    position: relative;
}
.footer-bottom{
    background: #2E7438
}
.menu-1 > ul{
    padding: 0!important;
    list-style: none;
}
.menu-1 > ul > li > a{
    font-size: 12px; 
    color:#343434;
    font-weight: 400;
    letter-spacing: 0.19px;
}
h3.footer-tittle {
    font-size: 17px;
    font-weight: bold;
    text-align: center;
    color:  #545454;
    letter-spacing: 0.29px;
}
.page-footer div{
    padding: 0;
}
.page-footer > div > div > p {
    margin: 0;
    font-size: 12px;
    text-align: center;
    color: #545454;
    font-weight: 400;
    letter-spacing: 0.18px;
    word-break: break-all;
}
.menu-1 > ul > li{
    text-align: center;
    padding-bottom: 10px;
}
.footer-text{font-size: 14px;}
.footer-text > a{color: #fff}

ul#footer-menu > li:before {
    font-family: FontAwesome;
    content: "\f054";
    padding: 1px;
    color: #4A4A4A;
}

#mapa{
    max-width: 267px;
    margin: auto;
    padding: 3rem 0;
}
#mapa > iframe {
    width: 100%;
    max-width: 267px;
}


/*TITULOS*/

h2.content-box-title {
    font-size: calc(1em + 2vw);
    width: fit-content;
    margin: 1em auto 3rem;
    padding: 1rem;
    max-width: 500px;
    position: relative;
    text-align: center;
    color: #5D5D5D;
    font-weight: bold;
}

h2.content-box-title::after {
    content: "";
    display: block;
    width: 80%;
    max-width: 167px;
    height: 2px;
    background: #518532;
    position: absolute;
    bottom: 0px;
    margin: auto;
    left: 1rem;
}


/*SECTION BANNER*/

.content-banner{
    position: relative;
}

.img-banner {
    min-height: 150px;
    object-fit: cover;
    object-position: center;
}

.banner-container {
    position: absolute;
    top: 0;
    width: 100vw;
    height: 100%;
    padding: 1rem 55px;
    background: #00000047;
}

.banner-detalles {
    height: 100%;
    max-height: 277px;
    position: relative;
    padding-bottom: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner-detalles > p {
    display: none;
}

.banner-detalles > h2 {
    margin: 0;
    font-size: calc(1em + 1vw);
    font-weight: bold;
    color: #fff;
    text-align: center;
}

.banner-detalles > a {
    display: flex;
    width: 80%;
    max-width: 240px;
    border: 2px solid rgb(255, 255, 255);
    height: 35px;
    border-radius: 30px;
    justify-content: center;
    align-items: center;
    color: rgb(255, 255, 255);
    font-size: 15px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    left: 0px;
    margin: auto;
    transition: all 0.3s ease 0s;
}




/*SECTION CARDS*/

.card {
    display: block;
    width: 100%;
    max-width: 468px;
    max-height: 248px;
    background-size: cover;
    background-position: center center;
    height: 64vw;
    position: relative;
    border-radius: 8px;
}

.card:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    background: #2a2a2a85;
    border-radius: 8px;
    right: -13px;
    bottom: -13px;
    z-index: -1;
}

.card-datos {
    background: rgba(42, 42, 42, 0.0);
    width: 100%;
    height: 100%;
    padding: 50px 30px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
    border-radius: 8px;
}

.card-datos > h2 {
    margin: auto 0;
    padding-bottom: 15px;
    font-size: calc(1em + 2vw);
    color: #FFFFFF;
    font-weight: 300;
    line-height: 1em;
    text-shadow: 1px 1px 3px #000;
}

.btn-card {
    display: flex;
    width: 145px;
    height: 40px;
    border: 2px solid #fff;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
    font-size: 16px;
    color: #fff;
    min-height: 40px;
    letter-spacing: -0.29px;
    transition: all 0.3s ease 0s;
    background: #e4ec7342;
    text-shadow: 1px 1px 2px #000;
}




/*SECTION DESTACADOS*/

.content-destacados .slick-arrow {
    top: 48%;
    background: var(--verde1);
}

/*tabs*/

.content-destacados .nav-tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.content-destacados .nav-tabs>li {
    float: initial;
    margin-bottom: initial;
}

.content-destacados .title {
    margin: 5px 15px!important;
    font-size: 16px;
    color: #373737;
    font-weight: 500;
    background: var(--gris);
    padding: 8px 15px;
    border-radius: 30px;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    color: #fff;
    border: none;
    background: var(--verde2);
}

.nav>li>a:focus, .nav>li>a:hover {
    text-decoration: none;
    background-color: var(--verde2);
    color: #fff;
    border: none;
}

.nav-tabs>li>a {
    margin-right: initial;
    line-height: initial;
    border: initial;
    border-radius: initial;
}

.des-top {
    border-bottom: 2px solid #F0F0F0;
    position: relative;
    padding: 17px;
}

.destacado {
    display: block;
    width: 100%;
    max-width: 287px;
    margin: 10px auto;
    border-radius: 4px;
}

.des-top > img {
    display: block;
    width: 211px;
    height: 210px;
    object-fit: cover;
    object-position: center;
    margin: auto;
}

.des-tag {
    display: flex;
    width: 181px;
    height: 25px;
    background: #518532;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    font-size: 13px;
    color: #fff;
    position: absolute;
    bottom: 12px;
    right: 14px;
}

.des-bot {
    padding: 11px 15px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.des-bot > p {
    color: #3A3A3A;
    font-size: 13px;
    line-height: 20px;
    font-weight: 500;
    margin: auto 0;
    text-align: center;
}

.des-enlace {
    font-size: 18px;
    color: #518532;
    display: flex;
    width: 139px;
    height: 35px;
    background: var(--gris);
    border: 2px solid var(--gris);
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    border-radius: 30px;
    margin: 0 auto;
    font-weight: 600;
    transition: all .3s ease;
}

.des-enlace:hover {
    background: var(--amarillo2);
    border: 2px solid var(--verde2);
}

.des-todos {
    display: flex;
    width: 205px;
    height: 40px;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: 2px solid var(--verde2);
    border-radius: 30px;
    font-size: 16px;
    color: var(--verde2);
    font-weight: 500;
    letter-spacing: -0.29px;
    margin: 15px auto;
}



/*SECTION VIDEOS*/

.video {
    background: rgb(215, 215, 215);
    padding: 2rem;
    border-radius: 12px;
    height: 515px;
}

.video-img {
    display: block;
    max-width: 529px;
    width: 100%;
    max-height: 294px;
    height:60vw;
    background-size: cover;
    background-position: center;
}

.video-datos {
    display: flex;
    flex-direction: column;
    height: 280px;
}

.marca {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease;
}

.marca > span {
    font-size: 50px;
    color: #FF0000;
}

.video-tag {
    font-size: 22px;
    color: #518532;
    font-weight: 500;
    font-style: italic;
    width: fit-content;
    padding: 1rem 10px 1rem 33px;
    margin-left: auto;
    position: relative;
}

.video-tag:before {
    content: "";
    display: block;
    width: 22px;
    height: 3px;
    border-radius: 15px;
    background: #66934A;
    position: absolute;
    left: 0px;
    bottom: 0;
    top: 0;
    margin: auto;
}

.video-datos > h2 {
    margin: 0px;
    color: rgb(55, 55, 55);
    font-weight: bold;
    font-size: calc(1em + 2vw);
    line-height: 1.5em;
    padding-bottom: 1rem;
    text-align: center;

    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

.video-datos > p {
    font-size: 15px;
    color: #373737;
    text-align: center;
    margin: auto 0px;
    line-height: 25px;

    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}




/*SECTION EVENTOS*/

.evento {
    display: block;
    width: 100%;
    max-width: 351px;
    height: 395px;
    margin: 10px auto;
}

.fecha-evento {
    background: #F2F2F2;
    border-radius: 8px;
    width: 53px;
    height: 68px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 53px;
}

.fecha-evento > div {
    display: block;
    width: 40px;
    height: 25px;
    text-align: center;
    overflow: hidden;
    padding: 3px 4px;
    text-overflow: ellipsis;
    font-size: 13px;
    color: #313131;
    font-weight: 500;
    letter-spacing: -0.23px;
}

.fecha-bot {
    border-top: 1px solid #D0D0D0;
}

.datos-evento {
    display: flex;
    padding: 10px 0;
    width: 100%;
    height: 180px;
}

.txt-evento {
    margin: 10px 15px;
    border-top: 1px solid #DCDCDC;
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 150px;
}

.txt-evento > h2 {
    margin: 0;
    font-size: 15px;
    color: #313131;
    font-weight: 500;
    line-height: 19px;
    letter-spacing: -0.26px;
    padding: 10px 0;
}

.txt-evento > p {
    font-size: 13px;
    color: #B2B2B2;
    font-weight: 500;
    line-height: 16px;
    letter-spacing: -0.23px;
    text-align: left;
    margin: auto 0;
}


/*section redes*/


.facebook, .instagram{
    padding: 2rem 0;
}






/*EFECTOS*/

.buttons-top a:hover {
    color: var(--verde1);
    text-decoration: underline;
}

header.home.fixed {
    height: 80px;
    transition: all .3s ease;
}

.fixed .nav-brand {
    transform: matrix(0.6,0.00,0.00,0.6,-59,29);
    transition: all .3s ease;
}

.fixed .ct-header {
    transform: translateY(-53px);
    transition: all .3s ease;
}

.banner-detalles > a:hover {
    background: var(--amarillo2);
    color: var(--verde1);
    border-color: var(--verde1);
}

.btn-card:hover {
    background: var(--amarillo2);
    color: var(--verde1);
    border-color: var(--verde1);
    transition: all .3s ease
}

.destacado:hover {
    background: #fff;
    box-shadow: 0px 15px 27px rgb(0 0 0 / 0.07);
    transform: scale(1.03);
}

a.des-todos:hover {
    background: var(--verde2);
    color: #fff;
}

.marca:hover {
    cursor: pointer;
    box-shadow: 0 0 15px var(--amarillo1);
    transition: all .3s ease;
}

.evento:hover {
    box-shadow: 0px 3px 27px #d7d7d74f;
    transform: translateY(-15px);
}

.menu-1 > ul > li > a:hover {
    color: var(--verde2);
}


#redes_laterales{
    display:none;
}



/* Media Queries */
@media (min-width: 500px) {

    .banner-detalles {
        max-height: 260px;
        padding-bottom: 58px;
        height: 100%;
        flex-direction: column;
        width: 90%;
        margin: auto;
    }

    .banner-detalles > a{
        height: 47px;
        font-size:18px;
    }
    .banner-detalles > h2{
        font-size: calc(0.85em + 2vw);
    }

    .facebook {
        width: fit-content;
        margin: auto;
        min-width: 340px;
    }

    .card-datos > h2{
        font-size: 37px
    }
    .video {
        height: 570px;
    }  
    .video-datos {
        height: 215px;
    }

}

@media (min-width: 768px){

    .content-destacados .title {
        font-size: 20px;
    }

    .video-datos > h2,
    .video-datos > p  {
        text-align: left;
    }

    .des-todos {
        margin: 30px auto;
    }

    .banner-detalles > p {
        display: block;
        color: #fff;
        text-align: center;
        margin: 0;
        padding-top: 10px;
    }

    .banner-detalles{
        width: 100%;
        max-width: 1200px;
        align-items: initial;
    }
    .banner-container{
        padding: 1rem 70px;
        display: flex;
        align-items: center;
    }

    .banner-detalles > h2 {
        text-align: left;
        font-size: 23px;
        max-width: 529px;
    }

    .banner-detalles > p {
        width: 100%;
        text-align: left;
        font-size: 20px;
        max-width: 454px;
        margin: initial;
    }
    .banner-detalles > a {
        margin: initial;
    }

    .video {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 400px;
    }

    .video-img {
        min-width: 55%;
    }
    .video-datos {
        max-width: 506px;
        padding-left: 3rem;
        height: 340px;
    }

}

@media (min-width: 992px){

    .banner-container {
        padding: 1rem 110px;
    }

    h2.content-box-title{
        font-size: 27px;
        margin: 1em auto 5rem;
    }

    .primero, .ultimo {
        display: flex;
        justify-content: center;
        align-items: center;
        min-height: 268px;
    }

    .menu-1 > ul > li, 
    .page-footer > div > div > p,
    h3.footer-tittle{
        text-align: left;
    }

    .banner-detalles > h2{
        font-size: 40px;
        line-height: 40px;
    }

    .banner-detalles > p {
        font-size: 22px;
        line-height: 29px;
    }  

    section.sec {
        margin: 50px 0;
    }

    .content-destacados .nav-tabs {
        padding-bottom: 2rem;
        border-bottom: none;
    }

    .destacado {
        height: 373px;
    }
    .des-bot {
        height: 127px;
    }

    header.home{
        padding: 0;
        border-top: 15px solid rgb(81, 133, 50);
        height: 130px;
    }  
    .home:before{
        content: "";
        display: block;
        width: 100%;
        height: 15px;
        background: rgb(81, 133, 50);
        position: absolute;
        top: -15px;
        left: 0px;
        z-index: 16;
    }

    .video-img {
        min-width: initial;
    }

    .section-cards {
        max-width: 1497px;
        margin: 0 auto;
    }

    .content-destacados {
        max-width: 1018px;
        margin: 0 auto;
    }

    .content-videos {
        max-width: 1138px;
        margin: auto;
    }

    .content-eventos {
        max-width: 1200px;
        margin: 0 auto;
    }

    .video-datos > h2 {
        font-size: 35px;
        line-height: 50px;
    }

    .video{
        background: #0000;
        padding-right: 5rem;
    }

    .fondo{
        position: relative;
    }

    .fondo:before {
        content: "";
        display: block;
        width: calc(100% - 50px);
        height: 400px;
        background: #D7D7D7;
        border-radius: 0 12px 12px 0;
        position: absolute;
        top: 0;
        left: 0;
    }    

    .fondo:after {
        content: "";
        display: block;
        width: calc(100% - 36px);
        height: 400px;
        background: #EBEBEB;
        border-radius: 0 12px 12px 0;
        position: absolute;
        top: 27px;
        left: 0;
        z-index: -1;
    }

    
    /*MENU ESCRITORIO ****************+*/

    .nav-brand {
        max-width: 295px;
        min-width: 200px;
        width: 100%;
    }
    .header-content{
        padding: 8px 1rem;
    }
    .navbar-header{
        display: block;
    }
    .page-top {
        display: block;
        min-width: 200px;
    }
    .nav-mobile {
        display: none;
    }
    .content-info-header {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
    }
    .ct-header {
        max-width: 1236px;
        margin: auto;
        transition: all .3s ease;
    }
    .redes-top {
        display: flex;
        min-width: 102px;
        align-items: center;
        justify-content: space-between;
        padding-left: 1rem;
    }

    .redes-top > div > a {
        display: flex;
        width: 27px;
        height: 27px;
        align-items: center;
        justify-content: center;
        font-size: 17px;
        border: 1px solid #000;
        border-radius: 100%;
        color: #000;
        margin-left: 10px;
    }

    nav.main-nav ul {
        padding: 0;
        margin: 0;
        list-style: none;
    }
    nav.main-nav > ul {
        display: flex;
        align-items: center;
        justify-content: space-around;
        height: 36px;
        margin: 15px auto 0;
        max-width: 757px;
    }
    nav.main-nav ul li a {
        display: block;
        font-size: 14px;
        padding: 5px 15px;
        border-radius: 30px;
        font-weight: bold;
        color: #3F3F3F;
        min-width: 95px;
        margin: 0 2px;
        text-align: center;
        white-space: nowrap;
        transition: all .3s ease;
    }

    #menu-main > li > a:hover, #menu-main > li > a:focus {
        color: var(--verde2);
        background: #D5E1CD;
    }

    ul.submenu {
        position: absolute;
        min-width: 150px;
        transform: translateX(-50%);
        padding-top: 16px!important;
        left: 50%;
        box-shadow: 0 0 0px black;
        display: none;
        transition: all .3s ease;
    }

    .fixed ul.submenu {
        padding-top: 19px!important;
    }

    ul.submenu li a {
        font-size: 12px !important;
        padding: 8px !important;
        text-align: left!important;
        background: #02020278;
        color: #fff!important;
        font-weight: 300!important;
        border-bottom: 1px solid;
        border-radius: 0!important;
    }

    nav.main-nav ul li {
        position: relative;
    }
    ul.subsubmenu {
        position: absolute;
        left: 100%;
        top: 0;
        min-width: 150px;
        background: #02020278;
    }


    /*end menu*/



    section.home-section {
        padding-top: 120px;
    }

    .site-content {
        padding-top: 150px;
    }


    /*page top*/

    .nav-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        max-width: 915px;
        width: 100%;
    }

    .buttons-top {
        display: flex;
        align-items: center;
        min-width: 115px;
    }
    
    .buttons-top span {
        font-size: 23px;
        color: var(--verde2);
    }
    .buttons-top a {
        font-size: 13px;
        color: #1F1F1F;
        padding-left: 10px;
        text-align: center;
        display: block;
        white-space: nowrap;
    }

    a.toogle-search.hidden-xs.hidden-sm.hidden-lg {
        padding: 0 2rem 0 1rem;
    }

    .page-nav-top {
        display: block;
        width: 100%;
    }
    .page-nav-top div {
        padding: 0;
    }
    .page-nav-top a, .page-nav-top p { 
        margin: 0!important;
        text-align: left;
        white-space: nowrap;
        padding-left: 15px;
        font-size: 12px;
        color: #565656;
        display: flex;
        align-items: center;
    }   

    .page-nav-top h4{
        font-size: 12px;
        font-weight: 300!important;
    } 
    .page-nav-top > div > div{
        display: flex;
        height: 39px;
        width: auto;
        padding: 0 2rem;
        align-items: center;
    }
    .page-nav-top > div {
        margin: 0 auto;
        display: flex;
        align-items: center;
    }


    #redes_laterales{
        display: block;
        position: fixed;
        right: 0px;
        z-index: 999;
        background: rgba(0, 0, 0, 0.7);
        top: 40%;
        border-radius: 10px 0 0 10px;
    }
    #redes_laterales a{
        display: flex;
        position: relative;
        text-decoration: none;
        transition: all .3s ease;
        height: 40px;
        width: 40px;
        justify-content: center;
        align-items: center;
    }
    #redes_laterales a > i{
        color: #ffffff;
        font-size: 1.5em;
    }
    #redes_laterales a > span{
        position: absolute;
        top: 0px;
        width: 170px;
        height: 40px;
        color: #ffffff;
        left: 80px;
        transition: all 0.5s;
        background: rgba(0, 0, 0, 0.7);
        z-index: -1;
        display: flex;
        align-items: center;
        padding: 0 1em;
        border-radius: 20px 0 0 20px;
    }

    #redes_laterales a:hover .span{
        left: -130px;
    }

}

@media(min-width: 1200px){

    .video-datos > p {
        font-size: 18px;
        max-width: 454px;
    }
    

    /*form nav*/

    .form-nav .form-control:focus{
        border: none;
        box-shadow: none;
    }

    .form-nav {
        width: 100%;
        padding-right: 15px;
    }
    .btn-nav {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .buttons-nav > ul {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 100%;
    }
    .btn-nav > li > a {
        display: flex;
        background: var(--amarillo);
        height: 33px;
        align-items: center;
        justify-content: center;
        width: fit-content;
        padding: 0 1rem;
        border-radius: 8px;
        box-shadow: 0 2px 4px #00000080;
        font-size: 13px;
        text-transform: uppercase;
        color: #001996;
        font-weight: bold;
        letter-spacing: 0.5px;
        margin-left: 5px;
    }
    .buttons-nav li#last > a {
        background: #E4E4E4;
    }

    .form-nav > form {
        background: #fff;
        padding: 5px;
        display: flex;
        height: 39px;
        overflow: hidden;
        width: 90%;
        max-width: 240px;
        box-shadow: 0px 2px 4px #00000026;
        margin: 0 auto;
    }

    .boton, .input {
        border: none;
        box-shadow: none;
        background: transparent;
        height: 100%;
        border-radius: 0;
        font-size: 15px;
        padding: 0 15px;
    }

    .boton {
        padding: 0 0 0 10px;
        font-size: 21px;
        line-height: 0;
        color: var(--verde2);
    }

    #mapa {
        position: relative;
        z-index: 10;
        margin: -50px auto auto;
        padding: 0px;
    }

    div#mapa:after {
        content: "";
        display: block;
        width: 100%;
        height: 260px;
        background: rgb(226, 226, 226);
        position: absolute;
        top: -12px;
        right: -14px;
        border-radius: 2px;
        z-index: -1;
    }

}




@media(min-width: 1500px){

    .form-nav > form{
        min-width: 240px;
    }

}