@import 'https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Noto+Sans+JP:wght@100..900&display=swap';html,body {
    scroll-behavior: smooth
}

html,body,h1,h2,h3,.buttonstyles,p,a,li,input,select,label,span {
    font-family: dm sans,sans-serif!important
}

html,body,h1,h2,h3,.buttonstyles,p,a,li,input,select,label,span {
    font-family: dm sans,sans-serif!important
}

h1,h2,h3,h4,h5,h6 {
}

h2,.h2 {
}

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 {
}

h1,h2,h3,h4,h5,h6 {
}

p {
    font-size: 14px
}

span {
    font-size: 13px
}

.container h2 {
    letter-spacing: 0;
    font-family: dm sans,sans-serif;
    font-weight: 700;
    line-height: 1;
    margin: 20px 0
}

.container p {
    font-family: dm sans,sans-serif;
    font-weight: inherit;
    letter-spacing: 0;
    font-size: inherit;
    margin-top: revert;
    margin-bottom: revert
}

body {
    font-family: dm sans,sans-serif;
    margin: 0;
    padding: 0;
    background-color: #fff;
    min-width: 425px;
    line-height: inherit
}

html,body {
    scroll-behavior: smooth
}

html,body,h1,h2,h3,.buttonstyles,p,a,li,input,select,label,span {
    font-family: dm sans,sans-serif!important
}

body {
    font-family: dm sans,sans-serif;
    margin: 0;
    padding: 0;
    background-color: #fff;
    min-width: 425px
}

.storepage .container .col-12 {
    padding: 0
}

.caminos {
    position: relative;
    width: 425px;
    margin: 0 auto
}

.camino1 {
    text-align: center;
    position: absolute;
    top: 220px;
    right: 0;
    z-index: 1
}

.camino1 svg {
    width: 90%;
    margin-right: 23px;
    margin-top: 56px
}

.camino2 {
    text-align: center;
    position: absolute;
    top: 1047px;
    right: 0;
    z-index: 1
}

.camino2 svg {
    width: 95%;
    margin-right: -12px;
    margin-top: 63px
}

.camino3 {
    text-align: center;
    position: absolute;
    top: 1433px;
    right: 0;
    z-index: 1
}

.camino3 svg {
    width: 87%;
    margin-right: 0;
    margin-top: 73px
}

.camino4 {
    text-align: center;
    position: absolute;
    top: 2100px;
    right: 0;
    z-index: 1
}

.camino4 svg {
    width: 90%;
    margin-right: 0;
    margin-top: 60px
}

.camino5 {
    text-align: center;
    position: absolute;
    top: 2630px;
    right: 0;
    z-index: 1
}

.camino5 svg {
    width: 88%;
    margin-right: 1px;
    margin-top: 74px
}

.camino6 {
    text-align: center;
    position: absolute;
    top: 3115px;
    right: 0;
    z-index: 1
}

.camino6 svg {
    width: 45%;
    margin-right: 80px;
    margin-top: 130px
}

.camino7 {
    text-align: center;
    position: absolute;
    top: 3495px;
    right: 0;
    z-index: 1
}

.camino7 svg {
    width: 92%;
    margin-right: -13px;
    margin-top: 107px
}

.camino8 {
    text-align: center;
    position: absolute;
    top: 3900px;
    right: 0;
    z-index: 1
}

.camino8 svg {
    width: 70%;
    margin-right: -43px;
    margin-top: 115px
}

.camino9 {
    text-align: center;
    position: absolute;
    top: 4170px;
    right: 50%;
    z-index: 1
}

.camino9 svg {
    width: 3px;
    margin-right: -1px;
    margin-top: 98px
}

.container {
    max-width: 425px;
    min-height: 100vh;
    margin: 0 auto;
    padding-top: 20px;
    background-color: #fff
}

.container_pasado {
    position: relative;
    max-width: 425px;
    min-height: 100vh;
    margin: 0 auto;
    padding-top: 20px;
    background-color: #fff;
    box-shadow: 0 0 0 rgba(0,0,0,.1)
}

.container_presente {
    max-width: 425px;
    margin: 0 auto;
    padding-top: 0;
    background-color: #fff;
    box-shadow: 0 0 0 rgba(0,0,0,.1)
}

.container_futuro {
    max-width: 425px;
    margin: 0 auto;
    padding-bottom: 50px;
    padding-top: 0;
    background-color: #fff;
    box-shadow: 0 0 0 rgba(0,0,0,.1)
}

.header40 {
    width: 100%;
    margin: 0 auto;
    padding: 20px;
    background-color: #fff;
    text-align: center;
    color: #212529;
    box-sizing: border-box
}

.header40 {
    height: auto
}

.texto_logo {
    font-size: 14px
}

.sub_header {
    width: 100%;
    margin: 0 auto;
    padding: 20px;
    background-color: #ccc;
    text-align: center;
    box-sizing: border-box
}

.line_container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 80%;
    margin: 0 auto
}

.circle_pasado {
    width: 20px;
    height: 20px;
    background-color: #e20026;
    border: 2px solid #e20026;
    border-radius: 50%
}

.pasado a {
    text-decoration: none;
    color: #e20026
}

.circle_presente {
    width: 18px;
    height: 18px;
    background-color: none;
    border: 2px solid #e20026;
    border-radius: 50%
}

.presente a {
    text-decoration: none;
    color: #e20026
}

.circle_futuro {
    width: 18px;
    height: 18px;
    background-color: none;
    border: 2px solid #e20026;
    border-radius: 50%
}

.futuro a {
    text-decoration: none;
    color: #e20026
}

.line {
    flex-grow: 1;
    height: 2px;
    background-color: #e20026
}

.line_text {
    padding-top: 10px;
    display: flex;
    width: 85%;
    align-items: center;
    justify-content: space-between;
    font-size: 10px;
    font-weight: 700;
    margin: 0 auto;
    text-decoration: underline;
    color: #e20026
}

.sub_header {
    height: 60px;
    margin-top: 20px
}

.sub_header {
    width: 100%;
    margin: 0 auto;
    padding: 20px;
    background-color: #fff;
    text-align: center;
    box-sizing: border-box
}

.nuestros_pasos {
    width: 100%;
    margin-top: 50px;
    padding-top: 5px;
    height: 60px;
    background-color: #e20026;
    color: #fff;
    font-size: 10px;
    text-align: center;
    font-size: 14px;
    line-height: 5px
}

.content_pasado {
    opacity: 1;
    overflow: hidden;
    transition: max-height .5s ease-out,opacity .5s ease-out
}

.content_pasado.hidden {
    max-height: 0;
    opacity: 0
}

.desplegar_pasado {
    width: 20px;
    height: auto;
    transition: transform .5s ease-out
}

.desplegar_pasado.rotated {
    transform: rotate(180deg)
}

.creacion_pikolinos {
    display: flex;
    justify-content: space-between;
    margin: 30px 20px 0;
    gap: 10px
}

.creacion_pikolinos_left {
    width: calc(66.67% - 5px) !important;
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.creacion_pikolinos_left img {
    width: 100%;
    height: auto
}

img.img_carousel {
    width: 100%;
    border-radius: 20px
}

.creacion_pikolinos_right {
    width: calc(33.33% - 5px);
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    z-index: 1
}

.texto1984_1 p,.texto1984_2 {
    margin: 0;
    padding: 0
}

.texto1984_1 p {
    font-size: 20px;
    font-weight: 700;
    line-height: 25px
}

.texto1984_2 {
    margin-top: 5px;
    font-size: 13px;
    font-weight: 400;
    line-height: 18px
}

.creacion_pikolinos_1 {
    display: flex;
    justify-content: space-between;
    margin: 0 20px
}

.creacion_pikolinos_left_1 {
    width: calc(66.67% - 5px);
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    font-size: 13px;
    line-height: 18px;
    z-index: 1
}

.creacion_pikolinos_left_1 p {
    font-size: 13px;
    font-weight: 400;
    line-height: 18px
}

.creacion_pikolinos_right_1 img {
    width: 75%;
    height: auto;
    margin-top: 50px
}

.creacion_pikolinos_right_1 {
    width: calc(33.33% - 5px);
    background-color: transparent;
    padding: 0;
    box-sizing: border-box;
    z-index: 0
}

.primer_logo_pikolinos {
    display: flex;
    justify-content: space-between;
    margin: 0 20px 20px;
    z-index: 1
}

.primer_logo_pikolinos_left {
    width: calc(33.33% - 5px);
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.primer_logo_pikolinos_left img {
    width: 100%;
    height: auto
}

.primer_logo_pikolinos_right {
    position: relative;
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 10px;
    margin-left: 24px;
    box-sizing: border-box;
    height: 50px;
    z-index: 1;
    font-size: 13px;
    font-weight: 700
}

.primer_logo_pikolinos_right p {
    font-size: 13px;
    font-weight: 700;
    line-height: 18px
}

.romana {
    display: flex;
    justify-content: space-between;
    margin: 0 20px 20px;
    z-index: 1
}

.romana_left {
    position: relative;
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 10px;
    box-sizing: border-box;
    height: 120px;
    z-index: 1;
    align-content: end;
    font-size: 13px;
    font-weight: 700
}

.romana_right {
    width: calc(45% - 5px);
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.romana_right img {
    width: 100%;
    height: auto
}

.texto_romana {
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
    margin-bottom: 20px
}

.year {
    font-size: 17px;
    font-weight: 700
}

.a1989 {
    width: 80%;
    margin: 0 0 0 25px;
    height: auto;
    background-color: transparent;
    text-align: left;
    z-index: 1;
    position: relative;
    font-weight: 700;
    font-size: 13px
}
.a1989 p{
    text-align: left;
}

.a1996 {
    display: flex;
    justify-content: space-between;
    margin: 80px 20px 0;
    z-index: 1;
    gap: 10px
}

.a1996_left {
    position: relative;
    width: calc(33.33% - 5px);
    background-color: transparent;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1;
    text-align: end;
    font-weight: 700;
    margin-top: -10px
}

.a1996_right {
    width: calc(66.67% - 5px) !important;
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.a1996_right img {
    width: 100%;
    height: auto
}

.texto_a1996_1 {
    text-align: end;
    font-size: 18px;
    line-height: 23px;
    font-weight: 700
}

.texto_a1996_2 {
    text-align: end;
    font-size: 13px;
    font-weight: 400;
    line-height: 18px
}

.a1997 {
    display: flex;
    justify-content: space-between;
    margin: 0 20px 20px;
    z-index: 1
}

.a1997_left {
    position: relative;
    width: calc(33.33% - 5px);
    background-color: transparent;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1;
    text-align: end;
    font-weight: 700;
    margin-top: -10px
}

.a1997_right {
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1;
    text-align: end
}

.a1997_right img {
    width: 100%;
    height: auto
}

.texto_a1997_1 {
    text-align: end;
    font-size: 17px
}

.texto_a1997_2 {
    text-align: end;
    font-size: 12px;
    font-weight: 400
}

.texto_a1997 {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400
}

.jerez {
    display: flex;
    justify-content: space-between;
    margin: 0 20px 20px;
    z-index: 1
}

.jerez_left {
    position: relative;
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 10px;
    box-sizing: border-box;
    height: 120px;
    z-index: 1;
    align-content: end;
    font-size: 13px;
    font-weight: 700
}

.jerez_right {
    width: calc(25% - 5px);
    background-color: transparent;
    padding: 0;
    box-sizing: border-box;
    height: 120px;
    z-index: 1
}

.jerez_right img {
    width: 100%;
    height: auto
}

.texto_jerez {
    font-size: 13px;
    margin-bottom: 18px;
    font-weight: 700
}

.a2002 {
    width: 95%;
    margin: 10px 0 30px;
    height: auto;
    background-color: transparent;
    text-align: right;
    z-index: 1;
    position: relative;
    font-weight: 700;
    font-size: 13px
}

.a2002 {
    font-size: 13px;
    font-weight: 700
}

.video1 {
    margin: 20px 0;
    position: relative;
    z-index: 1
}

.video1 img {
    width: 100%;
    height: 150px;
    object-fit: cover
}

.cambio_logo {
    display: flex;
    justify-content: space-between;
    margin: 30px 20px;
    z-index: 1
}

.cambio_logo_left {
    position: relative;
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 10px;
    box-sizing: border-box;
    height: auto;
    z-index: 1;
    align-content: end;
    font-size: 13px;
    font-weight: 700
}

.cambio_logo_right {
    width: calc(33.33% - 5px);
    background-color: #fff;
    padding: 0;
    align-content: center;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.cambio_logo_right img {
    width: 100%;
    height: auto
}

.texto_cambio_logo {
    font-size: 13px;
    font-weight: 700;
    margin-left: -14px
}

.a2006 {
    width: 85%;
    margin: 37px 29px;
    height: auto;
    background-color: transparent;
    text-align: left;
    z-index: 1;
    position: relative;
    font-weight: 700;
    font-size: 13px
}

.a2006 p {
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.fuencarral {
    display: flex;
    justify-content: space-between;
    margin: 0 20px 40px;
    z-index: 1
}

.fuencarral_left {
    position: relative;
    width: calc(33.33% - 5px);
    background-color: transparent;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.fuencarral_left img {
    width: 100%;
    height: auto
}

.fuencarral_right {
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 0;
    text-align: right;
    align-content: center;
    font-size: 13px;
    font-weight: 700;
    box-sizing: border-box;
    z-index: 1
}

.texto_fuencarral {
    font-size: 13px;
    font-weight: 700
}

.a2007 {
    display: flex;
    justify-content: space-between;
    margin: 0 20px
}

.a2007_left {
    width: calc(66.67% - 5px)!important;
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.a2007_left img {
    width: 100%;
    height: auto
}

.a2007_right {
    width: calc(33.33% - 5px);
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    z-index: 1
}

.texto2007_1 p,.texto2007_2 {
    margin: 0;
    padding: 0
}

.texto2007_1 p {
    font-size: 18px;
    font-weight: 700;
    line-height: 23px
}

.texto2007_2 {
    margin-top: 5px;
    font-size: 13px;
    font-weight: 400;
    line-height: 18px
}

.a2009 {
    width: 90%;
    margin: 35px 20px 20px;
    height: auto;
    background-color: #fff;
    text-align: left;
    z-index: 1;
    position: relative;
    font-weight: 700;
    font-size: 13px
}

.a2009 p {
    font-size: 13px;
    font-weight: 700
}

.lisboa {
    display: flex;
    justify-content: space-between;
    margin: 20px 20px 80px;
    z-index: 1
}

.lisboa_left {
    position: relative;
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 0;
    margin-left: 10px;
    box-sizing: border-box;
    height: 120px;
    z-index: 1;
    align-content: end;
    font-size: 13px;
    font-weight: 700
}

.lisboa_right {
    width: calc(33.33% - 5px);
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    height: 120px;
    z-index: 1
}

.lisboa_right img {
    width: 100%;
    height: auto
}

.texto_lisboa {
    font-size: 13px;
    font-weight: 700
}

.maasai {
    width: 95%;
    margin: 30px -12px;
    padding-top: 20px;
    height: auto;
    background-color: transparent;
    text-align: right;
    z-index: 1;
    position: relative;
    font-weight: 700;
    font-size: 13px
}

.maasai p {
    font-size: 13px;
    font-weight: 700
}

.video2 {
    margin: 20px 0;
    position: relative;
    z-index: 1
}

.video2 img {
    width: 100%;
    height: auto
}

.tarifa {
    display: flex;
    justify-content: space-between;
    margin: 0 15px 20px 20px;
    z-index: 1
}

.tarifa_left {
    position: relative;
    width: calc(33.33% - 5px);
    background-color: transparent;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.tarifa_left img {
    width: 100%;
    height: auto
}

.tarifa_right {
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 0;
    text-align: right;
    align-content: center;
    font-size: 13px;
    font-weight: 700;
    box-sizing: border-box;
    z-index: 1
}

.texto_tarifa {
    font-size: 13px;
    font-weight: 700
}

.a2015 {
    width: 72%;
    margin: 49px 20px 87px;
    height: auto;
    background-color: transparent;
    text-align: center;
    z-index: 1;
    position: relative;
    font-weight: 700;
    font-size: 13px
}

.a2015 p {
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
}

.a2016 {
    display: flex;
    justify-content: space-between;
    margin: -10px 20px 80px
}

.a2016_left {
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    display: flex;
    z-index: 1
}

.a2016_left img {
    width: 100%;
    height: auto
}

.img2016_1 {
    display: block;
    width: 50%
}

.img2016_2 {
    display: block;
    width: 50%;
    margin-left: 10px
}

.a2016_right {
    width: calc(33.33% - 5px);
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    z-index: 1
}

.texto2016_1 p,.texto2016_2 {
    margin: 0;
    padding: 0
}

.texto2016_1 p {
    font-size: 18px;
    font-weight: 700;
    line-height: 23px
}

.texto2016_2 {
    margin-top: 5px;
    font-size: 13px;
    line-height: 18px
}

.a2018 {
    display: flex;
    justify-content: space-between;
    margin: 50px 20px 0;
    z-index: 1
}

.a2018_left {
    position: relative;
    width: calc(33.33% - 5px);
    background-color: transparent;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1;
    text-align: end;
    font-weight: 700;
    margin-top: -10px
}

.a2018_right {
    width: calc(66.67% - 5px);
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.a2018_right img {
    width: 100%;
    height: auto
}

.texto_a2018_1 {
    text-align: end;
    font-size: 18px;
    font-weight: 700;
    line-height: 23px
}

.texto_a2018_2 {
    text-align: end;
    font-size: 13px;
    font-weight: 400;
    line-height: 18px
}

.texto_a2018_2 p {
    font-size: 13px;
    font-weight: 400;
    line-height: 22px
}

.Berna {
    display: flex;
    justify-content: space-between;
    margin: 20px 20px 20px 35px;
    z-index: 1
}

.Berna_left {
    position: relative;
    width: calc(66.67% - 5px);
    background-color: transparent;
    padding: 10px;
    box-sizing: border-box;
    height: auto;
    z-index: 1;
    align-content: start;
    font-size: 13px;
    font-weight: 700
}

.Berna_right {
    width: calc(33.33% - 5px);
    background-color: transparent;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.Berna_right img {
    width: 100%;
    height: auto
}

.texto_Berna {
    font-size: 13px
}

.a2019 {
    width: 95%;
    margin: 50px -35px 25px;
    height: auto;
    background-color: transparent;
    text-align: right;
    z-index: 1;
    position: relative;
    font-weight: 700;
    font-size: 13px
}

.a2019 p {
    font-size: 13px;
    font-weight: 700
}

.video3 {
    margin: 20px 0;
    position: relative;
    z-index: 1
}

.video3 video {
    width: 100%;
    height: auto
}

.cantabria {
    width: 95%;
    margin: 30px -25px;
    height: auto;
    background-color: transparent;
    text-align: right;
    z-index: 1;
    position: relative;
    font-weight: 700;
    font-size: 13px
}

.cantabria p {
    font-size: 13px;
    font-weight: 700
}

.img_cantabria {
    text-align: center;
    margin-bottom: 50px;
    margin-top: 50px
}

.img_cantabria img {
    width: calc(33.33% - 5px);
    background-color: #fff;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    position: relative;
    z-index: 1
}

.a2024 {
    text-align: center;
    font-size: 24px;
    margin-top: 50px;
    font-weight: 700
}

.a2024 {
    font-size: 24px;
    font-weight: 700
}

.punto_rojo {
    margin: 0 auto;
    width: 30px;
    height: 30px;
    background-color: #e20026;
    border-radius: 50%;
    margin-bottom: 10px
}

.imgs_present {
    height: 235px;
    align-content: center
}

.content_presente {
    position: relative;
    width: 100%;
    height: auto
}

.img_presente {
    display: none;
    opacity: 0;
    transition: opacity 1s ease-in-out
}

.img_presente.active {
    display: block;
    opacity: 1
}

.desplegar_presente {
    width: 20px;
    height: auto;
    transition: transform .5s ease-out
}

.desplegar_presente.rotated {
    transform: rotate(180deg)
}

.presente_debajo {
    width: 80%;
    margin: 0 auto;
    margin-top: 30px;
    height: auto;
    background-color: #fff;
    z-index: 1;
    position: relative;
    font-size: 13px;
    text-align: center
}

.presente_debajo p {
    font-size: 13px;
    font-weight: 400;
    line-height: 18px
}

.img_presente {
    text-align: center
}

.img_presente img {
    width: calc(50% - 5px);
    background-color: #fff;
    margin-top: 20px;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1;
    border-radius: 20px
}

.logo_actual {
    text-align: center;
    margin-top: 30px
}

.logo_actual img {
    width: 80%;
    background-color: #fff;
    margin-top: 20px;
    padding: 0;
    box-sizing: border-box;
    height: auto;
    z-index: 1
}

.futuro_debajo {
    width: 80%;
    margin: 0 auto;
    margin-top: 30px;
    height: auto;
    background-color: #fff;
    z-index: 1;
    position: relative;
    font-size: 13px;
    text-align: center
}

.futuro_debajo {
    opacity: 1;
    overflow: hidden;
    transition: max-height .5s ease-out,opacity .5s ease-out
}

.futuro_debajo.hidden {
    max-height: 0;
    opacity: 0
}

.futuro_debajo p {
    font-size: 13px;
    font-weight: 400;
    line-height: 18px
}

.desplegar_futuro {
    width: 20px;
    height: auto;
    transition: transform .5s ease-out
}

.desplegar_futuro.rotated {
    transform: rotate(180deg)
}

.letra_roja {
    color: #e20026;
    font-weight: 700
}

.button-container {
    display: flex;
    flex-direction: column;
    margin-top: 30px;
    margin-bottom: 50px;
    align-items: center;
    gap: 30px
}

.button_red {
    width: 300px;
    font-size: 12px !important;
    margin: 0 auto;
    text-align: center;
    border: 0;
    background: #e20026;
    color: #fff;
    padding: 10px;
}

.botonmas {
    border: 2px solid #e20026;
    background-color: #e20026;
    color: #fff;
    font-size: 20px;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    margin-left: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    animation: pulse 1.5s infinite alternate
}

@keyframes pulse {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(1.2)
    }
}

.botonmas:hover {
    background-color: #fff;
    color: #e20026
}

.botonmas:focus {
    text-decoration: underline!important
}

.ML {
    margin-left: 5px
}

.hidden {
    display: none
}

.text-box {
    margin: auto;
    padding: 0 20px 10px;
    text-align: center;
    border: 2px solid #e20026;
    border-radius: 20px;
    background-color: rgba(255,255,255,.96);
    width: 385px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 10
}

.start {
    top: 170px !important;
    position: absolute !important;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
  }
  
  .lock {
    margin-top: 51px;
    position: fixed;
  }
  
  .bottomrelease {
    position: absolute !important;
    top: 4250px !important;
  }

.text-box img {
    display: block;
    margin: 0 auto;
    margin-top: 20px;
    width: 100px;
    height: auto
}

#textBox1.text-box img.textBoximg {
    width: 135px
}

#textBox2.text-box img.textBoximg {
    width: 140px
}

#textBox3.text-box img.textBoximg {
    width: 95px
}

#textBox4.text-box img.textBoximg {
    width: 145px
}

#textBox5.text-box img.textBoximg {
    width: 80px
}

#textBox6.text-box img.textBoximg {
    width: 135px
}

#textBox7.text-box img.textBoximg {
    width: 95px
}

#textBox8.text-box img.textBoximg {
    width: 150px
}

#textBox9.text-box img.textBoximg {
    width: 120px
}

#textBox10.text-box img.textBoximg {
    width: 110px
}

#textBox11.text-box img.textBoximg {
    width: 80px
}

#textBox12.text-box img.textBoximg {
    width: 150px
}

#textBox13.text-box img.textBoximg {
    width: 80px
}

#textBox14.text-box img.textBoximg {
    width: 150px
}

#textBox15.text-box img.textBoximg {
    width: 100px
}

#textBox16.text-box img.textBoximg {
    width: 180px
}

.close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    background: 0 0;
    border: none;
    font-size: 20px;
    cursor: pointer;
    color: #e20026;
    transition: transform .5s
}

.close-btn img {
    margin-top: 5px;
    width: 18px
}

.close-btn:hover {
    transform: rotate(90deg)
}

.mySlides {
    display: none
}

img {
    vertical-align: middle
}

.slideshow-container {
    position: relative
}

.prev,.next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -22px;
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    transition: .6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none
}

.next {
    right: 0;
    border-radius: 3px 0 0 3px
}

.prev:hover,.next:hover {
    background-color: transparent
}

.text {
    color: #f2f2f2;
    font-size: 15px;
    padding: 8px 12px;
    position: absolute;
    bottom: 8px;
    width: 100%;
    text-align: center
}

.numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0
}

.dot {
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color .6s ease
}

.active,.dot:hover {
    background-color: transparent
}

.fade {
    animation-name: fade;
    animation-duration: 1s
}

.fade:not(.show) {
    opacity: initial
}

#content_pasado {
    scroll-margin-top: 200px;
}
#content_presente {
    scroll-margin-top: 200px;
}
#content_futuro {
    scroll-margin-top: 200px;
}

@keyframes fade {
    from {
        transform: translateX(-5%)
    }

    to {
        transform: translateX(0px)
    }
}

.onlyDesktop {
    display: none
}


/* CSS IDIOMAS */ 
.creacion_pikolinos{
    height: 264px;
}
.creacion_pikolinos_1{
    height: 166px;
}
.primer_logo_pikolinos{
    height: 82px;
}
.romana{
    height: 161px;
}
.a1989{
    height: 21px;
}
.a1996{
    height: 260px;
}
.a1997{
    height: 80px;
}
.jerez{
    height: 120px;
}
.a2002{
    height: 20px;
}
.cambio_logo{
    height: 66px;
}
.a2006{
    height: 39px;
}
.fuencarral{
    height: 129px;
}
.a2007{
    height: 264px;
}
.a2009{
    height: 21px;
}
.lisboa{
    height: 120x;
}
.maasai{
    height: 33px;
}
.tarifa{
    height: 131px;
}
.a2015{
    height: 39px;
}
.a2016{
    height: 247.6px;
}
.a2018{
    height: 264px;
}
.Berna{
    height: 125px;
}
.a2019{
    height: 21px;
}
.video3{
    height: 156px;
}
.cantabria{
    height: 20px;
}
.img_cantabria{
    height: 143px;
}
.a2024{
    height: 82px;
}
.primer_logo_pikolinos_right p {
    text-align: right;
}




@media only screen and (min-width: 800px) {
    .onlyDesktop {
        display:block
    }

    .rAnyos {
        position: absolute
    }

    .rectangle {
        width: 150px;
        height: 50px;
        background-color: #fff;
        border: 2px solid #e20026;
        border-radius: 5px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 24px;
        color: #e20026;
        font-weight: 700
    }

    .rAnyos {
        opacity: 1;
        left: -250px;
        transition: opacity ease-in-out .5ms
    }

    .rAnyo.fixed {
        position: fixed;
        top: 100px!important
    }

    .rAnyo.faded {
        opacity: 0
    }

    .rAnyo1984 {
        position: relative;
        top: 100px
    }

    .rAnyo1989 {
        position: relative;
        top: 675px
    }

    .rAnyo1996 {
        position: relative;
        top: 740px
    }

    .rAnyo1998 {
        position: relative;
        top: 1100px
    }

    .rAnyo2002 {
        position: relative;
        top: 1125px
    }

    .rAnyo2005 {
        position: relative;
        top: 1315px
    }

    .rAnyo2006 {
        position: relative;
        top: 1345px
    }

    .rAnyo2007 {
        position: relative;
        top: 1555px
    }

    .rAnyo2009 {
        position: relative;
        top: 1785px
    }

    .rAnyo2010 {
        position: relative;
        top: 2320px
    }

    .rAnyo2015 {
        position: relative;
        top: 2385px
    }

    .rAnyo2016 {
        position: relative;
        top: 2455px
    }

    .rAnyo2018 {
        position: relative;
        top: 2754px
    }

    .rAnyo2019 {
        position: relative;
        top: 3130px
    }

    .rAnyo2021 {
        position: relative;
        top: 3320px
    }

    .rAnyo2024 {
        position: relative;
        top: 3530px
    }

    .container {
        max-width: 100%
    }

    .header40 {
        width: 425px
    }

    .sub_header {
        width: 425px
    }

    .container_presente {
        max-width: 100%
    }

    .presente_debajo {
        width: 425px
    }

    .img_presente {
        max-width: 425px;
        margin: 0 auto
    }

    .logo_actual {
        max-width: 425px;
        margin: 0 auto
    }

    .container_futuro {
        max-width: 100%
    }

    .futuro_debajo {
        width: 425px
    }

    .text-box {
        margin-left: 450px
    }
}