@import url(https://fonts.googleapis.com/css2?family=Kanit:wght@100;200;300;400;500;600;700&display=swap);@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap);.App{background-color:#fff}body{padding:50px 20px;width:100vw}.container{display:flex}.leftContent{padding-left:40px;width:30%}.leftContent h1{font-size:35px;font-weight:500}.leftContent p{font-size:25px;font-weight:300}.port_text{margin-bottom:40px}.profile_text{display:flex;flex:1 1;width:90%}.profile_text p{font-size:18px;font-weight:200;width:80%}.profile_text p,.profile_text ul{margin-bottom:45px}.profile_text ul li{display:inline-block;font-family:Roboto,sans-serif;font-weight:300;line-height:30px;margin-right:20px}.profile_text ul li span{font-size:13px;font-weight:300;margin-left:5px}.profile_text ul.skill li:before{content:"•";margin-right:3px}.profile_text ul.contact li{margin-top:10px}.profile_text ul.contact a:hover{opacity:.5;transition:.2s}.profile_text ul li img{align-items:center;justify-content:center;margin-right:5px;width:18px}.profileimg{background-image:url(/static/media/profile_img.e85de4c8ce13f86b3a24.jpg);background-position:-40px -90px;background-size:270px;border-radius:100%;box-shadow:0 0 10px rgba(0,0,0,.3);height:200px;margin-bottom:50px;margin-top:30px;object-fit:fill;width:200px}.profile_text h1{font-size:25px;font-weight:400}.rightContent{background-color:#f5f5f5;border-radius:10px;display:flex;flex:1 1;height:85vh;margin-top:15px}h1 span{font-size:25px}.menubar{border-radius:10px 0 0 10px;font-family:Roboto,sans-serif;height:100%;width:250px}.menubar,.menucontainer{background-color:#e1dfe1}.menucontainer{align-items:center;border-radius:10px;display:flex;flex-direction:column;justify-content:center;padding:10px 30px}p#favor{color:#818181;font-weight:500;margin-left:30px;margin-top:10px}.choice{align-items:center;color:#555;cursor:pointer;display:flex;font-family:Roboto,sans-serif;font-size:14px;font-weight:400;margin-bottom:15px;width:100%}.active{background-color:rgba(80,80,80,.3);border-radius:5px;height:30px;padding:5px;transition:.2s ease-in}.choice img{margin-right:8px;width:18px}@-webkit-keyframes fade_in{0%{opacity:0}to{opacity:1}}@keyframes fade_in{0%{opacity:0}to{opacity:1}}.test{-webkit-animation:fade_in 1s;animation:fade_in 1s}.workshop{grid-gap:0 20px;display:grid;flex:1 1;gap:0 20px;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));height:150px;padding:10px}.workshop img{width:100px}img.git_logo{opacity:.3;width:40px}.workshop img:hover{opacity:.5;transition:.5s}.workshop span{font-family:Roboto,sans-serif;font-size:15px;font-weight:300}.wrk1{align-items:center;display:flex;flex-direction:column;height:150px;text-align:center;width:100px}@media screen and (max-width:400px){.profileimg{align-items:center;background-size:300px;border-radius:100%;height:250px;justify-content:center;width:250px}.leftContent{width:100%}.rightContent{height:100vh}.container{display:block}.menubar{width:70%}.menucontainer{padding:5px 20px}.menucontainer p{visibility:hidden}.choice{margin-bottom:10px;margin-right:15px}.choice img{margin:0}.active{height:30px;margin-left:15px;transition:none;width:30px}p#favor{visibility:hidden}.close_bar{display:inline-block;height:30px;width:30px}.workpanel{width:20%}.workshop{height:100%}}@media screen and (max-width:950px){.profileimg{align-items:center;background-size:300px;border-radius:100%;height:270px;justify-content:center;margin-left:5px;width:270px}.leftContent{width:100%}.rightContent{height:100%;width:100%}.container{display:block}.menubar{width:70%}.menucontainer{padding:5px 20px}.menucontainer p{visibility:hidden}.choice{margin-bottom:10px;margin-right:15px}.choice img{margin:0}.active{height:30px;margin-left:15px;transition:none;width:30px}p#favor{visibility:hidden}.close_bar{display:inline-block;height:30px;width:30px}.workpanel{width:20%}.workshop{height:100%}}@-webkit-keyframes slidein{0%{right:-1000px}to{right:0}}@keyframes slidein{0%{right:-1000px}to{right:0}}@-webkit-keyframes slideout{0%{right:0}to{right:-1000px}}@keyframes slideout{0%{right:0}to{right:-1000px}}@-webkit-keyframes fadein{0%{opacity:0}to{opatity:.5;visibility:visible}}@keyframes fadein{0%{opacity:0}to{opatity:.5;visibility:visible}}@-webkit-keyframes fadeout{0%{box-shadow:-10px 0 20px rgba(0,0,0,.2);opacity:.5}to{opatity:0;box-shadow:0 0 0 transparent;visibility:hidden}}@keyframes fadeout{0%{box-shadow:-10px 0 20px rgba(0,0,0,.2);opacity:.5}to{opatity:0;box-shadow:0 0 0 transparent;visibility:hidden}}.breadcrumb{height:20px;margin-top:10px}.breadcrumb p{font-weight:300;margin-left:30px;opacity:.5}.bcHover:hover{opacity:.3}.fadein{-webkit-animation:fadein 1s forwards;animation:fadein 1s forwards}.fadeout{-webkit-animation:fadeout 1s forwards;animation:fadeout 1s forwards}.slidein{-webkit-animation:slidein 1s ease forwards;animation:slidein 1s ease forwards}.slideout{-webkit-animation:slideout 1s ease-out forwards;animation:slideout 1s ease-out forwards}.wrk1{cursor:pointer}.offcanva1{background-color:#fff;box-shadow:-10px 0 20px rgba(0,0,0,.2);height:100vh;position:fixed;right:0;top:0;width:700px;z-index:1}.offcanva1 span{cursor:pointer;right:0}.blackpage{background-color:#000;height:100vh;left:0;opacity:.5;position:absolute;top:0;visibility:hidden;width:100vw;z-index:0}.close_btn{align-items:center;background-color:#ff605c;border-radius:100%;display:flex;height:20px;justify-content:center;margin:10px;width:20px}.close_btn .close_text{color:#911a18;margin-bottom:5px;opacity:0;transition:.1s}.close_btn:hover .close_text{opacity:1}.info{margin-left:10px;margin-top:15px}.ui_info{align-items:center;display:flex;flex:5 1;width:700px}.ui_info p{font-family:Roboto,sans-serif!important;font-size:20px;margin-left:7px}.ui_info img{width:35px}.subtitle{margin-left:40px;margin-top:20px}.subtitle p{font-family:Roboto,sans-serif!important;font-weight:300;line-height:30px}.ui_show{align-items:center;display:flex;flex:1 1;justify-content:center;width:700px}.ui_show Iframe{align-items:center;margin-top:20px}.ui_show img{width:950px}.ui_show img[alt=web]{margin-top:50px;width:650px}.link_button{display:flex;flex:1 1;width:700px}.link_button,.link_button button{align-items:center;justify-content:center}.link_button button{height:50px;width:250px}.button-39{background-color:#fff;border:1px solid #d1d5db;border-radius:.5rem;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);box-sizing:border-box;color:#111827;cursor:pointer;display:flex;font-family:Inter var,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-size:.875rem;font-weight:600;line-height:1.25rem;padding:.75rem 1rem;position:absolute;text-align:center;-webkit-text-decoration:none #d1d5db solid;text-decoration:none #d1d5db solid;text-decoration-thickness:auto;touch-action:manipulation;user-select:none;-webkit-user-select:none}.button-39 img{margin-right:15px;width:30px}.button-39:hover{background-color:#f9fafb}.button-39:focus{outline:2px solid transparent;outline-offset:2px}.button-39:focus-visible{box-shadow:none}#web_btn .button-39{margin-top:120px}a:link{text-decoration:none}a:link,a:visited{color:#000}.github{align-items:center;display:flex;flex:1 1;justify-content:center;margin-top:35px;position:absolute;width:100px}.ui_preview{display:flex;flex-direction:row;height:80vh;width:100%}.fileHover{align-content:center;cursor:pointer;display:flex;flex-wrap:wrap;height:30px}.fileHover:hover{background-color:rgba(0,0,0,.07);transition:.3s}.previewSection{align-items:center;border-left:.8px solid rgba(0,0,0,.08);display:flex;flex-direction:column;font-family:Roboto,sans-serif!important}.previewPic{border-radius:8px;box-shadow:1px 8px 14px -7px rgba(72,77,77,.75);margin-bottom:20px;width:90%}@media screen and (max-width:400px){.offcanva1{height:100vh;width:100%}.subtitle{margin-left:30px}.ui_show{margin-top:20px;width:100%}.ui_show img,.ui_show img[alt=fivem]{width:500px}.ui_show img[alt=web]{margin-top:50px;width:350px}.link_button{width:100%}.previewPic{width:40%}.previewSection{border-left:none;border-top:.8px solid rgba(0,0,0,.08);height:45vh;margin-top:5px;width:60vw!important}.ui_preview{flex-direction:column}}@media screen and (max-width:950px){.offcanva1{height:100vh;width:100%}.subtitle{margin-left:30px}.ui_show{margin-top:20px;width:100%}.ui_show img{width:150%}.link_button{width:100%}.picList{margin-left:0!important;width:100%!important}.previewSection{border-left:none;border-top:.8px solid rgba(0,0,0,.08);height:45vh;margin-top:5px;width:60vw!important}.ui_preview{flex-direction:column}}.btn-container{background-color:#fff;border-radius:8px 0 8px;display:flex;flex-direction:column;gap:8px;left:0;overflow:hidden;position:absolute;top:0;z-index:100}button{background-color:#fff;border:none;color:#737373;cursor:pointer;padding:10px}.preview_pic{display:none;height:100%;max-width:100%}@media screen and (max-width:400px){.zoom-pic{width:100%}}@media screen and (max-width:950px){.btn-container,.zoom-pic{display:none}.preview_pic{display:block}}.modal-overlay{align-items:center;display:flex;height:100%;justify-content:center;left:0;pointer-events:auto;position:fixed;top:0;width:100%;z-index:1000}.modal-content,.modal-overlay{background-color:rgba(0,0,0,.5)}.modal-content{border-radius:8px;max-width:80%;padding:20px;text-align:center}.modal-content h2{color:#fff;font-family:Roboto;font-weight:300;margin-bottom:10px}.modal-content button{background-color:#fff;border:none;border-radius:4px;color:#292929;cursor:pointer;padding:8px 16px;pointer-events:auto}.modal-content button:hover{background-color:#0056b3}.modal-open{overflow:hidden}*{box-sizing:border-box;padding:0}*,body{margin:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Kanit,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}
/*# sourceMappingURL=main.4c1b2d97.css.map*/