html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;vertical-align:baseline;border:0;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}:root{--color:#6366f0;--typing-color:#2196f3;--cursor-size:150px;--cursor-color:white}*,:after,:before{box-sizing:border-box;backface-visibility:hidden}html,body{text-transform:uppercase;width:100%;height:100%;margin:0;padding:0}body{scroll-behavior:smooth;background:#000;font:300 .9em/1.7 Raleway;transition:transform 1s;@media (width>=768px){font-size:1.2em}@media (width>=960px){font-size:1.1em}}h1,h2,h3,h4,h5,h6,strong{font-weight:800}a{color:inherit}[class^=icon-],[class*=\ icon-]{fill:currentColor;vertical-align:middle;display:inline-block}.slide-container{scroll-snap-type:y mandatory;scrollbar-width:none;position:fixed;inset:0;overflow-y:scroll;&::-webkit-scrollbar{display:none}}.slide{text-align:center;color:#fff;scroll-snap-align:start;width:100vw;height:100dvh;padding:20px}.slide-swipe{.not-touch &{display:none}opacity:0;z-index:-10;pointer-events:none;z-index:1;background:#00000080;transition:opacity 1s;position:fixed;inset:0;& .icon{opacity:0;color:#fff;filter:drop-shadow(0 0 5px #000);width:4em;height:4em;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}&.orientation,&.vertical,&.horizontal{opacity:1;z-index:99999;transition:none}&.vertical .icon-touch{animation:.85s 2 swipe-vertical}&.horizontal .icon-touch{animation:.85s 2 swipe-horizontal}&.orientation{background:#000000e6;& .icon-orientation{opacity:1;width:6em;height:6em}}}@keyframes swipe-vertical{0%{opacity:0;transform:translateZ(0)translateY(25vh)rotate(40deg)}50%{opacity:1;transform:translateZ(0)translateY(-25vh)rotate(20deg)}to{opacity:0;transform:translateZ(0)translateY(25vh)rotate(40deg)}}@keyframes swipe-horizontal{0%{opacity:0;transform:translateZ(0)translate(25vw)rotate(40deg)}50%{opacity:1;transform:translateZ(0)translate(-25vw)rotate(0)}to{opacity:0;transform:translateZ(0)translate(25vw)rotate(40deg)}}.topo-container{z-index:0;width:100%;height:100%;position:fixed;top:0;left:0}#topo{z-index:0;pointer-events:none;opacity:.5;filter:blur(10px);width:100%;height:100%;position:absolute;top:0;left:0}.hero{color:#fff;position:relative;.touch &{background-position:bottom}}.hero-container{z-index:1;background-color:#000;transition:background-color 5s;position:absolute;inset:0;.animated &{background-color:#0000}}.hero-bio{text-align:center;width:100%;margin-top:-150px;margin-left:-50%;font-weight:300;position:absolute;top:42%;left:50%;.no-touch &{top:42%}& a{transition:all .5s;&:hover{color:var(--color)}}& h2{word-spacing:-.2em;margin-bottom:.2em;font-size:2em;font-weight:300}& p strong{color:#fff;opacity:0;transition:opacity 1s;position:relative}.hero.animated & p strong:first-of-type{opacity:1;transition-delay:.3s}.hero.animated & p strong:nth-of-type(2){opacity:1;transition-delay:.6s}.hero.animated & p strong:nth-of-type(3){opacity:1;transition-delay:.9s}.hero.animated & p strong:nth-of-type(4){opacity:1;transition-delay:1.2s}.hero.animated & p strong:nth-of-type(5){opacity:1;transition-delay:1.5s}.hero.animated & p strong:nth-of-type(6){opacity:1;transition-delay:1.8s}.hero.animated & p strong:nth-of-type(7){opacity:1;transition-delay:2.1s}& p span{color:#eee;opacity:0;transition:opacity 3s}.hero.animated & span{opacity:1;transition-delay:1.8s}}.hero-avatar{border:.15em solid #fff;border-radius:100%;width:6.5em;height:6.5em;margin-bottom:.5em;@media (width>=960px){width:4.8em;height:4.8em}}.social{margin:.8em auto 0;& ul{height:3.5em}& ul,& li{margin:0;padding:0;list-style:none}& li{float:left;margin:5px}& a{opacity:0;border:.12em solid #fff;border-radius:50%;width:3.2em;height:3.2em;margin-left:-1.5em;text-decoration:none;transition:opacity 1s 2.4s,transform .7s ease-out 2.7s,border-color 1s 2.4s;display:block;position:absolute;left:50%;overflow:hidden}& .icon{color:#ddd;opacity:0;width:1.6em;height:1.6em;transition:opacity 1s 2.7s,color 1s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}}.hero.animated{& .icon{opacity:1}& a{opacity:.75;&:hover{opacity:1;transition-delay:0s}}& .social-email a{transform:translate(-180%)}& .social-codepen a{transform:translate(-60%)}& .social-github a{transform:translate(60%)}& .social-linkedin a{transform:translate(180%)}}.hero-scroll{.touch &{display:none}text-transform:uppercase;text-align:center;opacity:0;width:100px;font-size:10px;font-weight:600;text-decoration:none;transition:opacity 1s 3s;position:absolute;bottom:20px;left:50%;transform:translate(-50%);.hero.animated &{opacity:.7}& .icon{width:3em;height:3em;margin:0 auto 10px;animation:2.5s ease-out infinite flash;display:block}}@keyframes flash{0%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(10px)}to{opacity:.3;transform:translateY(0)}}.works{padding:0;position:relative}.work-container{scroll-snap-type:x mandatory;scrollbar-width:none;background:linear-gradient(#444,#000);display:flex;position:relative;overflow-x:scroll;&::-webkit-scrollbar{display:none}}.work{scroll-snap-align:start;flex-shrink:0;width:100vw;height:100dvh;position:relative;overflow:hidden;box-shadow:0 0 20px #000;@media (width>=960px){width:33.333vw}@media (width>=1200px){width:25vw}}.work-pagination{color:#fff;opacity:0;z-index:100;margin:0;padding:0;transition:opacity .5s;position:fixed;bottom:7.5vh;left:50%;transform:translate(-50%);@media (device-width<=768px) and (orientation:landscape){display:none}& a{border:.1em solid #fff;border-radius:50%;width:10px;height:10px;margin:5px;transition:transform .5s;display:inline-block;&.active{background:#fff;transform:scale(1.3)}}}html.works-visible .work-pagination{opacity:1}.work-previous,.work-next{text-shadow:0 0 5px #00000080;opacity:0;z-index:100;margin-top:130px;font-size:1.5em;text-decoration:none;transition:transform 1s,opacity .5s;display:block;position:fixed;top:47%;transform:translateY(-50%)}html.works-visible .work-previous:not(.disabled),html.works-visible .work-next:not(.disabled){opacity:1}.work-previous{left:30px;&.disabled{opacity:0;transform:translate(-50px)}&:not(.disabled) .icon{animation:4s ease-out infinite flash-left}}.work-next{right:30px;&.disabled{opacity:0;transform:translate(50px)}&:not(.disabled) .icon{animation:4s ease-out infinite flash-right}}.work-previous .icon,.work-next .icon{width:1em;height:1.4em}.work-pagination a,.work-button{box-shadow:0 0 5px #0000004d}.work-hover{background:linear-gradient(#0000,#000c);transition:transform .25s;position:absolute;inset:0;transform:translateY(100vh);@media (width>=768px) and (device-width>=769px){.work:hover &{opacity:1;transform:translateY(0)}}}.work-logo,.work-details,.work-button{transition:all 2s cubic-bezier(0,1,0,1);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.work-logo{height:auto;display:block;@media (width<=768px){top:27%}@media (width>=768px) and (device-width>=769px){.work:hover &{opacity:.03;transform:translate(-50%,-50%)scale(2.2)}}}.work-details{color:#fff;text-align:center;text-transform:uppercase;text-shadow:0 1px 1px #000;width:100%;padding:10px;display:table;@media (width>=768px) and (device-width>=769px){opacity:0;.work:hover &{opacity:1;transform:translate(-50%,-90px)}}& .work-wrapper{vertical-align:middle;height:6em;display:table-cell}& h3{padding-bottom:.4em;font-size:1.5em;line-height:1.1em}& p{font-size:.9em;line-height:1.1em;@media (width<=768px){font-weight:700}}}.work-button{text-transform:uppercase;text-align:center;color:#fff;border:.2em solid #fff;border-radius:50%;width:5em;height:5em;font-weight:700;line-height:4.6em;text-decoration:none;@media (width<=768px){top:70%}@media (width>=768px) and (device-width>=769px){opacity:0;width:4em;height:4em;line-height:3.8em;.work:hover &{opacity:1;transform:translate(-50%,40px)}}&:hover{border-color:#fff3;transform:translate(-50%,30px)scale(1.2)!important}}.facedetection{background:url(facedetection-bg.33245232.jpg) 50%}.facedetection-logo{opacity:.9;width:80%;max-width:450px}.vegas{background:#000 url(vegas-bg1.4671fed9.jpg) 50%/cover no-repeat;position:relative;& .vegas-logo{width:95%;max-width:450px}@media (width>=768px) and (device-width>=769px){background-position:50%;transition:background-position .3s;&:hover{background-position:60%}}}.vegas-overlay{opacity:.3;background:url(vegas-overlay.fddee6c8.png),linear-gradient(#0000,#0000004d);position:absolute;inset:0}.buzz{background:linear-gradient(#7fa917,#3f550b)}.buzz-logo{width:50%;max-width:300px}.markitup{background:linear-gradient(#fff 25%,#7cc7f2 75%)}.markitup-logo{width:180%;max-width:700px}@keyframes flash-left{0%{opacity:.4;transform:translate(0)}50%{opacity:1;transform:translate(-10px)scale(1.6)}to{opacity:.4;transform:translate(0)}}@keyframes flash-right{0%{opacity:.4;transform:translate(0)}50%{opacity:1;transform:translate(10px)scale(1.6)}to{opacity:.4;transform:translate(0)}}.contributions{color:#fff;flex-direction:column;justify-content:center;align-items:center;gap:2rem;display:flex;position:relative;& h2{margin-bottom:.7em;font-size:1.4em;line-height:1.1em;position:relative}& p{margin-bottom:1.5em}& p span{color:#fff;opacity:0;transition:opacity 1s;position:relative}& p strong{color:#eee;opacity:0;transition:opacity 4s}&.animated strong{opacity:1;transition-delay:1.2s}&.animated p span{opacity:1}}.awards-container,.clients-container{z-index:0;position:relative}.cube-container{perspective:1000px;opacity:0;width:150px;height:100px;margin:-15px auto 15px;transition:opacity 1s 3s;display:block;position:relative;.animated &{opacity:.9}}.cube{width:100%;height:100%;transform-style:preserve-3d;transition:all .25s ease-out;top:0;left:0}.cube div{opacity:0;width:150px;height:100px;transition:all .25s ease-out;display:block;position:absolute;&.active{opacity:.7}}.cube svg,.cube img{width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cube .front{transform:translateZ(50px)}.cube .back{transform:rotateX(-180deg)translateZ(50px)}.cube .top{transform:rotateX(90deg)translateZ(50px)}.cube .bottom{transform:rotateX(-90deg)translateZ(50px)}.clients-logos{--logo-height:25px;flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;margin-top:1.5rem;display:flex;@media (width>=768px){--logo-height:35px;gap:1.5rem}& img{height:var(--logo-height);opacity:0;transition:opacity 1s;&:hover{opacity:1}&.client-orange{height:var(--logo-height)}&.client-atlassian{height:calc(var(--logo-height) * .5)}&.client-creditagricole{height:calc(var(--logo-height) * .9)}&.client-francetv{height:calc(var(--logo-height) * .6)}&.client-liberation{height:calc(var(--logo-height) * 1.05);margin-top:.1em}&.client-renault{height:calc(var(--logo-height) * 1.3)}&.client-total{height:calc(var(--logo-height) * 1)}}.animated & img{opacity:.7}}.references{place-items:center;padding:0;display:flex;position:relative;overflow:hidden;@media (width>=1000px){display:block}& h2{word-spacing:-.2em;margin-bottom:.6em;font-size:1.5em;line-height:1.1em;@media (width>=1000px){display:none}}}.references-container{z-index:1;width:100%;position:relative;@media (width>=1000px){justify-content:center;align-items:center;height:100%;display:grid}}.references-wrapper{--tilt-x:5deg;--tilt-y:5deg;gap:1rem;padding:1rem;&::-webkit-scrollbar{display:none}@media (width<=1000px){overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;grid-auto-flow:column;gap:.75rem;scroll-padding-left:1rem;display:grid;overflow-x:auto}@media (width>=1000px){perspective:1000px;width:100%;transform:perspective(1000px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) rotateZ(2deg);transform-style:preserve-3d;will-change:transform;flex-wrap:wrap;justify-content:center;margin:0 auto;transition:transform .1s ease-out;display:flex}}.reference{color:#000;text-align:left;opacity:0;background:linear-gradient(#fff,#eee);border-radius:.5rem;flex-direction:column;flex:0 0 25%;min-width:300px;max-width:400px;padding:1rem;line-height:1.2em;display:flex;transform:scale(2)rotate(-5deg);.animated &{opacity:1;transition:transform .25s ease-out .5s,opacity .25s ease-out .5s;transform:scale(1)rotate(0)}@media (width<=1000px){opacity:1;scroll-snap-align:start;scroll-snap-stop:always;width:90vw;max-width:600px;transform:scale(1)rotate(0)}}.reference-header{gap:1rem;margin-bottom:.5rem;display:flex;& h3{text-transform:uppercase;font-size:.9rem}& h4{text-transform:none;opacity:.75;font-size:.75em;font-weight:400}& img{border-radius:50%;width:42px;height:42px;margin-bottom:.5rem}}.reference-info{flex-direction:column;justify-content:center;line-height:1.2em;display:flex}.reference-body{text-transform:none;color:#444;flex:1;max-height:200px;font-size:.75em;line-height:1.4em;overflow:hidden;& p{line-clamp:3;padding:0 1em 1em;position:relative;@media (width<=1000px){font-size:1rem;line-height:1.5em}}& p:before,& p:after{opacity:.8;color:var(--color);font-size:1.75em;line-height:0}& p:before{vertical-align:middle;content:"❝"}& p:after{vertical-align:bottom;content:"❞"}}.reference-footer{align-items:center;display:flex;& a{color:#0000;width:20px;height:20px;margin-left:auto;display:block;&:before{content:"";background:url(linkedin.478b394e.svg) 100%/contain no-repeat;width:16px;height:16px;display:inline-block}}}.reference-pagination{color:#fff;opacity:0;z-index:100;margin:0;padding:0;transition:opacity .5s;position:fixed;bottom:7.5vh;left:50%;transform:translate(-50%);@media (width>=1000px){display:none}@media (device-width<=1000px) and (orientation:landscape){display:none}& a{border:.1em solid #fff;border-radius:50%;width:10px;height:10px;margin:5px;transition:transform .5s;display:inline-block;box-shadow:0 0 5px #0000004d;&.active{background:#fff;transform:scale(1.3)}}}html.references-visible .reference-pagination{opacity:1}.bubble{text-align:left;color:#000;opacity:0;background:#eee;border-radius:5px;width:260px;height:33px;margin-left:-135px;padding:10px;font:12px Courier,sans-serif;transition:all .5s ease-in-out;animation:1s infinite alternate glowing;position:absolute;top:-55px;left:50%;transform:translateY(25px);@media (width>=768px){margin-left:-20px;top:-70px}.animated &.shown{opacity:1;transition:all .5s ease-in-out 4s;transform:translateY(0)}}.bubble-arrow{border-top:12px solid #eee;border-left:10px solid #0000;border-right:10px solid #0000;width:0;height:0;position:absolute;bottom:-5px;left:80px;transform:rotate(-20deg);@media (width>=768px){bottom:-8px;left:33px;transform:rotate(20deg)}}.bubble-cursor{background:var(--typing-color);display:inline-block;color:#fff!important}.bubble-blinking{margin-left:2px;animation:1s step-end infinite blinking}@keyframes glowing{0%{box-shadow:0 0 30px var(--typing-color)}to{box-shadow:0 0 0px var(--typing-color)}}@keyframes blinking{0%,to{background:var(--typing-color)}50%{background:0 0}}.lang-fr [lang=en],.lang-en [lang=fr]{display:none}.lang-nav{z-index:100;letter-spacing:.05em;color:#ffffff80;font-size:11px;font-weight:600;position:fixed;top:12px;right:15px;& a{color:#ffffff80;text-decoration:none;transition:color .3s;&:hover{color:#fff}}.lang-fr & a[data-lang=fr],.lang-en & a[data-lang=en]{color:#fff}}#cursor{z-index:9999;pointer-events:none;border:2px solid var(--cursor-color);opacity:0;border-radius:50%;width:0;height:0;transition:opacity .5s,width 2s cubic-bezier(0,1,0,1),height 2s cubic-bezier(0,1,0,1);position:absolute;transform:translate(-50%,-50%)rotate(0);box-shadow:0 0 5px #ffffff80;&:after,&:before{content:"";background:var(--cursor-color);width:1px;height:20px;position:absolute;top:50%;left:50%}&:after{transform:translate(-50%, calc(-50% - var(--cursor-size) / 2))}&:before{transform:translate(-50%, calc(-50% + var(--cursor-size) / 2))}}#cursor.hover{opacity:.4;width:var(--cursor-size);height:var(--cursor-size);animation:10s linear infinite backwards rotate}@keyframes rotate{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}:root{--k-c1:black;--k-c2:darkblue;--k-c3:black;--k-c4:indigo;--k-c5:purple;--k-c6:darkmagenta;--k-opacity:.5;--k-timing:10s;--k-saturation:100%;--k-blur:80px}.kaleidoscope:before{content:"";opacity:.5;background:conic-gradient(from 0deg, var(--k-c1), var(--k-c2), var(--k-c3), var(--k-c4), var(--k-c5), var(--k-c6), var(--k-c1));animation:spin var(--k-timing) linear infinite;filter:blur(var(--k-blur)) saturate(var(--k-saturation));z-index:0;pointer-events:none;position:absolute;inset:0}@keyframes spin{to{transform:rotate(360deg)}}
/*# sourceMappingURL=jaysalvat.com.3f62f386.css.map */