@import"https://fonts.googleapis.com/css2?family=Inconsolata:wght@400;500;700;900&display=swap";:root{--light_bg: #242320;--dark_bg: #1b1a17;--mark_text: #FF952D;--dark_mark_text: #dc832b;--text_color: #f0e3ca;--text_family_inconsolata: "Inconsolata", monospace;--text_family_arial: "Arial";--margin_wrapper: 120px;--button-size: 32px;--size_project: 320px;--index:calc(1vw + 1vh)}html{background-color:var(--dark_bg)}body{overflow-x:hidden}.wrapper{max-width:calc(100vw - var(--margin_wrapper) * 2);margin:0 auto}header{background-color:var(--dark_bg);width:100%;top:0;z-index:1100}header .wrapper--header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 0}header .header_logo{height:32px}header .header_menu{display:flex;gap:32px;margin:0;padding:0}header .header_button{display:none;width:var(--button-size);height:var(--button-size);background:#0000;border:0px;padding:4px}header .header_button--selected .button_line--top{transform:rotate(45deg)}header .header_button--selected .button_line--center{opacity:0%;display:none}header .header_button--selected .button_line--button{transform:rotate(-45deg);bottom:9%}header .header_button .button_line{position:relative;width:100%;height:3px;background-color:var(--text_color);border-radius:2px;transition:opacity .3s linear;transition:transform .3s linear}header .header_button .button_line--center{margin:20% 0;opacity:100%}header .header_item{color:var(--text_color)}header .header_item:hover{color:var(--mark_text)}header .header_item--text{font-family:var(--text_family_inconsolata);font-weight:700;font-size:20px}.menu_box{justify-content:center;align-items:center;flex-direction:column;flex-wrap:nowrap;position:absolute;background-color:var(--dark_bg);width:100%;height:calc(100vh - 80px);margin:0;padding:0}.menu_box--text{font-family:var(--text_family_inconsolata);font-size:20px}.menu_box .menu_link{display:flex;justify-content:center;align-items:center;width:100%;height:64px;color:var(--text_color)}.menu_box .menu_link:hover{color:var(--mark_text)}.menu_box--hidden{display:none}.menu_box--visible{display:flex}.hello{display:grid;grid-template-columns:repeat(2,1fr);justify-items:center;flex-direction:row;justify-content:space-between;align-items:center;background:linear-gradient(0deg,var(--light_bg) 16%,var(--dark_bg));height:90vh}.hello_text{font-family:var(--text_family_inconsolata);width:min-content}.hello_name{color:var(--mark_text);font-size:64px;font-weight:900;margin:4px 0}.hello_profession{color:var(--text_color);font-size:40px;font-weight:700;margin:4px 0}.hello_description{color:var(--text_color);font-size:20px;font-weight:400;margin:4px 0}.hello_baner{position:relative;width:100%;height:100%;overflow:hidden}.hello_boxCode{max-width:800px;width:100%;height:400px;overflow:hidden;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.hello_code{display:block;font-family:var(--text_family_inconsolata);font-size:16px;color:var(--mark_text);opacity:35%}.hello_pic{width:360px;height:360px;position:absolute;top:25%;left:20%}.hello_pic--lavel{position:absolute;width:inherit;height:inherit;border-radius:56% 78% 49%/32% 97% 34%}.hello_pic--lavel1{background:rgba(255,129,3,.875);transform:rotate(70deg)}.hello_pic--lavel2{background:rgba(240,227,202,.856);transform:rotate(-45deg)}.hello_pic--lavel3{background-image:url(../pic/img/pic_face.webp);background-position:center;background-size:cover;background-repeat:no-repeat}.about{padding:16px 0;background:var(--light_bg)}.about .wrapper--about{display:flex;align-items:center;gap:32px}.about_text{color:var(--text_color);font-family:var(--text_family_inconsolata);font-size:24px}.skills{margin:64px 0}.skills_header{margin:64px 0;text-align:center;color:var(--mark_text);font-family:var(--text_family_inconsolata)}.skills_line{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;opacity:100%}.portfolio{padding:64px 0}.portfolio_header{color:var(--mark_text);margin:64px 0;text-align:center;font-family:var(--text_family_inconsolata)}.portfolio_line{display:grid;grid-template-columns:repeat(3,min-content);gap:16px;justify-content:center}.portfolio_card{width:inherit;height:inherit;display:flex;justify-content:center;align-items:center;gap:12px;flex-direction:column;background-color:#24232000;box-sizing:border-box;transition-property:background-color;transition-timing-function:cubic-bezier(.25,.46,.45,.94);transition-duration:.5s;font-family:var(--text_family_inconsolata)}.portfolio_card *{opacity:0;margin:0;text-align:center;transition-property:opacity;transition-timing-function:cubic-bezier(.25,.46,.45,.94);transition-delay:.4;transition-duration:.5s}.portfolio_card:hover *{opacity:100%}.portfolio_card:hover{background-color:#21201df0}.portfolio_wrapper{width:var(--size_project);height:var(--size_project);background-size:cover}.portfolio_wrapper--1{background-image:url(pic/img/preview_layout_6.webp)}.portfolio_wrapper--2{background-image:url(pic/img/preview_layout_5.webp)}.portfolio_wrapper--3{background-image:url(pic/img/preview_layout_14.webp)}.portfolio_wrapper--4{background-image:url(pic/img/Templates18.webp)}.portfolio .project_name{color:var(--mark_text)}.portfolio .project_technologies{color:var(--text_color)}.portfolio .project_line{background-color:var(--mark_text);height:1px;width:72%}.portfolio .project_description{color:var(--text_color);width:80%}.portfolio .project_button{padding:14px 20px;border-radius:4px;background-color:var(--dark_bg)}.portfolio .project_button span{color:var(--text_color)}.footer{display:grid;grid-template-columns:minmax(216px,400px) min-content;gap:64px;align-items:center;justify-content:center;font-family:var(--text_family_inconsolata);padding:64px;background-color:var(--light_bg)}.footer_logo{height:44px}.footer_description{color:var(--text_color);font-size:20px}.footer_header{color:var(--mark_text);margin:16px 0}.footer_list{display:grid;grid-template-columns:repeat(2,max-content);column-gap:48px;row-gap:16px;list-style:none;padding:0;margin:0}.footer_item{display:flex;align-items:center;gap:16px}.footer_icon{height:32px}.footer_link{font-size:24px;font-family:var(--text_family_inconsolata);color:var(--mark_text)}.footer_link:hover{color:var(--dark_mark_text)}@media screen and (min-width: 640px) and (max-width: 1024px){header .wrapper--header{flex-direction:column;justify-content:center;padding:16px 0;gap:16px}.hello{grid-template-columns:repeat(1,1fr)}.hello_name{font-size:40px}.hello_profession{font-size:32px}.hello_description{font-size:24px}.hello_pic{width:75vw;height:75vw}.hello_code{font-size:10px}.portfolio_line{grid-template-columns:repeat(2,min-content)}}@media screen and (max-width: 639px){:root{--margin_wrapper: 16px}header{position:relative}header .header_menu{display:none}header .header_logo{height:24px}header .header_menu--button{display:flex;align-items:center;justify-content:center}header .header_button{display:block}main{position:relative}.hello{grid-template-columns:repeat(1,1fr)}.hello_baner{min-height:400px}.hello_name{font-size:40px}.hello_profession{font-size:32px}.hello_description{font-size:24px}.hello_pic{width:50vw;height:60vw;left:25%}.hello_boxCode{top:65%}.hello_code{font-size:12px;width:100%;margin:0 16px}.about .wrapper--about{display:flex;flex-direction:column;justify-content:center;align-items:center}.about .wrapper--about .about_text{margin:8px 32px;font-size:20px}.skills_card{flex-direction:row;width:240px;height:min-content;justify-content:left;align-items:center;padding:14px 0 14px 32px;gap:16px}.skills p{font-family:var(--text_family_inconsolata);font-weight:500;font-size:24px;line-height:25px;margin:0}.skills img{height:32px}.portfolio_header{margin:32px 0}.portfolio_line{grid-template-columns:min-content}.footer{grid-template-columns:min-content;gap:32px;padding:48px 16px}.footer_list{grid-template-columns:1fr}}.skills_card{padding:30px;display:flex;justify-content:center;align-items:center;flex-direction:column;background-color:var(--light_bg);border-radius:10px;gap:20px;transition:transform ease}.skills_card img{width:calc(var(--index) * 5);height:calc(var(--index) * 5)}.skills_card p{margin:16px 0 0;font-family:Arial;font-style:normal;font-weight:400;font-size:28px;line-height:32px;color:#fff}.skills_error{color:var(--mark_text)}.skills_status{color:var(--text_color)}.skillicon{--size: calc(var(--index) * 1.6);--trans: padding .3s ease;width:var(--size);height:var(--size);padding:1px;transition:var(--trans);-o-transition:var(--trans);-moz-transition:var(--trans);-webkit-transition:var(--trans);position:relative}.skillicon:hover{padding:0}.project_technologies{display:flex;gap:2px}.works_error{color:var(--mark_text)}.works_status{color:var(--text_color)}