.navbarigac {
    z-index: 10000;
}

a {
    text-decoration: none;
}

.main-row {
    flex-wrap: wrap;
}

.aside {
    width: 25%;
    z-index: 1;
    border-right: 1px solid #cccccc;
    position: relative;
    z-index: 1000;
    position: relative;
    transition: all 0.5s ease;
}

.aside.collapseAside {
    width: 0;
    transform: translate(-100%);
    box-shadow: none;
    position: absolute;
    transition: all 0.5s ease;
}

.aside.collapseAside .aside__togglebutton {
    position: sticky;
    top: 130px;
}

.aside__togglebutton {
    position: absolute;
    top: 30px;
    right: -25px;
    width: 25px;
    height: 25px;
    background: #3c3c3b;
    border-radius: 0 50% 50% 0;
    cursor: pointer;
    z-index: 100;
}

.aside__togglebutton img {
    transition: 0.5s all ease;
}

/*tabs*/
.aside .title {
    height: auto;
    margin-bottom: 20px;
}

.content-intro {
    align-items: center;
}

.aside .title .content-intro {
    justify-content: space-between;
    text-align: center;
    padding-bottom: 20px;
    border-bottom: 1px solid #cccccc;
}

.aside .title .content-intro h1 {
    font-size: 25px;
    line-height: normal;
    text-align: left;
    margin-bottom: 0;
}

#playerbuttons {
    margin-left: 10px;
}

#playerbuttons .context-play {
    font-size: 0.7rem;
    line-height: normal;
    margin-top: 3px;
    width: 50px;
}

#playerbuttons button {
    width: 27px;
    height: 27px;
    border-radius: 30px;
    border: 0;
    padding: 0;
    background: 0;
    border: 2px solid #fff;
    box-shadow: 2px 3px 10px #00000070;
    transition: all 0.2s ease;
}

#playerbuttons button:hover {
    box-shadow: none;
    transition: all 0.2s ease;
}

.botones-popups {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 10px;
}

.btn-info {
    margin: auto;
    width: max-content;
    margin-top: 10px;
    padding: 5px 20px 3px 20px;
    border: 1px solid #2f8adb;
    background: #2f8adb;
    border-radius: 50px;
    cursor: pointer;
    font-family: "Gill Sans Std Light";
    transition: all 0.5s ease;
}

.btn-info:hover {
    background: transparent;
    transition: all 0.5s ease;
}

.btn-info a {
    color: #fff;
    font-size: 0.8rem;
    transition: all 0.5s ease;
}

.btn-info:hover a {
    color: #2f8adb;
    font-weight: 900;
    transition: all 0.5s ease;
}

.btn-info.btn-close2 {
    position: fixed;
    right: 0;
    margin-right: 30px;
    font-size: 0.8rem;
    z-index: 100;
}

.btn-close {
    position: inherit;
    top: 9.9%;
    left: 23%;
    z-index: 9999;
    font-size: 1rem;
}

.aside .title .sub__title {
    font-size: 14px;
    margin-top: 20px;
    color: #31393e;
    font-family: "Gill Sans Std Light";
}

.aside .logos .title {
    font-size: 16px;
    height: 16px;
    color: #5192d9;
    font-family: "Gill Sans Std Light";
    margin-bottom: 5px;
}

.aside .logos .d-flex {
    align-items: center;
    justify-content: space-between;
}

.aside .logos img {
    margin-right: 10px;
    height: 100%;
    filter: grayscale(1);
    transition: 0.2s ease;
    opacity: 0.4;
}

.aside .logos img:hover {
    filter: grayscale(0);
    opacity: 1;
    transition: 0.2s ease;
}

.aside .logos .igac {
    width: 90px;
}

.aside .logos .ampiicanke {
    width: 70px;
}

.aside .logos .act {
    width: 60px;
    filter: invert(1);
}

.aside .logos .act:last-child {
    margin-right: 0;
}

.aside .logos .act:hover {
    filter: grayscale(1);
    filter: invert(1);
}

.aside .aside__container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    overflow: auto;
    height: calc(100vh - 108px);
    padding: 30px 30px;
    transition: all 0.5s ease;
    position: sticky;
    top: 60px;
    bottom: 0;
}

.aside.collapseAside .aside__container {
    padding: 50px 0px;
}

.aside .aside__container .nav-item {
    width: 50%;
    background: #e8e6e0;
    border-radius: 0.25rem 0.25rem 0 0;
}

.aside .aside__container .nav-tabs .nav-item:first-child {
    border-radius: 0.25rem 0 0 0;
}

.aside .aside__container .nav-tabs .nav-item:last-child {
    border-radius: 0 0.25rem 0 0;
}

.aside .aside__container .nav-tabs .nav-link {
    border: none;
    color: #58595b;
    font-size: 13px;
    line-height: normal;
    text-align: center;
    padding: 15px 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.aside .aside__container .nav-tabs .nav-link.active {
    color: #3595e0;
    border-bottom: 2px solid #3595e0;
    background: #dad9d5;
}

.tab-content {
    padding: 40px 20px;
    width: 100%;
    background: #f2efe9;
    border-radius: 0 0 0.25rem 0.25rem;
}

.tab-content ul {
    padding-left: 15px;
    margin-bottom: 0;
}

.tab-content ul li {
    list-style: disc;
    font-size: 14px;
    line-height: normal;
    margin-bottom: 8px;
}

.tab-content ul li:last-child {
    margin-bottom: 0;
}

.tab-content ul li span {
    color: #686868;
}

.portada {
    background: url(../images/portada.svg);
    background-color: #dcf1f2;
    background-size: 102%;
    background-position: center bottom;
    background-repeat: no-repeat;
}

.portada .text-center {
    width: 100%;
}
.portada #iframeYoutube,
.portada #iframeYoutubeAudio {
    margin: auto;
}

/*expediton terms list*/
.expediton__terms__list {
    border-top: 1px solid #cccccc;
    padding-top: 20px;
    margin-top: 20px;
}

.expediton__terms__list h2 {
    font-size: 16px;
    color: #5192d9;
    margin-bottom: 20px;
    font-family: "Gill Sans Std Light";
}

.expediton__terms__list h2 b {
    font-family: "Gill Sans Std";
}

.expediton__terms__list ol {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

.expediton__terms__list li {
    counter-increment: custom;
    padding-left: 10px;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 8px;
    position: relative;
}

.expediton__terms__list li .ver__mas {
    width: 5%;
    padding: 10px 0 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 0 10px 10px 0;
    border-left: 0;
    cursor: pointer;
}

.expediton__terms__list li .ver__mas .fa {
    font-size: 0.8rem;
}

.expediton__terms__list li.active .ver__mas .fa {
    border-left: 0;
    color: #3fa9f5;
}

.expediton__terms__list li.done .ver__mas .fa {
    border-left: 0;
    color: #5cbc8f;
}

.expediton__terms__list li.active .ver__mas {
    border-left: 0;
}

.expediton__terms__list li.done .ver__mas {
    border-left: 0;
}

.expediton__terms__list li .ver__mas:hover {
    opacity: 1;
}

.expediton__terms__list li:last-child {
    margin-bottom: 0;
}

.expediton__terms__list li a {
    color: #414042;
    font-size: 16px;
    line-height: 16px;
    padding: 10px 30px 8px;
    background: #fff;
    width: 95%;
    border-radius: 10px 0 0 10px;
    border: 1px solid #cccccc;
}

.expediton__terms__list li.active a {
    border: 1px solid #3fa9f5;
    background: #fff;
}

.expediton__terms__list li.done a {
    background: #f0faf6;
    border: 1px solid #5cbc8f;
}

.expediton__terms__list li a .list__item--title-resume {
    font-family: "Gill Sans Std Light";
    font-size: 14px;
}

.expediton__terms__list li a:hover {
    border: 1px solid #3fa9f5;
    transition: 1s all ease;
}

.expediton__terms__list ol li:before {
    position: absolute;
    top: calc(50% - 12px);
    left: 0;
    content: counter(custom) " ";
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: normal;
    background: #fff;
    width: 25px;
    height: 25px;
    border-radius: 25px;
    padding: 10px 5px 6px;
    font-size: 14px;
    line-height: 14px;
    color: #000;
    z-index: 10;
    box-shadow: 0 0 4px #0000004f;
}

.expediton__terms__list ol li:hover::before {
    background: #3fa9f5;
    color: #fff;
}

.sitioFECD52:hover::before {
    background: #fecd52 !important;
}

.sitio008ECC:hover::before {
    background: #008ecc !important;
}

.sitio56A766:hover::before {
    background: #56a766 !important;
}

.expediton__terms__list ol li.active:before {
    background: #3fa9f5;
    box-shadow: none;
    color: #fff;
}

.expediton__terms__list ol li.done:before {
    background: #5cbc8f;
    box-shadow: none;
    color: #fff;
}

.expediton__terms__list ol li:first-child {
    counter-reset: custom;
}

/*content*/
.content {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    transition: all 0.5s ease;
    width: 75%;
    overflow: auto;
    height: calc(100vh - 108px);
}

.content.collapseAside {
    width: 100%;
    transition: all 0.5s ease;
}

.content.collapseAside .etnohistoria .audio__Card .card .card-content .tab-content {
    padding: 10px 100px 20px;
}

/*pop up offline*/
.leaflet-popup {
    min-width: 270px;
}

.leaflet-popup .leaflet-popup-content-wrapper {
    border-top: 5px solid #5192d9;
    border-radius: 5px;
}

.leaflet-container a.leaflet-popup-close-button {
    width: inherit;
    top: 24px;
}

.leaflet-container a.leaflet-popup-close-button span {
    margin: 20px 20px 0;
    font-size: 25px;
}

.leaflet-popup .leaflet-popup-content {
    font-size: 13px;
    margin: inherit;
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    color: #808184;
    width: inherit !important;
}

.leaflet-popup .identificador {
    height: 25px;
    width: 25px;
    max-height: 25px;
    min-width: 25px;
    min-height: 25px;
    max-width: 25px;
    border-radius: 25px;
    background: #5192d9;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    line-height: 12px;
    margin-right: 5px;
}

.leaflet-popup .align-items-center {
    color: #5192d9;
    padding-right: 20px;
}

.leaflet-popup .contenedor__imagen {
    margin-top: 10px;
    min-height: 0;
    max-height: 110px;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.leaflet-popup .vermas-link {
    border: 2px solid #5192d9;
    padding: 7px;
    width: 100%;
    margin-right: 0;
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
    display: flex;
    justify-content: center;
    text-align: center;
    cursor: pointer;
}

/*pop up*/
.esriPopup .titlePane {
    font-size: 13px;
    background: #fff;
    color: #808184;
    padding: 15px 20px 0;
    border-top: 5px solid #5192d9;
    color: #5192d9;
}

.esriPopup .titlePane .title .identificador {
    height: 25px;
    width: 25px;
    border-radius: 25px;
    background: #5192d9;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    line-height: 12px;
    margin-right: 5px;
}

.content .esriPopup .contentPane {
    width: 100%;
    padding: 0 10px 6px;
    background: #fff;
}

.content .esriPopup .titleButton.maximize {
    filter: brightness(0.5);
    margin: 20px 20px 0;
}

.content .esriPopup .titleButton.close {
    filter: brightness(0);
    margin: 20px 20px 0;
}

.content .esriPopup .sizer .contentPane {
    font-size: 13px;
    color: #808184;
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
}

.esriPopup .contentPane .contenedor__imagen {
    margin-top: 10px;
    min-height: 0;
    max-height: 110px;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.esriPopup .contentPane .contenedor__imagen img {
    width: 100%;
}

.content .esriPopup .sizer .contentPane a {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
    margin-left: 10px;
}

.content .actionsPane {
    background: #fff;
    padding: 5px 20px 20px;
}

.content .actionsPane .actionList {
    height: inherit;
    display: flex;
    margin-left: -7.5px;
    margin-right: -7.5px;
}

.content .actionsPane .actionList a {
    border: 2px solid #5192d9;
    padding: 7px;
    width: 100%;
    margin-right: 0;
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
    margin: 0 7.5px;
}

#includedContent {
    width: 100%;
}

#puebloInfoExpedicion,
#mapaActores,
#bibliografia {
    z-index: 1000;
    width: 100%;
    top: 0;
    height: calc(100vh - 108px);
    position: absolute;
    z-index: 10000;
    display: flex;
    align-items: center;
}
#mapaActores .mapa-actores-content {
    width: 100%;
}
#mapaActores .title {
    padding: 15px 0 15px 0;
    margin-bottom: 7px;
    border-bottom: 1px solid #ccc;
}
#mapaActores .mapa-modal,
.historical__aspects {
    width: 70%;
    position: relative;
    z-index: 10000;
    margin: auto;
}
#mapaActores .nav-link {
    line-height: normal;
    cursor: pointer;
}
#mapaActores .nav-link.active {
    background: #2e8adb;
}
#mapaActores .tab-content {
    color: #58595b;
    padding: 20px 10px;
}
#mapaActores .col-8 {
    background: #f2efe9;
}
#mapaActores .tab-content .carousel-item {
    position: relative;
}
#mapaActores .tab-content .carousel-item .background-image {
    position: absolute;
    top: 0;
    filter: blur(5px);
    z-index: 0;
    width: 100%;
    background: #333;
}
#mapaActores .tab-content .carousel-item .background-image img {
    opacity: 0.7;
}
#mapaActores .tab-content .text {
    font-size: 0.9rem;
    position: absolute;
    padding: 5px 20px;
    bottom: 0px;
    width: 100%;
    background: #ffffffba;
    line-height: normal;
    z-index: 1;
}
#mapaActores .tab-content .carousel-control-next,
#mapaActores .tab-content .carousel-control-prev {
    background: #2e8adb;
    width: 40px;
    height: 40px;
    border-radius: 40px;
    top: calc(50% - 20px);
    right: 10px;
    opacity: 0.6;
}
#mapaActores .tab-content .carousel-control-prev {
    right: auto;
    left: 10px;
}
#mapaActores .tab-content .carousel-control-next span,
#mapaActores .tab-content .carousel-control-prev span {
    width: 12px;
}
#mapaActores .tab-content .carousel-indicators {
    position: absolute;
    padding: 0 5px;
    bottom: -15px;
    width: 100%;
    margin: auto;
    justify-content: flex-end;
}
#mapaActores .tab-content .carousel-indicators li {
    width: 7px;
    height: 7px !important;
    border-top: 0;
    border-bottom: 0;
    display: block;
    border-radius: 5px;
    margin: 0 3px;
    background: #2f8adb;
}
#mapaActores .tab-content .image-container {
    height: 348px;
    overflow: hidden;
    padding: 0px;
    display: block;
    margin: 0 auto;
    display: flex;
    justify-content: center;
}
#mapaActores .tab-content .image-container img {
    width: auto;
    height: 100%;
    z-index: 1;
}
.historical__aspects .card::after,
#mapaActores .tab-content::after {
    content: "";
    background-image: url(../images/assets/feather.svg);
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: 8px;
    overflow: hidden;
    width: 113px;
    height: 120px;
    position: absolute;
    top: -20px;
    right: -50px;
    z-index: 1;
}
#puebloInfoExpedicion .btn-info,
#mapaActores .btn-info,
#bibliografia .btn-info {
    width: max-content;
    margin-top: 5px;
    margin-bottom: 5px;
    padding: 5px 10px 3px 10px;
    border: 1px solid #2f8adb;
    background: #2f8adb;
    border-radius: 50px;
    cursor: pointer;
    font-family: "Gill Sans Std Light";
    transition: all 0.5s ease;
    position: absolute;
    top: -26px;
    left: -32px;
}
#puebloInfoExpedicion .modal-backdrop,
#mapaActores .modal-backdrop #bibliografia .modal-backdrop {
    top: 60px;
    left: inherit;
}

/** interna **/
.container-portada .content__banner {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 30px;
    min-height: 30px;
    max-width: 30px;
    max-height: 30px;
    border-radius: 30px;
    background: #3595e0;
    color: #fff;
}

.container-portada .content__banner p {
    height: 12px;
    font-size: 21px;
    line-height: 20px;
}

.container-portada .content__banner__title__Al {
    font-size: 35px;
    color: #000;
    opacity: 0.7;
    line-height: normal;
}

.container-portada .content__banner__title__Esp {
    font-size: 24px;
    color: #000;
    opacity: 0.7;
}

.content__banner .content__banner__context {
    margin-bottom: 20px;
}

.content__banner .content__banner__context button {
    border: 0;
    background: transparent;
}

.content__banner .play-button p {
    font-size: 14px;
    height: 18px;
    opacity: 0.6;
}

.popover-body {
    font-size: 12px;
    padding: 5px 10px;
}

.content__banner .content__banner__context .icon {
    width: 20px;
    margin-right: 7px;
}

/** youtube video **/
.iframeyoutube {
    max-height: 0;
    /*max-width: 560px;*/
    width: 560px;
    height: 315px;
    overflow: hidden;
    transition: 0.5s all ease;
}

.iframeyoutube .videoPlayer {
    width: 100%;
    height: auto;
    max-width: 560px;
    max-height: 315px;
}

.iframeyoutube.expand {
    max-height: 560px;
    transition: 0.5s all ease;
}

.iframeyoutube iframe {
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.iframeyoutubeaudio {
    max-height: 0;
    max-width: 560px;
    width: 560px;
    height: auto;
    transition: 0.5s all ease;
    overflow: hidden;
}

.iframeyoutubeaudio.expand {
    max-height: 560px;
    transition: 0.5s all ease;
}

.iframeyoutubeaudio iframe {
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}

/** pills **/
.container-info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    z-index: 10;
    padding: 40px 0;
}

.container-info .content__tabulador {
    box-shadow: 3px 3px 7px 1px #00000014;
    border-radius: 5px;
    width: 50%;
    position: relative;
}

.container-info .nav-pills {
    background: #f7f7f7;
    margin-bottom: 0 !important;
}

.container-info .nav-item {
    width: 50%;
}

.container-info .nav-link {
    text-align: center;
    padding: 25px;
    font-size: 16px;
}

.container-info .nav-link.active {
    background: transparent;
    color: #3595e0;
    border-bottom: 2px solid #3595e0;
    border-radius: 0;
}

.container-info .tab-content {
    padding: 40px;
    background: #fff;
    font-size: 14px;
    line-height: normal;
}

.popover-container {
    position: absolute;
    left: 15px;
    flex-wrap: wrap;
}
.popover-container .col-md-6 {
    padding: 0 !important;
}
.popover-container .popover {
    position: absolute;
    font-size: 0.7rem;
    left: 2hw;
    top: -20px;
    transform: translateY(-50%);
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    display: none;
    z-index: 10;
    width: 200px;
}

.popover-container .popover::before {
    content: "";
    position: absolute;
    top: 50%;
    right: -20px;
    transform: rotate(90deg) translateY(110px) translateX(25px);
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent transparent rgb(255, 255, 255);
}

/** referentes **/
.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: calc(50% - 10px);
    z-index: 1000;
    width: 30px !important;
    height: 30px;
    border-radius: 20px;
    background: #fff;
    opacity: 0.8;
    display: flex;
    align-items: center;
    justify-content: center;
}

.swiper-button-next::before {
    content: "\f054";
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
}

.swiper-button-prev::before {
    content: "\f053";
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
}

.swiper-pagination {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 80px;
    left: calc(50% - 50px);
    z-index: 10;
}

.swiper-pagination .swiper-pagination-bullet {
    background: #fff;
    box-shadow: 0 0 10px #000000;
    width: 7px;
    height: 7px;
    display: block;
    border-radius: 7px;
    margin: 0 3px;
}

.swiper-pagination .swiper-pagination-bullet-active {
    background: #3596e0 !important;
}

.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.modal .modal-content {
    display: block;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 80%;
    max-height: 80%;
    overflow: auto;
}

.modal .close {
    position: absolute;
    top: 15px;
    right: 15px;
    color: #fff;
    font-size: 30px;
    font-weight: bold;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    width: 30px;
    height: 30px;
    border-radius: 50px;
    border: 1px solid #2f8adb;
    background: #2f8adb;
}

.modal .close .fa {
    font-size: 1rem;
}

.modal-image {
    height: 100%;
}

/** slider **/
.slider .text p {
    font-size: 14px;
    margin-top: 15px;
    color: #808082;
}

.swiper .imagecontainer {
    height: 400px;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.swiper-button-next {
    right: 50px;
}

.swiper-button-prev {
    left: 50px;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 15px;
    color: #808082;
}

/** etnohistoria **/
.etnohistoria {
    min-height: 500px;
    margin-top: -40px;
    display: flex;
    align-items: center;
    background: #dcf1f2;
    padding: 50px 30px;
    color: #58595b;
    line-height: normal;
}

.etnohistoria b {
    color: #000;
    line-height: 40px;
}

.etnohistoria .p-relative {
    position: relative;
}

#EtnoHistoria_Video,
#EtnoHistoria_Video_Palenque {
    margin-top: 20px;
    width: 100%;
    height: 250px;
}

.videoIn {
    width: 100%;
    height: auto;
    display: none;
}

.videoIn:last-child {
    display: block;
}

.unexpanded .etnohistoria::before {
    left: 20px;
    transition: 1s all ease;
}

.etnohistoria .title {
    font-size: 35px;
    margin-bottom: 20px;
}

.etnohistoria .resume {
    font-size: 16px;
}

.etnohistoria .credits .title {
    font-size: 16px;
    margin-bottom: 10px;
}

.etnohistoria .audio__Card {
    position: absolute;
    right: 0;
    top: 0;
    margin-top: 60px;
    padding-right: 0;
    padding-left: 0;
}

.etnohistoria .audio__Card {
    display: flex;
}

.etnohistoria .audio__Card {
    z-index: 1;
}

.etnohistoria .audio__Card .card {
    border: 0;
    background: transparent;
    width: 40vw;
}

.etnohistoria .audio__Card .card-container {
    position: sticky;
    top: 50px;
}

.unexpanded .etnohistoria .audio__Card .card {
    width: 32vw;
    transition: 1s all ease;
    position: relative;
}

.etnohistoria .audio__Card .card .card-content {
    background: #84b3b0;
    color: #fff;
    text-align: center;
    padding: 10px 20px 20px;
    border: 0;
    border-radius: 10px 0 0 10px;
    position: relative;
}

.etnohistoria .audio__Card .card .card-content::before {
    content: "";
    width: 250px;
    height: 250px;
    background-color: #777ead;
    border-radius: 100%;
    position: absolute;
    left: -105px;
    bottom: -30px;
    z-index: -1;
}

.etnohistoria .audio__Card .card .card-content::after {
    content: "";
    background-image: url(../images/assets/letra.svg);
    background-size: cover;
    overflow: hidden;
    width: 80px;
    height: 120px;
    position: absolute;
    bottom: -30px;
    left: -100px;
    z-index: 1;
}

.etnohistoria .audio__Card .card .card-content .tab-content {
    opacity: 0.9;
    padding: 10px 30px 20px;
    background: #ffffff61;
    box-shadow: 5px 4px 10px #00000054;
}

.etnohistoria .audio__Card .card .card-content #etnoTabs {
    border-radius: 10px 10px 0 0;
    padding: 0;
    border-bottom: 0;
}

.etnohistoria .audio__Card .card .card-content .nav-tabs li button {
    background: transparent;
    padding-top: 12px;
    border: 0;
    color: #fff;
}

.etnohistoria .audio__Card .card .card-content .nav-tabs li.btnPalenque button {
    background: #777ead !important;
    color: #fff;
}

.etnohistoria .audio__Card .card .card-content .nav-tabs li.btnEsp button {
    background: #d26b6b !important;
    margin-right: 10px;
    color: #fff;
}

.etnohistoria .audio__Card .card .card-content .tab-content .credit {
    color: #333333;
    margin-bottom: 10px;
}

.etnohistoria .audio__Card .card .title,
.etnohistoria .audio__Card .card .reference,
.etnohistoria .audio__Card .card .credit {
    font-size: 23px;
    line-height: normal;
    margin-bottom: 0;
}

.etnohistoria .audio__Card .card .credit {
    font-size: 20px;
}

.etnohistoria .audio__Card .card .credit .br:last-child {
    display: none;
}

.etnohistoria .AudioEtnico {
    width: 100%;
    margin-top: 20px;
}

/** aspectos historicos **/
.historical__aspects .card {
    width: 70%;
    border: 0;
    background: #f4f7fe;
    font-size: 16px;
    color: #58595b;
    line-height: normal;
    margin: auto;
}

.historical__aspects .card .content-card {
    width: 100%;
    height: 70vh;
    overflow-y: auto;
    padding: 30px 30px;
}

.historical__aspects .sub-title {
    font-size: 15px;
    margin-bottom: 30px;
}

.historical__aspects .title {
    font-size: 35px;
    margin-bottom: 25px;
    line-height: 35px;
}

.historical__aspects .resume {
    margin-bottom: 60px;
}

.historical__aspects .resume:last-child {
    margin-bottom: 0;
}

/** team **/
.team {
    padding-top: 40px;
    padding-bottom: 40px;
    background: #f4f6fc;
}

.team .title {
    color: #000;
    font-size: 35px;
    opacity: 0.7;
    margin-bottom: 20px;
    line-height: normal;
}

.team .credit__item {
    justify-content: center;
    padding: 0 100px;
    width: 80%;
}

.team .credit__item .title {
    margin-top: 30px;
    margin-bottom: 10px;
    font-size: 23px;
    height: 23px;
}

.team .credit__item .icon {
    width: 80px;
    margin: auto;
}

/*intro*/

.tour.popover {
    max-width: 350px !important;
}

.popover[class*="tour-"].orphan.main {
    max-width: 1200px !important;
    width: 400px;
    vertical-align: middle !important;
    border-radius: 0;
    top: calc(25% - 60px) !important;
}

.tour-backdrop {
    opacity: 0.6;
}

.tour-tour-element {
    overflow: hidden;
}

.tour.popover .modal-header {
    padding: 15px;
    padding-bottom: 0;
    text-align: left;
    display: flex;
    justify-content: flex-end;
    border-bottom: 0;
}

.tour.popover .modal-header div {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 10px;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.2;
}

.popover[class*="tour-"] .popover-navigation {
    justify-content: space-between;
}

.popover[class*="tour-"] .popover-navigation *[data-role="prev"].disabled,
.popover[class*="tour-"] .popover-navigation *[data-role="next"].disabled,
.popover[class*="tour-"] .popover-navigation *[data-role="end"].disabled {
    display: none;
}

.tour.popover .contentP {
    flex-wrap: wrap;
    padding: 15px 0 15px;
    align-items: center;
    font-family: "Gill Sans Std";
}

.tour.popover .contentP img {
    padding: 0 15px;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

.tour.popover .popover-title {
    background: transparent;
    border-bottom: 0;
}

.tour.popover h2 {
    color: #6445e1;
    text-align: center;
    font-size: 22px;
}

.tour.popover .popover-content {
    font-size: 14px;
    color: #4c4c4c;
    width: 100%;
    text-align: justify;
    line-height: normal;
}

.tour.popover .popover-content .intro__text {
    height: 150px;
    overflow: auto;
}

.tour.popover .popover-content .intro__text {
    padding: 0 10px;
}

.tour.popover .navigation {
    padding: 15px;
    padding-top: 10px;
    border-top: 1px solid #e5e5e5;
}

.tour.popover .btn {
    background-color: #6445e1;
    color: #fff;
    font-size: 12px;
    padding: 6px 12px;
    border-radius: 5px;
}

.tour.popover .btn[data-role="end"] {
    border: 1px solid #6445e1;
    color: #6445e1;
    background-color: transparent;
    margin-left: 20px;
}

/*---- home ----*/
#HomeButton {
    position: absolute;
    top: 80px;
    right: 20px;
    z-index: 50;
}

.audio-player2,
.audio-player {
    height: 50px;
    width: 100%;
    max-width: 350px;
    margin: auto;
    color: white;
    font-size: 0.75em;
    display: grid;
    grid-template-rows: 6px auto;
    padding-top: 5px;
}

.audio-player2 {
    margin-top: 20px;
}

.audio-player2 .timeline,
.audio-player .timeline {
    background: #e7e7e7;
    width: 100%;
    position: relative;
    cursor: pointer;
    border-radius: 0.25rem;
}

.audio-player2 .timeline .progress,
.audio-player .timeline .progress {
    background: #1c313a;
    width: 0%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    overflow: visible;
}

.audio-player2 .timeline .progress::after,
.audio-player .timeline .progress::after {
    content: "";
    background: #1c313a;
    width: 15px;
    height: 15px;
    border-radius: 10px;
    position: absolute;
    right: -10px;
}

.audio-player2 .controls,
.audio-player .controls {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}

.audio-player2 .controls > *,
.audio-player .controls > * {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #e7e7e7;
    height: 20px;
    border-radius: 50px;
}

.audio-player2 .controls .toggle-play.play,
.audio-player .controls .toggle-play.play {
    width: 20px;
    height: 20px;
    position: relative;
    display: flex;
    justify-content: center;
}

.audio-player2 .controls .toggle-play.play::after,
.audio-player .controls .toggle-play.play::after {
    content: "";
    cursor: pointer;
    position: absolute;
    left: calc(50% - 3px);
    top: calc(50% - 5px);
    height: 0;
    width: 0;
    border: 5px solid #0000;
    border-left: 9px solid #1c313a;
}

.audio-player2 .controls .toggle-play.pause,
.audio-player .controls .toggle-play.pause {
    height: 10px;
    width: 20px;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.audio-player2 .controls .toggle-play.pause:before,
.audio-player .controls .toggle-play.pause:before {
    background: #1c313a;
    content: "";
    height: 10px;
    width: 3px;
    margin-right: 1.5px;
}

.audio-player2 .controls .toggle-play.pause:after,
.audio-player .controls .toggle-play.pause:after {
    margin-left: 1.5px;
    background: #1c313a;
    content: "";
    height: 10px;
    width: 3px;
}

.audio-player2 .controls .time,
.audio-player .controls .time {
    display: flex;
    background: transparent;
}

.audio-player2 .controls .time .current {
    display: none;
}

.audio-player2 .controls .time .divideraudio {
    display: none;
}

.audio-player2 .controls .time > *,
.audio-player .controls .time > * {
    padding: 2px;
    color: #1c313a;
}

.audio-player2 .controls .time > * {
    color: #fff;
}

.audio-player2 .controls .volume-container,
.audio-player .controls .volume-container {
    cursor: pointer;
    position: relative;
    z-index: 2;
    width: 20px;
}

.audio-player2 .controls .volume-container .icono-volumeMedium {
    display: flex;
    align-items: center;
}

.audio-player2 .controls .volume-container .volume-button,
.audio-player .controls .volume-container .volume-button {
    height: 26px;
    display: flex;
    align-items: center;
}

.audio-player2 .controls .volume-container .volume-button .fa-volume-up::before,
.audio-player .controls .volume-container .volume-button .fa-volume-up::before {
    color: #1c313a;
}

.audio-player2 .controls .volume-container .volume-slider,
.audio-player .controls .volume-container .volume-slider {
    position: absolute;
    left: 0px;
    top: 20px;
    z-index: -1;
    width: 0;
    height: 9px;
    background: #e7e7e7;
    transition: 0.25s;
}

.audio-player2 .controls .volume-container .volume-slider .volume-percentage,
.audio-player .controls .volume-container .volume-slider .volume-percentage {
    background: #3596e0;
    height: 100%;
    width: 75%;
}

.audio-player2 .controls .volume-container:hover .volume-slider,
.audio-player .controls .volume-container:hover .volume-slider {
    left: -123px;
    width: 120px;
}

/*---- time line ----*/
.timeline-container {
    width: 100%;
    position: relative;
    margin-bottom: 40px;
}

.timeline-line {
    position: absolute;
    top: calc(50% - 10px);
    width: 100%;
    height: 2px;
    background-color: black;
    overflow: hidden;
}

.timeline-items {
    display: flex;
    position: relative;
    justify-content: flex-start;
    overflow-x: auto;
    padding-top: 30px;
    padding-bottom: 108px;
    /* To allow space for the horizontal scrollbar */
    margin-bottom: -20px;
    /* To offset the extra padding */
    -ms-overflow-style: none;
    /* Hide scrollbar on Microsoft Edge and IE */
    scrollbar-width: none;
    /* Hide scrollbar on Firefox */
    transition: transform 5s ease-in-out;
}

.contenido-time-line {
    background: #eee;
    padding: 10px;
    margin-bottom: 60px;
}

.timeline-item {
    width: 250px;
    height: 260px;
    flex-shrink: 0;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.title-time-line {
    height: 40px !important;
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

.title-time-line .title-box {
    color: #1f6aac;
    border: 1px solid #1f6aac;
    border-radius: 5px;
    padding: 4px 10px 2px 10px;
}

.contenido-time-line {
    position: relative;
    display: flex;
    align-items: center;
    font-size: 0.8rem;
    height: 115px !important;
}

.contenido-time-line::before {
    content: "";
    bottom: -25px;
    position: absolute;
    width: 2px;
    height: 20px;
    background: #000;
}

.contenido-time-line::after {
    content: "";
    bottom: -45px;
    position: absolute;
    width: 20px;
    height: 20px;
    border: 2px solid #1f6aac;
    background: #2f8adb;
    border-radius: 20px;
}

.timeline-item > div {
    width: 100%;
    height: fit-content;
    justify-content: center;
    display: flex;
}

.timeline-item-above {
    height: 310px;
    padding-bottom: 300px;
}

.timeline-item-below {
    height: 300px;
    padding-top: 180px;
}

.timeline-item-below .date-time-line {
    margin-top: -40px;
    order: 1;
}

.timeline-item-below .contenido-time-line {
    order: 3;
    margin-bottom: 0;
}

.timeline-item-below .title-time-line {
    margin-bottom: 10px;
    position: relative;
    margin-top: 40px;
    order: 2;
}

.timeline-item-below .contenido-time-line::before,
.timeline-item-below .contenido-time-line::after {
    content: none;
}

.timeline-item-below .title-time-line::before {
    content: "";
    top: -20px;
    position: absolute;
    width: 2px;
    height: 20px;
    background: #000;
}

.timeline-item-below .title-time-line::after {
    content: "";
    top: -40px;
    position: absolute;
    width: 20px;
    height: 20px;
    border: 2px solid #1f6aac;
    background: #2f8adb;
    border-radius: 20px;
}

.time-line-button {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 30px;
    height: 30px;
    width: 30px;
    border: 2px solid #1f6aac;
    background: #2f8adb;
    transition: all 0.2s ease;
    cursor: pointer !important;
}

.time-line-button:hover {
    background: #fff;
}

.time-line-button i {
    color: #fff;
    cursor: pointer !important;
    transition: all 0.2s ease;
}

.time-line-button:hover i {
    color: #2f8adb;
}

.a .date-time-line {
    color: #1d751b;
}

.b .date-time-line {
    color: #fbd02c;
}

.c .date-time-line {
    color: #ef7c8e;
}

.d .date-time-line {
    color: #bc513e;
}

.e .date-time-line {
    color: #3e89bc;
}

.f .date-time-line {
    color: #c26dbc;
}

.g .date-time-line {
    color: #fc914e;
}

.h .date-time-line {
    color: #1d751b;
}

.i .date-time-line {
    color: #fbd02c;
}

.j .date-time-line {
    color: #ef7c8e;
}

.k .date-time-line {
    color: #3e89bc;
}

/*---- responsive ----*/
@media (max-width: 1024px) {
    .main-row {
        flex-wrap: nowrap;
    }

    .aside {
        width: 30%;
        background: #fff;
    }

    .aside .aside__container {
        padding: 50px 20px;
    }

    .content {
        width: 70%;
    }

    .content.collapseAside {
        width: 100%;
    }

    .content.collapseAside .etnohistoria .audio__Card .card .card-content .tab-content,
    .etnohistoria .audio__Card .card .card-content .tab-content {
        padding: 10px 20px 20px;
    }

    .tour-backdrop {
        max-width: 100%;
    }

    .etnohistoria .audio__Card .card .card-content::before {
        width: 230px;
        height: 230px;
        left: -47px;
        bottom: -47px;
    }

    .collapseAside .container-info .content__tabulador {
        width: 50%;
    }

    .container-info .content__tabulador {
        width: 80%;
    }

    .collapseAside .historical__aspects .card {
        width: 80%;
    }

    .historical__aspects .card {
        width: 80%;
    }

    .collapseAside .swiper .imagecontainer {
        height: 400px;
    }

    .swiper .imagecontainer {
        height: 300px;
    }
}

@media (max-width: 11170px) {
    .aside .logos .d-flex {
        flex-wrap: wrap;
        justify-content: center;
    }

    .aside .logos .igac,
    .aside .logos .ampiicanke {
        margin-top: 20px;
    }

    .aside .logos .act:last-child {
        margin-top: 20px;
    }

    .btn-info a {
        text-align: center;
    }
}

@media (max-width: 1024px) {
    #mapaActores .tab-content .image-container {
        height: 268px;
    }
}

@media (max-width: 960px) {
    #mapaActores .mapa-modal,
    .historical__aspects {
        width: 85%;
    }
    .content {
        width: 100%;
        position: relative;
    }
    .etnohistoria .audio__Card .card .card-content::before {
        bottom: -27px;
    }
    .etnohistoria .audio__Card .card .card-content .tab-content {
        padding: 10px 10px 10px;
    }
}

@media (min-width: 769px) {
    .mapa-actores-content .bloque-links .expand-width {
        width: 100% !important;
    }
}

@media (max-width: 768px) {
    .aside {
        width: 45%;
    }

    .content.sizer {
        height: inherit;
        position: relative;
    }

    .referentes .container {
        overflow-y: auto;
    }

    .referentes .referentes__item {
        width: 150px;
        min-width: 150px;
    }

    .mapa-actores-content .row {
        display: block;
    }

    .mapa-actores-content .bloque-links,
    .mapa-actores-content .bloque-gallery {
        max-width: 100%;
        width: 100%;
    }

    .mapa-actores-content .bloque-links .expand-width {
        padding-bottom: 10px;
    }

    .mapa-actores-content .bloque-links .nav-pills {
        display: flex;
        flex-direction: inherit !important;
    }

    .mapa-actores-content .bloque-links .nav-pills-container {
        overflow-y: auto;
    }

    .mapa-actores-content .bloque-links .nav-link {
        margin-right: 10px;
    }

    .mapa-actores-content .bloque-links .nav-link:last-child {
        margin-right: 0;
    }

    .mapa-actores-content .bloque-gallery {
        margin-top: 5px;
    }

    .historical__aspects .card::after,
    #mapaActores .tab-content::after {
        width: 73px;
        top: -10px;
        right: -30px;
    }

    .unexpanded .etnohistoria {
        display: block;
    }

    .unexpanded .etnohistoria .audio__Card {
        position: relative;
    }

    .unexpanded .etnohistoria .audio__Card .card {
        width: 40vw;
    }

    .unexpanded .etnohistoria .content_etno_text {
        width: 100% !important;
        max-width: 100%;
    }

    .unexpanded .etnohistoria .audio__Card {
        margin-top: 20px;
    }

    .unexpanded .etnohistoria .audio__Card .p-relative {
        height: auto !important;
        width: 100%;
    }

    .unexpanded .etnohistoria .audio__Card .p-relative .card {
        width: 100%;
    }

    .unexpanded .etnohistoria .audio__Card .card .card-content {
        border-radius: 10px;
    }

    .unexpanded .etnohistoria .audio__Card .card .card-content::after {
        width: 60px;
        height: 60px;
        bottom: -10px;
        left: -20px;
    }

    .etnohistoria .audio__Card .card {
        width: 40vw;
    }

    #EtnoHistoria_Video {
        height: 128px;
    }

    .collapseAside .container-info .content__tabulador {
        width: 80%;
    }

    .container-info .content__tabulador {
        width: 80%;
    }

    .collapseAside .swiper .imagecontainer {
        height: 320px;
    }

    .swiper .imagecontainer {
        height: 320px;
    }

    .collapseAside .historical__aspects .card {
        width: 100%;
    }

    .historical__aspects .card {
        width: 100%;
    }
}

@media (max-width: 576px) {
    .aside {
        width: 80%;
        z-index: 10000;
    }

    .content.unexpanded,
    .content.position-absolute-elem {
        position: absolute;
    }

    #puebloInfoExpedicion .btn-info,
    #mapaActores .btn-info,
    #bibliografia .btn-info {
        left: auto;
        right: -15px;
    }

    .historical__aspects .card::after,
    #mapaActores .tab-content::after {
        right: -20px;
    }

    #mapaActores .tab-content .image-container {
        height: 250px;
    }

    #mapaActores .title-tab {
        text-align: center;
    }

    .text-center {
        width: 100%;
    }

    .content__banner__title {
        line-height: normal;
    }

    .iframeyoutubeaudio {
        width: 100%;
    }

    .portada {
        width: 100%;
        margin-top: 0;
        padding-left: 30px;
        padding-right: 30px;
    }

    .portada .justify-content-center {
        flex-wrap: wrap;
    }

    .portada .justify-content-center #ID_Cofan {
        margin: 0 10px 20px 10px !important;
    }

    #AudioCOFAN {
        margin-bottom: 20px;
    }

    .iframeyoutube {
        width: 100%;
        height: 222px;
    }

    .iframeyoutube.expand {
        width: 100%;
        height: 222px;
    }

    .popover[class*="tour-"].orphan.main {
        max-width: 370px !important;
        width: 370px;
    }

    .etnohistoria {
        display: block;
    }

    .etnohistoria::before {
        width: 80px;
        height: 90px;
        top: -44px;
        left: 28px;
    }

    .etnohistoria .content_etno_text {
        width: 100% !important;
        max-width: 100%;
    }

    .etnohistoria .audio__Card {
        position: relative;
        right: -30px;
        margin-top: 20px;
    }

    .etnohistoria .audio__Card .card .card-content {
        padding: 20px;
    }

    .etnohistoria .audio__Card .p-relative {
        height: inherit !important;
    }

    .etnohistoria .audio__Card .card {
        width: 100%;
    }

    .etnohistoria .audio__Card .card .card-content::after {
        width: 60px;
        height: 60px;
        bottom: -20px;
        left: -50px;
    }

    .videoIn {
        height: 160px;
    }

    .container-info {
        padding-left: 30px;
        padding-right: 30px;
    }

    .collapseAside .container-info .content__tabulador {
        width: 100%;
    }

    .container-info .content__tabulador {
        width: 100%;
    }

    .container-info {
        height: inherit;
    }

    .slider {
        padding-right: 30px;
        padding-left: 30px;
    }

    .collapseAside .swiper .imagecontainer {
        height: 180px;
    }

    .swiper .imagecontainer {
        height: 180px;
    }

    .team .title {
        padding: 0 30px;
    }

    .team .credit__item .title {
        height: 55px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .team .credit__item {
        padding: 0 20px;
    }

    .popover .contentP {
        display: block !important;
    }

    .popover .contentP img {
        width: 100%;
        margin-bottom: 20px;
    }
}

.leaflet-control-zoomhome a {
    font: bold 18px "Lucida Console", Monaco, monospace;
}

a.leaflet-control-zoomhome-in,
a.leaflet-control-zoomhome-out {
    font-size: 1.5em;
    line-height: 26px;
}

.zoomhome-img {
    margin: auto;
    vertical-align: middle;
    display: inline-block;
    height: 0.95em;
    width: 0.95em;
}

/*Legend specific*/
.legend {
    padding: 6px 8px;
    background: white;
    background: rgba(255, 255, 255, 0.8);
    margin-bottom: 15px !important;
    line-height: 24px;
    color: #555;
}

.legend h4 {
    text-align: center;
    font-size: 16px;
    margin: 2px 12px 8px;
    color: #777;
}

.legend span {
    position: relative;
    bottom: 3px;
}

.legend i {
    width: 18px;
    height: 18px;
    float: left;
    margin: 0 8px 0 0;
    opacity: 0.7;
}

.legend i.icon {
    background-size: 18px;
    background-color: rgba(255, 255, 255, 1);
}

.leaflet-control-minimap {
    margin-bottom: 30px !important;
}