section {
    padding-bottom: 17.5rem;
}
section .top .section-tit3 {
    margin-top: 20rem;
}
section .top .btn {
    width: 62rem;
    margin-top: 5rem;
}

section .top .blq-img picture img {
    width: 165.5rem;
}
section .top .top-xs1 {
    width: 100vw;
    margin-top: 5.5rem;
    margin-bottom: 7.5rem;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}
section .top .top-xs1 img {
    width: 100%;
}

section .mid .section-tit3 {
    margin-bottom: 5rem;
}
section .mid .ruta {
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);
    background-color: white;
    margin-bottom: 7.5rem;
    display: -webkit-flex;
    display: flex;
    position: relative;
}
section .mid .ruta .ruta-img {
    width: 100%;
    height: 100%;
    -o-object-position: center;
    object-position: center;
    -o-object-fit: fill;
    object-fit: cover;
}
section .mid .ruta-mapa {
    font-size: 12px;
    line-height: 14px;
}
section .mid .ruta-mapa iframe {
    width: 100%;
    border: 1px solid black;
}

/* slider-alojamiento */
section .mid .ruta .ruta-images .duaSlider {
    width: 100%;
    height: 100%;
    min-height: 88.5rem;
}
/* end slider-alojamiento */

section .mid .ruta .ruta-cont {
    padding: 7.5rem 12rem;    
}
section .mid .ruta .ruta-categoria {
    margin-bottom: 1.5rem;
    font-size: 3rem;
    text-transform: uppercase;
}
section .mid .ruta .ruta-nombre {
    margin-bottom: 4rem;   
    font-size: 7.5rem;
    font-weight: 900;
}
section .mid .ruta .ruta-txt {
    font-size: 4rem;
}
section .mid .ruta .ruta-detalles {
    margin-top: 4.5rem;
    padding-top: 4rem;
    border-top: 0.5rem solid #cedde2;
    font-size: 3rem;
    display: -webkit-flex;
    display: flex;
}
section .mid .ruta .ruta-detalles > div + div {
    margin-left: 15rem;    
}
section .mid .ruta .ruta-detalles div span:first-of-type:after{
    content: '';
    width: 5rem;
    height: 5rem;    
    margin-left: 1.25rem;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
}
section .mid .ruta .ruta-detalles .dato-distancia span:first-of-type:after {
    background-image: url('../../images/iconos/rutas-distancia.svg');
}
section .mid .ruta .ruta-detalles .dato-duracion span:first-of-type:after {
    background-image: url('../../images/iconos/rutas-duracion.svg');
}
section .mid .ruta .ruta-detalles .dato-dificultad span:first-of-type:after {
    background-image: url('../../images/iconos/rutas-dificultad.svg');
}
section .mid .ruta .ruta-detalles .dato-inicioFin1 span:first-of-type:after {
    background-image: url('../../images/iconos/rutas-inicio-fin1.svg');
}
section .mid .ruta .ruta-detalles .dato-inicioFin2 span:first-of-type:after {
    background-image: url('../../images/iconos/rutas-inicio-fin2.svg');
}
section .mid .ruta .ruta-detalles .txt-corp {
    font-size: 3.5rem;
    display: block;
}
section .mid .ruta .ruta-pin {
    margin-top: 5rem;
}
section .mid .ruta .ruta-pin p {
    font-size: 3rem;
}
section .mid .ruta .ruta-pin p:before {
    content: '';
    width: 5rem;
    height: 5rem;    
    margin-right: 1.25rem;
    background-image: url('../../images/iconos/rutas-pin.svg');
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;    
}
section .mid .ruta .ruta-pin .flex {
    display: -webkit-flex;
    display: flex;
}
section .mid .ruta .ruta-pin ul {
    list-style-type: none;
    padding-left: 0;
    margin-left: 0;
}
section .mid .ruta .ruta-pin ul li:before {
    content: '';
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background-color: #cedde2;
    margin-right: 2.5rem;
    display: inline-block;
    vertical-align: middle;
}
section .bot .section-tit3 {
    padding-top: 25rem;
}
section .bot .section-titFondo {
    transform: translate(-50%,-20rem);
}
section .bot .flex {
    margin-left: -1.87rem;
    margin-right: -1.87rem;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
section .bot .icon {
    width: 50%;
    min-height: 25rem;
    padding-left: 37.37rem;
    padding-right: 1.87rem;    
    margin-top: 7.5rem;
    position: relative;
}
section .bot .icon img {
    width: 25rem;
    position: absolute;
    left: 1.87rem;
    top: 0;
}
.ruta iframe{
    min-height: 600px;
    width: 100%;
}

@media (min-width: 768px) {
    .ruta iframe{
        min-height: 400px;
        width: 100%;
    }
    section .top .top-xs {
        display: none;
    }  
    section .top .blq-txt {
        padding-bottom: 0;
    }
    section .mid .ruta .ruta-images {
        -webkit-flex: 0 0 100rem;
        flex: 0 0 100rem;    
    }
    section .mid .ruta .ruta-cont {
        -webkit-flex-grow: 1;
        flex-grow: 1;
    }
    section .mid .ruta .ruta-pin ul {
        -webkit-columns: 2;
        -moz-columns: 2;
        columns: 2;
        -webkit-column-gap: 7.5rem;
        -moz-column-gap: 7.5rem;
        column-gap: 7.5rem;
    }
    section .mid .ruta .ruta-wikiloc {
        position: absolute;
        right: 12rem;
        top: 7.5rem;
    }
    section .mid .ruta .ruta-wikiloc img {
        width: 24.25rem;
        display: block;
    }
}
@media (max-width: 767px) {
    section {
        padding-bottom: 0;
    }
    section .btn,
    section .top .btn {
        width: 100%;
    }
    section .top .top-lg {
        display: none;
    }    
    
    section .top .blq-txt,
    section .mid .blq-txt {
        padding: 0;
        margin-top: 0;
    }    
    section .top .blq-txt {
        padding-top: 6rem;
    }
    section .top .blq-txt .section-tit4 {
        margin-bottom: 7.5rem;
        line-height: 1.3;
    }
    section .top .section-tit3 {
        margin-top: 5rem;
    }
    section .mid .section-tit3 {
        margin-top: 11.5rem;
        margin-bottom: 2.5rem;
    }
    section .mid .row {
        -webkit-flex-direction: column;
        flex-direction: column;
    }   
    section .mid .row > div {
        padding-left: 0;
        padding-right: 0;
    }
    section .mid .ruta {
        padding: 4.5rem;
        margin-bottom: 4rem;
        -webkit-flex-direction: column;
        flex-direction: column;
        positionn: static;
    }    
    section .mid .ruta .ruta-images {
        width: 100%;
    }
    section .mid .ruta .ruta-images .duaSlider,
    section #filtros-bot #pestanas-cont .alojamiento .alojamiento-images .duaSlider .duaSlider-slides,
    section #filtros-bot #pestanas-cont .alojamiento .alojamiento-images .duaSlider .duaSlider-slides > *,
    section #filtros-bot #pestanas-cont .alojamiento .alojamiento-images .parque-img {
        height: auto;
    }
    section .mid .ruta .ruta-images .duaSlider {
        height: 0;
        min-height: auto;
        padding-bottom: 88.2%;
    }    
    section .mid .ruta .ruta-img {
        width: 100%;
    }
    section #filtros-bot #pestanas-cont .alojamiento .alojamiento-cont {
        padding: 3.25rem 4.5rem 4.5rem;
        position: static;
    }
    section .mid .ruta .ruta-cont {
        padding: 4rem 0 0;
        position: relative;
    }
    section .mid .ruta .ruta-wikiloc {
        padding: 2.25rem 3.5rem;
        background-color: white;  
        margin-left: auto;
        position: absolute;    
        right: 0;
        top: -10rem;
    }
    section .mid .ruta .ruta-categoria {
        font-size: 2.5rem;
    }
    section .mid .ruta .ruta-nombre {
        margin-bottom: 2.5rem;
        font-size: 5rem;
    }
    section .mid .ruta .ruta-detalles > div + div {
        margin-left: 6rem;
    }
    section .mid .ruta .ruta-detalles div span:first-of-type {
        padding-top: 6.25rem;        
        position: relative;
        display: block;
    }
    section .mid .ruta .ruta-detalles div span:first-of-type:after {        
        margin-left: 0;
        position: absolute;
        top: 0;
        left: 0;
    }
    section .mid .ruta .ruta-pin .flex {
        -webkit-flex-direction: column;
        flex-direction: column;
    }
    section .mid .ruta .ruta-pin ul {
        width: 100%;
        padding-left: 6rem;
        margin-bottom: 0;
    }
    section .bot {
        padding-bottom: 12rem;
    }
    section .bot .section-tit3 {
        padding-top: 15.5rem;
    }
    section .bot .section-titFondo {
        font-size: 28rem;
        letter-spacing: -1rem;
        transform: translate(-50%,-5rem);
    }
    section .bot .flex {
        -webkit-flex-direction: column;
        flex-direction: column;
    }
    section .bot .icon {
        width: 100%;
        min-height: auto;
        padding-left: 21.25rem;
        margin-top: 6rem;
    }
    section .bot .icon img {
        width: 17.5rem;
        left: 0;
    }
}