:root{--portfolio-color:#645fd1;--resume-color:#d2a426;--side-color:#d22676;--background-color:#13121c;--panel-background-color:#1c1b2b;--panel-border-color:#47455d;--text-color:#fff;--icon-background-color:#47455d;--icon-hovered-background-color:#8a87a9;--active-color:#645fd1;--pill-color:#111;--border-size:0.1rem;--panel-border-radius:1.5rem;--max-border-radius:9999px;--tiles-border-radius:1rem;--seperator-size:0.2rem;--icon-size:60%;--lifeline-size:3px;--h2-size:1.6rem;--h2-weight:600;--aside-border-size-phone:clamp(0.5rem,2vw,1.2rem);--icon-transformation-time:300ms}*{margin:0;padding:0}@font-face{font-family:Inter;font-style:normal;font-weight:400;src:url(../assets/font/Inter.ttf)}@font-face{font-family:HelveticaLight;src:url(../assets/font/Helvetica-Light.otf)}*,body{box-sizing:border-box}body{background-color:var(--background-color);color:var(--text-color);display:flex;font-family:Inter;justify-content:center;padding-bottom:5rem;padding-top:5rem}ul li{list-style:none}.page{display:none}.page.active{display:block}main{background-color:var(--panel-background-color);border:solid var(--border-size) var(--panel-border-color);border-radius:var(--panel-border-radius);overflow:hidden;width:65rem}main,nav{position:relative}nav{z-index:3}#main-nav{background-color:var(--active-color);border-radius:var(--panel-border-radius) 0 var(--panel-border-radius);height:clamp(3.5rem,12vw,5rem);justify-content:space-around;padding-left:1rem;padding-right:1rem;width:50%}#main-nav,#main-nav a{align-items:center;display:flex}#main-nav a{border-radius:var(--max-border-radius);box-sizing:border-box;color:var(--text-color);font-size:clamp(.9rem,4vw,1.2rem);font-weight:600;height:50%;justify-content:center;padding:clamp(.2rem,2vw,1rem);text-decoration:none;transition:var(--icon-transformation-time) ease}.active-nav{background:rgba(0,0,0,.1);box-shadow:inset 0 -5px 5px #2222}#main-nav a:hover{background:hsla(0,0%,100%,.2)}#nav-portfolio:active,#nav-portfolio:hover:active{background:var(--portfolio-color);box-shadow:inset 0 -5px 5px #2222}#nav-resume:active,#nav-resume:hover:active{background:var(--resume-color);box-shadow:inset 0 -5px 5px #2222}#nav-side:active,#nav-side:hover:active{background:var(--side-color);box-shadow:inset 0 -5px 5px #2222}main section{padding:clamp(1rem,3.5vw,2rem)}@media only screen and (max-width:95rem){body{align-items:center;flex-direction:column;padding:var(--aside-border-size-phone) var(--aside-border-size-phone) 0 var(--aside-border-size-phone)}main{order:1;width:100%}nav{bottom:0;box-sizing:content-box;position:fixed;width:calc(100% - (var(--aside-border-size-phone) + 1px)*2)}#main-nav{border-radius:var(--panel-border-radius) var(--panel-border-radius) 0 0;width:100%}}aside{align-items:center;background-color:var(--panel-background-color);border:solid var(--border-size) var(--panel-border-color);border-radius:var(--panel-border-radius);display:flex;flex-direction:column;height:43rem;justify-content:space-around;margin-left:3rem;padding-bottom:3.5rem;padding-top:3.5rem;width:25rem}aside h1{font-size:var(--h2-size);font-weight:var(--h2-weight);letter-spacing:.05rem;margin-bottom:.2rem;margin-top:.7rem}aside h2{font-size:1.4rem;font-weight:300}aside hr{border:solid var(--seperator-size) var(--active-color);border-radius:var(--max-border-radius);margin:1.5rem 0;width:clamp(1rem,40%,6rem)}.presentation{flex-direction:column}.presentation,.social_links{align-items:center;display:flex;width:100%}.social_links{gap:clamp(.5rem,8%,2rem);height:100%;max-height:6rem}.social,.social_links{justify-content:center}.social{align-items:center;aspect-ratio:1;background-color:var(--icon-background-color);border-radius:var(--max-border-radius);display:flex;height:60%;max-height:4rem;max-width:4rem;transition:all var(--icon-transformation-time) ease}.social:hover{background-color:var(--icon-hovered-background-color);transform:scale(1.05)}.social:active{background-color:var(--background-color);transform:scale(.95);transition:all .15s ease}.social img{height:var(--icon-size);width:var(--icon-size)}#direct_link{align-items:center;background-color:var(--background-color);border-radius:var(--max-border-radius);cursor:text;display:flex;height:11%;justify-content:center;margin-top:1.5rem;width:80%}#direct_link h3{font-weight:400;transition:opacity .3s ease}.avatar{align-items:center;display:flex;height:40%;justify-content:center;position:relative;width:100%}.model_3d{height:100%;position:absolute;width:100%;z-index:1}.model_background{aspect-ratio:1;background-color:#47455d;border-radius:clamp(.8rem,2vw,1.2rem);position:absolute;width:40%}@media only screen and (max-width:95rem){aside{align-items:center;flex-direction:row;height:22vw;margin:0 0 var(--aside-border-size-phone) 0;max-height:8rem;padding:0 1rem;width:100%}aside h1{font-size:clamp(.9rem,4vw,1.8rem);letter-spacing:.02rem}aside h2{font-family:HelveticaLight;font-size:clamp(.7rem,3.5vw,1.6rem);margin:1vw 0}.presentation{flex:0 0 50%;height:100%;justify-content:center;padding:.5rem;width:100%}.presentation>*{margin:0}.model_3d{height:80%}.presentation>hr{border-width:clamp(.1rem,.3vw,var(--seperator-size));margin-bottom:clamp(0rem,10%,.5rem);margin-top:clamp(0rem,10%,.5rem);max-width:6rem;width:15vw}#sep-2{display:none}.social_links{flex:0 0 30%}.social{height:8vw;max-height:3.5rem;max-width:3.5rem}#direct_link{display:none;height:100%}.avatar{height:100%}.model_background{height:70%;width:auto}}#resume-all{position:relative}#resume-content{display:flex;flex-direction:column;gap:3rem;padding-bottom:5rem}.resume-container{position:relative}.lifeline,.vline{position:absolute}.lifeline{border-left:solid var(--lifeline-size) var(--panel-border-color);height:95%;margin-top:.5rem}.lifeline,.vline{margin-left:calc(2rem - var(--lifeline-size)/2)}.vline{color:var(--panel-border-color);height:2rem;top:95%;width:var(--lifeline-size)}.resume-grid{column-gap:2rem;display:grid;grid-template-columns:2rem 1fr;margin-left:1rem;position:relative;z-index:2}.round{background-color:var(--active-color);border-radius:var(--max-border-radius);justify-self:center;outline:solid var(--lifeline-size) var(--panel-border-color)}.l1{height:1rem;margin-top:.35rem;width:1rem}.l2{height:.7rem;margin-top:1.8rem;width:.7rem}.l3{background-color:var(--panel-border-color);height:.5rem;margin-top:.35rem;width:.5rem}.multi-line *{font-style:normal;font-weight:400}.multi-line em{color:var(--active-color);font-weight:400;margin-left:2rem}.multi-line h3{font-size:1.2rem;margin-right:2rem;margin-top:1.4rem}.multi-line h4{color:var(--active-color);font-size:1.1rem;margin-bottom:.8rem;margin-top:.2rem}.multi-line b{color:var(--text-color);margin-right:2rem}.resume-container h4,.resume-container p{font-family:HelveticaLight}.resume-container p{font-size:1rem;margin-bottom:.5rem}#resume .button{background-color:var(--active-color);border-radius:var(--max-border-radius);box-shadow:inset 0 3px 3px #ddd4;color:var(--text-color);font-family:Inter;font-size:1.2rem;padding:.5rem 1rem;position:absolute;right:0;text-decoration:none;transition:all .2s ease}#resume .button:hover{filter:brightness(110%)}#resume .button:active,#resume .button:hover:active{box-shadow:inset 0 -3px 3px #2224;filter:brightness(95%)}.project a{border-radius:var(--max-border-radius);color:var(--text-color);font-family:Inter;font-size:1.5rem;font-weight:600;padding:.5rem 1.2rem;position:absolute;right:5rem;text-decoration:none;top:1.5rem;z-index:2}.project a:hover{background-color:hsla(0,0%,100%,.1)}.project a:active,.project a:hover:active{background-color:rgba(0,0,0,.1);box-shadow:inset 0 -3px 3px #4444}.project-background{background-image:url(../assets/media/images/projects/franck/frank.jpg);background-position:50%;background-size:100% auto;height:13rem;left:0;opacity:.5;position:absolute;top:0;width:100%;z-index:1}.project ul{display:flex;gap:1rem;position:absolute;top:10rem;z-index:2}.project li{background-color:var(--active-color);border-radius:var(--max-border-radius);padding:.25rem 1rem}.markdown-page{display:flex;flex-direction:column;margin-top:8rem}.markdown-page img{align-self:center;max-height:25rem}#main-projects hr{border:solid var(--seperator-size) var(--active-color);border-radius:var(--max-border-radius);margin:1rem 0 2.5rem;width:clamp(1rem,40%,6rem)}#main-projects p{color:var(--text-color);font-family:HelveticaLight;font-size:1rem;margin-bottom:3rem;word-spacing:.1rem}#main-projects h2{font-size:var(--h2-size);font-weight:var(--h2-weight)}#big-tiles-grid{display:flex;gap:2rem;height:30rem;justify-content:space-around}.big-tiles{border:solid var(--border-size) var(--panel-border-color);border-radius:var(--tiles-border-radius);flex:1;height:100%;overflow:hidden;position:relative;transition:all .5s ease}.big-tiles,.big-tiles *{color:inherit;text-decoration:none}.big-tiles h3{font-size:var(--h2-size);font-weight:700;text-transform:uppercase}.big-tiles h4{font-family:HelveticaLight;font-weight:100;margin-top:.2rem}.big-tiles:hover{flex:2}.big-tiles .foreground{display:flex;flex-direction:column;height:100%;justify-content:space-between;padding:1rem;position:absolute}.big-tiles ul{display:flex;flex-wrap:wrap;gap:10px;gap:1rem;list-style:none;width:100%}.big-tiles li{background-color:var(--text-color);border-radius:var(--max-border-radius);box-shadow:0 2px 4px #222;color:var(--pill-color);font-weight:600;padding:.2rem 1rem}.big-tiles video{filter:contrast(90%) saturate(90%);height:100%;object-fit:cover;opacity:.7;position:absolute;transition:opacity .5s ease,filter .5s ease;width:100%}.big-tiles:hover video{filter:contrast(100%) saturate(100%);opacity:1}#tiles-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(3,1fr);margin-top:3rem;width:100%}.tiles{aspect-ratio:1;perspective:100rem;position:relative}.behind{background-color:var(--background-color)}.behind,.front{aspect-ratio:1;border:solid var(--border-size) var(--panel-border-color);border-radius:var(--tiles-border-radius);position:absolute;width:100%}.front{background-image:url(../assets/media/images/projects/franck/FRANK.JPG);background-size:auto 100%;overflow:hidden;transform-origin:left;transition:all .5s ease}.tiles:hover .front{filter:brightness(110%);transform:rotateY(-20deg)}.tiles,.tiles *{color:inherit;text-decoration:none}.tiles video{height:100%;position:absolute;transform:translateX(-20%)}.tiles .foreground{display:flex;position:absolute;width:100%}.tiles h3{font-size:clamp(1rem,4vw,1.5rem);padding:1rem}.tiles ul{align-items:end;display:flex;flex-direction:column;gap:10px;gap:.5rem;justify-content:right;padding-top:1rem;position:absolute;width:100%}.tiles li{background-color:var(--text-color);border-radius:var(--max-border-radius) 0 0 var(--max-border-radius);box-shadow:0 2px 4px #200;color:var(--pill-color);font-size:clamp(.6rem,3vw,1rem);font-weight:600;opacity:.8;padding:.2rem clamp(.2rem,2vw,1rem)}.scene{display:flex;justify-content:center;margin-bottom:1rem;margin-top:2rem}.scene-container{aspect-ratio:1;background:#d2d1b0;border-radius:var(--tiles-border-radius);width:95%}.scene-3d-side{height:100%;width:100%}@media only screen and (max-width:65rem){#big-tiles-grid{flex-direction:column}#tiles-grid{grid-template-columns:repeat(2,1fr)}}