*{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--cyprus: #004643;--sanddune: #f0ede5;--butteryellow: #ffedab;--mirage: #16232a;--miragelite: #9dbdbb;--limeglow: #cdf17b;--gazetibrown: #64453b}html,body{margin:0;padding:0}body{background-image:url(../newspaperBak.jpg);background-position:center;background-size:cover;color:#000}#root{height:100vh;width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:center}nav{margin:5px 5px 0;padding:0;height:55px;width:98%;background-color:var(--butteryellow);display:flex;align-items:center;text-align:center;background:#fff3;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(10px);border-radius:15px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a}nav ul{margin:0;padding:0;height:55px;width:100%;display:flex;justify-content:center;list-style:none;background:#fff3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:12px;border:1px solid rgba(255,255,255,.3);box-shadow:0 4px 30px #0000001a}nav ul li{height:55px;display:flex;justify-content:center;align-items:center}nav ul li a{position:relative;margin:3px;padding:7px;color:#fff;font-family:Rubik Spray Paint,cursive;font-size:1.5rem;font-weight:300;text-decoration:none;line-height:1}nav ul li a:hover{color:orange;transition:.2s ease-in-out}nav ul li a:hover:after{color:none;transform:translate(-50%) scaleX(1);background:#e7721366}.TimesSection{height:80%;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.TheLensonTimesTitle{font-size:120px;color:var(--gazetibrown);font-family:Astloch,cursive;margin:3px;padding:7px;filter:blur(2px) brightness(.7);text-shadow:.5px 0 0 currentColor,-.5px 0 0 currentColor,0 .5px 0 currentColor,0 -.5px 0 currentColor}.CareerNiches{font-family:Smokum,cursive;font-size:30px;font-weight:400}.Pitch{font-family:"Jersey 10",serif;font-size:25px}.button{padding:.9rem 1.5rem;border:.2rem solid #443;border-radius:95% 4% 97% 5%/4% 94% 3% 95%;color:#443;background:none;cursor:pointer;font-family:"Ribeye+Marrow",cursive;margin-top:1rem;font-size:1.7rem;transition:all .2s linear}.button:hover{border-radius:4% 95% 6%/95% 4% 92% 5%;border:.2rem dashed #443}.SkillsContainer{box-sizing:border-box;width:95%;height:30%;margin:0 2.5% 2.5%;align-self:center;background:#fff3;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a}.SkillRow{height:31%;margin:5px;background-color:#fff;border-radius:18px;display:flex;align-items:center;justify-content:center}.SkillRow img{height:60%;margin:1%;background-color:#fff;border-radius:18px}.AboutMeContainer{width:95%;height:35%;margin:2.5%;align-self:center;background:#fff3;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a}.AboutMeContainer p{font-family:Arial}.ProfileImage{height:40%;aspect-ratio:1 / 1;margin:3%;background:#fff3;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a;display:flex;align-items:center;justify-content:center;transition:all .3s ease-in-out}.AboutMeDetails{width:95%;height:45%;margin:2.5%;align-self:center;background-color:#fff;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a;transition:all .3s ease-in-out}.AboutMeDetails p{margin:3%;font-size:90%}.ProfileImage img{width:auto;height:70%;border-radius:50%;transition:all .3s ease-in-out}.popUp{position:absolute;right:1rem;top:1rem;opacity:1;transform:translateY(0);transition:opacity .7s ease-out,transform .7s ease-out;border-radius:9999px;background:linear-gradient(to right,#ef4444,#f97316);padding:.25rem .75rem .5rem;font-family:sans-serif;font-size:.875rem;font-weight:600;line-height:1;letter-spacing:.05em;color:#fff}.popUpText{display:inline-block;font-size:1rem}.popUpArrow{position:absolute;bottom:-11px;left:1.25rem;width:1.25rem;transform:rotate(2deg);color:#f97316}@media (max-width: 768px){.HERO{height:auto;flex-direction:column-reverse}.image-container{width:100%;height:100vh}.hero_one{width:100%;height:calc(100vh - 50px)}nav ul li a{font-size:1.2rem}}@media screen{.SkillRow{overflow:auto;scrollbar-width:none}nav{overflow:auto;scrollbar-width:none}nav ul{overflow:auto;scrollbar-width:none}}:root{--cyprus: #004643;--sanddune: #f0ede5;--butteryellow: #ffedab;--mirage: #16232a;--miragelite: #9dbdbb;--limeglow: #cdf17b;--gazetibrown: #64453B;--gazeticream: #AC958D}.brutalist-container{position:fixed;bottom:30px;right:30px;width:88%;height:20%;cursor:pointer}.concrete-block{position:absolute;top:0;left:0;width:100%;height:100%;background:#fff0;border:2px solid;transition:all .6s cubic-bezier(.19,1,.22,1);overflow:hidden}.brutalist-container:hover .concrete-block{transform:translate(-12px,-12px) rotate(-2deg);box-shadow:12px 12px #333,24px 24px #666,36px 36px #999}.concrete-texture{position:absolute;top:0;left:0;width:100%;height:100%;background:repeating-linear-gradient(45deg,#000 0px 2px,#111 2px 4px),repeating-linear-gradient(-45deg,transparent 0px,transparent 8px,rgba(255,255,255,.05) 8px,rgba(255,255,255,.05) 10px);opacity:.3}.main-content{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:2}.title-text{color:#fff;font-size:32px;font-weight:400;letter-spacing:6px;text-transform:uppercase;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);text-shadow:2px 2px 0 #333,4px 4px 0 #666}.brutalist-container:hover .title-text{opacity:0;transform:translateY(-40px) rotateX(90deg) scale(.3);filter:blur(8px)}.social-grid{position:absolute;top:0;left:0;width:100%;height:100%;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:3px;padding:14px;opacity:0;transform:translateY(40px) rotateX(-90deg) scale(1.3);transition:all .4s cubic-bezier(.68,-.55,.265,1.55)}.brutalist-container:hover .social-grid{opacity:1;transform:translateY(0) rotateX(0) scale(1)}.social-cell{position:relative;background:#fff;border:4px solid #000;display:flex;align-items:center;justify-content:center;transition:all .4s cubic-bezier(.68,-.55,.265,1.55);overflow:hidden}.social-cell:nth-child(1){transition-delay:.1s}.social-cell:nth-child(2){transition-delay:.1s}.social-cell:nth-child(3){transition-delay:.1s}.social-cell:nth-child(4){transition-delay:.1s}.social-cell:hover{background:linear-gradient(orange,var(--butteryellow));transform:scale(1.1) rotate(5deg);border-color:#fff;z-index:10;box-shadow:8px 8px #0000004d}.social-cell:hovervar(--butteryellow) .social-icon{fill:#fff;transform:scale(1.2) rotate(-5deg)}.social-icon{width:24px;height:24px;fill:#000;transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.slab-bg{position:absolute;background:transparent;z-index:-1;transition:all .6s cubic-bezier(.19,1,.22,1)}.slab-1{top:18px;left:18px;width:264px;height:74px}.slab-2{top:36px;left:36px;width:228px;height:38px}.brutalist-container:hover .slab-1{transform:translate(20px,20px) rotate(1deg)}.brutalist-container:hover .slab-2{transform:translate(-10px,30px) rotate(-1deg)}.corner-bracket{position:absolute;width:20px;height:20px;border:2px solid #000;background:#fff;transition:all .4s cubic-bezier(.68,-.55,.265,1.55)}.bracket-tl{top:-10px;left:-10px;border-right:none;border-bottom:none}.bracket-tr{top:-10px;right:-10px;border-left:none;border-bottom:none}.bracket-bl{bottom:-10px;left:-10px;border-right:none;border-top:none}.bracket-br{bottom:-10px;right:-10px;border-left:none;border-top:none}.brutalist-container:hover .corner-bracket{transform:scale(1.5);background:#000;border-color:#fff}.type-accent{position:absolute;top:-30px;left:0;font-family:JetBrains Mono,monospace;font-size:12px;font-weight:700;letter-spacing:2px;color:#000;transition:all .4s ease;opacity:0}.brutalist-container:hover .type-accent{opacity:1;transform:translateY(5px)}.rivet{position:absolute;width:8px;height:8px;background:#000;border-radius:50%;border:2px solid #333;transition:all .3s ease}.rivet:nth-child(1){top:10px;left:10px}.rivet:nth-child(2){top:10px;right:10px}.rivet:nth-child(3){bottom:10px;left:10px}.rivet:nth-child(4){bottom:10px;right:10px}.brutalist-container:hover .rivet{background:#fff;transform:scale(1.5)}.scan-effect{position:absolute;top:0;left:-100%;width:4px;height:100%;background:linear-gradient(180deg,transparent,#fff,transparent);transition:all .8s cubic-bezier(.25,.46,.45,.94);opacity:.8}.brutalist-container:hover .scan-effect{left:100%}.paper-texture{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 50%,transparent 20%,rgba(255,255,255,.3) 21%,rgba(255,255,255,.3) 34%,transparent 35%,transparent),linear-gradient(0deg,transparent 24%,rgba(255,255,255,.05) 25%,rgba(255,255,255,.05) 26%,transparent 27%,transparent 74%,rgba(255,255,255,.05) 75%,rgba(255,255,255,.05) 76%,transparent 77%,transparent);pointer-events:none}.ProjectContainer{width:95%;height:31%;margin:2.5% 2.5% 0;background-color:#fff3;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid white}.ProjectImageContainer{width:95%;height:50%;margin:2.5%;border-radius:18px;display:flex;align-items:center;justify-content:space-evenly}.ProjectImageContainer img{height:95%;max-width:100%;max-height:95%;width:auto;height:auto;object-fit:contain;border-radius:15px;display:block;margin:0 auto}.PortfolioDescription{box-sizing:border-box;margin:0 3% 0 2.5%}.PortfolioDescription p{font-family:Sansation,system-ui;font-size:85%;margin:0}.GithubExitTechnologiesContainer{display:flex;flex-direction:row}.GithubExit{box-sizing:border-box;height:30px;aspect-ratio:3/1;padding:2%;margin:10px 10px 10px 15px;border-radius:14px;background-color:#141d444f;display:flex;align-items:center;transition:all .2s ease}.GithubExit:hover{background-color:#161b3080}.GithubExit h6{color:#000;text-decoration:none}.Technologies{box-sizing:border-box;height:30px;aspect-ratio:6/1;padding:.51%;margin:10px;background:#fff6;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,1);box-shadow:0 4px 30px #0000001a;display:flex;align-items:center;justify-content:center}.GithubExit img{height:85%;aspect-ratio:1 / 1;border-radius:50%;margin:3%}.GithubExit h6{margin:0 0 0 7%;padding:0}.Technologies h6{margin:0;padding:0}.glassCard{box-sizing:border-box;height:92%;width:620px;margin:5px;background:#fff3;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a;display:flex;flex-direction:column}.glassCardRow{box-sizing:border-box;min-height:92%;height:auto;width:620px;margin:5px;background:#fff3;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a;display:flex;flex-direction:column}.glassCardMini{height:46%;width:32%;margin:5px;background:#fff3;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a}.SpotifyPlayerContainer{box-sizing:border-box;width:95%;height:25%;padding:9px;display:flex;align-items:center;justify-content:center;align-self:center;background:#fff3;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a}.PlayerMain{width:100%;height:100%;margin:0;border-radius:18px;display:flex;flex-direction:row;align-self:center;background:#fff3;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 10px #0000001a}.SongImageContainer{height:100%;width:31%;border-radius:18px;flex-shrink:0}.SongImageContainer img{height:100%;width:auto;margin:0;border-radius:18px 0 0 18px;box-shadow:0 #0000001a;overflow:hidden}.TheRestOfTheStuff{box-sizing:border-box;height:100%;width:69%;margin:0;border-radius:0 18px 18px 0;background-color:#f5f5f5;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 5px #0000001a}.TopRow{height:40%;margin:5% 5% 3%;flex-direction:row;display:flex;justify-content:space-between}.TopRow img{height:35%;border-radius:50%;align-self:flex-start}.Progress{margin:0 5%;display:flex;align-items:center;justify-content:space-between}.ControllsContainer{box-sizing:border-box;height:13%;width:100%;margin:2% 5%;display:flex;flex-direction:row;align-items:center}.ControllsContainer img{height:90%;margin:0 5% 0 0}.TimeLineSlider{width:80%;height:4px;cursor:pointer;border-radius:50%;background:transparent}.SongTitle{max-width:173px;margin:0;color:#000;white-space:nowrap;overflow:hidden;display:block;position:relative}.Artist{margin:0;color:#fff;align-self:flex-start;color:#000}.TimeStamp{align-self:flex-start;margin:0 0 0 10%}.EmailFormcontainer{box-sizing:border-box;width:97%;height:30%;margin:1.5%;padding:8px;align-self:center;background:#fff3;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a}.EmailFormcontainer button{margin-top:0}.form{box-sizing:border-box;height:100%;width:100%;padding:12px;background-color:#fff;border-radius:18px;display:flex;flex-direction:column}.DoneMessage{height:100%;width:100%;background-color:#fff;border-radius:18px;display:flex;justify-content:center;flex-direction:column}.DoneMessage h2{margin:0;text-align:center;font-family:SUSE Mono,monospace;font-weight:400}.DoneMessage p{text-align:center;font-family:SUSE Mono,monospace;font-weight:500}.DoneMessage button{width:35%;align-self:center;border-radius:18px;color:#fff;font-family:SUSE Mono,monospace}.EmailFormGroup{height:20%;margin-bottom:2%}.ContentFormGroup{height:50%;margin-bottom:2%}.EmailFormGroup input{box-sizing:border-box;height:100%;width:100%;background-color:#fff;border-radius:14px;border:1px solid black;color:#000;padding:2%;font-size:15px}.ContentFormGroup textarea{box-sizing:border-box;width:100%;height:100%;background-color:#fff;border-radius:16px;border:1px solid black;color:#000;padding:2%;font-size:15px}.EmailFormBtn{border-radius:14px;color:#fff;font-family:SUSE Mono,monospace}.CertificationsContainer{box-sizing:border-box;width:95%;height:28%;margin:0 2.5% 2.5%;align-self:center;background:#fff3;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a;display:flex;align-items:center;justify-content:center}.CertificationsContent{box-sizing:border-box;height:90%;width:100%;margin:2%;padding:2%;border-radius:18px;background-color:#fff;display:flex;flex-direction:column}.CertificationItem{box-sizing:border-box;height:85%;display:flex;flex-direction:column;align-items:center;justify-content:center}.CertificationItem a{box-sizing:border-box;height:85%}.CertificationItem img{height:100%;width:auto}.CertificationsContent h2{font-family:SUSE Mono,monospace;font-weight:400;font-size:120%;margin:0;max-width:99%;align-self:center;white-space:nowrap;overflow:hidden}.CertificationsContent h6{margin:0}.ResumeContainer{box-sizing:border-box;margin:1.5% 1.5% 0;padding:5px;width:97%;height:60px;border-radius:15px;background:#ffffff40;border:solid rgba(255,255,255,.5) 1px;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);box-shadow:0 4px 30px #0000001a;display:flex;align-items:center;justify-content:center}.ResumeButton{width:100%;height:100%;border-radius:12px;background-color:#fff;display:flex;align-items:center;justify-content:center}.ResumeButton:hover{background-color:#ff7b004d;cursor:pointer;transition:.2s all ease-in-out}.ResumeContainer a{color:orange;text-decoration:none;font-weight:700;width:100%;height:100%}.ResumeButton p{margin:0}.ResumeContainer img{height:60%;margin:2%}.SocialsContainer{box-sizing:border-box;width:95%;height:120px;margin:0 2.5% 1.5%;padding:5px;align-self:center;background:#fff3;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-around;justify-items:center;align-items:center}.SomethingCoolContainer{box-sizing:border-box;width:95%;height:20%;margin:1.5% 2.5%;padding:5px;align-self:center;background:#fff3;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 30px #0000001a;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;justify-items:center;align-items:center;font-family:Barriecito,system-ui}.SomethingCoolContainer h3{color:#f5a207;font-family:Barriecito,system-ui;font-weight:300;font-size:150%;margin:0}.Social{height:40%;border-radius:10px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center}.Social a,.Social img{height:85%}.LoadingContainer{box-sizing:border-box;height:100%;width:100%;background-color:#fff;border-radius:18px;display:flex;align-items:center;justify-content:center;flex-direction:column}.ErrorMessage{box-sizing:border-box;height:100%;width:100%;padding:5px;background-color:#fff;border-radius:18px;display:flex;align-items:center;justify-content:center;flex-direction:column}.ErrorMessage h2{margin:0;text-align:center;font-family:SUSE Mono,monospace;font-weight:400;font-size:130%}.ErrorMessage p{text-align:center;font-family:SUSE Mono,monospace;font-weight:500}.ErrorMessage button{width:35%;margin:1%;align-self:center;border-radius:18px;color:#fff;font-family:SUSE Mono,monospace}.loader{display:block;--height-of-loader: 4px;--loader-color: orange;width:130px;height:var(--height-of-loader);border-radius:30px;background-color:#0003;position:relative}.loader:before{content:"";position:absolute;background:var(--loader-color);top:0;left:0;width:0%;height:100%;border-radius:30px;animation:moving 1s ease-in-out infinite}@keyframes moving{50%{width:100%}to{width:0;right:0;left:unset}}@media (max-width: 668px){.root body{height:3vh}.glassCard{width:100%}.Social{width:30%}}@media (max-width: 480px){.glassCard{width:95%}.SpotifyPlayerContainer{height:24%;width:95%}.Social{width:30%}}
