html{box-sizing:border-box;scroll-behavior:smooth;font-size:62.5%}*,*:before,*:after{box-sizing:inherit}:root{--a-color:#424242;--hx-color:#424242;--p-color:#424242;--primary-color:#64B5F6;--secondary-color:#F6A664}body{min-height:300vh;line-height:2;font-size:1.8rem;margin:0 auto;color:var(--p-color)}h1,h2,h3,h4{font-family:'Montserrat',cursive;font-weight:initial;font-style:normal;color:var(--p-color)}h1:before,h1:after,h2:before,h2:after,h3:before,h3:after{content:" - "}h1{font-size:4rem;font-weight:700;text-shadow:2px 2px 2px rgba(0,0,0,.8);padding-bottom:15px;border-bottom:1px solid var(--secondary-color)}h2{font-size:3rem;font-weight:400}h3{font-size:1.8rem;font-weight:400}h4{font-size:1.5rem;font-weight:400;color:#fff}a,li,span{font-family:'Open Sans',cursive;font-size:1em;line-height:1em;font-style:normal;font-weight:400;color:var(--p-color);text-decoration:none}p{font-family:'Open Sans',cursive;font-size:1.5rem;font-style:normal;font-weight:400;color:var(--p-color)}strong{padding-left:20px;padding-right:20px;margin-top:10px}img{max-width:100%}.majuscule_FirstL{font-weight:700;font-size:1.7rem}#stickyScroll{display:none;position:fixed;bottom:80px;z-index:100;right:2px;padding:5px 5px 5px 5px;background-color:var(--secondary-color);border:1px solid var(--secondary-color);border-radius:5px 5px 5px 5px;cursor:pointer}#stickyScroll i{font-size:2.5rem}header{position:fixed;width:100%;height:100%;top:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center}header h1,header button{position:relative;z-index:1000}header h1{text-transform:normal;letter-spacing:1pt;font-size:3em;color:#fff;text-align:center}header button{font-family:"Font Awesome 5 Free";font-weight:900;position:absolute;bottom:100px;left:calc(50% - 60px);width:120px;height:50px;border:0;box-shadow:2px 1px 20px 0 rgba(0,0,0,.5);border-radius:10px;cursor:pointer;background:#fff;font-size:1em;color:#09203f;transition:all 0.8s cubic-bezier(.645,.045,.355,1),transform 0.3s cubic-bezier(.455,.03,.515,.955),box-shadow 0.3s cubic-bezier(.455,.03,.515,.955);overflow:hidden}header button:hover{box-shadow:0 0 0 0 rgba(0,0,0,.5)}header button:focus{outline:0}header button:before,header button:after{font-family:"Font Awesome 5 Free";font-weight:900;transition:all 0.8s cubic-bezier(.645,.045,.355,1);top:17px;position:absolute}header button:before{content:'\f52b';opacity:1;left:50px}header button:after{content:'\f0c9';opacity:0;left:0}header .triangle{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to top,#1146a0 0%,#2395f3 100%);transition:all 0.8s cubic-bezier(.645,.045,.355,1);display:flex;justify-content:center;align-items:center;pointer-events:none;z-index:1000}header .triangle.left{clip-path:polygon(0 0,0% 100%,100% 100%)}header .triangle.right{clip-path:polygon(100% 0,0 0,100% 100%)}header.open .triangle.left{clip-path:polygon(0 0,0 100%,0 100%)}header.open .triangle.right{clip-path:polygon(100% 0,100% 0,100% 100%)}header.open button{left:95%;bottom:35px;width:50px;border-radius:50%}header.open button:before{opacity:0;left:100%}header.open button:after{opacity:1;left:18px}header.open button.menu{width:100%;height:100%;bottom:0;left:0;border-radius:0}header.open button.menu:after{right:-110%}#principaleNav{position:fixed;width:100%;height:100%;top:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;display:none}#principaleNav a{font-family:'Montserrat',sans-serif;font-weight:700;text-transform:uppercase;line-height:2;letter-spacing:1pt;font-size:2em;color:#09203f;animation:fadeDown .5s forwards;opacity:0;cursor:pointer;transform:translateY(-20px);transition:all 0.3s cubic-bezier(.455,.03,.515,.955)}#principaleNav a:hover{text-shadow:2px 1px 40px rgba(0,0,0,.5);opacity:.8}#principaleNav a:nth-child(1){animation-delay:0.5s}#principaleNav a:nth-child(2){animation-delay:0.6s}#principaleNav a:nth-child(3){animation-delay:0.7s}#principaleNav a:nth-child(4){animation-delay:0.8s}#principaleNav a:nth-child(5){animation-delay:0.9s}#principaleNav a:nth-child(6){animation-delay:1s}#principaleNav #nav-close{position:fixed;top:40px;right:40px;font-size:1.5em;cursor:pointer;animation:fadeDown .5s forwards;animation-delay:1.1s;opacity:0;color:#09203f;transform:translateY(-20px)}@keyframes fadeDown{0%{opacity:0;transform:translateY(-20px)}100%{opacity:1;transform:translateY(0)}}.btn--shockwave.is-active{animation:shockwaveJump 1s ease-out infinite}.btn--shockwave.is-active:after{content:'';position:absolute;top:5px;left:calc(50% - 60px);border-radius:50%;-webkit-animation:shockwave 1s .65s ease-out infinite;animation:shockwave 1s .65s ease-out infinite}.btn--shockwave.is-active:before{content:'';position:absolute;top:5px;left:calc(50% - 60px);border-radius:50%;-webkit-animation:shockwave 1s .5s ease-out infinite;animation:shockwave 1s .5s ease-out infinite}@-webkit-keyframes shockwaveJump{0%{-webkit-transform:scale(1);transform:scale(1)}40%{-webkit-transform:scale(1.08);transform:scale(1.08)}50%{-webkit-transform:scale(.98);transform:scale(.98)}55%{-webkit-transform:scale(1.02);transform:scale(1.02)}60%{-webkit-transform:scale(.98);transform:scale(.98)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes shockwaveJump{0%{-webkit-transform:scale(1);transform:scale(1)}40%{-webkit-transform:scale(1.08);transform:scale(1.08)}50%{-webkit-transform:scale(.98);transform:scale(.98)}55%{-webkit-transform:scale(1.02);transform:scale(1.02)}60%{-webkit-transform:scale(.98);transform:scale(.98)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes shockwave{0%{-webkit-transform:scale(1);transform:scale(1);box-shadow:0 0 2px rgba(0,0,0,.5),inset 0 0 1px rgba(0,0,0,.5)}95%{box-shadow:0 0 150px rgba(0,0,0,0),inset 0 0 130px rgba(0,0,0,0)}100%{-webkit-transform:scale(2.25);transform:scale(2.25)}}@keyframes shockwave{0%{-webkit-transform:scale(1);transform:scale(1);box-shadow:0 0 2px rgba(0,0,0,.15),inset 0 0 1px rgba(0,0,0,.15)}95%{box-shadow:0 0 150px rgba(0,0,0,0),inset 0 0 130px rgba(0,0,0,0)}100%{-webkit-transform:scale(2.25);transform:scale(2.25)}}main section{display:flex;justify-content:center;align-items:center;font-family:'Montserrat',sans-serif;font-weight:700;font-size:1em;letter-spacing:2pt}#presentation{background-image:url(../img/background_01.jpg);background-size:cover;text-align:center;color:#fff;padding:150px 75px;height:50vh;overflow:hidden}@keyframes slide_I{from{-webkit-transform:translateY(5px);transform:translateY(5px);background-color:rgba(245,245,245,.7);border:2px solid rgba(245,245,245,.8);color:var(--p-color)}to{-webkit-transform:translateY(-10px);transform:translateY(-10px);background-color:rgba(246,166,100,.7);border:2px solid rgba(246,166,100,.8);color:var(--p-color)}}#presentation article{display:block;background:rgba(66,66,66,.5);border:1px solid rgba(66,66,66,.6);border-radius:5px 5px 5px 5px}#presentation figure img{box-shadow:5px 5px 2px rgba(0,0,0,.8)}#presentation h1{font-size:5rem;color:#fff}#presentation h2{text-transform:none;padding-bottom:50px;font-size:4rem;color:#fff;text-shadow:2px 2px 5px rgba(0,0,0,.8)}#aPropos,#monCV,#competences,#realisations,#contacterMoi{flex-direction:column;justify-content:flex-start;width:80%;margin:0 auto;padding:15px 15px;overflow:hidden;position:relative}#aPropos:before,#monCV:before,#competences:before,#realisations:before,#contacterMoi:before{font-family:"FontAwesome";font-weight:900;content:"\f0d7";position:absolute;top:0;color:var(--secondary-color);font-size:2em;z-index:500}#aPropos h2,#monCV h2,#competences h2,#realisations h2,#contacterMoi h2{margin-top:40px;padding-bottom:15px;border-bottom:1px solid var(--secondary-color);margin-bottom:15px}#aPropos,#realisations,#monCV,#competences{width:100%}#aPropos>p{width:60%;text-indent:3%;text-align:justify}#aPropos .colonne{display:flex;flex-direction:row;justify-content:space-around;align-items:flex-start;flex-wrap:wrap;width:90%;margin-top:15px;box-shadow:0 2px 25px rgba(0,0,0,.1);border-radius:15px 15px}#aPropos .colonne article{display:inline-block;width:28%;text-align:center;min-width:350px;margin:15px auto}#aPropos tbody td{font-family:'Open Sans',sans-serif;font-weight:400;font-style:italic;font-size:1.6rem;color:var(--p-color);text-align:left}#aPropos .maSignature{margin:2% 1% 3% 50%;font-family:'Indie Flower',cursive;font-weight:400;font-style:italic;font-size:2rem;color:var(--p-color)}#aPropos .cta{display:block;text-align:center;font-family:'Roboto',sans-serif;text-decoration:none;background:var(--primary-color);color:#fff;transition:all 0.3s ease 0s;border-radius:5px;padding:20px 30px}#aPropos .cta:hover{background:var(--secondary-color);box-shadow:3px 5px 5px var(--primary-color)}#aPropos .colonne a{text-decoration:none}#aPropos .colonne a i{margin:15px auto 15px auto;background-color:rgba(245,245,245,.8);border:2px solid rgba(200,245,245,1);padding:15px 15px;border-radius:50% 50%;color:var(--p-color);overflow:hidden}#aPropos .colonne a i:hover{padding:15px 15px;border-radius:50% 50%;border:solid .3em;animation:slide_I 0.35s ease infinite alternate}#aPropos .colonne .container i{margin:25px auto 25px auto;padding:15px 15px;background-color:rgba(245,245,245,.7);border:2px solid rgba(66,66,66,.8);color:var(--p-color)}#aPropos .colonne .container i:hover{animation:slide_I 0.35s ease infinite alternate}#aPropos .rotateBackground h4{text-align:center;padding:100px 150px 100px 150px;color:rgba(0,0,0,0)}#aPropos .rotateBackground{position:relative;margin:0 auto;top:0;left:10%;width:46%;height:50%;overflow:hidden;border:4mm ridge var(--primary-color);border-radius:15px 15px;background-color:#ffffff;transform:rotate(-10deg);transition:all 0.4s ease-out}#aPropos .rotateBackground::before{content:"";position:absolute;width:100%;height:100%;top:0%;left:-2%;z-index:-1;background-image:url(../img/moi.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;transform:rotate(9deg);transition:all 0.4s ease-out}#aPropos .rotateBackground:hover{transform:rotate(0deg) translateY(15px)}#aPropos .rotateBackground:hover::before{content:"";position:absolute;width:100%;height:100%;top:0%;left:0%;z-index:-1;background-image:url(../img/moi.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;transform:rotate(0deg)}#aPropos .colonne:hover .rotateBackground{transform:rotate(0deg) translateY(15px)}#aPropos .colonne:hover .rotateBackground::before{content:"";position:absolute;width:100%;height:100%;top:0%;left:0%;z-index:-1;background-image:url(../img/moi.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;transform:rotate(0deg)}#monCV .cd-timeline{width:100%;position:relative;left:0%;right:0%;margin-left:-50%;margin-right:-50%}#monCV .cd-timeline h2{font-family:'Montserrat',cursive;font-weight:initial;font-style:normal;color:var(--p-color);padding-bottom:15px;border-bottom:1px solid var(--secondary-color);font-size:1.8rem}#monCV .cd-timeline h2:before,#monCV .cd-timeline h2:after{content:""}#competences .couleurfondBleu{width:100%;position:relative;left:0%;right:0%;margin-left:-50%;margin-right:-50%;padding-top:15px;background-color:#e3f2fd}#competences .col{margin-bottom:15px}.water50,.water50_p2{width:115px;height:115px;background:url(../img/anim_water_50.png) left center;margin:0 auto}.water60,.water60_p2{width:115px;height:115px;background:url(../img/anim_water_60.png) left center;margin:0 auto}.water90,.water90_p2{width:115px;height:115px;background:url(../img/anim_water_90.png) left center;margin:0 auto}.water100,.water100_p2{width:115px;height:115px;background:url(../img/anim_water_100.png) left center;margin:0 auto}.water50:hover,.water60:hover,.water90:hover,.water100:hover{cursor:pointer;animation:play 2s steps(6) infinite}.water50_p2:hover,.water60_p2:hover,.water90_p2:hover,.water100_p2:hover{cursor:pointer;animation:play 2s steps(6) infinite}@keyframes play{100%{background-position:-691px}}#realisations .couleurfondBleu{width:100%;background-color:#e3f2fd}#realisations .contenu{width:80%;margin:0 auto;text-align:center}#realisations h3{margin-top:15px;font-weight:700;font-size:2.1rem;margin-top:40px}#realisations h3:before,#realisations h3:after{content:""}#realisations p{position:relative}#realisations p:before{content:"";position:absolute;top:10px;left:-15px;width:125px;height:40px;background:rgba(246,166,100,.2);transform:rotate(50deg) skew(30deg)}#realisations a{display:block;text-decoration:none;font-family:'Roboto',sans-serif;padding:10px 15px;border:1px solid var(--secondary-color);border-radius:15px;color:var(--secondary-color);font-weight:700;font-size:1.7rem;transition:all 0.5s ease}#realisations a:hover{background-color:var(--secondary-color);color:#fff}.wrapper_realisations{display:grid;grid-template-columns:repeat(20,3vw);grid-auto-rows:4vw;margin-bottom:30px;overflow:hidden}.wrapper_realisations_PC{display:none;margin-top:15px;margin-bottom:30px;border-radius:5px 5px 5px 5px}.device{border:1vw solid #a9B9dd;border-bottom:solid 3vw #a9B9dd;grid-column:2 / span 3;grid-row:3 / span 6;border-radius:1.5vw;background:#fcfcfe;padding:1rem}.mobile{position:relative;z-index:1;grid-column:2 / span 3;grid-row:3 / span 5}.tablet{position:relative;z-index:1;grid-column:13 / span 7;grid-row:4 / span 4;border-bottom:1vw solid #a9B9dd;border-right:solid 3vw #a9B9dd}.laptop{position:relative;grid-column:3/ span 13;grid-row:2 / span 8;&:after{content:"";position:absolute;bottom:-3vw;left:-5.5vw;right:-5.5vw;height:3vw;background-color:#a9B9dd;border-radius:0 0 1vw 1vw}}.wrapper_realisations img{max-width:100%;height:100%;background-size:cover}#contacterMoi{flex-direction:column;justify-content:flex-start;width:80%;margin:0 auto;padding:15px 15px;overflow:hidden;position:relative}#contacterMoi:before{font-family:"FontAwesome";font-weight:900;content:"\f0d7";position:absolute;top:0;color:var(--secondary-color);font-size:2em;z-index:500}#contacterMoi h2{margin-top:40px;padding-bottom:15px;border-bottom:1px solid var(--secondary-color);margin-bottom:15px}#contacterMoi .alert.alert-success,#contacterMoi .alert.alert-warning,#contacterMoi .alert.alert-danger{font-size:1.2rem;display:none}#contacterMoi form{text-align:center;box-shadow:0 2px 25px rgba(0,0,0,.1);border-radius:15px 15px}#contacterMoi input,#contacterMoi textarea{padding:10px 10px 10px 70px;margin:1%;color:#666;background-color:#fff;border-radius:10px;border:1px solid var(--primary-color);font-family:Arial;font-size:1.6rem}#contacterMoi input{width:48%;float:left}#contacterMoi input{background-image:url(../img/bg_form_name.svg);background-repeat:no-repeat;background-size:40px;background-position:-7px}#contacterMoi input:nth-of-type(2){background-image:url(../img/bg_form_mail.svg);background-position:-7px}#contacterMoi textarea{width:98%;resize:none;background-image:url(../img/bg_form_message.svg);background-repeat:no-repeat;background-size:50px;background-position:-7px -7px;padding-left:80px}#contacterMoi button{font-family:'Roboto',sans-serif;margin:25px;padding:15px 25px;border:0;color:#fff;border-radius:10px}#contacterMoi button[type="submit"]{background:var(--primary-color);transition:all 0.3s ease 0s}#contacterMoi button[type="submit"]:hover{background:var(--secondary-color);box-shadow:3px 5px 5px var(--primary-color)}#contacterMoi button[type="reset"]{background-color:#999;transition:all 0.3s ease 0s}#contacterMoi button[type="reset"]:hover{box-shadow:3px 5px 5px #999}footer{width:100%;background:#424242;background:-moz-linear-gradient(top,#424242 0%,#757575 100%);background:-webkit-linear-gradient(top,#424242 0%,#757575 100%);background:linear-gradient(to bottom,#424242 0%,#757575 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#424242',endColorstr='#757575',GradientType=0);margin:0 auto;text-align:center}footer figure img{width:6%;max-width:7%;min-width:5%;margin:1% auto}footer p{color:#fff}@media screen and (max-width:540px){#presentation h1,#presentation h2{font-size:2.5rem;font-weight:700}#presentation h1::before,#presentation h1::after,#presentation h2::before,#presentation h2::after{content:""}#presentation h2,#aPropos h2,#monCV h2,#competences h2,#realisations h2,#contacterMoi h2{font-size:2rem}#contacterMoi button{margin:10px}#realisations a{display:block;text-decoration:none;font-family:'Roboto',sans-serif;padding:10px 15px;border:1px solid var(--secondary-color);border-radius:15px;background-color:var(--secondary-color);color:#fff;font-weight:700;font-size:1.7rem}#aPropos>p{width:95%;text-indent:3%}.wrapper_realisations{display:none}.wrapper_realisations_PC{display:block}#contacterMoi input,#contacterMoi textarea{display:block;width:100%;padding:10px 10px 10px 50px;font-size:1.2rem}}