@import url('https://fonts.googleapis.com/css2?family=Montserrat+Alternates:wght@400;500&family=Montserrat:wght@300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Caslon+Display&display=swap');
body{
    font-family: 'Montserrat',sans-serif;
    margin: 0;
    padding: 0;
}


/*NAVIGATION*/
nav{
    z-index: 999;
}
nav ul {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

nav ul li {
    list-style-type: none;
    z-index: 999;
}

nav ul li a {
    color: #fff;
    font-family: 'Montserrat', sans-serif;

}

img.logoProjet {
    width: 6vw;
    margin-right: 50px;
}


.about nav ul li a:hover{
    color: #F27649;
}





/*LOGO*/
.logo{
    display: block;
    margin: auto;
}


/*ACCUEIL*/
p.intro, span.introtxt{
    color: #fff;
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    font-size: 1.8rem;
}

span.introtxt{
    font-size: 1.5rem;
    background: transparent !important;

}

.section h1{
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    color: #fff;
    font-size: 4rem;
    padding: 50px;
}

.s1, .s2, .s3, .s4, .s5{
    background-size: cover;
}

span{
    background: white !important;
}

.fp-slidesNav.fp-bottom{
    margin-left: 1em !important;
    top: 20px;
}

.fp-controlArrow.fp-next {
    right: -7px;
    margin-top: 56px;
    width: 100px;
    border-width: 33.5px 0px 35.5px 24px;
    border-color: transparent transparent transparent #fff;
}

.fp-controlArrow.fp-prev {
    left: 35px;
    width: 0;
    margin-top: 55px;
    border-width: 33.5px 24px 35.5px 0;
    border-color: transparent #fff transparent transparent;
}


a h1.traitTitre {
    position: relative;
}
a h1.traitTitre::after {
    content: '';
    transform-origin: 0 0;
    transform: scaleX(0);
    position: absolute;
    width: 30vw;
    bottom: 0;
    top: 22vh;
    left: 35vw;
    right: 0;
    height: .1em;
    background: #fff;
    opacity: 0.8;
    transition: transform 1s;
}
a h1.traitTitre:hover::after {
    transform: scaleX(1);
}


/*SOURIS ACCUEIL*/
.middle{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%)
}

.mouse{
    width:45px;
    height:80px;
    border:2px solid #fff;
    border-radius:70px;
    margin-top:85vh;
}

.mouse::before{
    content:"";
    width:8px;
    height:8px;
    margin-top:85vh;
    position:absolute;
    top:30px;
    background: #fff;
    left: 50%;
    transform:translatex(-50%);
    border-radius:60%;
    opacity:1;
    animation: mouse 2s infinite
}
@keyframes mouse{
    from{
        opacity:1;
        top: 30px
    }
    to{
        opacity:0;
        top:65px;
    }
}





/*PROJETS*/
.projet h1{
  font-size: 2rem;
  text-align: center;
  font-family: 'Montserrat Alternates', sans-serif;
  color: #fff;
}

.projet a{
    text-decoration: none;
}

.one, .two, .three, .four{
    background-size: cover;
    background-position: center center;
}

a h1.traitTitreProjet {
    position: relative;
}
a h1.traitTitreProjet::after {
    content: '';
    transform-origin: 0 0;
    transform: scaleX(0);
    position: absolute;
    width: 15vw;
    bottom: 0;
    top: 8vh;
    left: 17.5vw;
    right: 0;
    height: .1em;
    background: #fff;
    opacity: 0.8;
    transition: transform 1s;
}
a h1.traitTitreProjet:hover::after {
    transform: scaleX(1);
}


/*Page projet version mobile*/

/* .projetMobile{
    display: none;
}


.projetMobile .section h1{
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    color: #fff;
    font-size: 1.2rem;
    padding: 50px;
}

.projetMobile .s1, .projetMobile .s2, .projetMobile .s3, .projetMobile .s4{
    background-size: cover;
}

.projetMobile .fp-slidesNav.fp-bottom{
    margin-left: 1em !important;
    top: 20px;
}

.projetMobile .fp-controlArrow.fp-next {
    right: -7px;
    margin-top: 56px;
    width: 100px;
    border-width: 33.5px 0px 35.5px 24px;
    border-color: transparent transparent transparent #fff;
}

.projetMobile .fp-controlArrow.fp-prev {
    left: 35px;
    width: 0;
    margin-top: 55px;
    border-width: 33.5px 24px 35.5px 0;
    border-color: transparent #fff transparent transparent;
}


.projetMobile a h1.traitTitreProjet {
    position: relative;
    padding-top: 3.5em;
    padding-bottom: 2.5em;
}

h1#navcomprojet {
    padding-top: 8em;
}

.projetMobile .section {
    margin-bottom: -1.6em;
}

.projetMobile a h1.traitTitreProjet::after {
    content: '';
    transform-origin: 0 0;
    transform: scaleX(0);
    position: absolute;
    width: 30vw;
    bottom: 0;
    top: 22vh;
    left: 40vw;
    right: 0;
    height: .1em;
    background: #fff;
    opacity: 0.8;
    transition: transform 1s;
}
.projetMobile a h1.traitTitreProjet:hover::after {
    transform: scaleX(1);
} */





/*A PROPOS*/
.about .parallax {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.CV a {
    font-weight: bold;
    font-size: 1.3rem;
    background: #F25A38;
    border-radius: 15px;
    padding: 7px;
    font-family: 'Montserrat',sans-serif;
}

h2.CV {
    text-align: center;
}

.about a{
    color: #000;
}

.about h1{
    text-align: center;
    font-family: 'Montserrat Alternates', sans-serif;
    margin-top: 5vh;
    margin-bottom: 2vh;
}

.about h2{
    font-family: 'Montserrat', sans-serif;
    margin-left: 5vw;
    margin-bottom: 6vh;
    margin-top: 10vh;
    font-weight: 400;
}

.formation ul, .experience ul, .hobby ul, .mot ul{
    margin-left: 8vw;
    margin-right: 8vw;
    margin-bottom: 2vh;
    margin-top: 1vh;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
}

.mot{
    padding-bottom: 10vh;
}

.about a.mentions {
    text-align: center;
    font-family: 'Montserrat Alternates', sans-serif;
    font-size: 0.8rem;
    margin-top: 5vh;
    font-weight: 600;
    display: block;
    padding-bottom: 5vh;
}

a.mentions:hover{
    color: #F27649;
}


/*CONTACT*/
.formulaireB{
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 2em;
    margin-top: 20vh;

}
.formulaireB1{
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 2em;
}

.formulaireB1 a{
    font-weight: bold;
}
.formulaireB1 a:hover{
    color: #F27649;
}

.contact .parallax {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}


.contact a{
    color: #000;
}

.contact h1{
    text-align: center;
    font-family: 'Montserrat Alternates', sans-serif;
    margin-top: 5vh;
    margin-bottom: 5vh;
}


.contact a.mentions {
    text-align: center;
    font-family: 'Montserrat Alternates', sans-serif;
    font-size: 0.8rem;
    margin-top: 25vh;
    font-weight: 600;
    display: block;
    padding-bottom: 5vh;
}

.contact     nav ul li a:hover{
    color: #F27649;
}

a.mentions:hover{
    color: #F27649;
}
 



/*MEDIA QUERIES*/
@media screen and (max-width: 758px) {
    img.logo {
        width: 20vw;
    }

    img.logoProjet {
        width: 10vw !important;
    }


    a h1.traitTitre{
        font-size: 2rem;
    }
    .projet .logoProjet, .contact .logoProjet, .about .logoProjet{
        width: 10vw;
    }

    #multiscroll{
        display: none;
    }

    div#multiscroll-nav{
        display: none;
    }

    .projetMobile{
        height: -webkit-fill-available;
        display: block;
        margin-top: -7em;
        background-color: black;
        
    }

    h1.Gauche{
        text-align: left;
        margin-left: 10%;
        padding-bottom: 2em;

    }

    h1.Droite{
        text-align: right;
        margin-right: 10%;
        padding-bottom: 2em;

    }

    a h1.Droite:hover , a h1.Gauche:hover{
        color:#EE7D23;
        
    }

    .NavMobile{
        margin-top: 2em;
        padding-top: 40%;
    }

    
    
}