*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}



body{
    background-color: #191919;
    margin: 0;
    padding: 0;
    box-sizing: border-box;

}
.contenido{
    height: 100vh;
    width: 100%;
    scroll-behavior:smooth;

}
h1{
    font-family: Jura;
    font-style: normal;
    font-weight: bold;
    font-size: 3.125vw;
    line-height: 120%;
    color: #FFFFFF;
    ;
}
h2{
    font-family: Play;
    font-style: normal;
    font-weight: bold;
    font-size: 1.042vw;
    line-height: 120%;
    color: #E94E1B;

}
h3{
    font-family: Play;
    font-style: normal;
    font-weight: normal;
    font-size: 1.198vw;
    line-height: 130%; 
    color: #FFFFFF; 
}
section, footer{
    scroll-snap-align:start;
}
section{
    height: 100vh;
    width: 100%;
  
}

.story_caption{
    position: relative;
    width: 43.4vw;
    left: 49.188vw;
    top: -20vw;
    font-family: Play;
    font-style: normal;
    font-weight: normal;
    font-size: 23px;
    line-height: 130%;
    text-align: center;
}
.story_caption h3, .story_caption h2, .story_caption h1{
    padding-bottom: 3vh;
}


.reel{
    position: relative;
    width: 33vw;
    height: 33vw;
    left: 7vw;
    top: 10vw;
    color:white;
    outline-style: solid;
    outline-width:1.250vw;
}
.reel img{
    height: 33vw;
    width: 33vw;
    position: absolute;
    top:0;
    left:0;
}

.caption{
    width: 48vw;
    position: relative;
    left: 117px;
    top: 35vh;
    width: 25.7vw;
}

.bg{
    width: 48vw;
}

.pilar_item_1{
    height: 100vh;
    background: url(../img/viajes.png);
    background-repeat: no-repeat;
    background-size:  100%;
    background-position: center center;    
}
.pilar_item_2{
    height: 100vh;
    background: url(../img/escalada.png);
    background-repeat: no-repeat;
    background-size:  100%;
    background-position: center center;    
}
.pilar_item_3{
    height: 100vh;
    background: url(../img/naturaleza.png);
    background-repeat: no-repeat;
    background-size:  100%;
    background-position: center center;    
}

footer{
    display: block;
    background: black;
    height: auto;
    text-align: center;
    text-transform: uppercase;
    color: #717171;
    font-family: Jura;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 68px;
    justify-content: center;
    align-items: center;
}
.pilar{
    display: flex;
    flex-direction:row;
    position: relative;
}
.selectors_pilar{
    display: inline-block;
    color: white;
    height: 100vh;
    width: 100%;
    text-align: right;
    font-family: Play;
    font-style: normal;
    font-weight: bold;
    font-size: 1.042vw;
    line-height: 120%;
    z-index: 90;
    position: absolute;
    right: 1.6vw;
}

.selectors_pilar label{
    position: relative;
    top: 42.3vh;
    right: 1%;
    line-height: 300%;
}
.arrows{
    display: inline-block;
    padding-right: calc( 100% * 18/1031);
    height: 100vh;
    background: url(../img/sidebar/1.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 4.5vh;
    z-index: 100;
    position: absolute;
    right: .1vw;
}

.pilar_item_1{
    position: absolute;
    top:0;
    height: 100vh;
    width: 100%;
}
.pilar_item_2{
    position: absolute;
    top:0;
    height: 100vh;
    width: 100%;
}
.pilar_item_3{
    position: absolute;
    top:0;
    height: 100vh;
    width: 100%;
}

.titulo_pilar{
    font-size: 2.5vw !important;
    line-height: 150% !important;
}

@media (max-width: 414px) {
    .arrows{
        display: none;
    }
.reel{
    position: absolute;
    width: 80vw;
    height: 80vw;
    margin: 5vw auto 0 auto;
    top: 20vw;
    left: 0;
    right: 0;
    outline-width:5vw;
}

.reel img{
    
    width: 80vw;
    height: 80vw;
    
}

.story_caption{
    top:120vw;
    left: 0;
    right: 0;
    margin: 0 auto 0 auto;
    width: 82vw;
}

.story_caption h1{
    font-size: 8vw;
}
h2, h3{
    font-size: 4.800vw;
}
.caption{
    width: 95vw;
    top:68vh;
    margin: 0 auto 0 auto;
    left:0;
    right: 0;
}
.caption h2{
    font-size: 4vw;
    line-height: 120%;
    text-align: center;
    color: #FFFFFF;
}

.caption h1{
    font-size: 8vw;
    text-align: center;
    margin-bottom: 6.667vw;
   
}
.caption h3{
    font-size: 4vw;
    text-align: center;
   
}
.selectors_pilar{
    display: flex;
    flex-direction: row;
}
.pilar{height: 120vh;
    position: relative;
    top:38vw;

}
.caption{
    top:130vw;
}
.pilarSections{
    background: white;
    border-radius: 50%;
    width: 10px;
    height: 10px;
    margin: 10px;
    color:rgba(0,0,0,0);
    position: relative;
    left: calc(50vw - 45px);

}
.selectors_pilar label {
    
    height: 0;
}

.pilar{
    top:0;
    height: 175vw;
}

.pilar_item_1{
    height: 100vh;
    background: url(../img/viajes_mov.png);
    background-repeat: no-repeat;
    background-size:  110%;
    background-position: center center;    
    top:-50vw;
}
.pilar_item_2{
    height: 100vh;
    background: url(../img/escalada_mov.png);
    background-repeat: no-repeat;
    background-size:  110%;
    background-position: center center;    
    top:-50vw;
}
.pilar_item_3{
    height: 100vh;
    background: url(../img/naturaleza_mov.png);
    background-repeat: no-repeat;
    background-size:  110%;
    background-position: center center;  
    top:-50vw;  
}

footer{
    display: flex;
    background: black;
    height: 15vw;
    text-align: center;
    text-transform: uppercase;
    color: #717171;
    font-family: Jura;
    font-style: normal;
    font-weight: 500;
    font-size: 3.200vw;
    line-height: 3.3vw;
    justify-content: center;
    align-items: center;
}
.story{
    height: 314vw;
}
.selectors_pilar{
    right: 0;
    top:60vw;
    height: 30vw;
}

.titulo_pilar{
    font-size: 5vw !important;
    line-height: 150% !important;
    color:#E94E1B !important;
}
}