* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
  }
  
  html {
    scroll-behavior: smooth;
  }
  
  body {
    background-color: black;
    font-family: "Maron Rose";
  }
  body::-webkit-scrollbar {
    background-color: rgba(0, 0, 0, 0);
    width: 0.8vh;
    border-radius: 8vh;
  }
  body::-webkit-scrollbar-thumb {
    background-color: rgba(76, 104, 113, 0.675);
    width: 0.8vh;
    border-radius: 8vh;
  }
  
  ::before, ::after {
    transition: 0.5s;
  }
  
  h1 {
    font-weight: normal;
  }
  
  .header_new {
    width: 100%;
    z-index: 2;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-direction: column;
    text-align: center;
    padding-top: 15vh;
    background: url(../images/bg.jpg) top/cover;
  }
  .header_new .bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: none;
  }
  .header_new .bg video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .header_new::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(20, 16, 11, 0.3), rgba(12, 24, 28, 0.75));
    top: 0;
    z-index: 1;
  }
  .header_new .key {
    display: flex;
    align-items: start;
    justify-content: center;
    width: 60%;
    position: relative;
    z-index: 1;
  }
  .header_new .key li {
    width: 20%;
    margin: 0vh 4vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
  }
  .header_new .key li p {
    font-size: 2vh;
    color: rgb(255 255 255 / 75%);
    width: 100%;
    font-weight: normal;
    margin: 0 auto;
    margin-top: 3vh;
    z-index: 1;
    letter-spacing: 0vh;
  }
  .header_new .key li span {
    width: 9vh;
    height: 9vh;
    background-color: rgba(118, 165, 196, 0.46);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 0.3vh solid rgb(200, 225, 239);
    padding: 0.6vh;
    backdrop-filter: blur(1vh);
    box-shadow: 0vh 1vh 3vh rgba(35, 27, 12, 0.712);
  }
  .header_new .key li span div:nth-child(1) {
    border-radius: 100%;
    background-color: rgb(188 112 147);
    width: 100%;
    border: 0.2vh solid rgb(241 193 222);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .header_new .key li span div:nth-child(1) img {
    width: 5vh;
  }
  .header_new .key li span div:nth-child(2) {
    position: absolute;
    opacity: 0.6;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .header_new .key li span div:nth-child(2) img {
    width: 12.5vh;
    position: absolute;
  }
  .header_new .line {
    position: absolute;
    bottom: -0.5vh;
    width: 100%;
    height: 0.4vh;
    pointer-events: none;
  }
  .header_new .line::before {
    content: "";
    width: 40%;
    height: 0.2vh;
    position: absolute;
    left: 0;
    background-color: rgb(41, 53, 58);
  }
  .header_new .line::after {
    content: "";
    width: 40%;
    height: 0.2vh;
    position: absolute;
    right: 0;
    background-color: rgb(41, 53, 58);
  }
  .header_new .line img {
    width: 120vh;
    transform: rotate(180deg);
    position: relative;
    z-index: 1;
    top: -13.5vh;
  }
  .header_new .top {
    position: relative;
    z-index: 1;
    margin-bottom: 10vh;
  }
  .header_new .top::after {
    content: "";
    left: 0;
    opacity: 0.3;
    top: 10vh;
    width: 100%;
    height: 80%;
    background-color: black;
    position: absolute;
    z-index: -1;
    filter: blur(10vh);
  }
  .header_new .top .logo {
    width: 50vh;
    margin-bottom: 3vh;
  }
  .header_new .top h1 {
    color: white;
    font-size: 8vh;
    text-shadow: 0vh 0vh 2vh rgba(0, 0, 0, 0.622);
    line-height: 10vh;
  }
  .header_new .top h1 span {
    color: rgb(171, 217, 239);
  }
  
  .secon_btn {
    width: 12vh;
    height: 4.2vh;
    border-radius: 10vh;
    background: linear-gradient(rgb(35, 80, 98), rgb(58, 111, 135));
    display: inline-flex;
    align-items: center;
    position: relative;
    border: 0.3vh solid rgb(153, 182, 199);
    transition: 0.5s;
  }
  .secon_btn:hover {
    border: 0.3vh solid rgb(231, 244, 252);
    box-shadow: inset 0vh 0vh 2vh rgb(179, 224, 245);
  }
  .secon_btn span {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.7vh;
    color: white;
    border-radius: 10vh;
    position: relative;
  }
  .secon_btn span i {
    z-index: 1;
    margin: 0 !important;
  }
  .secon_btn span::before {
    content: "";
    top: 0;
    width: 60%;
    height: 100%;
    clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
    position: absolute;
    background-color: rgba(166, 201, 217, 0.293);
  }
  .secon_btn .decoration {
    position: absolute;
    left: 0;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
  }
  .secon_btn .decoration img {
    position: absolute;
    z-index: 0;
    width: 6.2vh;
  }
  .secon_btn .decoration img:nth-child(1) {
    left: -3.8vh;
  }
  .secon_btn .decoration img:nth-child(2) {
    right: -3.8vh;
  }
  
  li {
    list-style: none;
  }
  
  nav {
    position: fixed;
    top: 0;
    width: 100%;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1001;
    background-color: rgb(0 0 0);
    /* border-bottom: 0.2vh solid rgba(48, 61, 71, 0.61); */
  }
  nav .mobile {
    display: none;
  }
  nav ul:nth-child(2) {
    display: flex;
    height: 100%;
    align-items: center;
  }
  nav ul:nth-child(2) li:nth-child(2) {
    margin: 0vh 5vh 0vh 5vh;
  }
  nav ul:nth-child(2) li:nth-child(1) a {
    display: inline-flex;
    margin: 0vh 1.5vh;
    color: rgba(255, 255, 255, 0.466);
    font-size: 1.8vh;
  }
  nav ul:nth-child(2) li:nth-child(1) a i {
    transition: 0s;
  }
  nav ul:nth-child(2) li:nth-child(1) a:hover {
    color: white;
    text-shadow: 0vh 0vh 2vh rgb(0, 162, 255);
  }
  nav ul:nth-child(1) {
    display: flex;
    height: 100%;
    display: flex;
    align-items: center;
  }
  nav ul:nth-child(1) li:nth-child(1) {
    margin: 0vh 2vh;
  }
  nav ul:nth-child(1) li:nth-child(1) img {
    position: relative;
    top: 0.4vh;
  }
  nav ul:nth-child(1) li {
    margin: 0vh 3vh;
  }
  nav ul:nth-child(1) li img {
    width: 15vh;
  }
  nav ul:nth-child(1) li.active a {
    color: white;
  }
  nav ul:nth-child(1) li.active a img {
    opacity: 1;
  }
  nav ul:nth-child(1) li:hover a {
    color: white;
  }
  nav ul:nth-child(1) li:hover a img {
    opacity: 1;
  }
  nav ul:nth-child(1) li a {
    display: flex;
    align-items: center;
    color: rgb(112, 131, 138);
    font-size: 1.9vh;
    text-transform: uppercase;
    letter-spacing: 0.1vh;
  }
  nav ul:nth-child(1) li a img {
    width: 2.5vh;
    margin-right: 1vh;
    opacity: 0.3;
  }
  
  .navigation_left {
    position: fixed;
    padding-top: 8vh;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    width: 12vh;
    top: 0;
  }
  .navigation_left li {
    margin: 1vh 0vh;
    cursor: pointer;
    transition: 0.5s;
  }
  .navigation_left li a.active img {
    width: 5vh;
    opacity: 1;
  }
  .navigation_left li a:hover img {
    width: 4.8vh;
    opacity: 1;
  }
  .navigation_left li img {
    width: 4vh;
    opacity: 0.5;
    transition: 0.5s;
  }
  
  img {
    transition: 0.5s;
  }
  
  a {
    transition: 0.5s;
  }
  
  .main_btn {
    width: 45vh;
    height: 8vh;
    background: linear-gradient(120deg, #785b8b, #785b8b);
    padding: 0.8vh;
    display: inline-flex;
    border-radius: 10vh;
    margin-top: 3vh;
    position: relative;
    border: 0.2vh solid rgb(244 199 228);
    backdrop-filter: blur(2vh);
    box-shadow: 0vh 2vh 3vh rgba(0, 0, 0, 0.178);
    transition: 0.5s;
  }
  .main_btn:hover span {
    box-shadow: inset 0vh 0vh 4vh white;
    font-size: 3.5vh;
    letter-spacing: 1vh;
  }
  .main_btn:hover span::after {
    width: 82%;
    clip-path: polygon(10% 0, 90% 0, 100% 50%, 90% 100%, 10% 100%, 0% 50%);
  }
  .main_btn span {
    display: inline-flex;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgb(255, 255, 255), rgba(255, 255, 255, 0));
    color: rgb(19 28 33);
    box-shadow: inset 0vh 0vh 1.5vh #efb0be;
    font-size: 2.8vh;
    border: 0.3vh solid #f5d9e7;
    border-radius: 10vh;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    transition: 0.5s;
    font-weight: bold;
    letter-spacing: 0.3vh;
    position: relative;
  }
  .main_btn span::Before {
    transition: 0.5s;
    content: "";
    border: 0.2vh solid rgba(255, 255, 255, 0.741);
    top: 0;
    position: absolute;
    background: linear-gradient(120deg, white, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0), rgba(255, 255, 255, 0), white);
    width: 82%;
    clip-path: polygon(10% 0, 90% 0, 100% 50%, 90% 100%, 10% 100%, 0% 50%);
    height: 100%;
    border-radius: 10vh;
  }
  .main_btn span::after {
    transition: 0.5s;
    content: "";
    transition: 0.5s;
    top: 0;
    position: absolute;
    background: linear-gradient(120deg, white, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0), white);
    width: 65%;
    clip-path: polygon(13% 0, 87% 0, 100% 50%, 87% 100%, 13% 100%, 0% 50%);
    z-index: 1;
    height: 100%;
    border-radius: 10vh;
  }
  .main_btn .decoration {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    top: 0;
    left: 0;
    z-index: 1;
  }
  .main_btn .decoration img {
    position: absolute;
    width: 9.6vh;
    top: -0.3vh;
  }
  .main_btn .decoration img:nth-child(1) {
    left: -4.6vh;
  }
  .main_btn .decoration img:nth-child(2) {
    right: -4.6vh;
  }
  
  a {
    text-decoration: none;
  }
  
  @keyframes scale-streams {
    0% {
      transform: scale(1);
      text-shadow: 0vh 0vh 2vh rgb(119, 190, 238);
    }
    50% {
      transform: scale(1.2);
      text-shadow: 0vh 0vh 3vh rgb(209, 233, 252);
    }
    100% {
      transform: scale(1);
      text-shadow: 0vh 0vh 2vh rgb(119, 190, 238);
    }
  }
  @keyframes margin-streams-top {
    0% {
      margin-top: 2.2vh;
    }
    50% {
      margin-top: 3vh;
    }
    100% {
      margin-top: 2.2vh;
    }
  }
  @keyframes margin-streams-bottom {
    0% {
      margin-bottom: 2.2vh;
    }
    50% {
      margin-bottom: 3vh;
    }
    100% {
      margin-bottom: 2.2vh;
    }
  }
  .streams {
    position: fixed;
    right: -30vh;
    height: 100vh;
    display: flex;
    align-items: center;
    z-index: 1003;
    transition: 0.5s;
  }
  .streams.active {
    right: 0;
  }
  .streams.active .streams_icon .fa-xmark {
    display: block;
  }
  .streams.active .streams_icon .fa-youtube {
    display: none;
  }
  .streams.active .streams_icon::before {
    opacity: 1;
    pointer-events: all;
  }
  .streams_icon {
    margin-right: 3vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
  }
  .streams_icon:hover span {
    opacity: 1 !important;
  }
  .streams_icon::before {
    content: "";
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background-color: rgba(21, 19, 15, 0.85);
    opacity: 0;
    pointer-events: none;
  }
  .streams_icon .fa-xmark {
    display: none;
  }
  .streams_icon i {
    color: white;
    font-size: 3.2vh;
    position: relative;
    z-index: 1;
    text-shadow: 0vh 0vh 2vh rgb(119, 190, 238);
    animation: scale-streams 2s infinite linear;
  }
  .streams_icon span:nth-child(1) {
    opacity: 0.4;
    height: 10vh;
    width: 0.2vh;
    background: linear-gradient(rgba(255, 255, 255, 0), white);
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 2.2vh;
    animation: margin-streams-bottom 2s infinite linear;
  }
  .streams_icon span:nth-child(1)::before {
    content: "";
    position: absolute;
    bottom: -1vh;
    width: 0.5vh;
    height: 0.5vh;
    transform: rotate(45deg);
    border: 0.3vh solid white;
  }
  .streams_icon span:nth-child(4) {
    opacity: 0.4;
    height: 10vh;
    width: 0.2vh;
    background: linear-gradient(rgb(255, 255, 255), rgba(255, 255, 255, 0));
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2.2vh;
    animation: margin-streams-top 2s infinite linear;
  }
  .streams_icon span:nth-child(4)::before {
    content: "";
    position: absolute;
    top: -1vh;
    width: 0.5vh;
    height: 0.5vh;
    transform: rotate(45deg);
    border: 0.3vh solid white;
  }
  .streams_list {
    width: 30vh;
    padding: 2vh;
    border-left: 0.2vh solid rgba(112, 128, 138, 0.362);
    height: 100vh;
    background-color: rgba(31, 41, 47, 0.852);
    overflow-y: scroll;
    position: relative;
    z-index: 1;
  }
  .streams_list::-webkit-scrollbar {
    width: 0;
  }
  .streams_list iframe {
    width: 100%;
    height: 14vh;
    margin-bottom: 1.5vh;
  }
  
  .start {
    height: 55vh;
    width: 100%;
    position: relative;
    z-index: 2;
    overflow: hidden;
  }
  .start_bg {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0;
  }
  .start .line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 0.2vh;
    background-color: rgba(112, 128, 138, 0.501);
    z-index: 3;
    pointer-events: none;
  }
  .start .line img {
    position: absolute;
    width: 80vh;
  }
  .start__thumbs {
    position: absolute;
    width: 40%;
    margin-left: auto;
    margin-right: auto;
    right: 0;
    left: 0;
    bottom: 8vh;
    z-index: 15;
  }
  .start__thumbs .swiper-slide {
    color: white;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    filter: grayscale(100%);
    transform: scale(0.8);
    transition: 0.5s;
    cursor: pointer;
  }
  .start__thumbs .swiper-slide-thumb-active {
    transform: scale(1);
    filter: grayscale(0%);
    opacity: 1;
  }
  .start__thumbs .swiper-slide-thumb-active p {
    color: rgb(205, 205, 205) !important;
    top: 10.5vh !important;
  }
  .start__thumbs .swiper-slide-thumb-active .circle .circle-1 span {
    animation: circle 3s linear;
    opacity: 1 !important;
  }
  .start__thumbs .swiper-slide-thumb-active .circle .circle-2 span {
    animation: circle2 6s linear;
    display: flex !important;
  }
  .start__thumbs .swiper-slide:hover {
    filter: grayscale(0%);
    opacity: 1;
  }
  .start__thumbs .swiper-slide:hover p {
    color: rgb(205, 205, 205) !important;
  }
  .start__thumbs .swiper-slide p {
    position: absolute;
    transition: 0.5s;
    top: 9.9vh;
    font-size: 1.8vh;
    width: 80%;
    margin: 0 auto;
    color: gray;
  }
  .start__thumbs .swiper-slide .circle {
    position: absolute;
    width: 10.5vh;
    height: 10.5vh;
    border-radius: 100%;
    margin: 0;
  }
  .start__thumbs .swiper-slide .circle .circle-1 {
    display: flex;
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    clip-path: polygon(100% 0, 50% 0, 50% 100%, 100% 100%);
  }
  .start__thumbs .swiper-slide .circle .circle-1 span {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    border: 0.4vh solid rgb((79, 164, 214));
    border-radius: 100%;
    clip-path: polygon(100% 0, 50% 0, 50% 100%, 100% 100%);
    opacity: 0;
  }
  .start__thumbs .swiper-slide .circle .circle-2 {
    display: flex;
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    border-radius: 100%;
    clip-path: polygon(50% 0, 0 0, 0 100%, 50% 100%);
  }
  .start__thumbs .swiper-slide .circle .circle-2 span {
    position: absolute;
    width: 100%;
    height: 100%;
    display: none;
    border: 0.4vh solid rgb(79, 164, 214);
    border-radius: 100%;
    clip-path: polygon(50% 0, 0 0, 0 100%, 50% 100%);
  }
  .start__thumbs .swiper-slide div {
    border-radius: 100%;
    width: 8vh;
    height: 8vh;
    overflow: hidden;
    position: relative;
    z-index: 1;
    border: 0.3vh solid rgb(134, 180, 211);
  }
  .start__thumbs .swiper-slide div img {
    width: 100%;
  }
  .start__decoration {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    top: 0;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
  }
  .start__decoration::before {
    content: "";
    width: 100%;
    height: 0.1vh;
    background-color: rgba(112, 128, 138, 0.3);
    position: absolute;
    bottom: 12vh;
    z-index: 2;
  }
  .start__decoration h1 {
    position: absolute;
    top: 31vh;
    font-size: 80vh;
    line-height: 80vh;
    letter-spacing: 6vh;
    opacity: 0.03;
    display: none;
    color: rgb(45, 81, 102);
  }
  .start__decoration img:nth-child(1) {
    width: 150%;
    position: absolute;
    top: -75vh;
    opacity: 0.15;
    transform: rotate(180deg);
  }
  .start__decoration img:nth-child(2) {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    opacity: 0.3;
    filter: blur(0vh);
  }
  .start__video {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .start__video .swiper-slide {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 6vh;
  }
  .start__video .swiper-slide-active h1 {
    opacity: 1 !important;
    transform: translateY(0) !important;
  }
  .start__video .swiper-slide-active p {
    transform: translateY(0vh) !important;
    opacity: 1 !important;
  }
  .start__video .swiper-slide-active a {
    transform: translateY(0vh) scale(0.9) !important;
    opacity: 1 !important;
  }
  .start__video .swiper-slide h1 {
    color: white;
    position: relative;
    z-index: 3;
    opacity: 0;
    transform: translateY(10vh);
    transition: 1.5s;
    margin-bottom: 0.5vh;
    font-size: 7vh;
    text-shadow: 0vh 1.5vh 3vh rgba(20, 15, 7, 0.8);
  }
  .start__video .swiper-slide h1 span {
    color: rgba(255, 255, 255, 0.4);
  }
  .start__video .swiper-slide a {
    position: relative;
    z-index: 5;
    opacity: 0;
    transform: translateY(10vh) scale(0.9);
    transition: 2s !important;
  }
  .start__video .swiper-slide p {
    color: rgba(255, 255, 255, 0.562);
    font-size: 2.5vh;
    transform: translateY(10vh);
    width: 40%;
    transition: 2s;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    opacity: 0;
    text-align: center;
  }
  .start__video .swiper-slide::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(2, 0, 36, 0);
    background: radial-gradient(circle, rgba(0, 0, 0, 0) 0%, rgb(17, 29, 34) 50%, rgb(16, 31, 38) 100%);
    z-index: 2;
    top: 0;
    pointer-events: none;
    display: none;
  }
  .start__video .swiper-slide::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0.308), rgba(16, 24, 29, 0.862), rgba(16, 24, 29, 0.99));
    z-index: 2;
    top: 0;
    pointer-events: none;
    display: none;
  }
  .start__video video {
    top: 0;
    position: absolute;
    width: 101%;
    top: -0.2vh;
    z-index: -1;
  }
  .start__title {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 0vh;
    z-index: 2;
  }
  .start__title img {
    width: 60vh;
    opacity: 0.9;
  }
  .start__title h1 {
    color: rgba(52, 174, 255, 0.848);
    font-size: 2vh;
    font-weight: normal;
    text-transform: uppercase;
    letter-spacing: 1.5vh;
    margin-bottom: 1vh;
  }
  
  @keyframes circle {
    0% {
      stroke-dashoffset: 1000;
    }
    100% {
      stroke-dashoffset: 670;
    }
  }
  html, body {
    overflow-x: hidden;
  }
  
  .game {
    background-color: rgb(25, 36, 43);
    overflow: hidden;
    background: url(../images/bg/2.png) top/cover no-repeat;
  }
  .game .systems {
    text-align: center;
    position: relative;
    padding: 8vh 0vh 20vh 0vh;
    border-top: 0.2vh solid rgba(255, 255, 255, 0.04);
  }
  .game .systems__title {
    position: relative;
    margin-bottom: 8vh;
  }
  .game .systems__title h1 {
    color: rgb(203, 226, 237);
    text-shadow: 0vh 1vh 2vh rgba(0, 0, 0, 0.422);
    font-size: 7vh;
  }
  .game .systems__box {
    position: relative;
    width: 35vh;
    margin: 0 auto;
  }
  .game .systems__box .swiper-scrollbar {
    display: none;
    bottom: -9vh;
    background-color: rgba(255, 255, 255, 0.1) !important;
  }
  .game .systems__box .swiper-scrollbar-drag {
    background-color: rgb(91, 143, 167);
  }
  .game .systems__box .swiper-slide {
    padding: 0vh 1vh;
    transition: 0.5s;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .game .systems__box .swiper-slide:hover {
    transform: scale(1.05);
  }
  .game .systems__box .swiper-slide:hover h1 {
    color: white;
  }
  .game .systems__box .swiper-slide:hover .img span {
    border: 0.4vh solid rgb(189, 226, 241);
    box-shadow: inset 0vh 0vh 2.5vh rgba(179, 213, 245, 0.733);
  }
  .game .systems__box .swiper-slide:hover .btn span:nth-child(1) {
    border: 0.2vh solid white;
    box-shadow: inset 0vh 0vh 1.5vh rgb(179, 230, 245);
  }
  .game .systems__box .swiper-slide:hover .btn span:nth-child(1) i {
    transform: rotate(-180deg);
  }
  .game .systems__box .swiper-slide:hover .btn span:nth-child(2) {
    transform: rotate(180deg);
  }
  .game .systems__box .swiper-slide .img {
    width: 16vh;
    height: 16vh;
    overflow: hidden;
    border-radius: 100%;
    margin: 0 auto;
    margin-bottom: 4vh;
    padding: 1.5vh;
    box-shadow: 0vh 2vh 4vh rgba(0, 0, 0, 0.232);
    background-color: rgba(0, 0, 0, 0);
    border: 0.2vh solid rgb(45, 84, 102);
    transition: 0.5s;
  }
  .game .systems__box .swiper-slide .img span {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    display: flex;
    border: 0.4vh solid rgb(80, 138, 161);
    transition: 0.5s;
  }
  .game .systems__box .swiper-slide h1 {
    color: rgb(139, 160, 173);
    font-size: 2.3vh;
    transition: 0.5s;
    width: 80%;
    margin: 0 auto;
    margin-bottom: 3vh;
  }
  .game .systems__box .swiper-slide .btn {
    position: relative !important;
    display: flex;
    width: 6vh;
    height: 6vh;
    border-radius: 10vh;
    background-color: black;
    justify-content: center;
    align-items: center;
    font-size: 2vh;
    color: white;
    border: 0.3vh solid rgb(162, 180, 187);
    padding: 0.6vh;
  }
  .game .systems__box .swiper-slide .btn span:nth-child(1) {
    background-color: rgba(60, 113, 137, 0.814);
    width: 100%;
    height: 100%;
    border-radius: 10vh;
    display: flex;
    align-items: center;
    transition: 0.5s;
    justify-content: center;
    border: 0.2vh solid rgb(152, 186, 200);
  }
  .game .systems__box .swiper-slide .btn span:nth-child(1) i {
    transition: 0.5s;
  }
  .game .systems__box .swiper-slide .btn span:nth-child(2) {
    opacity: 0.6;
    transition: 0.5s;
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
    z-index: -1;
    top: 0;
  }
  .game .systems__box .swiper-slide .btn span:nth-child(2) img {
    position: absolute;
    width: 6vh;
  }
  .game .systems__box .swiper-slide .btn span:nth-child(2) img:nth-child(1) {
    left: -3.8vh;
  }
  .game .systems__box .swiper-slide .btn span:nth-child(2) img:nth-child(2) {
    right: -3.8vh;
  }
  .game .why {
    padding: 15vh 0vh 12vh 0vh;
  }
  .game .why__title {
    text-align: center;
    margin-bottom: 9vh;
  }
  .game .why__title img {
    width: 70vh;
    opacity: 0.4;
  }
  .game .why__title h1 {
    text-align: center;
    color: rgb(203, 229, 237);
    text-shadow: 0vh 1vh 2vh rgba(0, 0, 0, 0.422);
    font-size: 7vh;
    margin-bottom: 2vh;
    line-height: 8vh;
  }
  .game .why .tabs {
    display: flex;
    height: 40vh;
    width: 140vh;
    margin: 0 auto;
    justify-content: space-between;
  }
  .game .why .tab {
    width: 50%;
    height: 100%;
    overflow: hidden;
    border: 0.2vh solid rgba(85, 106, 116, 0.825);
    box-shadow: 0vh 5vh 6vh rgba(0, 0, 0, 0.2);
    position: relative;
    animation: tabs--home 1s;
  }
  .game .why .tab::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: linear-gradient(rgba(0, 0, 0, 0.052), rgba(0, 0, 0, 0.729));
  }
  .game .why .tab .decoration {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }
  .game .why .tab .decoration img {
    width: 22vh;
    height: auto;
    position: absolute;
  }
  .game .why .tab .decoration img:nth-child(1) {
    left: 0;
    top: 0;
  }
  .game .why .tab .decoration img:nth-child(2) {
    right: 0;
    bottom: 0;
    transform: rotate(180deg);
  }
  .game .why .tab .decoration img:nth-child(3) {
    right: -1.4vh;
    top: 1.4vh;
    transform: rotate(90deg);
  }
  .game .why .tab .decoration img:nth-child(4) {
    left: -1.4vh;
    bottom: 1.4vh;
    transform: rotate(-90deg);
  }
  .game .why .tab img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .game .why .tab_nav {
    width: 55%;
    padding: 0vh 0vh 0vh 8vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .game .why .tab_nav li:not(:last-child) {
    margin-bottom: 3.4vh;
  }
  .game .why .tab_nav li {
    text-align: left;
  }
  .game .why .tab_nav li.active span {
    color: white;
  }
  .game .why .tab_nav li.active span div img {
    opacity: 1;
  }
  .game .why .tab_nav li.active span i {
    transform: rotate(180deg);
  }
  .game .why .tab_nav li:hover span {
    color: rgb(255, 255, 255);
  }
  .game .why .tab_nav li span {
    font-size: 2.8vh;
    color: gray;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: 0.5s;
  }
  .game .why .tab_nav li span div {
    display: flex;
    align-items: center;
  }
  .game .why .tab_nav li span div img {
    width: 3.2vh;
    margin-right: 2vh;
    opacity: 0.6;
  }
  .game .why .tab_nav li span i {
    font-size: 1.5vh;
    transition: 0.5s;
  }
  .game .why .tab_nav li p {
    display: none;
    color: rgb(199, 210, 221);
    font-size: 2vh;
    padding: 1.5vh 0vh;
    width: 95%;
    line-height: 2.5vh;
  }
  
  .projects_discussion {
    padding: 18vh 0vh;
    background-color: rgb(17, 23, 27);
    text-align: center;
    position: relative;
    box-shadow: 0vh 0vh 9vh rgba(0, 0, 0, 0.118);
    background: url(https://nirvanapw.online/images/bg/6.png) top/cover no-repeat;
  }
  .projects_discussion .line {
    position: absolute;
    top: 0;
    opacity: 0.3;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 0.2vh;
    background-color: rgba(112, 133, 138, 0.701);
  }
  .projects_discussion .line img {
    position: absolute;
    width: 80vh;
  }
  
  .discussion {
    border-top: 0.2vh solid rgba(255, 255, 255, 0.052);
    width: 140vh;
    margin: 0 auto;
    padding-top: 8vh;
    margin-top: 10vh;
  }
  .discussion h1 {
    color: rgb(203, 227, 237);
    text-shadow: 0vh 1vh 2vh rgba(0, 0, 0, 0.422);
    font-size: 5vh;
    margin-bottom: 4vh;
  }
  .discussion .secon_btn {
    width: 25vh;
    height: 5vh;
  }
  .discussion .secon_btn span {
    font-size: 2vh;
  }
  .discussion .secon_btn span::before {
    content: "";
    top: 0;
    width: 80%;
    height: 100%;
    clip-path: polygon(10% 0, 90% 0, 100% 50%, 90% 100%, 10% 100%, 0% 50%);
    position: absolute;
    background-color: rgba(166, 202, 217, 0.2);
  }
  .discussion_list {
    display: flex;
    gap: 4vh;
    margin-bottom: 5vh;
  }
  .discussion_list a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4vh;
    border-radius: 0.8vh;
    position: relative;
    border: 0.2vh solid rgba(69, 107, 118, 0.3);
    background-color: rgba(112, 127, 138, 0.078);
  }
  .discussion_list a:hover span:nth-child(1) i {
    color: rgba(255, 255, 255, 0.503);
  }
  .discussion_list a:hover::before {
    height: 100%;
    opacity: 1;
  }
  .discussion_list a::before {
    content: "";
    opacity: 1;
    width: 100%;
    height: 0%;
    top: 0;
    position: absolute;
    background-color: rgba(69, 105, 118, 0.3);
    border-radius: 0.8vh;
    opacity: 0;
  }
  .discussion_list a span {
    position: relative;
    z-index: 1;
  }
  .discussion_list a span:NTh-child(1) {
    display: flex;
    margin-right: 2.5vh;
  }
  .discussion_list a span:NTh-child(1) i {
    font-size: 4vh;
    color: rgb(64, 82, 88);
  }
  .discussion_list a span:nth-child(2) {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .discussion_list a span:nth-child(2) div:nth-child(1) {
    margin-bottom: 0.3vh;
  }
  .discussion_list a span:nth-child(2) div:nth-child(1) p {
    color: white;
    font-size: 2.2vh;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
  }
  .discussion_list a span:nth-child(2) div:nth-child(2) {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .discussion_list a span:nth-child(2) div:nth-child(2) p {
    color: gray;
  }
  .discussion_list a span:nth-child(2) div:nth-child(2) p strong {
    font-size: 1.8vh;
    font-weight: normal;
    color: rgb(155, 184, 194);
  }
  
  .projects h1 {
    color: rgb(203, 228, 237);
    text-shadow: 0vh 1vh 2vh rgba(0, 0, 0, 0.422);
    font-size: 7vh;
    margin-bottom: 6vh;
  }
  .projects_list {
    width: 100%;
    margin: 0 auto;
  }
  .projects_list .swiper-wrapper {
    transition-timing-function: linear !important;
  }
  .projects_list .swiper-slide {
    padding: 0vh 2vh;
    height: 30vh;
  }
  .projects_list .swiper-slide div {
    background-color: rgba(255, 255, 255, 0);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0vh 2vh 2vh 2vh;
    position: relative;
    height: 100%;
    background-color: rgba(66, 66, 66, 0);
    border: 0.2vh solid rgba(255, 255, 255, 0.099);
    transition: 0.5s;
  }
  .projects_list .swiper-slide div:hover {
    background-color: rgba(78, 73, 63, 0.178);
  }
  .projects_list .swiper-slide div .project_logo {
    height: 18vh;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .projects_list .swiper-slide div .project_logo img {
    width: 20vh;
  }
  .projects_list .swiper-slide div .project_link a {
    color: rgb(112, 173, 190);
    text-transform: uppercase;
    font-size: 1.8vh;
    display: inline-flex;
    align-items: center;
    letter-spacing: 0.2vh;
  }
  .projects_list .swiper-slide div .project_link a:hover {
    color: white;
  }
  .projects_list .swiper-slide div .project_link a:hover i {
    color: white;
  }
  .projects_list .swiper-slide div .project_link a i {
    font-size: 1.5vh;
    margin-left: 0.7vh;
    position: relative;
    top: 0.1vh;
  }
  .projects_list .swiper-slide div .project_name {
    font-size: 2.7vh;
    color: rgba(255, 255, 255, 0.744);
    margin-bottom: 1vh;
  }
  .projects_list .swiper-slide div .decoration {
    position: absolute;
    opacity: 0.3;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
  }
  .projects_list .swiper-slide div .decoration img {
    width: 12vh;
    height: auto;
    position: absolute;
  }
  .projects_list .swiper-slide div .decoration img:nth-child(1) {
    left: 0;
    top: 0;
  }
  .projects_list .swiper-slide div .decoration img:nth-child(2) {
    right: 0;
    bottom: 0;
    transform: rotate(180deg);
  }
  .projects_list .swiper-slide div .decoration img:nth-child(3) {
    right: -0.75vh;
    top: 0.75vh;
    transform: rotate(90deg);
  }
  .projects_list .swiper-slide div .decoration img:nth-child(4) {
    left: -0.8vh;
    bottom: 0.75vh;
    transform: rotate(-90deg);
  }
  
  .offers {
    text-align: center;
    padding: 15vh 0vh;
    background-color: rgb(24, 33, 39);
    position: relative;
    background: url(../images/bg/3.png) top/cover no-repeat;
    z-index: 2;
  }
  .offers .line {
    position: absolute;
    width: 100%;
    height: 0.2vh;
    background-color: rgba(85, 122, 134, 0.477);
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .offers .line img {
    position: absolute;
    width: 80vh;
  }
  .offers__faq {
    border-top: 0.2vh solid rgba(255, 255, 255, 0.086);
    width: 130vh;
    margin: 0 auto;
    margin-top: 8vh;
    padding-top: 8vh;
    text-align: left;
  }
  .offers__faq h1 {
    font-size: 3vh;
    color: rgb(225, 225, 225);
    margin-bottom: 3vh;
  }
  .offers__faq .faq li:not(:last-child) {
    margin-bottom: 2vh;
  }
  .offers__faq .faq li {
    cursor: pointer;
  }
  .offers__faq .faq li:hover div {
    color: rgb(203, 203, 203);
  }
  .offers__faq .faq li.active span div {
    color: white;
  }
  .offers__faq .faq li.active span div img {
    opacity: 1;
  }
  .offers__faq .faq li.active span i {
    transform: rotate(180deg);
  }
  .offers__faq .faq li span {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .offers__faq .faq li span div {
    display: flex;
    align-items: center;
    font-size: 2.4vh;
    color: gray;
    transition: 0.5s;
  }
  .offers__faq .faq li span div img {
    width: 4vh;
    opacity: 0.5;
    margin-right: 1vh;
    transition: 0.5s;
  }
  .offers__faq .faq li span i {
    color: rgba(255, 255, 255, 0.621);
    font-size: 1.5vh;
    transition: 0.5s;
  }
  .offers__faq .faq li p {
    display: none;
    padding: 1vh 10vh 1vh 5vh;
    color: rgb(124, 140, 147);
    font-size: 1.8vh;
  }
  .offers__title {
    margin-bottom: 10vh;
  }
  .offers__title h1 {
    font-size: 8vh;
    color: rgb(203, 227, 237);
    text-shadow: 0vh 2vh 3vh rgba(0, 0, 0, 0.3);
  }
  .offers__box {
    width: 140vh;
    margin: 0 auto;
  }
  .offers__box .swiper-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0vh 5vh;
  }
  .offers__box .swiper-slide .offers__img {
    width: 100%;
    height: 22vh;
    background-color: rgba(61, 82, 88, 0.156);
    border: 0.2vh solid rgba(85, 109, 116, 0.825);
    margin-bottom: 4vh;
    position: relative;
    border-radius: 0.8vh;
    box-shadow: 0vh 2vh 4vh rgba(0, 0, 0, 0.29);
  }
  .offers__box .swiper-slide .offers__img .decoration {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }
  .offers__box .swiper-slide .offers__img .decoration img {
    width: 22vh;
    height: auto;
    position: absolute;
  }
  .offers__box .swiper-slide .offers__img .decoration img:nth-child(1) {
    left: -0.2vh;
    top: -0.2vh;
  }
  .offers__box .swiper-slide .offers__img .decoration img:nth-child(2) {
    right: -0.2vh;
    bottom: -0.2vh;
    transform: rotate(180deg);
  }
  .offers__box .swiper-slide .offers__img .decoration img:nth-child(3) {
    right: -1.4vh;
    top: 1.2vh;
    transform: rotate(90deg);
  }
  .offers__box .swiper-slide .offers__img .decoration img:nth-child(4) {
    left: -1.4vh;
    bottom: 1.2vh;
    transform: rotate(-90deg);
  }
  .offers__box .swiper-slide .offers__items {
    position: relative;
    width: 100%;
    z-index: 1;
    cursor: pointer;
  }
  .offers__box .swiper-slide .offers__items:hover ul {
    transform: scaleY(100%);
  }
  .offers__box .swiper-slide .offers__items:hover ul li span {
    top: 0;
  }
  .offers__box .swiper-slide .offers__items:hover span {
    top: 3.5vh;
  }
  .offers__box .swiper-slide .offers__items:hover span i {
    transform: rotate(180deg);
  }
  .offers__box .swiper-slide .offers__items ul {
    position: absolute;
    transform: scaleY(0);
    transform-origin: top;
    transition: 0.5s;
    top: 0;
    width: 100%;
    background-color: rgb(39, 48, 55);
    padding: 9vh 4vh 4vh 4vh;
    border-radius: 0.7vh;
    border: 0.2vh solid rgba(109, 124, 134, 0.675);
    box-shadow: 0vh 3vh 4vh rgba(0, 0, 0, 0.3);
  }
  .offers__box .swiper-slide .offers__items ul .decoration {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    pointer-events: none;
  }
  .offers__box .swiper-slide .offers__items ul .decoration img {
    position: absolute;
    width: 18vh;
  }
  .offers__box .swiper-slide .offers__items ul .decoration img:nth-child(1) {
    left: 0;
    top: 0;
  }
  .offers__box .swiper-slide .offers__items ul .decoration img:nth-child(2) {
    right: 0;
    bottom: 0;
    transform: rotate(180deg);
  }
  .offers__box .swiper-slide .offers__items ul .decoration img:nth-child(3) {
    right: -1.2vh;
    top: 1vh;
    transform: rotate(90deg);
  }
  .offers__box .swiper-slide .offers__items ul .decoration img:nth-child(4) {
    left: -1.2vh;
    bottom: 1vh;
    transform: rotate(-90deg);
  }
  .offers__box .swiper-slide .offers__items ul li:not(:last-child) {
    margin-bottom: 3vh;
  }
  .offers__box .swiper-slide .offers__items ul li {
    font-size: 2.1vh;
    color: rgb(192, 192, 192);
    display: flex;
    align-items: center;
    justify-content: start;
    width: 100%;
    text-align: left;
  }
  .offers__box .swiper-slide .offers__items ul li span {
    width: 4vh;
    height: 4vh;
    border-radius: 0.5vh;
    margin-right: 1.8vh;
    border: 0.2vh solid rgb(134, 173, 201);
  }
  .offers__box .swiper-slide .offers__items span {
    color: rgb(145, 201, 229);
    font-size: 2vh;
    text-transform: uppercase;
    display: flex;
    justify-content: center;
    align-items: center;
    letter-spacing: 0.2vh;
    width: 100%;
    z-index: 1;
    position: relative;
    cursor: pointer;
    transition: 0.5s;
    top: 0;
  }
  .offers__box .swiper-slide .offers__items span i {
    margin-left: 1vh;
    font-size: 1.5vh;
    transition: 0.5s;
    color: rgba(145, 207, 229, 0.495);
  }
  .offers__box .swiper-slide .offers__buy {
    width: 100%;
    margin-bottom: 4vh;
  }
  .offers__box .swiper-slide .offers__buy h1 {
    color: rgb(230, 230, 230);
    font-size: 4vh;
    margin-bottom: 2vh;
  }
  .offers__box .swiper-slide .offers__buy button {
    cursor: pointer;
    width: 80%;
    font-family: "Maron Rose";
    height: 7vh;
    border-radius: 10vh;
    background: linear-gradient(120deg, rgb(35, 79, 98), rgb(29, 51, 61));
    display: inline-flex;
    align-items: center;
    position: relative;
    border: 0.3vh solid rgb(153, 185, 199);
    padding: 0.8vh;
    transition: 0.5s;
  }
  .offers__box .swiper-slide .offers__buy button:hover {
    transform: scale(1.05);
  }
  .offers__box .swiper-slide .offers__buy button:hover span {
    border: 0.2vh solid rgb(255, 255, 255);
    box-shadow: inset 0vh 0vh 2vh rgb(229, 250, 255);
  }
  .offers__box .swiper-slide .offers__buy button:hover span::before {
    background-color: rgba(149, 187, 212, 0.6);
    position: absolute;
  }
  .offers__box .swiper-slide .offers__buy button span {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    font-size: 2.3vh;
    color: white;
    transition: 0.5s;
    border-radius: 10vh;
    letter-spacing: 0.1vh;
    position: relative;
    border: 0.2vh solid rgb(179, 213, 245);
    background-color: rgb(82, 122, 154);
  }
  .offers__box .swiper-slide .offers__buy button span p {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
  }
  .offers__box .swiper-slide .offers__buy button span i {
    z-index: 1;
    font-size: 1.5vh;
    margin-left: 0.5vh;
  }
  .offers__box .swiper-slide .offers__buy button span::before {
    content: "";
    top: 0;
    width: 76%;
    height: 100%;
    clip-path: polygon(10% 0, 90% 0, 100% 50%, 90% 100%, 10% 100%, 0% 50%);
    position: absolute;
    background-color: rgba(149, 187, 212, 0.36);
  }
  .offers__box .swiper-slide .offers__buy button .decoration {
    position: absolute;
    left: 0;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    top: -0.3vh;
  }
  .offers__box .swiper-slide .offers__buy button .decoration img {
    position: absolute;
    z-index: 0;
    width: 8vh;
  }
  .offers__box .swiper-slide .offers__buy button .decoration img:nth-child(1) {
    left: -3.8vh;
  }
  .offers__box .swiper-slide .offers__buy button .decoration img:nth-child(2) {
    right: -3.8vh;
  }
  
  footer {
    padding: 15vh 0vh 8vh 0;
    text-align: center;
    position: relative;
    background: url(../images/bg/2.png) top/cover no-repeat;
    z-index: 2;
  }
  footer .line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 0.2vh;
    background-color: rgba(112, 128, 138, 0.3);
  }
  footer .line img {
    position: absolute;
    width: 80vh;
  }
  footer .right {
    width: 120vh;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding-top: 5vh;
  }
  footer .right img {
    width: 18vh;
    margin-bottom: 3vh;
  }
  footer .right ul {
    display: flex;
    margin-bottom: 1vh;
  }
  footer .right ul li {
    margin: 0vh 2.5vh;
  }
  footer .right ul li a {
    font-size: 1.8vh;
    color: rgba(255, 255, 255, 0.5);
  }
  footer .right ul li a:hover {
    color: rgb(118, 199, 236);
  }
  footer .right span {
    color: rgba(255, 255, 255, 0.2);
    font-size: 1.7vh;
  }
  footer .stay h1 {
    color: white;
    font-size: 6vh;
    text-transform: uppercase;
    letter-spacing: 0.3vh;
    margin-bottom: 4vh;
  }
  footer .stay div a {
    color: white;
    font-size: 2vh;
    margin: 0vh 3vh;
    display: inline-flex;
    position: relative;
    display: inline-flex;
    width: 8vh;
    align-items: center;
    justify-content: center;
    height: 8vh;
    border-radius: 100%;
    padding: 0.7vh;
    background-color: rgba(0, 0, 0, 0);
    border: 0.3vh solid rgb(147, 164, 169);
  }
  footer .stay div a:hover span {
    box-shadow: inset 0vh 0vh 2vh rgb(179, 222, 245);
  }
  footer .stay div a:hover span i {
    transform: rotate(360deg);
  }
  footer .stay div a:hover .decoration {
    transform: rotate(-90deg);
  }
  footer .stay div a span {
    width: 100%;
    transition: 0.5s;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    border-radius: 100%;
    background-color: rgba(75, 121, 139, 0.567);
    border: 0.3vh solid rgba(192, 207, 213, 0.816);
  }
  footer .stay div a i {
    transition: 0.5s;
  }
  footer .stay div a .decoration {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    left: 0;
    z-index: 0;
    transition: 0.5s;
  }
  footer .stay div a .decoration img {
    position: absolute;
    width: 11vh;
    opacity: 0.6;
  }
  
  .circle--animate--reverse {
    animation: circle--animate--reverse 12s infinite linear;
  }
  
  .circle--animate {
    animation: circle--animate 12s infinite linear;
  }
  
  @keyframes tabs--home {
    0% {
      opacity: 0;
      transform: scale(1.15);
      filter: blur(0.5vh);
    }
    100% {
      opacity: 1;
      filter: blur(0vh);
      transform: scale(1);
    }
  }
  @keyframes tabs--intro {
    0% {
      opacity: 0;
      transform: translateX(-8vh);
      filter: blur(0.5vh);
    }
    100% {
      opacity: 1;
      filter: blur(0vh);
      transform: translateX(0vh);
    }
  }
  .tabs {
    text-align: center;
  }
  .tabs .tab_nav li span {
    cursor: pointer;
  }
  .tabs .tab {
    display: none;
  }
  .tabs .tab.active {
    display: block;
  }/*# sourceMappingURL=style.css.map */