:root{--dark: #0B0C08;--primary: #c08a24;--light: rgb(254, 246, 224);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{height:95dvh;scroll-behavior:smooth}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:var(--light)}.home{position:relative;height:95dvh;width:100%;color:var(--primary);margin-top:5dvh}.content{text-transform:uppercase;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;text-align:center}.home .content h1{font-size:8rem;font-weight:800}.home h2{font-size:5rem;font-weight:200}.overwrap{overflow:hidden;position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.overwrap.active{--x: 50%;--y: 50%;--radius: 150px;background-size:180px 180px;background-image:linear-gradient(to right,var(--primary) 2px,transparent 1px),linear-gradient(to bottom,var(--primary) 2px,transparent 1px);-webkit-mask-image:radial-gradient(circle var(--radius, 450px) at var(--x, 50%) var(--y, 50%),rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);-webkit-mask-repeat:no-repeat;-webkit-mask-size:cover;mask-image:radial-gradient(circle var(--radius, 450px) at var(--x, 50%) var(--y, 50%),rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);mask-repeat:no-repeat;mask-size:cover}@media (max-width: 600px){.home .content h1{font-size:4.5rem;font-weight:800}.home h2{font-size:3rem;font-weight:200}.overwrap{display:none}}.about{height:95dvh;display:flex;text-align:center;justify-content:center;flex-direction:column;gap:4rem;color:var(--primary);padding:2rem;margin-top:5dvh}.about .picture{display:flex;align-items:center;justify-content:center}.about .description{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2vw}.about .profile{width:clamp(12rem,26vw,24rem);height:auto;border-radius:50%;box-shadow:0 0 15px #0003}.about h1{font-size:3rem;font-weight:800;text-transform:uppercase}.about p{font-size:1.4rem;font-weight:400;text-transform:uppercase}.about .social-link{font-size:1.45rem;color:var(--primary);text-decoration:none;font-weight:600}.about .insta{font-size:1.3rem;font-weight:400;text-transform:uppercase}@media (max-width: 600px){.about .description{gap:1.5rem}.about .profile{width:12rem;margin-right:0;margin-bottom:1rem}.about h1{font-size:2rem}.about p{font-size:1rem}.about .insta{font-size:.8rem}.about .social-link{font-size:.9rem;font-weight:600}}.project-cardcontainer{width:100%;min-height:95dvh;height:auto;display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap;gap:50px 100px;padding-top:10dvh;padding-bottom:5dvh;margin:0 auto}.project-cardcontainer .cardlink{width:25vw;height:25dvh;border-radius:16px;text-decoration:none;color:inherit;display:block}.project-cardcontainer .cardlink a{text-decoration:none;color:inherit}.project-cardcontainer .card{padding:.5rem;width:25vw;height:25dvh;border-radius:16px;box-shadow:#00000026 0 5px 10px,#00000040 0 15px 14px;transition:transform .1s ease;transform-style:preserve-3d;display:flex;justify-content:center;flex-direction:column;text-align:center;background-color:var(--dark);overflow:hidden;border:1px solid rgba(255,255,255,.05)}.project-cardcontainer .cardcontent{position:relative;transition:transform .1s ease;transform-style:preserve-3d;pointer-events:none;z-index:1}.cardcontent h1{font-size:3rem;font-weight:800;color:var(--primary)}.cardcontent p{font-size:2rem;font-weight:600;color:var(--primary)}.project-cardcontainer .cardbg{position:absolute;z-index:0;object-fit:cover;width:100%;height:100%;transition:transform .3s ease,opacity .3s ease,filter .3s ease;border-radius:14px;filter:blur(3px) grayscale(30%);opacity:.3}.project-cardcontainer .card:hover .cardbg{opacity:.6;filter:blur(0px) grayscale(0%)}@media (max-width: 1800px){.project-cardcontainer{align-content:flex-start;flex-wrap:wrap;padding-top:10dvh}.project-cardcontainer .card,.project-cardcontainer .cardlink{width:650px;height:350px}}@media (max-width: 1350px){.project-cardcontainer{min-width:300px;align-content:flex-start;padding-top:10dvh;gap:2rem}.project-cardcontainer .card,.project-cardcontainer .cardlink{width:45vw;height:30dvh}}@media (max-width: 850px){.project-cardcontainer{gap:2rem}.project-cardcontainer .card,.project-cardcontainer .cardlink{width:80vw;height:20dvh}.cardcontent h1{font-size:1.5rem}.cardcontent p{font-size:1rem}}*,:before,:after{margin:0;padding:0;box-sizing:border-box}.vm-homepage{--marron: #312F2F;--green: #84DCCF;--blue: #A6D9F7;background:linear-gradient(15deg,#3c6f96,#78c3fb 51%,#fff7b8);background:var(--marron);height:910vh;width:100%;overflow:hidden;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:bolder}.vm-homepage .intro{height:100vh;width:100%;position:relative}.intro .title{height:100%;width:100%;background-color:var(--green);position:absolute;z-index:1;display:flex;justify-content:center;align-items:center;flex-direction:column}.vm-homepage .intro h1{font-size:clamp(5rem,20vw,21rem);color:var(--marron);text-align:center;opacity:1;line-height:.9;padding:0 1rem}.vm-homepage .intro-img{height:100%;width:100%;z-index:0;display:flex;justify-content:flex-end;align-items:center;flex-direction:column}.vm-homepage .intro h2{font-size:5rem;color:var(--green);opacity:1;padding-bottom:5%;text-align:center}.vm-homepage .middle-top{z-index:1;height:100vh;width:100%;display:flex;position:relative;justify-content:space-evenly;align-items:center;flex-direction:column}.middle-top .text-expo{width:100%;height:100%}.middle-top .text-expo .top-half{height:70%;display:flex;justify-content:center;align-items:center;flex-direction:column;overflow:hidden}.middle-top .text-expo .top-half .img1{height:70%;width:100%;object-fit:cover;position:absolute;z-index:4}.middle-top .text-expo .top-half .img2{height:70%;width:100%;position:absolute;z-index:3}.middle-top .text-expo .top-half .img3{height:70%;width:100%;position:absolute;z-index:2}.middle-top .text-expo .bottom-half{height:30%;width:100%;display:flex;justify-content:center;align-items:center;overflow-x:hidden;border-top:15px solid var(--green)}.middle-top .bottom-half .description-text{font-size:clamp(1rem,2.5vw,3.5rem);color:var(--green);width:90%;max-width:1400px;text-align:center;line-height:1.3;margin:0 auto;padding:0 1rem}.middle-top .bottom-half .first{position:absolute;opacity:1}.middle-top .bottom-half .second,.middle-top .bottom-half .third{position:absolute}.vm-homepage .middle-bottom{z-index:1;height:130vh;display:flex;justify-content:flex-start;align-items:center;flex-direction:column;background-color:var(--green);padding:1rem}.middle-bottom h3{height:10%;text-align:center;display:flex;justify-content:center;align-items:center;font-size:4.5em;color:var(--marron)}.middle-bottom .vinyl-expo{height:90%;width:100%;display:grid;grid-template-columns:repeat(4,1fr);align-content:center;gap:3rem;box-sizing:border-box;padding:3rem 2rem}.middle-bottom .vinyl-card{position:relative;height:100%;aspect-ratio:1 / .8;width:100%;margin:0 auto;overflow:hidden}.vinyl-background{position:absolute;width:100%;height:100%;background-color:var(--marron);opacity:.9;z-index:1}.middle-bottom .full-vinyl{width:100%;height:100%;position:relative;z-index:2;display:flex;justify-content:center;align-items:center;transform-origin:center;margin-right:15px;transition:.5s}.middle-bottom .vinyl-card:hover .full-vinyl{transform:scale(1.1)}.middle-bottom .vinyl-cover,.middle-bottom .vinyl-disc{aspect-ratio:1 / 1;position:absolute}.middle-bottom .vinyl-cover{height:80%;z-index:3;margin-left:-5%;box-shadow:-5px 10px 15px #000}.middle-bottom .vinyl-disc{height:91%;z-index:2;margin-left:20%}.vm-homepage .image-expo{height:300vh;position:relative}.placeholder-img{height:20%;width:30%;left:10%;top:10%;position:absolute}.placeholder-text{color:var(--green);height:10%;width:40%;left:55%;top:20%;position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:4rem}.placeholder-img-second{height:20%;width:80%;left:10%;top:40%;position:absolute;object-fit:cover}.placeholder-text-second{color:var(--green);height:10%;width:40%;left:7%;top:72%;position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:4rem}.placeholder-img-third{height:25%;width:40%;left:50%;top:70%;position:absolute;object-fit:cover}.vm-homepage .footer{height:30vh;width:100%}.footer .top-half{background-color:var(--green);color:var(--marron);height:5vh;display:flex;justify-content:center;align-items:center;overflow-x:hidden}.footer .infinite-loop{height:100%;font-size:3.2rem;display:flex;position:relative;overflow:hidden;font-weight:800;gap:2rem}.footer .infinite-loop-content{flex-shrink:0;display:flex;justify-content:space-around;gap:2rem;min-width:100%;list-style:none;animation:scroll 15s linear infinite}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(calc(-100% - 2rem))}}.footer .bottom-half{background-color:var(--marron);height:25vh;display:flex;align-items:center}.footer .bottom-half .left-half{width:60%;height:100%;display:flex;justify-content:flex-start;align-items:center}.footer .bottom-half .logo{font-size:18vh;font-weight:bolder;position:relative;left:5%;top:-5%}.footer .bottom-half .right-half{width:40%;height:100%;display:flex;justify-content:center;align-items:center}.footer .bottom-half .right-half .adress,.footer .bottom-half .right-half .socials{display:flex;justify-content:flex-start;align-items:center;flex-direction:column;gap:50px;padding:.5rem}.footer .bottom-half .right-half .adress{width:60%;height:100%}.footer .bottom-half .right-half .adress h4,.footer .bottom-half .right-half .socials h4{color:var(--green);font-size:5rem;font-weight:bolder}.footer .bottom-half .right-half .adress p,.footer .bottom-half .right-half .socials p{color:var(--blue);font-size:2.5rem;margin-top:-15px}.footer .bottom-half .right-half .socials{width:40%;height:100%}.footer .bottom-half .right-half .socials p:hover{cursor:pointer;transform:scale(1.1);transition:transform .2s ease;color:var(--green)}.footer .bottom-half .right-half .socials p:active{transform:scale(.9);transition:transform .2s ease}@media (max-width: 850px){.middle-bottom h3{font-size:3.5em;height:10%}.middle-bottom .vinyl-expo{height:90%;width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;padding:.5rem}.vm-homepage .middle-bottom{z-index:1;height:200vh}}@media (max-width: 650px){.vm-homepage .intro h1{font-size:4rem}.vm-homepage .intro h2{font-size:1.5rem;padding-bottom:5%;text-align:center}.vm-homepage .middle-bottom{height:200vh}.middle-bottom h3{font-size:1.5em;height:10%}.middle-bottom .vinyl-expo{height:90%;width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;padding:.5rem}.image-expo .placeholder-text,.image-expo .placeholder-text-second{font-size:1.5em}.footer .bottom-half .logo{font-size:3rem;top:-5%}.footer .bottom-half .left-half{width:40%}.footer .bottom-half .right-half{width:60%}.footer .infinite-loop{font-size:2.5rem;font-weight:800;gap:2rem}.footer .bottom-half .right-half .adress h4,.footer .bottom-half .right-half .socials h4{font-size:1rem;font-weight:bolder}.footer .bottom-half .right-half .adress p,.footer .bottom-half .right-half .socials p{font-size:.5rem;margin-top:-15px}}@media (max-width: 350px){.vm-homepage .middle-bottom{z-index:1;height:100vh}.middle-bottom h3{font-size:2.5em;height:20%}.middle-bottom .vinyl-expo{height:80%;width:100%;gap:.5rem;padding:0}.middle-bottom .vinyl-card{position:relative;aspect-ratio:1 / 1;width:90%;height:90%}.middle-bottom .vinyl-card:hover .full-vinyl{transform:scale(1.1)}}#minis-container{min-height:100vh;width:100%;z-index:1;position:relative;padding:10rem 10rem 2rem;display:flex;justify-content:center}.minis-pictures-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-flow:dense;gap:1rem;width:100%}.miniature-card{width:100%;background-color:#222;overflow:hidden;opacity:0;transform:translateY(50px);position:relative;grid-column:span 1;grid-row:span 1;aspect-ratio:1/1}.miniature-card:nth-child(5n+1){grid-column:span 2;aspect-ratio:2/1}.miniature-card:nth-child(8n+2){grid-row:span 2;grid-column:span 1;aspect-ratio:1/2;display:flex;align-items:center}.miniature-card:nth-child(11n+3){grid-column:span 2;grid-row:span 2;aspect-ratio:1/1}.miniature-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;display:block}.miniature-card:hover img{transform:scale(1.05)}@media (max-width: 900px){.minis-pictures-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.minis-pictures-grid{grid-template-columns:1fr}.miniature-card:nth-child(n){grid-column:span 1!important;grid-row:span 1!important;aspect-ratio:1/1!important}}.pictures-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000fa;display:flex;justify-content:center;align-items:center;flex-direction:column;z-index:1000}.single-view{width:90%;height:90%;display:flex;padding-top:10rem;justify-content:center;align-items:center}.multi-view{width:90%;height:90%;padding-top:10rem;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;flex-direction:column}.main-picture-container{width:100%;height:70%;display:flex;justify-content:center;align-items:center}.main-picture{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:8px}.sub-pictures-container{width:100%;height:30%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;padding:10px;box-sizing:border-box;overflow-y:auto}.sub-picture{width:100px;height:100px;object-fit:cover;border-radius:4px;cursor:pointer}.d-none{display:none}.navbar{position:absolute;top:0;left:0;right:0;z-index:10;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;justify-content:space-between;align-items:center;height:5dvh;color:var(--primaryry);margin:.2rem 2rem}.navbar-name{color:var(--primary);font-size:2em;text-decoration:none;font-weight:900}.navbar-lead{gap:3rem;display:flex;align-items:center;justify-content:space-evenly;list-style:none;height:100%;padding:9px}.navbar-lead .navbarlink{display:inline-block;transition:transform .2s ease,border-bottom .1s ease;text-decoration:none;font-size:2em;color:var(--primary)}.navbar-lead .navbarlink:hover{border-bottom:2px solid var(--primary);transform:scale(1.04)}@media (max-width: 600px){.navbar{margin-right:1rem;margin-left:1rem}.navbar-name{font-size:1.5em}.navbar-lead{gap:1.5rem;padding:5px}.navbar-lead .navbarlink{font-size:1.2em}}.social-links{position:absolute;bottom:20px;right:20px;display:flex;gap:20px;z-index:10}.social-btn{display:block;width:2rem;height:2rem;transition:transform .2s ease;color:var(--primary)}.social-btn:hover{transform:scale(1.1)}.social-btn svg{width:100%;height:100%}
