@import url(https://fonts.googleapis.com/css2?family=Playfair+Display:wght@800&display=swap);@import url(https://fonts.googleapis.com/css2?family=Allura&display=swap);@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@800&display=swap);body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}*{margin:0;padding:0;box-sizing:border-box;font-family:"Playfair Display"}.App{background-repeat:no-repeat;object-fit:cover;overflow-x:hidden;text-decoration:none}.App .border{margin:1em;border:5px solid #000;height:100%}.App .header{max-width:1608px;margin:0 auto;width:85%;position:fixed;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:space-between;justify-content:space-between;top:5%;left:50%;z-index:99;transition:.3s;-webkit-transform:translate(-50%) scale(1);transform:translate(-50%) scale(1)}.App .shift{top:0}.logo{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center}.logo img{width:110px;height:auto}.logo .logo-text{margin-left:20px;letter-spacing:2px}.logo .logo-text p{opacity:.6;font-size:19px;margin-left:185px;transition:.3s}.logo .logo-text h2{font-size:35px;color:#000}.nav{position:absolute;right:20px;top:30%;height:100%}.nav a{color:#fff;font-size:1.7em;text-decoration:none;margin:0 1em;text-shadow:5px 2px 5px #000;transition:.3s;padding:.2em}.nav a i{padding:0 10px}.nav .nav-mobile{position:absolute;top:0;right:0;width:50px;height:50px;color:#000;background:#fff;box-shadow:0 1px 20px #000;transition:.2s;display:none;z-index:100}.navBg{position:fixed;z-index:98;background:#000;width:100%;height:105px;top:0;left:0;opacity:.2;transition:.3s;-webkit-transform:translateY(0);transform:translateY(0)}.home{opacity:0;-webkit-transform:translateY(-120px);transform:translateY(-120px)}.main{width:100vw;height:100vh;position:relative}.main .main-container{max-width:1608px;margin:0 auto}.main .main-container .main-btn{position:absolute;top:800px;padding:.5em 2em;font-size:25px;cursor:pointer;color:#000;opacity:.7;background-color:#fff;border:1px solid #000;transition:.3s;letter-spacing:2px}.main .main-btn:hover{color:#fff;background-color:#000}.hero-body{position:absolute;top:350px;display:-webkit-flex;display:flex}.hero-body .hero-text{position:relative;letter-spacing:2px}.hero-body .hero-text .text p{position:absolute;font-size:20px;opacity:.7;top:50px;left:250px}.hero-body .hero-text .text h2{font-size:60px;margin-bottom:-.7em}.hero-body .hero-text .text h3{font-size:100px}.hero-body .hero-text .desc{max-width:850px;opacity:.7;font-size:1.2em}.hero-body .hero-img{position:absolute;margin-left:5em;box-shadow:2px 2px 50px #000}.hero-body .hero-img img{z-index:2;position:relative;width:500px;-webkit-filter:grayscale(100%);filter:grayscale(100%);transition:.3s}.hero-body .hero-img .whiteBg{position:absolute;width:450px;height:450px;background:#fff;box-shadow:2px 4px 25px #000;top:110px;right:20px;margin-top:-15em;z-index:1;opacity:.2;box-shadow:8px 8px 300px #000}.hero-body .hero-img .blackBg{position:absolute;width:200px;height:200px;background:#000;box-shadow:2px 4px 25px #000;top:300px;right:-80px;margin-top:-15em;z-index:0;opacity:.8;box-shadow:2px 2px 50px #000}.projects{position:relative;height:2500px;overflow:hidden;background-color:#fff}.projects .project-title{position:absolute;text-transform:uppercase;letter-spacing:2px;top:8%;left:3%}.projects .project-title h2{font-size:60px}.projects .project-title h2 span{font-size:100px}.projects .section-effect{position:absolute;color:#fff;letter-spacing:10px;font-family:"Poppins";font-size:8em;top:50%;left:90%;-webkit-transform:translate(-90%,-50%);transform:translate(-90%,-50%);text-shadow:2px 2px 8px #000;opacity:.1}.projects .projects-container{position:relative;left:3%;max-width:1208px;margin:0 auto;display:-ms-grid;display:grid;-ms-grid-columns:(minmax(400px,1fr))[auto-fill];grid-template-columns:repeat(auto-fill,minmax(400px,1fr));grid-row-gap:10px}.projects .projects-container article{position:relative;width:300px;height:700px;overflow:hidden;cursor:pointer;box-shadow:5px 2px 10px #000;border-bottom-left-radius:20px;border-bottom-right-radius:20px;border-top-right-radius:20px;top:500px}.projects .projects-container article img{position:relative;-webkit-filter:grayscale(100%);filter:grayscale(100%);-webkit-transform:translateX(0);transform:translateX(0);transition:.3s;width:120%;opacity:.7;z-index:1}.projects .projects-container article .project-info h2{font-size:20px;position:absolute;z-index:2;top:0;padding-top:20px;left:0;letter-spacing:2px;background:#fff;width:300px;text-align:center;height:80px;opacity:0;transition:.3s;text-shadow:2px 2px 5px #000}.projects .projects-container article .project-info h2 span{font-family:"Allura";font-size:3em}.projects .projects-container article .project-info p{color:#000;font-size:1.2em;position:absolute;z-index:2;background:#fff;border-bottom-left-radius:20px;border-bottom-right-radius:20px;top:30%;height:400px;padding:20px;max-width:300px;opacity:0;transition:.3s;box-shadow:5px 2px 10px #000}.projects .projects-container article:hover img{-webkit-filter:grayscale(0);filter:grayscale(0);opacity:1}.projects .projects-container article:hover h2,.projects .projects-container article:hover p{opacity:1}.projects .view{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;background:#fff;opacity:0;transition:.5s;pointer-events:none}.projects .view .closeBtn{position:absolute;font-size:4em;top:2%;left:3%;transition:.3s;cursor:pointer}.projects .view .link{position:absolute;top:78%;right:10%;font-size:3em;transition:.3s;opacity:.7}.projects .view .link a{color:#000}.projects .view .views{position:relative;background:#000;width:1550px;height:720px;top:3%;left:10%;display:-webkit-flex;display:flex;z-index:99;overflow:hidden}.projects .view .views img{min-width:300px}.projects .view .views .desktop-view{position:absolute;top:0;left:12%;z-index:20}.projects .view .views .desktop-view img{width:800px}.projects .view .views .tablet-view{position:absolute;z-index:19;bottom:0;left:12%}.projects .view .views .tablet-view img{width:400px}.projects .view .views .mobile-view{position:absolute;right:10.5%;top:0;z-index:18}.projects .view .views .mobile-view img{width:400px;height:720px;object-fit:cover}.projects .view .view-text{position:absolute;letter-spacing:2px;top:80%;left:10%}.projects .view .view-text h2{font-size:2em}.projects .view .view-text p{font-size:1.3em;max-width:1100px}.projects .view .link:hover{-webkit-transform:scale(1.2);transform:scale(1.2)}.projects .viewOverlayBg{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;opacity:0;pointer-events:none;transition:.2s;z-index:998}.projects .closeBtn:hover{-webkit-transform:scale(1.2);transform:scale(1.2)}.projects .displayProject{opacity:1;pointer-events:all}.projects .overlayBg{opacity:.6}.contact{position:relative;height:100vh;overflow-x:hidden;max-width:1608px;margin:0 auto}.contact .contact-container .contact-title{position:absolute;text-transform:uppercase;letter-spacing:2px;top:80px;left:3%}.contact .contact-container .contact-title h2{font-size:60px}.contact .contact-container .contact-title h2 span{font-size:100px}.contact .contact-container .contact-section{position:absolute;width:1400px;height:600px;top:30%;left:8%;background:#fff;box-shadow:0 0 25px #000}.contact .contact-container .contact-section .section-title{position:absolute;left:50%;top:20%;-webkit-transform:translateX(-50%);transform:translateX(-50%);font-size:4em}.contact .contact-container .contact-section .section-title h2{font-family:"Allura"}.contact .contact-container .contact-section .section-text{position:absolute;display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;width:90%;letter-spacing:2px;bottom:5%;font-size:20px}.contact .contact-container .contact-section .section-text .text{max-width:800px;margin:0 40px}.contact .contact-container .contact-section .section-text .information p{max-width:600px;letter-spacing:1px;margin-bottom:20px;opacity:.7}.contact .contact-container .contact-section .section-text .connect .social{font-size:2em}.contact .contact-container .contact-section .section-text .connect .social a{color:#000;margin:0 5px;cursor:pointer}.contact .contact-container .contact-section .section-text .skills ul li{list-style:none}.hero-img img:hover{-webkit-filter:grayscale(0);filter:grayscale(0)}.logo-text p:hover{margin-left:160px;font-size:25px;opacity:1}.nav a:hover{font-size:1.8em;text-decoration:none;color:#000;text-shadow:none;text-transform:uppercase;letter-spacing:2px}.nav-mobile:hover{-webkit-transform:scale(1.3);transform:scale(1.3)}@media only screen and (min-width:1601px) and (max-width:2500px){.App .header{width:100%;-webkit-transform:translate(-50%) scale(1);transform:translate(-50%) scale(1)}.App .shift{-webkit-transform:translate(-50%) scale(.9);transform:translate(-50%) scale(.9)}}@media only screen and (min-width:1401px) and (max-width:1600px){.App .header{width:100%;-webkit-transform:translate(-50%) scale(1);transform:translate(-50%) scale(1)}.App .shift{-webkit-transform:translate(-50%) scale(.9);transform:translate(-50%) scale(.9)}.main .main-container .main-btn{font-size:20px;left:40px}.hero-body{-webkit-transform:scale(.9);transform:scale(.9);position:absolute;top:350px;display:-webkit-flex;display:flex}.hero-body .hero-text{position:relative;letter-spacing:2px}.projects .view{width:100%}.projects .view .views{-webkit-transform:scale(.8);transform:scale(.8);left:0}.projects .view .view-text{position:absolute;letter-spacing:2px;top:75%;left:10%}.projects .view .view-text h2{font-size:2em}.projects .view .view-text p{font-size:1.3em;max-width:1100px}.projects .view .link{font-size:2.5em;top:72%}.contact .contact-container .contact-section{position:absolute;top:30%;left:4%;-webkit-transform:scale(.8);transform:scale(.8)}}@media only screen and (min-width:1080px) and (max-width:1400px){.App .header{width:90%;-webkit-transform:translate(-50%) scale(1);transform:translate(-50%) scale(1)}.App .shift{-webkit-transform:translate(-45%) scale(.9);transform:translate(-45%) scale(.9)}.main .main-container .main-btn{font-size:20px;left:300px}.hero-body{-webkit-transform:scale(1.1);transform:scale(1.1);position:absolute;top:360px;left:19%;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column}.hero-body .hero-text{position:relative;letter-spacing:2px}.hero-body .hero-img{position:absolute;margin-left:5em;-webkit-transform:scale(.7);transform:scale(.7);top:-250px;right:-50px}.projects .view .views{-webkit-transform:scale(.8);transform:scale(.8);left:0}.nav{top:30%}.nav .nav-list{position:absolute;top:75px;right:-190px;background:#000;width:320px;height:1800px;opacity:.7;-webkit-transform:translateX(235px);transform:translateX(235px);transition:.3s}.nav a{color:#fff;font-size:1.7em;text-decoration:none;margin:5em 1em;text-shadow:5px 2px 5px #000;transition:.3s;display:-webkit-flex;display:flex;opacity:1}.nav .nav-mobile{position:absolute;top:0;right:50px;width:50px;height:50px;color:#000;box-shadow:0 1px 20px #000;transition:.2s;display:block;z-index:100}.nav .show-mobile-nav{-webkit-transform:translateX(0);transform:translateX(0)}.projects{height:2100px}.projects .projects-container{top:0;height:1600px}.projects .view{width:100%}.projects .view .views{-webkit-transform:scale(.6);transform:scale(.6);left:-200px}.projects .view .view-text{position:absolute;letter-spacing:2px;top:75%;left:10%;max-width:900px}.projects .view .link{font-size:2.5em;top:72%}.contact .contact-container .contact-section{position:absolute;top:30%;left:-10%;-webkit-transform:scale(.7);transform:scale(.7)}.nav a:hover{font-size:1.8em;text-decoration:none;color:#fff;text-shadow:none;text-transform:uppercase;letter-spacing:2px}}@media only screen and (max-width:1079px){.App .header{width:170%}.App .header,.App .shift{-webkit-transform:translate(-50%) scale(.6);transform:translate(-50%) scale(.6)}.main .main-container .main-btn{font-size:20px;left:120px}.hero-body{-webkit-transform:scale(.8);transform:scale(.8);position:absolute;top:200px;left:5%;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column}.hero-body .hero-text{position:relative;letter-spacing:2px;top:180px}.hero-body .hero-img{position:absolute;margin-left:5em;-webkit-transform:scale(.7);transform:scale(.7);top:-200px;right:-50px}.logo{-webkit-transform:scale(.8);transform:scale(.8)}.nav{top:30%}.nav .nav-list{position:absolute;top:100px;right:-100px;background:#000;width:320px;height:1800px;opacity:.7;-webkit-transform:translateX(305px);transform:translateX(305px);transition:.3s}.nav a{color:#fff;font-size:1.7em;text-decoration:none;margin:5em 1em;text-shadow:5px 2px 5px #000;transition:.3s;display:-webkit-flex;display:flex;opacity:1}.nav .nav-mobile{position:absolute;top:0;right:50px;width:50px;height:50px;color:#000;box-shadow:0 1px 20px #000;transition:.2s;display:block;z-index:100}.nav .show-mobile-nav{-webkit-transform:translateX(0);transform:translateX(0)}.projects{height:2800px}.projects .projects-container{top:0;height:2300px}.projects .view{width:100%}.projects .view .views{top:-40px;-webkit-transform:scale(.3);transform:scale(.3);left:-450px}.projects .view .view-text{position:absolute;letter-spacing:2px;top:45%;left:10%;max-width:700px}.projects .view .link{font-size:2.5em;top:45%}.contact .contact-container .contact-section{position:absolute;top:15%;left:50px;-webkit-transform:scale(.8);transform:scale(.8);width:600px;height:950px}.contact .contact-container .contact-section .section-title{position:absolute;top:5%;left:55%;font-size:2.4em;width:500px}.contact .contact-container .contact-section .section-text{position:absolute;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-justify-content:center;justify-content:center;bottom:10%}.nav a:hover{font-size:1.7em;text-decoration:none;color:#fff;text-shadow:none;text-transform:uppercase;letter-spacing:2px}}@media only screen and (min-width:461px) and (max-width:625px){.App .header{width:180%}.App .header,.App .shift{-webkit-transform:translate(-50%) scale(.6);transform:translate(-50%) scale(.6)}.main .main-container .main-btn{font-size:20px;left:30px}.hero-body{-webkit-transform:scale(.7);transform:scale(.7);position:absolute;top:200px;left:-10%;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column}.hero-body .hero-text{position:relative;letter-spacing:2px;top:180px}.hero-body .hero-img{position:absolute;margin-left:5em;-webkit-transform:scale(.7);transform:scale(.7);top:-200px;right:-50px}.logo{-webkit-transform:scale(.8);transform:scale(.8)}.nav{top:30%}.nav .nav-list{position:absolute;top:100px;right:-100px;background:#000;width:320px;height:1800px;opacity:.7;-webkit-transform:translateX(235px);transform:translateX(235px);transition:.3s}.nav a{color:#fff;font-size:1.7em;text-decoration:none;margin:5em 1em;text-shadow:5px 2px 5px #000;transition:.3s;display:-webkit-flex;display:flex;opacity:1}.nav .nav-mobile{position:absolute;top:0;right:50px;width:50px;height:50px;color:#000;box-shadow:0 1px 20px #000;transition:.2s;display:block;z-index:100}.nav .show-mobile-nav{-webkit-transform:translateX(0);transform:translateX(0)}.projects{height:2800px}.projects .projects-container{top:0;height:2300px}.projects .view{width:100%}.projects .view .views{top:-40px;-webkit-transform:scale(.3);transform:scale(.3);left:-480px}.projects .view .view-text{position:absolute;letter-spacing:2px;top:45%;left:10%;max-width:700px}.projects .view .link{font-size:2.5em;top:45%}.contact .contact-container .contact-section{position:absolute;top:10%;left:-20px;-webkit-transform:scale(.7);transform:scale(.7);width:600px;height:950px}.contact .contact-container .contact-section .section-title{position:absolute;top:5%;left:55%;font-size:2.4em;width:500px}.contact .contact-container .contact-section .section-text{position:absolute;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-justify-content:center;justify-content:center;bottom:10%}.nav a:hover{font-size:1.7em;text-decoration:none;color:#fff;text-shadow:none;text-transform:uppercase;letter-spacing:2px}}@media only screen and (min-width:320px) and (max-width:460px){.App .header{width:180%}.App .header,.App .shift{-webkit-transform:translate(-50%) scale(.6);transform:translate(-50%) scale(.6)}.main .main-container .main-btn{font-size:20px;left:30px}.hero-body{-webkit-transform:scale(.7);transform:scale(.7);position:absolute;top:200px;left:-10%;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column}.hero-body .hero-text{position:relative;letter-spacing:2px;top:180px}.hero-body .hero-img{position:absolute;margin-left:5em;top:-200px;right:-50px}.hero-body .hero-img,.logo{-webkit-transform:scale(.7);transform:scale(.7)}.nav{top:30%}.nav .nav-list{position:absolute;top:100px;right:-100px;background:#000;width:320px;height:1800px;opacity:.7;-webkit-transform:translateX(235px);transform:translateX(235px);transition:.3s}.nav a{color:#fff;font-size:1.7em;text-decoration:none;margin:5em 1em;text-shadow:5px 2px 5px #000;transition:.3s;display:-webkit-flex;display:flex;opacity:1}.nav .nav-mobile{position:absolute;top:0;right:50px;width:50px;height:50px;color:#000;box-shadow:0 1px 20px #000;transition:.2s;display:block;z-index:100}.nav .show-mobile-nav{-webkit-transform:translateX(0);transform:translateX(0)}.projects{height:2800px}.projects .projects-container{top:0;height:2300px}.projects .view{width:100%}.projects .view .views{top:-20px;-webkit-transform:scale(.25);transform:scale(.25);left:-600px}.projects .view .view-text{position:absolute;letter-spacing:2px;top:45%;left:10%;max-width:700px}.projects .view .link{font-size:2.5em;top:45%}.contact .contact-container .contact-section{position:absolute;top:10%;left:-100px;-webkit-transform:scale(.6);transform:scale(.6);width:600px;height:950px}.contact .contact-container .contact-section .section-title{position:absolute;top:5%;left:55%;font-size:2.4em;width:500px}.contact .contact-container .contact-section .section-text{position:absolute;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-justify-content:center;justify-content:center;bottom:10%}.nav a:hover{font-size:1.7em;text-decoration:none;color:#fff;text-shadow:none;text-transform:uppercase;letter-spacing:2px}}
/*# sourceMappingURL=main.ef640395.chunk.css.map */