@import url("https://fonts.googleapis.com/css2?family=Domine:wght@400..700&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");

/*Menu*/

.menuExposiciones .logos {
    display: flex;
}
.menuExposiciones .logos > div {
    width: 22%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.menuExposiciones .logos > div:before {
    content: "";
    border-right: 2px solid #ffffff;
    height: 34px;
    position: relative;
    left: -18px;
}

.menuExposiciones nav {
    background: -webkit-gradient(linear, left top, left bottom, from(rgb(27, 27, 25)), to(transparent));
    background: -webkit-linear-gradient(top, rgb(27, 27, 25), transparent);
    background: -o-linear-gradient(top, rgb(27, 27, 25), transparent);
    background: linear-gradient(to bottom, rgb(27, 27, 25), transparent);
    padding: 27px 0;
}
.menuExposiciones .navbar-dark .navbar-toggler {
    background-color: #20202091;
}
.menuExposiciones .fixed-top {
    z-index: 4;
}
.menuExposiciones .offcanvas-header {
    border-top: 4px solid #98212b;
}
.menuExposiciones .offcanvas-header strong {
    color: #ad212d;
}
.menuExposiciones .dropdown-menu-dark .dropdown-item.active,
.dropdown-menu-dark .dropdown-item:active {
    color: #fff;
    background-color: #48515b;
}
/*Fin menu*/
h1,
h2,
h3,
h4 {
    font-family: "Domine";
}
button.btn.btn-secondary {
    background-color: #e1d08f;
    font-weight: 600;
    color: #765e5e;
    border: 0;
}
button.btn.btn-secondary:hover {
    background-color: #eee1ad;
}
.fade {
    background-color: #000000a8;
}
.modal-header {
    border-bottom: 0px solid #dee2e6;
}
.modal-footer {
    border-top: 0px solid #dee2e6;
}
.main,
.main-fluid {
    margin-top: 0;
}
.carousel-control-prev {
    position: absolute !important;
}
   .tooltipdos {
        position: relative;
        display: inline-block;
    }
.tooltipdos .tooltipdostext {
    visibility: hidden;
    width: 124px;
    background-color: #404040;
    color: #fff;
    text-align: center;
    border-radius: 3px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    left: 2px;
    top: 0;
}
.tooltipdos .tooltipdostext::before {
    content: "";
    position: absolute;
    background: #404040;
    width: 17px;
    height: 17px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    top: 27px;
    left: 46px;
}
    .tooltipdos:hover .tooltipdostext {
        visibility: visible;
    }
#Esclavizacion p {
    font-family: "Rokkitt";
    line-height: 1.2em;
    font-size: 1.2vw;
}
#Esclavizacion section {
    display: table;
    margin: auto;
    padding: 0 6%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
span.carousel-control-prev-icon,
.carousel-control-next-icon {
    background-color: black;
    border-radius: 50%;
}
.carousel-control-prev-icon,
.carousel-control-prev {
    position: absolute;
}
.Parada1,
.Parada2,
.Parada3,
.Parada4,
.Parada5,
.Parada6,
.Parada7,
.Parada8,
.Parada9,
.Parada10,
.Parada11,
.Parada12,
.Parada13 {
    position: absolute;
    left: 44%;
    top: 36%;
    width: 171px;
    background-color: white;
}

.Parada1 {
    right: 4%;
    top: 33%;
    left: 44%;
}

.Parada2 {
    right: 4%;
    top: 36%;
    left: inherit;
}
.Parada3 {
    left: 82%;
    top: 61%;
}
.Parada4 {
    right: 4%;
    top: 36%;
    left: inherit;
}
.Parada4 {
    right: 23%;
    top: 66%;
    left: inherit;
}
.Parada5 {
    left: 37%;
    top: 56%;
}
.Parada6 {
    left: 32%;
    top: 6%;
}

.Parada7 {
    left: 58%;
    top: 12%;
}
.Parada8 {
    left: 37%;
    top: 71%;
}
.Parada9 {
    left: 61%;
    top: 46%;
}
.Parada10 {
    left: 52%;
    top: 71%;
}
.Parada11 {
    left: 26%;
    top: 30%;
}
.Parada12 {
    left: 21%;
    top: 60%;
}
.Parada13 {
    left: 6%;
    top: 36%;
}

.Parada1 p,
.Parada2 p,
.Parada3 p,
.Parada4 p,
.Parada5 p,
.Parada6 p,
.Parada7 p,
.Parada8 p,
.Parada9 p,
.Parada10 p,
.Parada11 p,
.Parada12 p,
.Parada13 p {
    font-family: arial;
    background: rgb(228, 8, 198);
    background: linear-gradient(0deg, rgba(228, 8, 198, 1) 5%, rgba(253, 89, 62, 1) 72%);
    color: #fff;
    padding: 5px 14px;
    font-family: arial !important;
    font-size: 1vw !important;
    margin: 0;
}
.Parada1 span,
.Parada2 span,
.Parada3 span,
.Parada4 span,
.Parada5 span,
.Parada6 span,
.Parada7 span,
.Parada8 span,
.Parada9 span,
.Parada10 span,
.Parada11 span,
.Parada12 span,
.Parada13 span {
    background: #fff;
    color: #f5593e;
    padding: 11px;
    width: 100%;
    display: table;
    font-size: 1vw !important;
    line-height: 1rem;
}
.Lineas::before {
    content: "";
    width: auto;
    min-width: 100%;
    height: 2px;
    background-color: #c1bbab;
    display: inherit;
    margin: 5px 0;
}

#Esclavizacion .Lineas::after {
    content: "";
    width: auto;
    min-width: 100%;
    height: 2px;
    background-color: #c1bbab;
    display: inherit;
    margin-bottom: 22px;
}

/* ------*/

#EsclavizacionParadaUno p {
    font-family: "Rokkitt";
    font-size: 1.2vw;
}
span.fondo {
    background-color: #67716a;
    display: table;
    width: 100%;
    color: white;
    line-height: 1.1em;
    padding: 21px;
    font-size: 2vw;
}
#EsclavizacionParadaUno section {
    display: table;
    margin: auto;
    padding: 0 6%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

@media (min-width: 1281px) {
    .main,
    .main-fluid {
        margin-top: 0;
    }
}
@media only screen and (max-device-width: 999px) and (orientation: portrait) {
    .rotate {
        width: 100%;
        height: 100%;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 9999;
        background: #a7a7a7 url(/sites/default/files/2023-07/rotate.gif) no-repeat center center;
        display: block;
        max-width: 100vw;
        max-height: 100vh;
    }
}

@media (max-width: 900px) {
	span.fondo {
		font-family: "Domine";
		font-size: 1.7vw;
		padding: 10px;
}
	.navbar>.container, .navbar>.container-fluid, .navbar>.container-lg, .navbar>.container-md, .navbar>.container-sm, .navbar>.container-xl, .navbar>.container-xxl {
    justify-content: flex-end;
}
    .carousel-control-prev-icon,
    .carousel-control-prev {
        position: relative;
    }
    .tooltipdos .tooltipdostext {
        left: -30px!important;
    }
    .menuExposiciones .logos {
        display: none;
    }
    .menuExposiciones nav {
        background: linear-gradient(to bottom, rgb(27 27 25 / 38%), transparent);
    }
    #Esclavizacionparadaocho .fs-2,
    .fs-3,
    .fs-4 {
        font-size: 2.3vw !important;
        line-height: 1em;
        padding: 0;
    }

    span.fondo {
        line-height: 1em !important;
    }
    h1,
    h2,
    h3,
    h4 {
        font-family: "Domine";
        font-size: 2vw;
    }
    .Parada1,
    .Parada2,
    .Parada3,
    .Parada4,
    .Parada5,
    .Parada6,
    .Parada7,
    .Parada8,
    .Parada9,
    .Parada10,
    .Parada11,
    .Parada12,
    .Parada13 {
        width: 112px;
    }

    .Parada1 p,
    .Parada2 p,
    .Parada3 p,
    .Parada4 p,
    .Parada5 p,
    .Parada6 p,
    .Parada7 p,
    .Parada8 p,
    .Parada9 p,
    .Parada10 p,
    .Parada11 p,
    .Parada12 p,
    .Parada13 p {
        font-size: 1.2vw !important;
        line-height: 1em;
    }
    .Parada4 {
        right: 19%;
    }
    .Parada10 {
        left: 51.6%;
    }
    .flex.fs-5 {
        position: absolute;
        bottom: 23px;
        left: 0px;
    }
    .Parada1 span,
    .Parada2 span,
    .Parada3 span,
    .Parada4 span,
    .Parada5 span,
    .Parada6 span,
    .Parada7 span,
    .Parada8 span,
    .Parada9 span,
    .Parada10 span,
    .Parada11 span,
    .Parada12 span,
    .Parada13 span {
        font-size: 1.3vw !important;
    }
}
