@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Libre+Baskerville&display=swap";@import"https://fonts.googleapis.com/css2?family=Open+Sans:wght@600&display=swap";@import"https://fonts.googleapis.com/css2?family=Recursive:slnt,wght,CASL,CRSV,MONO@-15..0,300..1000,0..1,0..1,0..1&display=swap";@import"https://fonts.googleapis.com/css2?family=EB+Garamond:wght@700&display=swap";@font-face{font-family:Material Icons;font-style:normal;font-weight:400;font-display:block;src:url(/portfolio_FF/assets/material-icons-8265f647.woff2) format("woff2"),url(/portfolio_FF/assets/material-icons-fd84f88b.woff) format("woff")}.material-icons{font-family:Material Icons;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"liga"}@font-face{font-family:Material Icons Outlined;font-style:normal;font-weight:400;font-display:block;src:url(/portfolio_FF/assets/material-icons-outlined-35dca8a7.woff2) format("woff2"),url(/portfolio_FF/assets/material-icons-outlined-8e94758c.woff) format("woff")}@font-face{font-family:Material Icons Round;font-style:normal;font-weight:400;font-display:block;src:url(/portfolio_FF/assets/material-icons-round-c948f126.woff2) format("woff2"),url(/portfolio_FF/assets/material-icons-round-1c135b15.woff) format("woff")}.material-icons-round{font-family:Material Icons Round;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"liga"}@font-face{font-family:Material Icons Sharp;font-style:normal;font-weight:400;font-display:block;src:url(/portfolio_FF/assets/material-icons-sharp-d31bfb81.woff2) format("woff2"),url(/portfolio_FF/assets/material-icons-sharp-fa3888ef.woff) format("woff")}.material-icons-sharp{font-family:Material Icons Sharp;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"liga"}@font-face{font-family:Material Icons Two Tone;font-style:normal;font-weight:400;font-display:block;src:url(/portfolio_FF/assets/material-icons-two-tone-1e673ba8.woff2) format("woff2"),url(/portfolio_FF/assets/material-icons-two-tone-3d34f30a.woff) format("woff")}.material-icons-two-tone{font-family:Material Icons Two Tone;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"liga"}@font-face{font-family:Material Icons Outlined;font-style:normal;font-weight:400;font-display:block;src:url(/portfolio_FF/assets/material-icons-outlined-35dca8a7.woff2) format("woff2"),url(/portfolio_FF/assets/material-icons-outlined-8e94758c.woff) format("woff")}.material-icons-outlined{font-family:Material Icons Outlined;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"liga"}@font-face{font-family:amerto;src:url(../../../public/assets/fonts/AMERTO_I.TTF) format("truetype")}@font-face{font-family:drukWide;src:url(https://db.onlinewebfonts.com/t/29800a9e7d146302b8ed9ad2f848db63.eot);src:url(https://db.onlinewebfonts.com/t/29800a9e7d146302b8ed9ad2f848db63.eot?#iefix) format("embedded-opentype"),url(https://db.onlinewebfonts.com/t/29800a9e7d146302b8ed9ad2f848db63.woff2) format("woff2"),url(https://db.onlinewebfonts.com/t/29800a9e7d146302b8ed9ad2f848db63.woff) format("woff"),url(https://db.onlinewebfonts.com/t/29800a9e7d146302b8ed9ad2f848db63.ttf) format("truetype"),url("https://db.onlinewebfonts.com/t/29800a9e7d146302b8ed9ad2f848db63.svg#Druk Wide Web Bold Regular") format("svg")}*,*:before,*:after{box-sizing:border-box}body,h1,h2,h3,h4,h5,h6,p,ol,ul{margin:0}ol,ul{list-style:none}body,button,input,select,textarea{padding:0}button,input{border:0;background-color:transparent}:focus{outline:none}body{font-size:16px;line-height:1.5}body,button,input,select,textarea{font-family:Montserrat,sans-serif}body{background-color:transparent}:root{--TEST: #c0dbea;--bg-color: #1e1f24;--icon--active--color: #f3f2f9;--text--color--blue: #aab2d1}[data-theme=light]{--bg-color: white;--icon--active--color: black;--text--color--blue: black}@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{to{transform:translateY(-8rem);opacity:0}}@keyframes fadeOutX{to{transform:translate(-8rem);opacity:0}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#root{width:100%;height:100dvh;cursor:default;background-color:var(--bg-color);top:0;right:0;bottom:0;left:0;overflow:hidden;display:flex;justify-content:center;align-items:center;transition:background-color .3s ease-in-out}.tp-dfwv{z-index:100;left:0!important;top:90%!important;transform:translate(5rem,-50%);--tp-base-background-color: hsla(230, 20%, 11%, 1);--tp-base-shadow-color: hsla(0, 0%, 0%, .2);--tp-button-background-color: hsla(230, 10%, 80%, 1);--tp-button-background-color-active: hsla(230, 10%, 95%, 1);--tp-button-background-color-focus: hsla(230, 10%, 90%, 1);--tp-button-background-color-hover: hsla(230, 10%, 85%, 1);--tp-button-foreground-color: hsla(230, 20%, 11%, 1);--tp-container-background-color: hsla(230, 25%, 16%, 1);--tp-container-background-color-active: hsla(230, 25%, 31%, 1);--tp-container-background-color-focus: hsla(230, 25%, 26%, 1);--tp-container-background-color-hover: hsla(230, 25%, 21%, 1);--tp-container-foreground-color: hsla(230, 10%, 80%, 1);--tp-groove-foreground-color: hsla(230, 20%, 8%, 1);--tp-input-background-color: hsla(230, 20%, 8%, 1);--tp-input-background-color-active: hsla(230, 28%, 23%, 1);--tp-input-background-color-focus: hsla(230, 28%, 18%, 1);--tp-input-background-color-hover: hsla(230, 20%, 13%, 1);--tp-input-foreground-color: hsla(230, 10%, 80%, 1);--tp-label-foreground-color: hsla(230, 12%, 48%, 1);--tp-monitor-background-color: hsla(230, 20%, 8%, 1);--tp-monitor-foreground-color: hsla(230, 12%, 48%, 1)}@media screen and (max-width: 600px){.tp-dfwv{width:13rem!important;height:15rem!important;left:50%!important;top:90%!important;transform:translate(-50%,-50%)}.tp-dfwv .tp-lblv_l{font-size:.5rem}.tp-dfwv .tp-sldv_k:after{width:.5rem;height:.5rem}}.mainCustomCursor{position:fixed;top:-2px;left:-2px;width:3.5px;height:3.5px;background-color:var(--icon--active--color);border-radius:50%;pointer-events:none;z-index:999}.cursorBorder{--size: 20px;position:fixed;top:calc(var(--size) / -2);left:calc(var(--size) / -2);width:var(--size);height:var(--size);border-radius:50%;box-shadow:0 0 0 1px var(--icon--active--color);pointer-events:none;transition:top .15s ease-out,left .15s ease-out,width .15s ease-out,height .15s ease-out,background-color .15s ease-out;z-index:999}.mainPage{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;z-index:5}.mainPage .mainBurgerNav{cursor:pointer;display:flex;position:absolute;left:90%;top:10%;transform:translate(-50%,-50%)}@media screen and (max-width: 480px){.mainPage .mainBurgerNav{left:87%}}.mainPage .mainBurgerNav svg{width:5rem;transition:transform .5s cubic-bezier(.4,0,.2,1)}.mainPage .mainBurgerNav path{stroke:#fff;transition:transform .5s cubic-bezier(.4,0,.2,1),stroke-dasharray .5s cubic-bezier(.4,0,.2,1),stroke-dashoffset .5s cubic-bezier(.4,0,.2,1)}.mainPage .mainBurgerNav path:nth-child(1){transform-origin:36% 40%}.mainPage .mainBurgerNav path:nth-child(2){stroke-dasharray:29 299}.mainPage .mainBurgerNav path:nth-child(3){transform-origin:35% 63%}.mainPage .mainBurgerNav path:nth-child(4){stroke-dasharray:29 299}.mainPage .mainBurgerNav path:nth-child(5){transform-origin:61% 52%}.mainPage .mainBurgerNav path:nth-child(6){transform-origin:62% 52%}.mainPage .mainBurgerNav.activeStyle svg{transform:rotate(90deg)}.mainPage .mainBurgerNav.activeStyle path:nth-child(1){transform:translate(9px) translateY(1px) rotate(45deg)}.mainPage .mainBurgerNav.activeStyle path:nth-child(2){stroke-dasharray:225 299;stroke-dashoffset:-72px}.mainPage .mainBurgerNav.activeStyle path:nth-child(3){transform:translate(9px) translateY(1px) rotate(-45deg)}.mainPage .mainBurgerNav.activeStyle path:nth-child(4){stroke-dasharray:225 299;stroke-dashoffset:-72px}.mainPage .mainBurgerNav.activeStyle path:nth-child(5){transform:translate(9px) translateY(1px) rotate(-45deg)}.mainPage .mainBurgerNav.activeStyle path:nth-child(6){transform:translate(9px) translateY(1px) rotate(45deg)}.mainPage .containerDarkMode{position:absolute;left:84%;top:10.2%;transform:translate(-50%,-50%)}@media screen and (max-width: 1400px){.mainPage .containerDarkMode{left:83%}}@media screen and (max-width: 1025px){.mainPage .containerDarkMode{left:79%}}@media screen and (max-width: 750px){.mainPage .containerDarkMode{left:76%}}@media screen and (max-width: 600px){.mainPage .containerDarkMode{left:73%}}@media screen and (max-width: 480px){.mainPage .containerDarkMode{left:65%}}.mainPage .containerDarkMode .wrapperDarkMode{width:100%;height:100%;position:relative}.mainPage .containerDarkMode .wrapperDarkMode span{color:#fff;font-weight:400;font-size:.9rem}.mainPage .containerLanguages{position:absolute;left:78%;top:10.2%;transform:translate(-50%,-50%)}@media screen and (max-width: 1400px){.mainPage .containerLanguages{left:75%}}@media screen and (max-width: 1025px){.mainPage .containerLanguages{left:69%}}@media screen and (max-width: 750px){.mainPage .containerLanguages{left:65%}}@media screen and (max-width: 600px){.mainPage .containerLanguages{left:59%}}@media screen and (max-width: 480px){.mainPage .containerLanguages{left:44%}}.mainPage .backgroundLight{width:250px;height:250px;position:absolute;transform:translate(-50%,-50%);filter:blur(25px);background-image:linear-gradient(rgba(36,206,135,.85),rgba(130,36,227,.57));border-radius:30% 70% 70% 30%/30% 30% 70% 70%;transition:all .4s ease;z-index:-1}.mainPage .backgroundLight:hover{filter:blur(8.3333333333px)}.mainPage .backgroundLight.isHover{scale:1.1}.mainPage .backgroundLight:nth-child(1){left:30%;top:10%}@media screen and (max-width: 700px){.mainPage .backgroundLight:nth-child(1){opacity:0}}.mainPage .backgroundLight:nth-child(2){left:90%;top:10%}.mainPage .backgroundLight:nth-child(3){left:10%;top:90%}.mainPage .backgroundLight:nth-child(4){left:80%;top:80%}@media screen and (max-width: 700px){.mainPage .backgroundLight:nth-child(4){opacity:0}}.mainPage .backgroundLight.centerStyle{left:50%;top:50%;filter:blur(6.25px)}.mainPage .backgroundLight.leftStyle{left:3%;top:75%;filter:blur(6.25px);animation:rotate 5s cubic-bezier(.8,.2,.2,.8) alternate infinite}.mainPage .backgroundLight.rightStyle{left:73%;top:64%;filter:blur(6.25px);animation:rotate 5s cubic-bezier(.8,.2,.2,.8) alternate infinite}.mainPage .backgroundLight.topStyle{top:18%;left:25%;filter:blur(6.25px)}.mainPage .backgroundLight.menuStyle{top:40%;left:65%;filter:blur(2.5px);animation:rotate 5s cubic-bezier(.8,.2,.2,.8) alternate infinite}@media screen and (max-width: 1000px){.mainPage .backgroundLight.menuStyle{width:30vw;height:30vw}}.mainPage .backgroundLight.playgroundStyle{opacity:0}.mainPage .mainMenuItem{display:flex;flex-direction:column;position:absolute;left:20%;top:50%;transform:translate(-50%,-50%);pointer-events:none;gap:.5rem}@media screen and (max-width: 1200px){.mainPage .mainMenuItem{left:30%}}@media screen and (max-width: 600px){.mainPage .mainMenuItem{left:0;top:50;transform:translate(3rem,-50%)}}.mainPage .mainMenuItem .containerItem{position:relative;display:flex;align-items:flex-end;gap:.5rem;opacity:0;transition:.4s var(--delayIn) ease-in-out;transform:translateY(-5rem);text-transform:uppercase}.mainPage .mainMenuItem .containerItem span{font-weight:600;color:var(--TEST);transform:translateY(-.7rem);font-family:EB Garamond,serif}.mainPage .mainMenuItem .containerItem h4{position:relative;font-size:2.7rem;color:var(--TEST);font-family:EB Garamond,serif}@media screen and (max-width: 1000px){.mainPage .mainMenuItem .containerItem h4{font-size:2rem}}.mainPage .mainMenuItem .containerItem .textWrapper{position:absolute;overflow:hidden;width:0;left:.5%;transform:translate(0);white-space:pre;color:var(--TEST);transition:width .5s;border-bottom:1px solid}.mainPage .mainMenuItem .containerItem:hover .textWrapper{width:100%}.mainPage .mainMenuItem.openStyle{pointer-events:all}.mainPage .mainMenuItem.openStyle .containerItem{opacity:1;transition:.3s var(--delayOff) ease-in-out;transform:translateY(0)}.mainPage .mainMenuItem.openStyle .containerItem:nth-child(1){transition:.3s 1s ease-in-out}.mainPage .mainMenuItem.openStyle .containerItem:nth-child(2){transition:.3s 1.2s ease-in-out}.mainPage .mainMenuItem.openStyle .containerItem:nth-child(3){transition:.3s 1.4s ease-in-out}.mainPage .mainMenuItem.openStyle .containerItem:nth-child(4){transition:.3s 1.6s ease-in-out}.mainPage .mainMenuItem.openStyle .containerItem:nth-child(4) .textWrapper{left:.4%}.mainPage .mainMenuItem.openStyle .containerItem:nth-child(5){transition:.3s 1.8s ease-in-out}.mainPage .mainMenuItem.disable{opacity:0}.mainPage .mainHome{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem}.mainPage .mainHome.isMenuPositionStyle{pointer-events:none}.mainPage .mainHome .containerTitle{display:flex;flex-direction:column;align-items:center}@media screen and (max-width: 530px){.mainPage .mainHome .containerTitle{width:95%;text-align:center}}.mainPage .mainHome .containerTitle h1{font-weight:700;-webkit-text-stroke:1px var(--TEST);color:transparent;font-family:amerto,sans-serif;font-size:2rem;text-transform:uppercase}@media screen and (max-width: 800px){.mainPage .mainHome .containerTitle h1{font-size:1.5rem}}@media screen and (max-width: 440px){.mainPage .mainHome .containerTitle h1{font-size:1.2rem}}.mainPage .mainHome .containerTitle h1 span{-webkit-text-stroke:0;color:var(--TEST);font-size:2.2rem;font-family:Dosis,sans-serif;font-family:EB Garamond,serif}@media screen and (max-width: 800px){.mainPage .mainHome .containerTitle h1 span{font-size:1.7rem}}@media screen and (max-width: 440px){.mainPage .mainHome .containerTitle h1 span{font-size:1.4rem}}.mainPage .mainHome .containerInfo{display:flex;flex-direction:column;align-items:center;gap:.7rem;font-size:.8rem;color:#fff}@media screen and (max-width: 800px){.mainPage .mainHome .containerInfo{font-size:.7rem}}.mainPage .mainHome a{padding:0;margin:0;border:none;background:none;transform:translateY(1rem);text-decoration:none;--primary-color: var(--TEST);--hovered-color: white;position:relative;display:flex;font-weight:500;font-size:15px;gap:.5rem;align-items:center;cursor:pointer}.mainPage .mainHome a:hover p:before{width:100%}.mainPage .mainHome a:hover svg{transform:translate(4px);color:var(--hovered-color)}.mainPage .mainHome a:after{position:absolute;content:"";width:0;left:0;bottom:-7px;background:var(--hovered-color);height:2px;transition:.3s ease-out}.mainPage .mainHome a:after:hover:after{width:100%}.mainPage .mainHome a p{margin:0;position:relative;font-size:15px;color:var(--primary-color)}.mainPage .mainHome a p:before{position:absolute;content:"Contacts";width:0%;top:0;right:0;bottom:0;left:0;color:var(--hovered-color);overflow:hidden;transition:.3s ease-out}.mainPage .mainHome a svg{color:var(--primary-color);transition:.2s;position:relative;width:15px;transition-delay:.2s}.mainPage .mainHome .containerContact{position:absolute;left:50%;bottom:5%;transform:translate(-50%,-50%);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.6rem;width:80%;transition:.1s ease-in-out;opacity:1}.mainPage .mainHome .containerContact h5{color:#fff;font-size:1rem;font-weight:500;display:flex;justify-content:center;align-items:center;gap:1rem;text-align:center}.mainPage .mainHome.isHomePositionStyle .containerTitle h1{opacity:0;transform:translateY(-8rem)}.mainPage .mainHome.isHomePositionStyle .containerTitle h1:nth-child(1){animation:fadeIn ease .5s .9s forwards}.mainPage .mainHome.isHomePositionStyle .containerTitle h1:nth-child(2){animation:fadeIn ease .5s .7s forwards}.mainPage .mainHome.isHomePositionStyle .containerTitle h1:nth-child(3){animation:fadeIn ease .5s .5s forwards}.mainPage .mainHome.isHomePositionStyle a{opacity:1}.mainPage .mainHome.isHomePositionStyle .containerInfo{transform:translate(-8rem);opacity:0;animation:fadeIn ease .5s .9s forwards}.mainPage .mainHome.isHomePositionStyle .containerContact{opacity:1}.mainPage .mainHome.isMenuPositionStyle .containerTitle h1:nth-child(1){animation:fadeOut ease .5s .1s forwards}.mainPage .mainHome.isMenuPositionStyle .containerTitle h1:nth-child(2){animation:fadeOut ease .5s .2s forwards}.mainPage .mainHome.isMenuPositionStyle .containerTitle h1:nth-child(3){animation:fadeOut ease .5s .3s forwards}.mainPage .mainHome.isMenuPositionStyle .containerInfo{animation:fadeOutX ease .5s .4s forwards}.mainPage .mainHome.isMenuPositionStyle a,.mainPage .mainHome.isMenuPositionStyle .containerContact{opacity:0}.mainPage .mainProjects{width:100%;height:80%;position:absolute;right:0;bottom:0;display:flex;justify-content:flex-end;align-items:center;transition:4s ease 3s;pointer-events:none}.mainPage .mainProjects .modalPreview{position:absolute;left:0;top:45%;transform:translate(4rem,-50%);width:28rem;height:28rem}@media screen and (max-width: 1300px){.mainPage .mainProjects .modalPreview{width:30vw;height:30vw}}.mainPage .mainProjects .modalPreview .modalPreviewWrapper{width:100%;height:100%;border-radius:2rem;position:relative;overflow:hidden}.mainPage .mainProjects .modalPreview .modalPreviewWrapper img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;height:100%;opacity:1;transition:opacity 1.2s ease,transform 1s ease;object-fit:cover;opacity:0}.mainPage .mainProjects .modalPreview .modalPreviewWrapper img.hover{opacity:1;transform:translate(-50%,-50%) scale(1.05)}.mainPage .mainProjects .projectList{height:100%;width:70%;min-width:65rem;display:flex;flex-direction:column;gap:2rem;padding:2rem 4rem 5rem 8rem;overflow-y:scroll;transform-origin:right center;transform:perspective(800px) rotateY(-13deg);-ms-overflow-style:none;scrollbar-width:none}.mainPage .mainProjects .projectList::-webkit-scrollbar{display:none}@media screen and (max-width: 1170px){.mainPage .mainProjects .projectList{width:100%;min-width:70rem}}@media screen and (max-width: 860px){.mainPage .mainProjects .projectList{min-width:140vw;gap:1.5rem}}.mainPage .mainProjects .projectList a{font-size:6rem;font-weight:700;text-align:end;font-family:drukWide,sans-serif;word-wrap:break-word;line-height:5rem;text-transform:uppercase;opacity:0;transform:translateY(-28rem);text-decoration:none;color:var(--TEST)}@media screen and (max-width: 860px){.mainPage .mainProjects .projectList a{font-size:5rem;line-height:4.5rem}}@media screen and (max-width: 700px){.mainPage .mainProjects .projectList a{font-size:4rem;line-height:4rem}}@media screen and (max-width: 500px){.mainPage .mainProjects .projectList a{font-size:3rem;line-height:3.5rem}}@media screen and (max-width: 430px){.mainPage .mainProjects .projectList a{font-size:2.4rem;line-height:2rem}}.mainPage .mainProjects .projectList a.base{transition:.3s ease}.mainPage .mainProjects .projectList a.base:hover{-webkit-text-stroke:1px var(--TEST);transform-origin:right bottom;transform:perspective(800px) rotateY(5deg)!important;color:transparent}.mainPage .mainProjects.open{pointer-events:all}.mainPage .mainProjects.open .projectList a{margin-top:0rem;opacity:1;transform:translate(0)}.mainPage .mainProjects.open .projectList a.animation{pointer-events:none}.mainPage .mainProjects.open .projectList a.animation:nth-child(5){transition:.9s ease .2s}.mainPage .mainProjects.open .projectList a.animation:nth-child(4){transition:.9s ease .4s}.mainPage .mainProjects.open .projectList a.animation:nth-child(3){transition:.9s ease .6s}.mainPage .mainProjects.open .projectList a.animation:nth-child(2){transition:.9s ease .8s}.mainPage .mainProjects.open .projectList a.animation:nth-child(1){transition:.9s ease 1s}.mainPage .mainProjects.close{pointer-events:none}.mainPage .mainProjects.close .projectList a:nth-child(1){transition:.9s ease .2s}.mainPage .mainProjects.close .projectList a:nth-child(2){transition:.9s ease .4s}.mainPage .mainProjects.close .projectList a:nth-child(3){transition:.9s ease .6s}.mainPage .mainProjects.close .projectList a:nth-child(4){transition:.9s ease .8s}.mainPage .mainProjects.close .projectList a:nth-child(5){transition:.9s ease 1s}.mainPage .mainAbout{width:100%;height:85%;position:absolute;right:0;bottom:0;pointer-events:none;transition:4s ease;display:flex;justify-content:center;align-items:center;min-height:fit-content}.mainPage .mainAbout .container{width:100%;height:100%;display:flex;justify-content:space-between;align-items:center;padding:3rem 0}@media screen and (max-width: 1350px){.mainPage .mainAbout .container{flex-direction:column;justify-content:flex-start;gap:4rem;text-align:center;width:100%;overflow-y:scroll;scrollbar-width:none;padding-bottom:6rem}.mainPage .mainAbout .container::-webkit-scrollbar{display:none}}@media screen and (max-width: 950px){.mainPage .mainAbout .container{padding-bottom:0}}.mainPage .mainAbout .container .main{display:grid;width:23rem;min-height:28rem;place-items:center;opacity:0;position:relative;transform:translate(-9rem);transition:.6s ease-in-out .2s}@media screen and (max-width: 1350px){.mainPage .mainAbout .container .main{transform:translate(0) translateY(2rem)}}@media screen and (max-width: 950px){.mainPage .mainAbout .container .main{width:16rem;height:20rem;transform:translateY(-3rem)}}.mainPage .mainAbout .container .main:hover:not(.activeMain,.mobileStyle) #c1{transform:translate(-100px) rotate(-50deg)}.mainPage .mainAbout .container .main:hover:not(.activeMain,.mobileStyle) #c2{transform:translate(-50px) rotate(-40deg)}.mainPage .mainAbout .container .main:hover:not(.activeMain,.mobileStyle) #c3{transform:translate(0) rotate(-30deg)}.mainPage .mainAbout .container .main:hover:not(.activeMain,.mobileStyle) #c4{transform:translate(50px) rotate(-20deg)}.mainPage .mainAbout .container .main:hover:not(.activeMain,.mobileStyle) #c5{transform:translate(100px) rotate(-10deg)}@media screen and (max-width: 600px){.mainPage .mainAbout .container .main #c1{transform:translate(-20px) rotate(-12deg)}.mainPage .mainAbout .container .main #c2{transform:translate(20px) rotate(12deg)}.mainPage .mainAbout .container .main #c3{transform:translate(10px) rotate(6deg)}.mainPage .mainAbout .container .main #c4,.mainPage .mainAbout .container .main #c5{transform:translate(-10px) rotate(-6deg)}}.mainPage .mainAbout .container .main .card{width:23rem;height:28rem;margin:0 auto;border-radius:1rem;z-index:1;position:absolute;box-shadow:0 0 10px 1px #0003;transition:.3s ease-in-out;cursor:pointer;display:flex;flex-direction:column;overflow:hidden;border:2px solid rgba(255,255,255,.2);z-index:var(--zIndex)}@media screen and (max-width: 950px){.mainPage .mainAbout .container .main .card{width:16rem;height:20rem}}.mainPage .mainAbout .container .main .card.mobile{cursor:auto}.mainPage .mainAbout .container .main .card.mobileStyle.activeCard{transform:translateY(3rem) scale(1.2) rotate(0)!important}.mainPage .mainAbout .container .main .card.activeCard,.mainPage .mainAbout .container .main .card .activeCardMobile{transform:scale(1.2) translateY(1rem);width:22rem;height:27rem;z-index:10;cursor:auto}.mainPage .mainAbout .container .main .card.activeCard .cardContent,.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent{pointer-events:none}@media screen and (max-width: 950px){.mainPage .mainAbout .container .main .card.activeCard,.mainPage .mainAbout .container .main .card .activeCardMobile{transform:scale(1.2) translateY(3rem);width:20rem;height:24rem}}@media screen and (max-width: 600px){.mainPage .mainAbout .container .main .card.activeCard,.mainPage .mainAbout .container .main .card .activeCardMobile{margin-top:1rem}}@media screen and (max-width: 450px){.mainPage .mainAbout .container .main .card.activeCard,.mainPage .mainAbout .container .main .card .activeCardMobile{width:17rem;height:24rem}}.mainPage .mainAbout .container .main .card.activeCard .cardContent,.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:2rem}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerTitle,.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerTitle{transform:translateY(0)}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerTitle span,.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerTitle span{font-size:1.5rem}@media screen and (max-width: 950px){.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerTitle span,.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerTitle span{font-size:1rem}}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p,.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p{opacity:1;overflow:hidden;width:0;white-space:nowrap;font-family:Varela Round,sans-serif;font-size:.8rem;font-weight:400;text-align:left}@media screen and (max-width: 950px){.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p,.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p{font-size:.7rem}}@media screen and (max-width: 450px){.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p,.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p{font-size:.6rem}}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(1),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(1){animation:typing 1s steps(70,end) 0s forwards}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(2),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(2){animation:typing 1s steps(70,end) 1s forwards}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(3),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(3){animation:typing 1s steps(70,end) 2s forwards}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(4),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(4){animation:typing 1s steps(70,end) 3s forwards}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(5),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(5){animation:typing 1s steps(70,end) 4s forwards}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(6),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(6){animation:typing 1s steps(70,end) 5s forwards}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(7),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(7){animation:typing 1s steps(70,end) 6s forwards}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(8),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(8){animation:typing 1s steps(70,end) 7s forwards}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(9),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(9){animation:typing 1s steps(70,end) 8s forwards}.mainPage .mainAbout .container .main .card.activeCard .cardContent .containerSubTitle p:nth-child(10),.mainPage .mainAbout .container .main .card .activeCardMobile .cardContent .containerSubTitle p:nth-child(10){animation:typing 1s steps(70,end) 9s forwards}@keyframes typing{0%{width:0}to{width:100%}}@keyframes blink-caret{0%,to{border-color:transparent}50%{border-color:orange}}.mainPage .mainAbout .container .main .card.activeCard p,.mainPage .mainAbout .container .main .card .activeCardMobile p{color:var(--icon--active--color)}.mainPage .mainAbout .container .main .card.disable{opacity:0;pointer-events:none;cursor:auto}.mainPage .mainAbout .container .main .card.middleCard{transform:translate(0) rotate(0)!important;z-index:10;cursor:pointer}.mainPage .mainAbout .container .main .card .tools{display:flex;align-items:center;padding:9px}.mainPage .mainAbout .container .main .card .tools .circle{padding:0 4px}.mainPage .mainAbout .container .main .card .tools .box{display:inline-block;align-items:center;width:12px;height:12px;border-radius:50%}@media screen and (max-width: 950px){.mainPage .mainAbout .container .main .card .tools .box{width:9px;height:9px}}.mainPage .mainAbout .container .main .card .tools .box.red{background-color:#ff605c}.mainPage .mainAbout .container .main .card .tools .box.yellow{background-color:#ffbd44}.mainPage .mainAbout .container .main .card .tools .box.green{background-color:#00ca4e}.mainPage .mainAbout .container .main .card .cardContent{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1;padding:0 1.5rem;position:relative}.mainPage .mainAbout .container .main .card .cardContent .containerTitle{display:flex;justify-content:center;align-items:center;height:20%;transform:translateY(-4rem)}.mainPage .mainAbout .container .main .card .cardContent .containerTitle span{transition:.2s ease-in-out;font-size:1.7rem;font-weight:700;color:#fff;font-family:Libre Baskerville,serif;text-align:center}@media screen and (max-width: 950px){.mainPage .mainAbout .container .main .card .cardContent .containerTitle span{font-size:1.3rem}}.mainPage .mainAbout .container .main .card .cardContent .containerSubTitle{width:100%}.mainPage .mainAbout .container .main .card .cardContent .containerSubTitle p{opacity:0}.mainPage .mainAbout .container .main .card .cardContent .containerSubTitle .number{font-size:20rem;-webkit-text-stroke:1px var(--text--color--blue);color:transparent;font-family:amerto,sans-serif;opacity:.5;position:absolute;left:75%;top:80%;transform:translate(-50%,-50%)}@media screen and (max-width: 950px){.mainPage .mainAbout .container .main .card .cardContent .containerSubTitle .number{font-size:10rem;left:80%;top:80%}}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile){z-index:5}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c1{transform:translate(-150px) rotate(0)}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c2{transform:translate(-100px) rotate(0)}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c3{transform:translate(-50px) rotate(0)}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c4{transform:translate(0) rotate(0)}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c5{transform:translate(100px) rotate(0)}@media screen and (max-width: 600px){.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c1{transform:translate(-80px) translateY(-3rem) rotate(0)}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c2{transform:translate(80px) translateY(-3rem) rotate(0)}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c3{transform:translate(40px) translateY(-3rem) rotate(0)}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c4{transform:translate(-40px) translateY(-3rem) rotate(0)}.mainPage .mainAbout .container .main .card:hover:not(.activeCard,.mobile)#c5{transform:translate(0) translateY(-3rem) rotate(0)}}.mainPage .mainAbout .container .main .card#c1{background-color:#0b666a}.mainPage .mainAbout .container .main .card#c2{background-color:#4d4c7d}.mainPage .mainAbout .container .main .card#c3{background-color:#12486b}.mainPage .mainAbout .container .main .card#c4{background-color:#3d30a2}.mainPage .mainAbout .container .main .card#c5{background-color:#011522}.mainPage .mainAbout .container .main .card:nth-child(5).activeCard .cardContent .containerSubTitle p:nth-child(3),.mainPage .mainAbout .container .main .card:nth-child(5).activeCard .cardContent .containerSubTitle p:nth-child(5){margin-top:1rem}.mainPage .mainAbout .container .main .card:nth-child(4).activeCard .cardContent .containerSubTitle p:nth-child(2),.mainPage .mainAbout .container .main .card:nth-child(4).activeCard .cardContent .containerSubTitle p:nth-child(5){margin-top:1rem}.mainPage .mainAbout .container .main .card:nth-child(3).activeCard .cardContent .containerSubTitle p:nth-child(2),.mainPage .mainAbout .container .main .card:nth-child(3).activeCard .cardContent .containerSubTitle p:nth-child(4),.mainPage .mainAbout .container .main .card:nth-child(3).activeCard .cardContent .containerSubTitle p:nth-child(6){margin-top:1rem}.mainPage .mainAbout .container .main .card:nth-child(2).activeCard .cardContent .containerSubTitle p:nth-child(4),.mainPage .mainAbout .container .main .card:nth-child(2).activeCard .cardContent .containerSubTitle p:nth-child(6){margin-top:1rem}.mainPage .mainAbout .container .main .card:nth-child(1).activeCard .cardContent .containerSubTitle p:nth-child(3),.mainPage .mainAbout .container .main .card:nth-child(1).activeCard .cardContent .containerSubTitle p:nth-child(5){margin-top:1rem}.mainPage .mainAbout .container .containerDot{width:20rem;position:absolute;z-index:1000;left:50%;top:75%;transform:translate(-50%);display:flex;flex-direction:row-reverse;justify-content:center;align-items:center;gap:1rem}.mainPage .mainAbout .container .containerDot .dot{width:.7rem;min-height:.7rem;background-color:#fff6;border-radius:50%;opacity:0;pointer-events:none;transition:.3s ease-in-out}.mainPage .mainAbout .container .containerDot .dot.display{opacity:1;pointer-events:all}.mainPage .mainAbout .container .containerDot .dot.activeDot{background-color:#fff}.mainPage .mainAbout .container .modalButton{position:absolute;top:50%;width:3rem;height:3rem;border-radius:50%;opacity:0;pointer-events:none;transition:.3s ease-in-out;background-color:#ffffff4d;display:flex;justify-content:center;align-items:center;cursor:pointer}.mainPage .mainAbout .container .modalButton.display{z-index:1000;opacity:1;pointer-events:all}.mainPage .mainAbout .container .modalButton.prev{left:0;transform:translate(-2rem,-50%)}.mainPage .mainAbout .container .modalButton.prev span{transform:translate(.3rem)}.mainPage .mainAbout .container .modalButton.next{right:0;transform:translate(2rem,-50%)}.mainPage .mainAbout .container .containerAboutText{display:flex;flex-direction:column;gap:3rem;transform:translate(4rem);position:relative;z-index:100;width:47%}@media screen and (max-width: 1350px){.mainPage .mainAbout .container .containerAboutText{width:90%;transform:translate(0)}}.mainPage .mainAbout .container .containerAboutText .containerText{display:flex;flex-direction:column;gap:2rem;width:100%;position:relative;z-index:100}.mainPage .mainAbout .container .containerAboutText .containerText h1{transition:.9s ease .5s}.mainPage .mainAbout .container .containerAboutText .containerText h3{transition:.9s ease .8s}.mainPage .mainAbout .container .containerAboutText .containerText h1,.mainPage .mainAbout .container .containerAboutText .containerText h3{font-weight:700;-webkit-text-stroke:1px var(--TEST);color:transparent;font-family:amerto,sans-serif;font-size:2rem;transform:translateY(-5rem);opacity:0}.mainPage .mainAbout .container .containerAboutText .containerText h1 span,.mainPage .mainAbout .container .containerAboutText .containerText h3 span{-webkit-text-stroke:0;color:var(--TEST);font-family:montserrat,sans-serif}@media screen and (max-width: 700px){.mainPage .mainAbout .container .containerAboutText .containerText h1,.mainPage .mainAbout .container .containerAboutText .containerText h3{font-size:1.5rem}}@media screen and (max-width: 400px){.mainPage .mainAbout .container .containerAboutText .containerText h1,.mainPage .mainAbout .container .containerAboutText .containerText h3{font-size:1.3rem}}.mainPage .mainAbout .container .containerAboutText .containerText .subTitle{display:flex;flex-direction:column;gap:.3rem}.mainPage .mainAbout .container .containerAboutText .containerText .subTitle h2{color:var(--TEST);font-size:1rem;font-weight:500;opacity:0;transform:translate(-5rem)}.mainPage .mainAbout .container .containerAboutText .containerText .subTitle h2:nth-child(1){transition:.9s ease .2s}.mainPage .mainAbout .container .containerAboutText .containerText .subTitle h2:nth-child(2){transition:.9s ease .4s}.mainPage .mainAbout .container .containerAboutText .containerText .subTitle h2:nth-child(3){transition:.9s ease .6s}@media screen and (max-width: 700px){.mainPage .mainAbout .container .containerAboutText .containerText .subTitle h2{font-size:.8rem}}@media screen and (max-width: 400px){.mainPage .mainAbout .container .containerAboutText .containerText .subTitle h2{font-size:.7rem}}.mainPage .mainAbout .container .containerAboutText .containerText .subTitle span{font-weight:700;color:var(--TEST);font-family:montserrat,sans-serif}.mainPage .mainAbout.open{pointer-events:all;opacity:1}.mainPage .mainAbout.open .container .containerAboutText h1,.mainPage .mainAbout.open .container .containerAboutText h3{opacity:1;transform:translateY(0)}.mainPage .mainAbout.open .container .containerAboutText .subTitle h2{opacity:1;transform:translate(0)}.mainPage .mainAbout.open .container .main{opacity:1}.mainPage .mainPlayground{width:100%;height:100%;position:absolute;right:0;bottom:0;pointer-events:none;opacity:0}.mainPage .mainPlayground .mask1{width:100%;height:100%;transition:transform .5s ease-in-out;background-color:#151619;transform:translate(-100%);position:absolute;bottom:0}.mainPage .mainPlayground.disable{background-color:transparent}.mainPage .mainPlayground .mask2{width:100%;height:100%;transition:transform .5s ease-in-out .5s,background-color .4s ease-in-out .5s;background-color:#1e1f24;transform:translateY(-100%);position:absolute;bottom:0}.mainPage .mainPlayground .canvas{width:100%;height:100%;position:relative;z-index:0;opacity:0;transition:.4s ease-in-out}.mainPage .mainPlayground .canvas.display{opacity:1}.mainPage .mainPlayground.open{pointer-events:all;opacity:1;z-index:-1}.mainPage .mainPlayground.open .mask1{pointer-events:none;transform:translate(0)}.mainPage .mainPlayground.open .mask1.disable{background-color:transparent}.mainPage .mainPlayground.open .mask2{pointer-events:none;transform:translate(0)}.mainPage .mainPlayground.open .mask2.disable{background-color:transparent}
