@import url(https://fonts.googleapis.com/css2?family=Almarai:wght@300;400;700;800&family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap);@font-face{font-family:PP Neue Montreal;font-style:normal;font-weight:300;src:url(/static/media/ppneuemontreal-thin-webfont.ed4deeb52fa22eaaf8cf.woff) format("woff")}@font-face{font-family:PP Neue Montreal;font-style:normal;font-weight:400;src:url(/static/media/ppneuemontreal-book-webfont.cda7c9143f6e679dde9b.woff) format("woff")}@font-face{font-family:PP Neue Montreal;font-style:normal;font-weight:500;src:url(/static/media/ppneuemontreal-medium-webfont.c302be04686b7531bfc4.woff) format("woff")}@font-face{font-family:PP Neue Montreal;font-style:normal;font-weight:700;src:url(/static/media/ppneuemontreal-bold-webfont.d1650c50e8e004659e04.woff) format("woff")}:root{--font-base:"PP Neue Montreal",sans-serif;--primary-color:#111414;--lightGray-color:#efefef;--gray:#3e4040;--max-width:1600px}*{box-sizing:border-box;margin:0;padding:0;scroll-behavior:smooth}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background-color:var(--primary-color);box-shadow:inset 0 0 10px rgba(0,0,0,.25)}::-webkit-scrollbar-thumb{background-color:var(--lightGray-color);border-radius:5px}.App{-webkit-tap-highlight-color:rgba(0,0,0,0);background:var(--primary-color);font-family:var(--font-base);overflow-x:hidden;overflow-y:hidden;overflow:hidden}.underline-hover{color:var(--lightGray-color);display:inline-block;position:relative;text-decoration:none;transition:color .6s ease-in-out}.underline-hover:before{background-color:var(--lightGray-color);bottom:0;content:"";height:1px;position:absolute;right:0;transition:width .4s ease-in-out;width:0;z-index:1}.underline-hover:hover:before{left:0;right:auto;width:100%}.nav{z-index:2}.nav,.navbar{position:fixed}.navbar{align-items:center;box-sizing:border-box;display:flex;justify-content:space-between;margin:0 auto;mix-blend-mode:difference;padding:2.25em 4.5em 1em;width:100%;z-index:10}.Logo-container{display:inline-block;position:relative}.nav_logo{font-size:1.4em;font-weight:500;mix-blend-mode:difference;text-decoration:none}.light{fill:var(--primary-color);color:var(--primary-color)}.light .lineBottom,.light .lineCenter,.light .lineTop{background-color:var(--primary-color)}.dark{fill:var(--lightGray-color);color:var(--lightGray-color)}.dark .lineBottom,.dark .lineCenter,.dark .lineTop{background-color:var(--lightGray-color)}.nav-overlay{background:var(--primary-color);height:100dvh;left:0;overflow:hidden;padding:4em;position:fixed;top:-100%;transition:all 2s cubic-bezier(.16,1,.3,1);width:100%;z-index:-2}.right__container{align-items:center;display:flex;justify-content:flex-end;mix-blend-mode:difference;position:relative;right:5px}.nav__theme{align-items:center;cursor:pointer;display:inline-flex;justify-content:center}.nav__theme__icon{height:1.25em;width:1.25em}.theme__text{font-size:1.2em;font-weight:500;letter-spacing:0;margin-left:.5em}.hidden{display:none}.menu-toggle{justify-content:center;margin:0 20px}.hamBox,.menu-toggle{align-items:center;display:flex}.hamBox{flex-direction:column;height:20px;justify-content:space-between;width:30px}.lineBottom,.lineCenter,.lineTop{border-radius:10px;display:block;height:2px;left:0;margin:0 auto;mix-blend-mode:difference;position:relative;right:0;-webkit-transform:rotate(0deg);transform:rotate(0deg);transition:all .4s;width:24px}.lineTop{top:2px}.lineBottom{bottom:2px}.lineTop.spin{top:10px;-webkit-transform:rotate(135deg);transform:rotate(135deg)}.lineBottom.spin{bottom:8px;-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}.lineCenter.spin{opacity:0}ul.nav-links{align-items:center;display:flex;flex-direction:column;justify-content:center;left:50%;margin:0;padding:0;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}ul.nav-links li{list-style:none;padding-bottom:29px;position:relative}ul.nav-links li a{font-size:6em;letter-spacing:.1em;text-transform:uppercase;transition:all 2s cubic-bezier(.16,1,.3,1)}.rolling-text{color:var(--lightGray-color);display:inline-block;position:relative;text-decoration:none;transition:color .6s ease}.rolling-text:before{background-color:var(--lightGray-color);bottom:0;content:"";height:2px;position:absolute;right:0;transition:width .4s ease-in-out;width:0;z-index:1}.rolling-text:hover:before{left:0;right:auto;width:100%}.nav-item-wrapper:after{background:var(--primary-color);content:"";height:100%;left:-10%;margin:0 auto;position:absolute;top:120px;width:120%}.nav-footer{bottom:0;display:flex;justify-content:space-between;left:0;padding:2em;position:absolute;width:100%}.nav-social-media{align-items:center;display:flex;flex:1 1;justify-content:right}.nav-social-media a{padding:0 1em}.icon{display:block;height:1.5rem;position:relative;top:2px;transition:fill .4s ease-out;width:1.5rem}.icon,.icon:hover,.location{color:var(--lightGray-color)}.location{bottom:-20px;opacity:0;position:relative;text-transform:capitalize;transition:all 2s cubic-bezier(.16,1,.3,1)}@media screen and (max-width:768px){.navbar{padding:1em}.nav_logo{font-size:1em}.theme__text{display:none}ul.nav-links li a{font-size:4em}.location{display:flex}.nav-footer{justify-content:space-around}.nav-social-media ul li a{padding:0 1em}.Logo{height:25px}.hamBox{margin:0 auto}}#home{background-color:var(--primary-color);width:100%}.wrapper{margin:0 auto;max-width:var(--max-width);min-height:100vh;position:relative}.header__grid,.wrapper{color:var(--lightGray-color)}.header__grid{grid-gap:25px 0;bottom:0;box-sizing:border-box;display:grid;gap:25px 0;grid-auto-flow:row;grid-template-areas:"row1" "row2" "row3";grid-template-columns:1fr;grid-template-rows:1fr 1fr 1fr;left:0;margin-top:150px;position:absolute;right:0;top:0}.row1{display:inline-block}.row1 div{color:var(--lightGray-color);font-size:8em;font-weight:500;line-height:1;line-height:.85;margin:0;position:relative;text-transform:uppercase}.row2{align-items:center;display:flex;justify-content:center}.marquee{position:absolute}.marquee span{-webkit-text-stroke:3px var(--lightGray-color);-webkit-animation:marquee-animation 400s linear infinite;animation:marquee-animation 400s linear infinite;color:transparent;display:inline-block;font-size:15em;font-weight:500;letter-spacing:-5px;mix-blend-mode:normal!important;overflow:hidden;padding-left:-10%;text-transform:uppercase;white-space:nowrap}@-webkit-keyframes marquee-animation{0%{-webkit-transform:translate(0);transform:translate(0)}to{-webkit-transform:translate(-100%);transform:translate(-100%)}}@keyframes marquee-animation{0%{-webkit-transform:translate(0);transform:translate(0)}to{-webkit-transform:translate(-100%);transform:translate(-100%)}}.row3{grid-gap:0 0;display:grid;gap:0 0;grid-auto-flow:column;grid-template-areas:"left__text middle__text right__text";grid-template-columns:1fr 1fr 3fr;grid-template-rows:1fr}.right__text{display:inline-block}.right__text div{color:var(--lightGray-color);font-size:8em;font-weight:500;line-height:.85;margin:0;position:relative;text-align:right;text-transform:uppercase}.middle__text{align-items:flex-end;display:flex;justify-content:flex-end;position:relative}.middle__text div{color:var(--lightGray-color);font-size:22px;font-weight:500;line-height:.85;padding-bottom:5px;text-transform:uppercase}.left__text{align-items:flex-end;display:flex;justify-content:flex-start;position:relative}.left__text span{fill:var(--lightGray-color)}@media screen and (max-width:768px){.row1 div{font-size:4em}.row3{grid-gap:0 0;display:grid;gap:0 0;grid-auto-flow:row;grid-template-columns:1fr;grid-template-rows:1fr 1fr 1fr}.left__text:first-child{grid-row:3}.middle__text:nth-child(2){grid-row:2}.right__text:nth-child(3){display:inline-block;grid-row:1}.right__text div{font-size:4em;text-align:left}}#about{width:100%}.about-container{align-items:center;display:flex;justify-content:center;margin:0 auto;max-width:var(--max-width);min-height:100vh;position:relative}.widget{grid-gap:0 0;display:grid;gap:0 0;grid-template-areas:"widget-about widget-skills";grid-template-columns:60% 40%;grid-template-rows:1fr;position:relative}.widget-about{align-content:flex-start;border-color:var(--gray);border-style:solid;border-width:0 0 1px;box-sizing:border-box;display:flex;flex-wrap:wrap;margin:0 100px 0 0;position:relative}.about-title{margin-bottom:25px;position:relative;width:100%}.about-title h3{font-size:22px;font-weight:500;letter-spacing:3px;line-height:1;text-transform:uppercase}.about-body,.about-title h3{color:var(--lightGray-color)}.about-body{font-size:25px;font-weight:400;line-height:1.5em;padding:100px 0;text-align:left}.widget-skills{align-content:flex-start;border-color:var(--gray);border-style:solid;border-width:0 0 1px;display:flex;flex-wrap:wrap;position:relative}.skills-title{margin-bottom:25px;position:relative;width:100%}.skills-title h3{color:var(--lightGray-color);font-size:22px;font-weight:500;letter-spacing:3px;line-height:1;text-transform:uppercase}.skills-body{color:var(--lightGray-color);line-height:1.5em;padding:100px 0;text-align:left;text-transform:capitalize}.list-items{list-style-type:none}.item{align-items:center;display:flex;font-size:25px;padding-bottom:10px;position:relative}.item span{box-sizing:border-box;color:var(--lightGray-color);font-weight:400;list-style-type:none}.item span span{color:var(--gray);font-weight:500;padding-right:10px}@media screen and (max-width:768px){.widget{display:block}.widget-about,.widget-skills{margin:0 20px 50px 10px;width:95%}.about-title{margin-bottom:0}.about-body{font-size:100%}.about-body p{padding-right:10px}.item{font-size:100%}}#footer{background-color:var(--primary-color);background-size:cover;height:40vh;width:100%}.footer-container{align-items:end;height:100%;justify-content:center;margin-left:auto;margin-right:auto;max-width:var(--max-width)}.footer-container,.footer-widget{box-sizing:border-box;position:relative}.footer-widget{align-content:flex-start;color:var(--lightGray-color);display:flex;flex-wrap:wrap;padding:10px 0;width:100%}.widget-top{grid-gap:0 0;display:grid;gap:0 0;grid-template-areas:"box-left box-center box-right";grid-template-columns:40% 20% 40%;grid-template-rows:100%;padding-top:80px;width:100%}.box-left h2{font-size:16px;font-weight:500;padding-bottom:20px;text-transform:uppercase}.box-left a,.box-left h2{box-sizing:border-box;line-height:1}.box-left a{border-radius:3px;color:var(--gray);display:inline-block;font-size:20px;font-weight:400;text-align:center;text-decoration:none;transition:fill .4s ease-in-out}.box-left a:hover{color:var(--lightGray-color)}.box-right{text-align:right}.box-right h2{box-sizing:border-box;font-size:16px;font-weight:500;line-height:1;padding-bottom:20px;text-transform:uppercase}.box-right ul{display:flex;flex-wrap:wrap;justify-content:flex-end;list-style-type:none;margin-left:-15px;margin-right:-15px}.box-right ul li{margin-left:15px;margin-right:15px}.box-right ul li a{align-items:center;color:var(--gray);display:flex;font-size:20px;text-align:right;text-decoration:none;transition:fill .4s ease-in-out;width:100%}.box-right ul li a svg{fill:var(--gray);height:18px;margin-right:10px;width:18px}.box-right ul li a:hover{color:var(--lightGray-color)}.box-right ul li a:hover svg{fill:var(--lightGray-color)}.elements{bottom:0;display:flex;justify-content:space-between;left:0;padding:10px 0;position:absolute;width:100%}.element-left h3{text-align:left}.element-left h3,.element-right h3{color:var(--gray);font-size:13px;font-weight:400;text-transform:capitalize}.element-right h3{text-align:right}@media screen and (max-width:768px){.widget-top{gap:0 0;grid-template-areas:"box-right box-left";grid-template-columns:100%;grid-template-rows:50% 50%}.box-left a{font-size:16px}.box-right{padding:20px 0;text-align:left}.box-right h2{padding-bottom:10px}.box-right ul{justify-content:flex-start}.box-right ul li a{font-size:16px}.elements{justify-content:space-around;padding:30px 0 0}}#projects{background-color:var(--primary-color);width:100%}.projects-container{color:var(--lightGray-color);margin:0 auto;max-width:var(--max-width);min-height:100vh;padding-top:60px}.projects__header{-webkit-text-size-adjust:100%;grid-column-gap:1.25em;align-items:flex-end;display:grid;grid-template-columns:8fr 4fr;line-height:1.15;padding-bottom:1.25em}.projects__header h3{font-size:2.5em;font-weight:400}.projects__header p{font-size:1.25em;font-weight:400;text-align:right}.projects__list{-webkit-text-size-adjust:100%;grid-row-gap:1.25em;display:grid;grid-template-rows:repeat(4,1fr);margin-bottom:3em}@media screen and (max-width:768px){.projects__header h3{font-size:1.5em}.projects__header p{display:none}}.project{-webkit-text-size-adjust:100%;align-items:flex-end;background:transparent;border-bottom:1px solid var(--gray);border-top:1px solid var(--gray);cursor:pointer;display:flex;justify-content:space-between;opacity:1;padding:3em 0;position:relative;text-decoration:none;width:100%;z-index:1}.project,.project__text{color:var(--lightGray-color)}.project__text{-webkit-text-size-adjust:100%;pointer-events:none}.project__title{font-size:5.37em;font-weight:400;letter-spacing:-.03em;line-height:1}.project__info{font-size:1.0626em;line-height:1.5}.hover-reveal{height:400px;left:50%;opacity:0;overflow:hidden;pointer-events:none;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transform:scale(.8);transform:scale(.8);transition:all .5s ease-out;width:300px}.hover-reveal img{height:100%;object-fit:cover;position:relative;transition:-webkit-transform .4s ease-out;transition:transform .4s ease-out;transition:transform .4s ease-out,-webkit-transform .4s ease-out;width:100%}.project_number{font-size:3.58em;letter-spacing:-.02em;line-height:1.1}@media screen and (max-width:768px){.project__title{font-size:2em}.project__info{font-size:1em}.project_number{font-size:2.5em}}.container{background:var(--lightGray-color)}.loader__text{color:var(--primary-color);font-size:2em;font-weight:500;left:50%;position:absolute;text-transform:uppercase;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.overlay{height:100vh;width:100%}.block{background:var(--primary-color);height:100vh;position:fixed;width:5%}.block-1{left:0}.block-2{left:5%}.block-3{left:10%}.block-4{left:15%}.block-5{left:20%}.block-6{left:25%}.block-7{left:30%}.block-8{left:35%}.block-9{left:40%}.block-10{left:45%}.block-11{left:50%}.block-12{left:55%}.block-13{left:60%}.block-14{left:65%}.block-15{left:70%}.block-16{left:75%}.block-17{left:80%}.block-18{left:85%}.block-19{left:90%}.block-20{left:95%}
/*# sourceMappingURL=main.1f0c0d71.css.map*/