@import"https://fonts.googleapis.com/css?family=Exo:100";@import"https://fonts.googleapis.com/css2?family=VT323&display=swap";@keyframes bg-scrolling-reverse{to{background-position:50px 50px}}@keyframes bg-scrolling{0%{background-position:50px 50px}}body{color:#999;font:400 16px Exo,Ubuntu,Segoe UI,Helvetica,Arial,sans-serif;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAIAAACRXR/mAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABnSURBVHja7M5RDYAwDEXRDgmvEocnlrQS2SwUFST9uEfBGWs9c97nbGtDcquqiKhOImLs/UpuzVzWEi1atGjRokWLFi1atGjRokWLFi1atGjRokWLFi1af7Ukz8xWp8z8AAAA//8DAJ4LoEAAlL1nAAAAAElFTkSuQmCC) repeat 0 0;animation:bg-scrolling-reverse .92s linear infinite}body:before{font-size:8rem;font-weight:100;font-style:normal}.content{display:flex;flex-direction:column;justify-content:center;color:#999}.about{padding-top:280px;padding-left:100px;padding-right:100px;font-size:80px;color:#000}.about-me{margin-top:6px;font-size:40px;font-weight:700}.introduction{display:flex;flex-direction:column;padding-top:400px;float:right}.introduction h2{font-size:90px;text-align:right;background-color:#ffa07a;border-radius:10px;font-weight:700}.introduction h4{font-size:40px;text-align:right;font-weight:700}.resume{height:50px;width:120px;background-color:#3c85f9;padding:5px;font-size:20px;border-radius:5px}.Skills{padding-top:400px;padding-left:100px;padding-right:100px;color:#000}.Skills h2{font-size:80px;font-weight:700;background-color:#20b2aa;border-radius:10px}.heading{text-align:center}.Skills h3{font-size:40px;padding-top:30px;position:relative;display:inline-block;margin:0 auto;font-weight:700}.Skills h3:after{content:"";position:absolute;left:0;bottom:-.5px;width:100%;height:1px;background-color:#000}.project{padding-top:400px;padding-left:100px;padding-right:100px;color:#000}.project h2{font-size:80px;text-align:right;font-weight:700;background-color:#f4b94b;border-radius:10px}.pro{padding-top:50px}.contact{padding-top:400px;padding-left:100px;padding-right:100px;color:#000}.contact h2{font-size:80px;text-align:center;font-weight:700;background-color:#f3f36b;border-radius:10px}.Social{padding-top:90px;display:flex;justify-content:center;align-items:center;text-align:center}.foot{padding-top:100px;min-height:100%;display:flex;flex-direction:column}.footer{color:#000;font-weight:700;text-align:center;padding:15px 0;background:#8d8b8b}.name{display:flex;font-size:80px;flex-wrap:wrap}.name p{margin:0;white-space:nowrap}@media (max-width: 1024px){.about,.Skills,.project,.contact{padding-left:70px;padding-right:70px}.about{font-size:60px}.about-me{font-size:30px}.introduction h2{font-size:70px}.introduction h4{font-size:30px}.Skills h2,.project h2{font-size:60px}.Skills h3{font-size:30px}.name{font-size:60px}}@media (max-width: 768px){.about{padding-top:200px;font-size:40px}.about-me{font-size:22px}.introduction{padding-top:200px;float:none}.introduction h2{font-size:40px;text-align:left;text-align:right}.introduction h4{font-size:22px;text-align:left}.Skills h2{font-size:40px}.project h2{font-size:40px;text-align:right}.Skills h3{font-size:22px}.name{font-size:40px;flex-direction:column;align-items:flex-start}}@media (max-width: 480px){.about{padding-top:200px;font-size:30px;padding-left:10px;padding-right:10px}.about-me{font-size:18px}.introduction{padding-top:200px;padding-left:10px;padding-right:10px}.introduction h2{font-size:30px}.introduction h4{font-size:18px;text-align:right}.Skills,.contact,.project{padding-top:200px;padding-left:10px;padding-right:10px}.pro{padding-top:30px}.contact h2,.Skills h2,.project h2{font-size:30px}.Skills h3{font-size:18px}.name{font-size:30px}.resume{height:25px;width:80px;background-color:#3c85f9;padding:2px;font-size:15px;border-radius:3px}}.navbar{background:#000;height:80px;display:flex;justify-content:space-between;align-items:center;padding:0 24px;z-index:10;position:fixed;top:0;width:100%;transition:top .3s ease-in-out}.navbar.hide{top:-100px}.logo{display:flex;align-items:center;height:100%}.logo img{border-radius:50%;height:50px;width:auto;margin-right:20px;cursor:pointer;transition:transform .2s ease-in-out}.logo img:hover{transform:scale(1.05)}.NavMenu{display:flex;align-items:center;list-style:none;text-align:center}.NavLink{color:#fff;text-decoration:none;padding:0 1rem;height:100%;cursor:pointer;position:relative}.NavLink:hover{color:#fff}.NavLink:after{content:"";position:absolute;bottom:0;left:0;width:0%;height:2px;background-color:#fff;transition:width .3s ease-in-out}.NavLink:hover:after{width:100%}.NavBtn{display:flex;align-items:center}.NavBtnLink{border-radius:4px;background:#256ce1;padding:10px 22px;color:#fff;border:none;outline:none;cursor:pointer;text-decoration:none;transition:all .2s ease-in-out}.NavBtnLink:hover{background:#fff;color:#010606;transition:all .2s ease-in-out}@media screen and (max-width: 768px){.Bars{display:block;position:absolute;top:0;right:0;transform:translate(-100%,60%)}.NavMenu,.NavBtn{display:none}}.hamburger{display:none;flex-direction:column;justify-content:space-between;height:18px;cursor:pointer;z-index:1001}.hamburger .bar{width:25px;height:3px;background-color:#fff;transition:all .3s ease-in-out}.hamburger .bar.open:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.hamburger .bar.open:nth-child(2){opacity:0}.hamburger .bar.open:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}@media screen and (max-width: 768px){.hamburger{display:flex}.NavMenu,.NavBtn{display:none;flex-direction:column;width:100%;background-color:#000000ed;position:absolute;top:80px;left:0;z-index:1000;transition:max-height .3s ease-in-out;padding:1rem 0}.NavMenu.mobile-active,.NavBtn.mobile-active{display:flex}.NavLink{padding:1rem;text-align:center}.NavBtnLink{width:fit-content;margin:0 auto}}.desktop-only{display:flex}.mobile-only{display:none}@media screen and (max-width: 768px){.desktop-only{display:none}.mobile-only{display:block;margin:1rem auto 0}}.skill-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;justify-items:center;padding:20px}.skill-grid>div{font-weight:bolder;font-size:20px;display:flex;flex-direction:column;align-items:center;text-align:center}.skill-grid img{width:100px;height:100px;opacity:0;transform:translate(-50px)}@media (max-width: 768px){.skill-grid{grid-template-columns:repeat(2,1fr);gap:15px;padding:15px}.skill-grid>div{font-size:18px}.skill-grid img{width:80px;height:80px}}@media (max-width: 480px){.skill-grid{grid-template-columns:repeat(3,1fr);padding:10px;gap:5px}.skill-grid>div{font-size:16px;padding:8px}.skill-grid img{width:50px;height:50px}}.soft-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;justify-items:center;padding:30px;color:#000}.soft-grid>div{font-size:20px;font-weight:bolder;display:flex;flex-direction:column;align-items:center;text-align:center}.soft-grid img{width:130px;height:130px;opacity:0;transform:translate(-50px)}.animate-slide-in{animation:slideIn .6s ease forwards}@keyframes slideIn{0%{opacity:0;transform:translate(-50px) scale(1)}to{opacity:1;transform:translate(0) scale(1)}}@media (max-width: 768px){.soft-grid{grid-template-columns:repeat(2,1fr);padding:15px;gap:15px}.soft-grid>div{font-size:18px}.soft-grid img{width:80px;height:80px}}@media (max-width: 480px){.soft-grid{grid-template-columns:repeat(2,1fr);padding:10px;gap:5px}.soft-grid>div{font-size:16px;padding:8px}.soft-grid img{width:50px;height:50px}}.contact-section{background-color:transparent;padding:60px 20px}.contact-container{max-width:600px;margin:0 auto;text-align:center}.contact-container h2{font-size:2.5rem;margin-bottom:10px}.contact-container p{color:#666;margin-bottom:30px}.contact-form{display:flex;flex-direction:column;gap:15px}.contact-form input,.contact-form textarea{padding:12px;font-size:1rem;border:1px solid #ccc;border-radius:5px}.contact-form button{padding:12px;background-color:#007bff;color:#fff;font-size:1rem;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s ease}.contact-form button:hover{background-color:#0056b3}.card svg{height:30px}.card{position:relative;display:flex;align-items:center;justify-content:center;background:#e7e7e7;box-shadow:0 1px 3px #0000001f,0 1px 2px #0000003d;transition:all .3s cubic-bezier(.25,.8,.25,1);overflow:hidden;height:70px;width:300px}.card:before,.card:after{position:absolute;display:flex;align-items:center;width:50%;height:100%;transition:.25s linear;z-index:1}.card:before{content:"";left:0;justify-content:flex-end;background-color:#4d60b6}.card:after{content:"";right:0;justify-content:flex-start;background-color:#4453a6}.card:hover{box-shadow:0 14px 28px #00000040,0 10px 10px #00000038}.card:hover span{opacity:0;z-index:-3}.card:hover:before{opacity:.5;transform:translateY(-100%)}.card:hover:after{opacity:.5;transform:translateY(100%)}.card span{position:absolute;display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#f5f5f5;font-family:Fira Mono,monospace;font-size:24px;font-weight:700;opacity:1;transition:opacity .25s;z-index:2}.card .social-link{position:relative;display:flex;align-items:center;justify-content:center;width:25%;height:100%;color:#f5f5f5;font-size:24px;text-decoration:none;transition:.25s}.card .social-link svg{text-shadow:1px 1px rgba(31,74,121,.7);transform:scale(1)}.card .social-link:hover{background-color:#f9f4ffc5;animation:bounce_613 .4s linear}@keyframes bounce_613{40%{transform:scale(1.4)}60%{transform:scale(.8)}80%{transform:scale(1.2)}to{transform:scale(1)}}.card2{width:100%;max-width:2450px;height:600px;border-radius:8px;background:#f5cdcd;display:flex;flex-direction:row;gap:10px;padding:.5rem}.card2-section{flex:1;overflow:hidden;cursor:pointer;border-radius:6px;transition:all .5s ease;background:#f9ad87;border:2px solid rgb(241,228,228);display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;padding:.5rem}.card2-section:hover{flex:5;background:#f6e0d1}.summary span{font-weight:700;writing-mode:vertical-rl;transform:rotate(180deg);font-size:1.5rem;text-transform:uppercase;letter-spacing:.1em;color:#e31111;transition:all .5s ease}.card2-section:hover .summary span{writing-mode:horizontal-tb;transform:rotate(0);font-size:1.3rem;margin-bottom:.5rem;font-weight:700}.details{opacity:0;text-align:center;color:#fff;transition:opacity .5s ease;max-height:0;overflow:hidden;width:100%;overflow:auto}.card2-section:hover .details{opacity:1;max-height:1000px}.details img{width:100%;max-height:80%;object-fit:cover;border-radius:6px;margin-bottom:.5rem;border:2px solid #333}.desc{font-weight:700;font-size:1rem;color:#000;margin:.4rem 0}.tech{font-weight:700;font-size:.8rem;color:#000;margin:.4rem 0}.details a{display:inline-block;margin-top:.3rem;font-weight:700;text-decoration:none}.button1{background:transparent;position:relative;padding:clamp(4px,1.2vw,8px) clamp(12px,3vw,20px);display:flex;align-items:center;font-size:clamp(14px,2.5vw,18px);font-weight:600;text-decoration:none;cursor:pointer;border:1px solid rgb(0,0,0);border-radius:clamp(18px,5vw,30px);outline:none;overflow:hidden;color:#fff;transition:color .3s .1s ease-out;text-align:center;z-index:10}.button1 span{margin:10px}.button1:before{position:absolute;top:0;right:0;bottom:0;margin:auto;content:"";border-radius:50%;display:block;width:20em;height:20em;left:-5em;text-align:center;transition:box-shadow .5s ease-out;z-index:-1}.button1:hover{color:#000;border:1px solid rgb(255,255,255)}.button1:hover:before{box-shadow:inset 0 0 0 10em #fff}.monitor{margin-left:25px;width:100%;max-width:780px;background-color:#fff;overflow-x:hidden;overflow-y:hidden;white-space:nowrap;box-shadow:unset 0 5px 10px 2px #94f577;position:relative;border:1vw solid black;border-radius:50px;padding:.5em 0}.monitor p{font-family:VT323,monospace;font-size:clamp(2rem,8vw,6rem);display:inline-block;color:#48f648;position:absolute;animation:move 20s linear infinite;top:50%;transform:translateY(-50%)}@keyframes move{0%{left:100%}to{left:-100%}}@media (min-width: 1200px){.monitor p{font-size:100px}}@media (max-width: 1008px){.monitor{margin-left:0}}*{margin:0;padding:0;box-sizing:border-box}