@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|PT+Sans:400,700|Roboto:100,300,400,500,700|Montserrat:200,300,400,500,600&display=swap');

*, :before {margin:0; padding:0; box-sizing:border-box; outline:none; border:0; box-shadow:none;}
body {font:400 15px/1.5 'Open Sans', 'Segoe UI', Arial, sans-serif; background-color:#1b1f26; color:#fff}

.abs {position:absolute}
.rel {position:relative;}

h1, h2, h3, h4, h5, h6 {font-weight:400; line-height:1.2}
a {text-decoration:none;}
ul, nav {list-style:none;}
.red {border:1px solid red;}
.flex {display:flex; align-items:center;}
.flex_i {display:flex !important;}
.awesome {font-family:"Font Awesome 6 Pro"}
:root {--awesome:"Font Awesome 6 Pro";}

.no {display:none}

header {background-color:#1f242b; height:100vh; position:relative}
.center {max-width:1200px; margin:0 auto}
.content_info {margin-top:180px; line-height:2; padding:20px 10px;}
.content_info .update {margin:20px 0}
.content_info h4 {font-size:22px; margin:20px 0;}
.content_info h5 {font-size:20px; margin:20px 0;}
.content_info a {color:#03d5c0}

body a#button_up {bottom:50px; display:none; position:fixed; right:20px; z-index:4; width:80px; height:80px; border-radius:50%; display:flex; justify-content:center; align-items:center; background-color:rgba(163, 163, 163, 0.1); backdrop-filter:blur(6px); font-size:30px; color:#fff;}

.top_menu {position:fixed; width:100%; top:0;  height:80px; justify-content:space-around; backdrop-filter:blur(6px); text-shadow:1px 1px 2px #000; z-index:10}
.menu_user_slide {flex: 1; max-width: 800px;}
.menu_user_slide ul {flex:1; max-width:900px; justify-content:space-around;}
.menu_user_slide ul li {position:relative;}
.menu_user_slide ul a {padding:8px 20px; color:#fff; font-weight:600; display:inline-block; transition:all .1s ease-in-out;}
.menu_user_slide ul .buy a {border:2px solid #03d5c0; border-radius:20px;}
.menu_user_slide ul .active:after {content:""; position:absolute; bottom:0; left:0; right:0; background-color:#03d5c0; height:3px; border-radius:1.5px; animation:border 1s linear 1;}

@keyframes border {
    0% {left:50%; right:50%}
    30% {left:0; right:0}
}


.logo a {font-weight:600; color:#01C9F5; font-size:35px}
.logo b {color:#fff; margin-left:10px}
.logo img {width:60px;}

.head_block  {text-align:center; width:100%; text-shadow:2px 2px 6px #000; z-index:1}

.head_block p {font-size:30px;}
.head_block h1 {display:inline-block; margin:20px 0; font-size:70px; padding-right:20px; border-right:3px solid #03C9B5; -webkit-animation:blink 1s step-start infinite; animation:blink 1s step-start infinite; -webkit-animation-delay:3.5s; animation-delay:3.5s; line-height:1em; font-weight:700; color:#fff;}
.head_block h1 span {color:#01C9F5}
.head_block h3 {font-size:18px; margin:20px auto 0; max-width:700px}
.head_block a {display:inline-block; margin-top:10vh; line-height:45px; padding:0 6vw; background-color:#03d5c0; border-color:#03d5c0; font-weight:bold; border-radius:20px; color:#000; text-shadow:none;}


@keyframes blink {
    50% {border-color:transparent;}
}

.video_bg {inset:0; overflow:hidden}
.video_bg video {background-size:cover; height:auto; min-height:100%; min-width:100%; object-fit:cover; overflow:hidden; width:auto;}

.text_block {padding:70px 0 20px}
.text_block :is(.left, .right) {width:50%; line-height:1.5}
.text_block .badge {display:inline-block; padding:5px 40px; color:#21bbb3; border-radius:3px; margin-bottom:20px; background-color:#1c3c41}
.text_block h4 {font-size:2rem; font-weight:700;}
.text_block p {margin:20px 0}
.text_block li p {margin:5px 0; padding-left:35px}

.token .right {text-align:center}
.token .right img {width:300px;}
.token li {margin-top:20px; margin-left:2vw}
.token li:before {font-family:var(--awesome); font-weight:400; margin-right:10px; font-size:24px; color:#fff; vertical-align:middle;}
.token li.item_1:before {content:"\f06d";}
.token li.item_2:before {content:"\f023";}
.token li.item_3:before {content:"\f8bb";}  /* \f653 */
.token li.item_4:before {content:"\f6ff";}

.about_us { background-color:#181c23}
.about_us .left img { z-index:2}

.jello-diagonal-1 {-webkit-animation:jello-diagonal-1 .8s 5s both; animation:jello-diagonal-1 .8s 5s both}

@keyframes jello-diagonal-1 {
    0% {transform:skew(0deg 0deg);}
    30% { transform:skew(25deg 25deg);}
    40% {transform:skew(-15deg, -15deg);}
    50% { transform:skew(15deg, 15deg);}
    65% {transform:skew(-5deg, -5deg);}
    75% {transform:skew(5deg, 5deg);}
    100% {transform:skew(0deg 0deg);}
}

.marquee {width:84px; height:24px; overflow:hidden; position:absolute; font-size:16px; display:flex; align-items:center; transform:rotate(-10deg) skewX(-5deg); transform-origin:left center; z-index:1; top:105px; left:160px;}
.marquee span {display:inline-block; white-space:nowrap; position:absolute; animation:scroll 6s linear infinite; color:#fff;}

@keyframes scroll {
    0% {left:100%;}
    20% {left:0;}
    50% {left:-160%;}
    100% {left:-160%;}
}

.contaner_item {justify-content:space-between; align-items:stretch;}
.contaner_item > div  {width:30%; display:flex; flex-direction:column; justify-content:space-around; border:1px solid #363c47; padding:10px; border-radius:20px;}
.contaner_item h4 {text-align:center; font-size:1.5rem; font-weight:600}
.contaner_item a {color:#21bbb3; display:inline-block; padding:10px 20px; margin:20px auto; background-color:#262C36;  border-radius:20px;}

.block_bg {overflow:hidden;  position:relative; background-image:url(/files/images/6.jpg); background-repeat:no-repeat; background-position:100%; background-attachment:fixed; padding:100px 0; background-color:#14171c; background-size:100%}

.block_bg_head {width:100%;}
.block_bg p {margin:5px 0 40px 0; max-width:500px;}
.block_bg a {color:#f8f9fa; border-radius:50px; padding:20px 40px;  border:1px solid #f8f9fa;  line-height:45px; display:inline-block; padding:0 40px;}

.contacts {flex-direction:column; margin:15vh auto 0;  width:100%; max-width:800px; background-color:#252a33; padding:4vh 4vw;}
.contacts h1 {font:400 23px/1 "Roboto"; margin-top:4px;}
.contacts form {width:100%; max-width:400px; margin-top:10px;}
.contacts label {display:block; margin:20px 0 4px;}
.contacts input {height:40px; width:100%; padding:0 10px; border:0; border-radius:5px; background-color:#fff;}
.contacts textarea {border:0; width:100%; min-height:100px; border-radius:5px; padding:10px;}
.contacts button { cursor:pointer; display:block; margin:30px auto 0; border:0; line-height:38px; padding:0 15px; border-radius:20px; color:#fff; background-color:#6633CC; font-size:17px;}

[for="text"] {display:none !important}
[name="text"] {display:none}



footer {padding:40px 0; margin-top:80px;  background-color:#181c23}
footer .contaner {justify-content:space-between; margin-bottom:70px;}
footer .contaner aside {max-width:700px;}
footer .text h4 {font-size:1.5rem; margin-bottom:15px}
footer .menu {justify-content:space-around;}
footer .menu li {text-align:center;}
footer a {color:#21bbb3}
footer .logo { position:relative; min-width:150px; height:150px; margin-right:3vw; z-index:2;}
footer .logo:before {content:""; position:absolute; width:100%; height:100%; background:linear-gradient(to right, rgba(255, 255, 255, 0.17) 30%, #0ffbba 70%); animation:rotate 3s linear infinite; border-radius:50%;}
footer .logo img {width:100px; animation:hue 10s infinite linear;}
footer .logo div {width:100%; height:100%; position:absolute; justify-content:center; background-color:#181c23; border-radius:50%; overflow:hidden; box-shadow:none; object-fit:cover; margin:1px;}
footer li a {display:inline-block;}
footer .contact {padding:0 30px; line-height:40px;  border:1px solid #21bbb3; margin-bottom:6px;}
footer .contact:before {content:"\f0e0"; font-family:var(--awesome); font-weight:400; margin-right:10px; font-size:15px; color:#AAAAAA;}

.copyright {margin:80px auto 0; text-align:center}

@keyframes rotate {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}

@keyframes hue {
    from {filter:hue-rotate(0deg);}
    to {filter:hue-rotate(-360deg);}
}


/* PC */
@media (min-width:801px) {
    .mobile {display:none !important;}
}

@media (max-width:800px ) {
    .no_mobile {display:none;}

    .top_menu {height:60px;}

    .content_info {margin-top:100px; line-height:2; padding:20px 11px;}
    .content_info h1 {font-size:22px}

    .menu_user_slide {display:none; position: fixed; top:60px; bottom: 0; width: 100%; height:calc(100vh - 60px); right:auto; flex-direction: column; transition:none; color:#fff; background:linear-gradient(135deg, #5E4159 0.23%, #4E5288 35.23%, #8B67D0 100%); z-index: 11;}
    .menu_user_slide.show_menu {display:block;}
    .menu_user_slide ul {flex-direction: column; align-items:stretch; padding-top: 5vh;}
    .menu_user_slide ul li {padding-left:20px; border-top: 1px solid rgba(142, 139, 179, 0.1);}
    .menu_user_slide ul li.buy {align-self: center; margin-top:5vh;}
    .menu_user_slide ul .active:after {height:0}
    .menu_user_slide a:before {font-family:var(--awesome); font-weight:400; margin-right:10px; font-size:24px; color:#fff; vertical-align:middle;}
    .menu_user_slide .home:before {content:"\e487";}
    .menu_user_slide .token:before {content:"\f004";}
    .menu_user_slide .about:before {content:"\e49a";}
    .menu_user_slide .partners:before {content:"\f2b5";}
    .menu_user_slide .contact:before {content:"\f0e0";}
    .menu_user_slide .terms:before {content:"\f02d";}
    .menu_user_slide .privacy:before {content:"\f3ed";}
    .menu_user_slide .disclaimer:before {content:"\f4a5";}

    .menu_mobile_bt {top:12px; right:0; width:34px; height:27px; margin-right:7vw; transition:all 0.3s; z-index:21}
    .menu_mobile_bt b {position:absolute; display:block; width:100%; height:3px; left:0; bottom:0; background:#fff; transition:all 0.3s; border-radius:20px}
    .menu_mobile_bt:before, .menu_mobile_bt:after {content:""; position:absolute; display:block; width:100%; height:3px; left:0; background:#fff; transition:all 0.3s; border-radius:20px}
    .menu_mobile_bt:before {top:0;}
    .menu_mobile_bt:after {top:calc(50% - 1.5px);}
    .menu_mobile_bt.active {height:30px;}
    .menu_mobile_bt.active b {opacity:0}
    .menu_mobile_bt.active:before {transform:rotate(45deg); top:50%; border-radius:20px;}
    .menu_mobile_bt.active:after {transform:rotate(-45deg); top:50%; border-radius:20px;}
    .head_block {padding:10px;}
    .head_block p {font-size:20px;}
    .head_block h1  {font-size:40px;}
    .head_block h2  {font-size:17px;}
    .head_block h3  {font-size:15px;}

    .contaner_item > div {width:auto;  margin:10px;}

    .text_block, .block_bg > div, .contaner_item, footer aside, footer .contaner  {flex-direction:column}
    .text_block .left {width:auto; text-align:center}
    .text_block .right {width:auto; padding:0 10px;}

    .text_block h4 {font-size:20px; }
    .about_us > div {flex-direction: column-reverse;}
    .about_us .left img {max-width:100%;}

    .block_bg {background-size: auto 100%;}
    .block_bg_head  {text-align:center}
    .token .left ul  {text-align:left}
    .token .right img {width:200px; margin-top:20px}

    footer {margin-top:0; padding:10px;}
    footer .text {text-align:center; margin-bottom:40px}

}