* {font-family: "IBM Plex Sans",serif;padding: 0px;margin: 0px;box-sizing: border-box;}
.fancybox-bg, .fancybox__backdrop {background: #1d252d !important;opacity: 1 !important;}
body {background: #1d252d;display: flex;align-items: start;justify-content: start;flex-direction: column;height: 100vh !important;user-select: none;user-select: none;touch-action: none;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;outline: none;position: relative;}
main {height: 100%;position: relative;}
header {display: flex;width: 100%;padding: 40px 100px;}
header button {background: none;cursor: pointer;border: 1px solid #fff;display: flex;align-items: center;height: 60px;margin-left: auto;position: relative;}
header button:before {position: absolute;content: "";display: block;transition: width .5s;width: 0px;will-change: width;height: 100%;background: #48d597;z-index: -1;}
header button svg {margin: 0 20px;flex-shrink: 0;}
header button span {color: #fff;color: #fff;font-style: normal;font-weight: 300;font-size: 16px;line-height: 1;padding: 0 60px 0 30px;height: 100%;display: flex;align-items: center;border-left: 1px solid #fff;}
header button:hover:before {width: 100%;}
@keyframes nums {0% {transform: translate(0px,0px);}
	100% {transform: translate(0px,15px);}}
.logo {display: block;width: 194px;height: 84px;overflow: hidden;position: relative;}
.logo:before {content: "";display: block;width: 100%;height: 20px;background: rgba(29,37,45,.9);position: absolute;top: 0;left: 0;}
.logo:after {content: "";display: block;width: 100%;height: 20px;background: rgba(29,37,45,.9);position: absolute;bottom: 0;left: 0;}
.logo .number {animation: nums 8s linear infinite;}
.canvas {position: relative;position: absolute;height: 100%;bottom: 0;left: 0;display: flex;}
.canvas:before {font-style: normal;font-weight: 500;font-size: 18px;line-height: 150%;letter-spacing: .15em;text-transform: uppercase;color: #fff;position: absolute;bottom: 50%;left: 100px;margin: auto;}
.canvas:after {font-style: normal;font-weight: 500;font-size: 18px;line-height: 150%;letter-spacing: .15em;text-transform: uppercase;color: #fff;position: absolute;bottom: 50%;right: 100px;margin: auto;}
.canvas canvas {max-width: 100vw;}
.input {width: 100%;border: 2px solid #fff;position: relative;display: block;}
.input input {background: none;width: 100%;height: 50px;display: block;padding: 0 15px;color: #fff;}
.input input:focus ~ span, .input input.in ~ span {top: -40px;left: 0;}
.input span {position: absolute;top: 0;left: 30px;width: auto;height: 100%;display: flex;align-items: center;color: #fff;font-size: 14px;transition: all .5s;}
.fancybox-close-small svg {color: #fff;fill: #fff;}
#feed {background: #1d252d;border: 2px solid #fff;padding: 30px;}
#feed p {font-size: 35px;color: #fff;line-height: 1.1;margin-bottom: 40px;}
#feed p span {font-weight: 600;display: block;}
#feed button[type=submit] {background: none;width: 100%;border: 2px solid #fff;height: 60px;margin-top: 30px;cursor: pointer;position: relative;}
#feed button[type=submit] span {font-family: "IBM Plex Mono",serif;font-style: normal;font-weight: 400;font-size: 22px;line-height: 1;letter-spacing: .1em;color: #fff;position: relative;z-index: 2;}
#feed button[type=submit]:before {position: absolute;content: "";display: block;transition: width .5s;width: 0px;will-change: width;height: 100%;background: #48d597;z-index: 1;top: 0;right: 0;}
#feed button[type=submit]:hover:before {width: 100%;}
#start {background: #48d597;border: 2px solid #fff;height: 70px;display: flex;align-items: center;justify-content: center;width: 240px;position: absolute;top: 250px;left: 0;right: 0;bottom: 0;margin: auto;z-index: 10;cursor: pointer;}
#start:before {position: absolute;content: "";display: block;transition: width .5s;width: 0px;will-change: width;height: 100%;background: #1d252d;z-index: -1;}
#start span {font-family: "IBM Plex Mono",serif;font-style: normal;font-weight: 400;font-size: 22px;line-height: 1;letter-spacing: .1em;color: #fff;}
#start:hover:before {width: 100%;}
@keyframes cloud {0% {transform: translate(0px,0px);}
	50% {transform: translate(0px,25px);}
	100% {transform: translate(0px,0px);}}
.cloud {position: absolute;width: 200px;height: 80px;}
.cloud-1 {top: 50%;left: 23%;animation: cloud 6s linear infinite;}
.cloud-2 {top: 30%;left: 56%;animation: cloud 8s linear infinite;}
.cloud-3 {top: 50%;left: 78%;animation: cloud 7s linear infinite;}
.title {display: table;margin: 100px;position: relative;z-index: 2;}
.title .top {align-items: center;display: flex;gap: 50px;}
.title span {font-style: normal;font-weight: 200;font-size: 78px;line-height: 1.3;letter-spacing: .15em;text-transform: uppercase;color: #fff;}
.loading {position: relative;top: 5px;left: -15px;margin-left: auto;width: 100%;}
.loading .loading_line {align-items: center;justify-content: start;border: 2px solid rgba(255,255,255,.5);height: 50px;display: flex;padding: 3px;gap: 3px;}
.loading .loading_line i {background: rgba(255,255,255,.5);width: 100%;height: 100%;display: block;opacity: 0;}
.loading .loading_line i.active {opacity: 1;}
.loading p {font-style: normal;font-weight: 400;font-size: 16px;margin-top: 5px;line-height: 90%;letter-spacing: .2em;font-family: "IBM Plex Mono",serif;color: rgba(255,255,255,.5);}
footer {display: flex;padding: 100px;width: 100%;}
footer p {font-family: "IBM Plex Mono",serif;font-style: normal;font-weight: 300;font-size: 18px;line-height: 100%;line-height: 1.2;color: #fff;max-width: 245px;margin: 0 25px;}
.presentation {align-items: center;display: flex;height: 85px;border: 2px solid #fff;padding: 0 40px;text-decoration: none;position: relative;}
.presentation:before {position: absolute;content: "";display: block;transition: height .5s;height: 0px;will-change: height;width: 100%;left: 0;top: 0;background: #48d597;z-index: -1;}
.presentation span {font-style: normal;font-weight: 400;font-size: 22px;text-decoration: none;line-height: 1;letter-spacing: .1em;color: #fff;}
.presentation svg {margin-left: 20px;margin-bottom: -5px;}
.presentation:hover:before {height: 100%;}
.soc {margin-left: auto;}
.soc span {display: block;font-family: "IBM Plex Mono",serif;font-style: normal;font-weight: 400;font-size: 25px;line-height: 1;letter-spacing: .1em;color: rgba(255,255,255,.5);}
.soc .flex {align-items: center;display: flex;margin-top: 20px;width: 100%;justify-content: space-around;}
.soc svg {height: 20px;width: 20px;fill: #fff;}
.soc a {display: block;}
.soc a:hover svg {fill: #48d597;}
.soc i {width: 2px;height: 30px;background: rgba(255,255,255,.5);margin-top: -3px;}
@media screen and (max-width: 1920px) {header {padding: 20px 50px;}
	.title {margin: 0 50px;}
	footer {padding: 50px;}
	.canvas {height: auto;}
	.cloud-1 {top: -20%;}
	.cloud-2 {top: -10%;}
	.cloud-3 {top: -30%;}
	#start {top: 0;}}
@media screen and (max-width: 1024px) {header {align-items: center;}
	.title {margin: 30px 50px;}
	.title span {font-size: 50px;}
	.cloud-1 {top: -50%;left: 0;}
	.cloud-2 {top: -30%;left: 40%;}
	.cloud-3 {top: -50%;right: 0;}
	footer {flex-wrap: wrap;}
	footer .soc {width: 100%;}
	footer .soc span {text-align: center;}
	footer p {margin: 30px 0;text-align: center;width: 100%;max-width: 100%;}
	.presentation {width: 100%;justify-content: center;}}
@media screen and (max-width: 600px) {header {padding: 10px;}
	header button span {display: none;}
	.title {margin: 30px 10px;}
	.title span {font-size: 30px;line-height: 2;}
	.cloud {width: 70px;}
	#start {top: -33vh;}
	.loading .loading_line i:nth-child(even) {display: none;}
	footer {padding: 30px 10px;}
	footer p {margin: 15px 0;font-size: 12px;}
	#start {top: -5vh;}
	.presentation {padding: 0 10px;}}
@media screen and (max-height: 870px) {.cloud-1, .cloud-2 {display: none;}}
@media screen and (max-height: 500px) {header button, .title, footer {display: none;}
	.canvas {margin-bottom: 60px;}}