/* Home */
.container,
.container-fluid,
section {
    overflow: hidden
}

/*.logo-container {
    display: none;
    -webkit-animation: fade 1s 1 0s;
    -moz-animation: fade 1s 1 0s;
    -o-animation: fade 1s 1 0s;
    animation: fade 1s 1 0s
}*/
.slider-container{
    xbackground-color: #042031;
}
@keyframes fade {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

#navbar {
    background-color: transparent
}

.navChange {
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out
}

.offsetLeft {
    transform: translateX(-18%)
}

.mask01 {
    overflow: hidden;
    display: block;
    height: 1000px;
    width: 80%;
    float: right;
    z-index: 0
}

.z-100 {
    z-index: 100
}

.introDeplacement {
    transform: translateY(10vh)
}

#logoAnimated {
    max-width: 550px
}

#section02 {
    position: relative
}

.bike {
    position: absolute;
    margin-top: 5%
}

.text-block-02 {
    max-width: 380px
}

.imgSection03 {
    transform: translateX(-3vw)
}

.offsetRight {
    transform: translateX(7vh)
}

.shellImg {
    width: 63%;
    max-width: 1000px;
    transform: translateX(41vw);
    position: absolute;
    bottom: 0
}

.shape01 {
    width: 100%;
    height: 100vh;
    position: absolute;
    background-image: url(/assets/images/home/line_diagonal-01.svg);
    background-repeat: no-repeat;
    top: 100px;
    background-size: 800px;
    background-position-x: -300px;
    background-position-y: -371px;
    left: 0
}

.shape02 {
    width: 100%;
    height: 184vh;
    position: absolute;
    background-image: url(/assets/images/home/semi_circle_orange.svg);
    background-repeat: no-repeat;
    top: 0;
    background-position-x: 100%;
    left: 0;
    background-size: 32%
}

.shape03 {
    width: 100%;
    height: 200vh;
    z-index: -1;
    position: absolute;
    background-image: url(/assets/images/home/zig_zag_orange.svg);
    background-repeat: no-repeat;
    top: 0;
    background-position-x: 0;
    background-position-y: 30%;
    left: 0;
    background-size: 100%
}

.shape04 {
    width: 100%;
    height: 190vh;
    z-index: -1;
    position: absolute;
    background-image: url(/assets/images/home/r_vector.svg);
    background-repeat: no-repeat;
    top: 0;
    background-position-x: -7%;
    background-position-y: 16%;
    left: 0;
    background-size: 600px;
    overflow: visible
}

.shape05 {
    width: 100%;
    height: 200vh;
    z-index: -1;
    position: absolute;
    background-image: url(/assets/images/home/line_diagonal.svg);
    background-repeat: no-repeat;
    top: 0;
    background-position-x: 100%;
    background-position-y: 75%;
    left: 0;
    background-size: 600px;
    overflow: visible;
}
h1.big--title{
    font-size: 4rem;
    line-height: 5rem;
}
.object-fit_contain{
    object-fit: contain;
    display:block;
}
.object-fit_cover img{
    object-fit: cover;
    display:block;
}
.news-item{
    padding-bottom: 40px;
}
.news-item .underlined{
    transform: translateX(0);
}
.news-image-detail img{
    width:100%;
    height: 600px;
}
.align-center{
    text-align: center !important;
}
.padding-top-20{
    padding-top: 30px;
}
a.underlined {
    color: #fff;
    transition: .3s ease-in-out;
    transition-delay: .2s;
    position: relative;
    display: inline-block;
    overflow: hidden;
    padding: 8px 10px;
    height: 42px;
    transform: translateX(0);
    border: 1px solid #fff;
}

@media only screen and (max-width: 1200px) {
    .shape01 {
        background-size: 55%;
        background-position-x: -289px;
        background-position-y: 0
    }

    .mask01 {
        height: auto
    }

    .shape02 {
        background-position-x: 116%;
        background-size: 32%;
        background-position-y: 15%
    }

    .big--title {
        font-size: 14vw;
        font-weight: 400;
        line-height: 12vh;
        letter-spacing: -.01em
    }

    .bike {
        position: absolute;
        margin-top: 16%
    }

    .bike img {
        width: 64%
    }
    .news-image-detail img{
        width:100%;
        height: auto;
    }
}

@media only screen and (max-width: 920px) {
    .mask01 {
        width: 100%
    }

    .shape01 {
        background-size: 51%;
        background-position-x: -57%;
        background-position-y: 26%
    }

    #logoAnimated {
        max-width: 415px
    }

    .shape02 {
        background-position-x: 101%;
        background-size: 38%;
        background-position-y: 20%
    }

    .shape05 {
        background-position-x: 183%;
        background-position-y: 80%;
        background-size: 500px
    }

    .shape04 {
        background-position-x: -7%;
        background-position-y: 40%;
        background-size: 400px
    }

    .bike img {
        width: 53%
    }
}

@media only screen and (max-width: 768px) {
    .offsetLeft {
        transform: translateX(0)
    }

    .gap-Pad {
        display: none
    }

    .shape01 {
        background-size: 51%;
        background-position-x: -57%;
        background-position-y: -20%
    }

    .shape03 {
        background-position-y: 17%
    }

    .shape02 {
        background-position-x: 137%;
        background-size: 38%;
        background-position-y: -8%
    }
}

@media only screen and (max-width: 575px) {
    shape01 {
        background-size: 500px;
        background-position-x: 296%;
        background-position-y: 0;
        height: 100vh
    }

    .shape02 {
        background-position-x: 137%;
        background-size: 42%;
        background-position-y: 17%
    }

    .shape03 {
        background-position-y: -13%;
        background-size: 236%
    }

    .shape04 {
        background-position-x: -7%;
        background-position-y: -7%;
        background-size: 359px
    }

    .shape05 {
        background-position-x: 274%;
        background-position-y: 112%;
        background-size: 500px
    }

    .shellImg {
        width: 100%;
        max-width: 1000px;
        transform: translateX(0);
        position: relative;
        bottom: 0
    }

    .bike {
        position: relative;
        transform: translate(-20px, 0);
        margin-top: 5%;
    }

    .bike img {
        width: 53%;
    }

    .lifestyleImg,
    .peopleImg {
        width: 100%
    }

    .linedTextIntro {
        margin-bottom: 5vh
    }
    h1.big--title{
        font-size: 40px;
        line-height: 45px;
    }
}