*{transition:all .2s}html{background:linear-gradient(180deg,#1e2330,#0f0f0f);background-repeat:no-repeat;background-color:#0f0f0f;cursor:url(/image/cursor.cur),auto}html,body{margin:0;height:100%;transition:all .3s}body{width:80%;margin:auto}#root{width:100%;display:flex;justify-content:center}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:#252525}::-webkit-scrollbar-thumb{background:#acacac;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#555}.content-body{width:100%;height:100%;display:flex;align-items:center;flex-direction:column}#preloader{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0f0f0f;display:flex;justify-content:center;align-items:center;transition:opacity .5s ease,visibility .5s ease;z-index:111111111}#preloader.LoadHidden{opacity:0;visibility:hidden}.loader{position:absolute;top:390;width:50px;height:50px;border:5px solid #ccc;border-top-color:#15b5ff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.scene{width:200px;height:200px;position:absolute;top:180}.cube{width:100%;height:100%;position:absolute;transform-style:preserve-3d;animation:rotateCube 5s infinite linear}.face{position:absolute;width:200px;height:200px;background:#00ffff4d;border:2px solid cyan;box-shadow:0 0 10px #0ff}.front{transform:translateZ(100px)}.back{transform:rotateY(180deg) translateZ(100px)}.left{transform:rotateY(-90deg) translateZ(100px)}.right{transform:rotateY(90deg) translateZ(100px)}.top{transform:rotateX(90deg) translateZ(100px)}.bottom{transform:rotateX(-90deg) translateZ(100px)}@keyframes rotateCube{0%{transform:rotateX(0) rotateY(0)}to{transform:rotateX(360deg) rotateY(360deg)}}body{overflow:hidden}body.LoadHidden{overflow:visible}.preloader-container{perspective:1000px;text-align:center;position:relative;bottom:100px}.fz-text{position:relative;font-size:170px;font-family:monospace;font-weight:900;color:transparent;transform-style:preserve-3d;animation:float 3s infinite ease-in-out;margin-bottom:50px;text-shadow:none;line-height:1;z-index:10}.fz-text span{margin:30px;position:relative;display:inline-block}.f-letter{background:linear-gradient(45deg,#ff2d55,#ff6b81);-webkit-background-clip:text;background-clip:text;padding:0 10px;transform:translateZ(0)}.z-letter{background:linear-gradient(45deg,#1e90ff,#70a1ff);-webkit-background-clip:text;background-clip:text;padding:0 10px;margin-left:-30px;transform:translateZ(0)}.fz-text span:before{content:attr(data-char);position:absolute;top:0;left:0;color:#0003;transform:translateZ(-30px);background:none;-webkit-background-clip:initial;background-clip:initial}@keyframes float{0%,to{transform:translateY(0) rotateX(10deg)}50%{transform:translateY(-20px) rotateX(10deg)}}@keyframes textPulse{0%{opacity:.3;transform:translate(-50%,-50%) scale(.8)}to{opacity:.8;transform:translate(-50%,-50%) scale(1.2)}}.particle{position:absolute;border-radius:50%;pointer-events:none;z-index:21212121212;filter:blur(1px);transition:opacity 1.5s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.divline{width:100%;height:1000px;position:absolute}aside{position:fixed;width:25%;pointer-events:none;right:0;top:0}aside .notif{pointer-events:all;background-color:#222;border:2px solid #444;border-radius:10px;margin:20px;padding:10px;color:#fff;font-family:roboto;animation:fadeIn .5s ease-in-out 2s both,fadeOut .5s ease-in-out 7s both;opacity:0}@keyframes fadeOut{to{opacity:0;transform:translateY(100px)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}aside .notif h1{font-size:24px;margin-bottom:10px}@media screen and (max-width: 900px){aside{position:fixed;width:75%;height:100%;right:0;top:0}}header{display:grid;align-items:center;height:90px;background-color:#121213;width:100%;border-radius:10px;margin-top:20px;box-shadow:1px 1px 33px #7ba0ee4b;color:#fff;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}header #avatar_header{width:50px;height:50px;display:flex;align-items:center;justify-content:center;background-image:url(/image/avatar.gif);background-size:100%;border-radius:8px;font-size:22px;font-weight:700;text-shadow:1px 1px 4px rgba(0,0,0,0);font-family:roboto;color:#fff0;-webkit-user-select:none;user-select:none}header #avatar_header:hover{color:#fff;text-shadow:1px 1px 4px rgb(0,0,0)}header .container_header:nth-child(1){display:flex;gap:15px;justify-self:start;align-items:center;margin-left:20px}header .container_header:nth-child(2){display:flex;gap:15px;justify-self:end;align-items:center;margin-right:20px}header .container_header:nth-child(2) ul{display:flex;gap:15px;list-style:none}header .container_header:nth-child(2) ul li{padding:4px;margin:3px 5px;font-size:17px;font-family:roboto;cursor:pointer;-webkit-user-select:none;user-select:none}header .container_header:nth-child(2) ul li:hover{transform:translateY(-3px);color:#57a1f7}header .container_header:nth-child(2) ul li:active{color:#07f;transition:color .1s}header #logo_header{display:flex;flex-direction:column;font-family:roboto}header #logo_header span:nth-child(1){font-family:roboto;font-weight:700;font-size:20px}header #logo_header span:nth-child(2){font-family:roboto;font-size:13px}footer{position:-webkit-sticky;background-size:5%;background-position:10px;width:125%;margin-top:10px;height:30%;color:#fff;font-family:monospace;margin-bottom:40px}#main_footer_container{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:100%;height:100%}footer h2{text-align:center;margin:45px 5px 5px}footer #footer_container{display:flex;justify-content:start;align-items:center;width:97%;height:100%;margin-top:10px}footer #footer_container .logocontainer{display:flex;align-items:center;justify-content:space-between}footer #footer_container .container_text_logo{align-self:start}footer #footer_container ul{display:flex;list-style-type:none;justify-content:center;align-items:start;flex-direction:column;align-self:center}footer #footer_container ul li{font-size:20px;margin:0 15px 7px;font-family:roboto}footer #footer_container .logocontainer img{position:static;cursor:default;width:40px}footer #footer_container .logocontainer h1{font-size:40px;font-family:DynaPuff;font-weight:500;margin:5px}footer #footer_container span{font-size:20px;font-family:monospace;font-weight:700}footer #line1{display:block;height:2px;width:80%;margin:40px 10px 10px;box-sizing:border-box;background:linear-gradient(90deg,#798dfd3d 0,#1093ff3b 24.48%,#1e88e580 47.4%,#1e88e536)}footer #link_thefuzeexd{display:flex;width:80%;justify-content:space-between;align-items:center}footer #link_thefuzeexd span{font-size:15px}footer #link_thefuzeexd a{color:#949494}#contactMalito{display:inline;text-decoration:none;color:#58d0ff;transition:color .1;margin:0}#contactMalito:hover{color:#5affff}footer a{text-decoration:none;font-family:monospace;font-size:18px;color:#6c758f;transition:color .1;margin:0 15px;padding:3px}footer a:hover{color:#33bdb1}footer img{-webkit-user-select:none;user-select:none;position:sticky;left:2630px;cursor:pointer;margin-right:10px;bottom:10px;width:30px}footer #ImgBox{width:100%}@media screen and (max-width: 900px){footer{background-size:60%}}main{padding:30px;display:grid;justify-content:center;align-items:center;grid-template-columns:600px 460px;gap:0;width:100%;color:#fff}main .content_text{display:flex;flex-direction:column;justify-self:start;width:100%}main .content_text div:nth-child(1){display:flex;flex-direction:column}main .content_text div:nth-child(1) span:nth-child(1){font-family:Sansation;font-size:25px;margin:8px 0;color:#62d2ff;font-weight:700}main .content_text div:nth-child(1) span:nth-child(2){font-family:roboto;font-size:45px;margin:0;padding:0;font-weight:700}main .content_text div:nth-child(1) span:nth-child(2) m{color:transparent;background:linear-gradient(45deg,#6d8fff,#00f7ff);-webkit-background-clip:text;background-clip:text}main .content_text div:nth-child(1) p{font-family:roboto;font-size:21px;margin:4px 0;color:#c5c5c5;font-weight:300}main .content_text div:nth-child(2) button{font-family:roboto;font-size:16px;color:#fff;background-color:#101113;border:none;width:150px;height:35px;border-radius:13px;cursor:pointer;-webkit-user-select:none;user-select:none;margin:10px 0;box-shadow:1px 1px 12px #54a4ff67;font-weight:700}main .content_text div:nth-child(2) button:hover{transform:translateY(-5px)}main .content_text div:nth-child(2) button:nth-child(2){margin-left:15px;background-color:#62d2ff;color:#000}main .content_text ul{width:100%;display:flex;list-style:none;padding:0;flex-wrap:wrap;margin-top:0;align-items:center}main .content_text ul li{width:120px;margin:10px 10px 10px 0;display:flex;align-items:center;justify-content:center;font-size:13px;border-radius:6px;font-family:roboto;font-weight:800;height:31px;padding:2px 4px;color:#696969;border:1px solid rgb(32,32,32);background-color:#0e1011}main .content_card{justify-self:end;width:420px;height:476px;display:flex;align-items:center;flex-direction:column;background:linear-gradient(145deg,#141414,#0d0e11);border:1px solid rgb(22,22,22);border-radius:15px}main .content_card_image{min-width:382px;height:320px;margin:20px;background-image:url(/image/avatar.gif);display:block;border-radius:15px;background-repeat:no-repeat;background-size:100%}main .content_card_info{display:flex;justify-content:center;align-items:center;width:100%;margin-bottom:14px}main #content_card_info_name{display:flex;justify-self:start;flex-direction:column;align-items:start;margin-left:20px;font-family:roboto}main #content_card_info_name span:nth-child(1){font-size:20px;font-weight:700;margin:0;padding:0}main #content_card_info_name span:nth-child(2){font-size:15px;font-weight:400;color:#a5a5a5;margin:0;padding:0}main #content_card_info_buttons{display:inline;justify-self:end;width:80%;margin-top:10px}main #content_card_info_buttons button{font-family:roboto;font-size:16px;color:#6dd1ff;background-color:#101113;border:none;width:90px;height:40px;border-radius:10px;cursor:pointer;margin-left:10px;overflow:hidden;-webkit-user-select:none;user-select:none;box-shadow:1px 1px 12px #54a4ff67;font-weight:700}main #content_card_info_buttons button:nth-child(2){margin-left:15px}main #content_card_info_buttons button:hover{transform:translateY(-5px)}main #content_card_info_socials{align-self:start;display:flex;margin-left:20px;margin-bottom:20px}main #content_card_info_socials span:active{color:#fff;transition:.1s}main #content_card_info_socials span{font-size:14px;color:#696969;margin-right:15px;cursor:pointer;-webkit-user-select:none;user-select:none;width:88px;border-radius:5px;height:32px;display:flex;justify-content:center;align-items:center;border:1px solid rgba(73,73,73,.322);font-family:roboto;font-size:16px;font-weight:700;background-color:#ffffff05}@media screen and (max-width:900px){header .container_header:nth-child(2){display:none}main{grid-template-columns:auto}main .content_card{width:100%;height:360px}main .content_card_image{width:100%;min-width:100%;height:180px;background-image:url(/image/banner.gif);margin-top:0;margin-bottom:0}#content_card_info_buttons{display:flex!important;justify-content:center;align-items:end;margin-right:20px;flex-direction:column}#content_card_info_buttons button{margin:10px 0 0!important}#content_card_info_name span:nth-child(2){font-size:14px!important}#container_about{justify-content:center;align-items:center;flex-direction:column}#container_about .about{width:100%!important}#container_about .instruments{width:100%;margin-top:25px}#container_projects{flex-direction:column}#container_projects .project{margin-top:40px}#container_projects .project:nth-child(1){margin-top:10px}#container_projects .project #fluffy_img,#Wonderix_img,#AliThemes_img{height:180px!important}#container_skills{width:100%;flex-direction:column}#container_skills .skill{margin:10px 0;padding:10px 0}#container_contact{flex-direction:column}.stats div span{font-size:10px}#container_contact .form_contact{padding:8px 0;width:100%;align-items:center}#container_contact .form_contact form{align-items:center}#container_contact .form_contact form input{width:90%}#logo_header span:nth-child(1){font-size:17px!important}#logo_header span:nth-child(2){font-size:12px!important}#link_thefuzeexd a,#link_thefuzeexd span{font-size:11px!important}#container_contact .form_contact form textarea,#container_contact .info_contact{width:90%}.content_text div span:nth-child(2){font-size:20px!important}.content_text div p{font-size:15px!important}}#container_about{padding:30px 30px 10px;display:flex;justify-content:space-around;gap:0;width:100%;color:#fff}#container_about .about{width:60%;padding:10px 15px;border-radius:18px;background:linear-gradient(180deg,#111,#121318);box-shadow:1px 1px 12px #76bfff33}#container_about .about h1{font-family:Roboto;margin-bottom:6px;font-size:19px;padding-left:10px}#container_about .about p{font-family:Roboto;margin:5px 0 9px;font-size:17px;padding-left:10px;color:#afafaf}#container_about .stats{display:flex;justify-content:center;align-items:stretch}#container_about .stats div{display:flex;flex-direction:column;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none;overflow:hidden;width:90%;box-shadow:1px 1px 12px #76bfff;margin:10px 14px;background-color:#15151b;border-radius:12px;animation:down_stats .3s ease-in-out both}#container_about .about:hover .stats div{background-color:#8effff;color:#000;animation:up_stats .3s ease-in-out both}#container_about .about:hover .stats div:nth-child(2){transition-delay:.25s;animation-delay:.25s}#container_about .about:hover .stats div:nth-child(3){transition-delay:.55s;animation-delay:.55s}@keyframes down_stats{0%{transform:translateY(-5px)}to{transform:translateY(0)}}@keyframes up_stats{0%{transform:translateY(0)}to{transform:translateY(-5px)}}#container_about .stats h2{font-family:roboto;padding:0;margin:15px 10px 10px}#container_about .stats div span{text-align:center;margin-bottom:10px;font-family:roboto}.instruments{font-family:roboto;width:25%;padding:10px 15px;border-radius:18px;background:linear-gradient(180deg,#111,#121318);box-shadow:1px 1px 12px #76bfff33}.instruments:hover{transition:.3s}.instruments h1{font-family:Roboto;margin-bottom:10px;font-size:19px;padding-left:10px}.instruments span{margin-bottom:6px;font-size:17px;padding-left:10px}.instruments .bar{width:90%;height:12px;background-color:#1e1e24;border-radius:8px;margin:6px 10px}.instruments .bar div{width:0%;background-color:#8effff;height:100%;border-radius:8px;transition:.4s}@keyframes grow_bar_1{0%{width:0%}to{width:85%}}.instruments .TaskBar:nth-child(1) .bar div{animation:grow_bar_1 .4s ease-in-out both;animation-delay:2s}@keyframes grow_bar_2{0%{width:0%}to{width:75%}}.instruments .TaskBar:nth-child(2) .bar div{animation:grow_bar_2 .4s ease-in-out both;animation-delay:2.3s}@keyframes grow_bar_3{0%{width:0%}to{width:90%}}.instruments .TaskBar:nth-child(3) .bar div{animation:grow_bar_3 .4s ease-in-out both;animation-delay:2.5s}@keyframes grow_bar_4{0%{width:0%}to{width:80%}}.instruments .TaskBar:nth-child(4) .bar div{animation:grow_bar_4 .4s ease-in-out both;animation-delay:2.7s}.instruments #container_bars{display:flex;flex-direction:column;margin-bottom:10px}#container_projects{display:flex;justify-content:space-between;align-items:center}#Project{width:100%;padding:0 30px 10px}#Wonderix_img{background-image:url(/image/wonderix.webp);background-repeat:no-repeat;background-size:100%;height:11vw;width:98%;border-radius:15px}#AliThemes_img{background-image:url(/image/dyno.webp);background-repeat:no-repeat;background-size:100%;height:11vw;width:98%;border-radius:15px}.project{width:100%;box-shadow:1px 1px 12px #76bfff33;display:flex;justify-content:center;flex-direction:column;background:linear-gradient(180deg,#111,#121318);padding:15px;border-radius:18px;margin:0 20px}#Project h1:nth-child(1){color:#fff;font-size:18px;font-family:roboto;padding-bottom:10px}.project img{width:98%;height:190px;align-self:center;padding:10px 10px 0;border-radius:20px;box-shadow:0 4px 8px #0000001a;transition:transform .3s ease}.project h1{margin-left:8px;color:#fff;font-size:18px;font-family:roboto}.project p{color:#afafaf;font-size:14px;font-family:roboto;margin-left:8px;margin-top:0}.project .project_footer{display:flex;justify-content:space-between;align-items:center}.project .project_footer span{color:#797979;font-size:16px;font-family:roboto;margin-left:8px}.project .project_footer button{background-color:#0e1214;color:#fff;border:none;box-shadow:1px 1px 12px #76bfff94;border-radius:8px;padding:10px 16px;font-size:14px;font-family:roboto;font-weight:600;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .3s ease,color .3s ease}.project .project_footer button:hover{background-color:#76bfff;color:#000}.project #fluffy_img{background-image:url(/image/fluffy.webp);background-repeat:no-repeat;background-size:100%;height:11vw;width:98%;border-radius:15px}#Skills{width:100%;padding:0 30px 10px;color:#fff;font-family:roboto}#Skills #title_skills:nth-child(1){color:#fff;font-size:18px;font-family:roboto;padding-bottom:10px}#container_skills{display:flex;justify-content:space-between;align-items:stretch}.skill{width:100%;background:linear-gradient(180deg,#111,#121318);box-shadow:1px 1px 12px #76bfff33;margin:0 10px 10px;padding:10px;border-radius:18px}.skill h1{color:#fff;font-size:18px;font-family:roboto;margin:10px 10px 0}.skill p{color:#afafaf;margin:10px}.skill:hover{transform:translateY(-10px)}#Contact{width:100%;padding:0 30px 10px;color:#fff;font-family:roboto}#title_contact{font-size:18px}#container_contact{display:flex;justify-content:space-around;align-items:stretch;gap:26px;width:100%}.info_contact ul{padding:0}.info_contact ul li{display:flex;justify-content:start;align-items:center}.info_contact ul li a{font-size:24px}.form_contact{padding:10px 20px;border-radius:18px;width:100%;display:flex;justify-content:center;align-items:start;flex-direction:column;background:linear-gradient(180deg,#111,#121318);box-shadow:1px 1px 12px #76bfff33}.form_contact h1{font-size:22px}.form_contact form{display:flex;justify-content:center;align-items:start;width:100%;flex-direction:column}.form_contact form input{width:100%;height:30px;border:none;background-color:#131313;border-radius:6px;box-shadow:1px 1px 12px #76bfff33;color:#fff}.form_contact form input::placeholder{padding-left:5px}.form_contact form textarea::placeholder{padding-left:5px}.form_contact label{padding:10px 0}.form_contact label:nth-child(3){padding-bottom:0}.info_contact{padding:10px 20px;width:50%;box-shadow:1px 1px 12px #76bfff33;border-radius:18px;background:linear-gradient(180deg,#111,#121318)}.info_contact h1{font-size:22px}.form_contact textarea{width:100%;resize:none;height:100px;font-size:13px;color:#fff;box-shadow:1px 1px 12px #76bfff33;border:none;background-color:#131313;border-radius:6px;font-family:roboto;margin:10px 0}.form_contact button{background-color:#0e1214;color:#fff;border:none;box-shadow:1px 1px 12px #76bfff94;border-radius:8px;padding:10px 16px;margin:10px 10px 10px 0;font-size:14px;font-family:roboto;font-weight:600;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .3s ease,color .3s ease}.form_contact button:hover{background-color:#76bfff;color:#000}.info_contact ul{list-style:none}.info_contact ul a{color:#fff;display:flex;text-decoration:none;align-items:center;font-size:20px;font-weight:700;padding:8px 0;-webkit-user-select:none;user-select:none;width:100%;border-radius:10px}.info_contact ul a:hover{background-color:#2c4e4e3d}.info_contact img{width:20px;padding-left:5px;padding-right:10px}
