body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#161e29;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{margin:auto;max-width:1370px;padding:60px 0;position:relative;text-align:center;width:100%}*,.App{box-sizing:border-box}*{margin:0;padding:0}[role=button],a,button,input[type=button],input[type=submit],select{cursor:pointer}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media screen and (max-width:768px){.App{padding:40px 10px}}@media screen and (max-width:480px){.App{padding:20px 4px}}@media screen and (max-width:320px){.App{padding:10px 2px}}.content{background-color:rgba(42,51,56,.137);border:1px solid hsla(0,0%,100%,.158);border-radius:10px;box-sizing:border-box;overflow-x:hidden;padding-bottom:40px;padding-left:40px;width:75%}.content .head{align-items:center;display:flex}.content .head h1{color:#cac9c9;padding-bottom:20px;padding-top:40px;text-align:left;width:74%}.content .head .menu{border-bottom:1px solid hsla(0,0%,100%,.158);border-bottom-left-radius:10px;border-left:1px solid hsla(0,0%,100%,.158);display:flex;margin-top:-30px;padding:25px 0;width:26%}.content .head .menu a{color:#fff;text-decoration:none;transition:.3s;width:50%}.content .head .menu a:hover{color:wheat}.content .line{text-align:left}.content .line .border{border:2px solid #fdd385;border-radius:5px;display:inline-block;width:80px}.content .doing h1{color:#cac9c9;margin-top:50px}.content .doing .skills{display:flex;flex-wrap:wrap;gap:4%;padding-right:40px}.content .doing .skills .each-skill{background-color:rgba(77,77,77,.267);border-left:1px solid hsla(0,0%,100%,.158);border-radius:10px;border-top:1px solid hsla(0,0%,100%,.158);display:flex;margin-top:50px;padding:35px 25px;width:48%}.content .doing .skills .each-skill .skill-logo{width:20%}.content .doing .skills .each-skill .skill-logo img{display:block;height:50px;margin:0 auto;object-fit:contain;width:50px}.content .doing .skills .each-skill .skill-logo .Min,.content .doing .skills .each-skill .skill-logo .Mob,.content .doing .skills .each-skill .skill-logo .Web{height:50px;width:50px}.content .doing .skills .each-skill .skill-content{width:80%}.content .doing .skills .each-skill .skill-content h2,.content .doing .skills .each-skill .skill-content p{color:#cac9c9;text-align:left}.content .doing .skills .each-skill .skill-content h2{font-size:20px;margin-bottom:5px}.content .doing .skills .each-skill .skill-content p{line-height:23px}.portfolio{display:flex;gap:3%}@media screen and (max-width:900px){.portfolio{align-items:stretch;flex-direction:column;gap:0;overflow-x:hidden}.left-bar{display:block!important;margin:0 0 18px}.content,.left-bar{max-width:100vw;min-width:0;padding:10px 0;width:100%!important}.content{box-sizing:border-box;margin:12px 0 0;overflow-x:hidden}}.content>p{color:#b9b8b5;font-size:17px;line-height:30px;margin-top:35px;text-align:left}@media screen and (max-width:768px){.content{padding-bottom:16px;padding-left:8px;width:100%}.head{align-items:flex-start;flex-direction:column}.head h1{font-size:1.3rem;padding-bottom:8px;padding-top:16px;width:100%}.head .menu{flex-direction:row;gap:8px;margin-top:0;overflow-x:auto;padding:8px 0;width:100%}.head .menu a{font-size:1rem;padding:4px 8px;white-space:nowrap}.doing .skills{flex-direction:column;gap:10px;padding-right:0}.doing .skills .each-skill{align-items:flex-start;flex-direction:column;margin-top:12px;padding:16px 8px;width:100%}.doing .skills .each-skill .skill-logo{height:36px;margin-bottom:8px;width:36px}.doing .skills .each-skill .skill-content{width:100%}.doing .skills .each-skill .skill-content h2{font-size:1.05rem}.doing .skills .each-skill .skill-content p{font-size:.95rem}}@media screen and (max-width:480px){.content{padding-bottom:6px;padding-left:2px;width:100%}.head h1{font-size:1.05rem;padding-bottom:4px;padding-top:8px}.doing .skills .each-skill{margin-top:6px;padding:8px 2px}.doing .skills .each-skill .skill-logo{height:28px;width:28px}.doing .skills .each-skill .skill-content h2{font-size:.95rem}.doing .skills .each-skill .skill-content p{font-size:.8rem}}@media screen and (max-width:600px){.head,.head .menu{align-items:center;flex-direction:column}.head .menu{gap:6px;margin-top:0;padding:6px 0;width:100%}.head .menu a{display:block;font-size:1rem;padding:4px 8px;text-align:center;white-space:nowrap}.doing .skills{flex-direction:column;gap:10px;padding-right:0}.doing .skills .each-skill{align-items:flex-start;flex-direction:column;margin-top:8px;padding:12px 4px;width:100%}.doing .skills .each-skill .skill-logo{height:28px;margin-bottom:6px;width:28px}.doing .skills .each-skill .skill-content{width:100%}.doing .skills .each-skill .skill-content h2{font-size:.98rem}.doing .skills .each-skill .skill-content p{font-size:.8rem}.content>p{font-size:.95rem;line-height:1.5}.content .doing h1,.content h1{font-size:1.1rem;margin-bottom:8px;margin-top:18px}}.left-bar{background-color:rgba(42,51,56,.137);border:1px solid hsla(0,0%,100%,.158);border-radius:10px;height:850px;padding:30px;position:-webkit-sticky;position:sticky;top:60px;width:22%}.left-bar .avatar{border-bottom:1px solid #707070;padding-bottom:30px;padding-top:10px}.left-bar .avatar img{border-radius:20px;height:220px;width:228px}.left-bar .avatar h1,.left-bar .avatar h3,.left-bar .avatar p{color:#fff;font-weight:500;margin-bottom:5px}.left-bar .avatar h1{font-size:28px;margin-bottom:12px;margin-top:20px}.left-bar .avatar h3{background-color:hsla(0,0%,50%,.397);border-radius:10px;display:inline-block;font-size:14px;font-weight:500;margin-bottom:15px;padding:3px 0;width:35%}.left-bar .avatar p{font-size:13px}.left-bar .router{display:flex;flex-direction:column;gap:20px;padding:30px 0 10px 5px}.left-bar .router .link{align-items:center;cursor:pointer;display:flex;gap:20px}.left-bar .router .link .logo{background-color:rgba(59,59,59,.233);border-left:1px solid hsla(0,0%,100%,.158);border-radius:10px;border-top:1px solid hsla(0,0%,100%,.158);padding:7px}.left-bar .router .link .logo img{height:30px;opacity:.8;width:30px}.left-bar .router .link .link-title{line-height:20px}.left-bar .router .link .link-title p{color:hsla(0,0%,100%,.507);font-size:13px;text-align:left}.left-bar .router .link .link-title h2{color:hsla(0,0%,100%,.822);font-size:14px}@media screen and (max-width:900px){.left-bar{height:auto;margin-bottom:20px;padding:20px 10px;position:static;width:98%}.left-bar .avatar img{height:120px;width:120px}}@media screen and (max-width:480px){.left-bar{padding:10px 2px;width:100%}.left-bar .avatar img{height:80px;width:80px}.left-bar .avatar h1{font-size:1.1rem}.left-bar .avatar h3{font-size:.8rem}.left-bar .avatar p{font-size:.7rem}}.content .tab{display:flex;gap:50px;margin-top:40px}.content .tab button{background:none;border:none;cursor:pointer;font-size:15px;transition:.4s}.content .projects{display:flex;flex-wrap:wrap;gap:3%;padding-top:10px}.content .projects .each-project{cursor:pointer;margin-top:40px;width:30%}.content .projects .each-project .project-img{border-radius:10px;height:200px;overflow:hidden;width:100%}.content .projects .each-project .project-img img{height:200px;object-fit:cover;transition:.4s;width:100%}.content .projects .each-project .project-img .show_view{align-items:center;background-color:rgba(90,90,90,.548);display:flex;display:none;height:200px;justify-content:center;position:absolute;transition:.4s;width:295.6px;z-index:10}.content .projects .each-project .project-img .show_view .icon{align-items:center;background-color:hsla(0,0%,75%,.671);border-radius:10px;display:flex;height:60px;justify-content:center;width:80px}.content .projects .each-project .project-img .show_view .icon span{color:#fff}.content .projects .each-project h2{font-size:18px;margin-top:10px}.content .projects .each-project p{font-size:14px;padding:5px 15px 0}.content .projects .each-project h2,.content .projects .each-project p{color:#cacaca}.content .projects .each-project h3{color:hsla(0,0%,50%,.637);font-size:14px;font-weight:400}.content .projects .each-project:hover img{transform:scale(1.2)}.content .projects .each-project:hover .show_view{border-radius:10px;display:flex}@media screen and (max-width:900px){.content .projects{flex-direction:column;gap:20px}.content .projects .each-project{margin-top:20px;width:98%}.content .tab{align-items:flex-start;flex-direction:column;gap:10px}}@media screen and (max-width:480px){.content .projects .each-project{margin-top:10px;width:100%}.content .projects .each-project h2{font-size:1rem}.content .projects .each-project p{font-size:.85rem}.content .projects .each-project h3{font-size:.8rem}.content .tab button{font-size:.95rem}}.welcome-overlay{align-items:center;background-color:#000000f2;display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:9999}.welcome-text{color:#fff;text-align:center}.welcome-text h1{-webkit-text-fill-color:#0000;background:linear-gradient(45deg,#ff8a00,#e52e71);-webkit-background-clip:text;font-size:3.5rem;font-weight:700;letter-spacing:2px;margin-bottom:1rem}.welcome-text .underline{background:linear-gradient(45deg,#ff8a00,#e52e71);border-radius:2px;height:3px;margin:0 auto;transform-origin:left;width:100%}.loading-overlay{align-items:center;background-color:#000000f2;display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:9999}.loading-content{text-align:center}.loading-content .spinner{border-color:#e52e71 #ffffff1a #ffffff1a #ff8a00;border-radius:50%;border-style:solid;border-width:4px;filter:drop-shadow(0 0 15px rgba(255,138,0,.3));height:60px;margin:0 auto 20px;width:60px}.loading-content .gradient-text{-webkit-text-fill-color:#0000;background:linear-gradient(45deg,#ff8a00,#e52e71);-webkit-background-clip:text;filter:drop-shadow(0 0 2px rgba(255,138,0,.3));font-size:1.4rem;font-weight:500;letter-spacing:3px}
/*# sourceMappingURL=main.65f2d976.css.map*/