@charset "UTF-8";
.header {
  background-image: url("../../img/vline.webp"), url("../../img/bgc1.webp");
  background-size: cover;
  height: 406px;
  position: relative;
  width: 100%;
  z-index: 2;
}
.header .container {
  width: 1280px;
  margin-left: auto;
  margin-right: auto;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
}
.header__container {
  max-width: 1280px;
  margin: 0 auto;
  height: 100%;
  position: relative;
}
.header__inner {
  height: 406px;
  display: flex;
  flex-flow: row wrap;
  position: relative;
  z-index: 2;
}
.header .menu {
  padding-top: 20px;
  height: 30px;
  width: 80%;
  display: flex;
  flex-flow: row wrap;
}
.header .menu ul {
  display: flex;
  list-style-type: none;
  margin-left: 15px;
}
.header .menu li {
  margin-right: 42px;
  position: relative;
}
.header .menu li:hover .submenu {
  transform: scaleY(1);
}
.header .menu a {
  color: #FEB61D;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.2);
  transition: all 0.2s ease;
}
.header .menu a:hover {
  color: rgb(254.2246696035, 198.4008810573, 79.7753303965);
  text-shadow: 0 0 10px rgba(254.449339207, 214.8017621145, 130.550660793, 0.8), 0 0 20px rgba(254.449339207, 214.8017621145, 130.550660793, 0.4);
  transform: scale(1.02);
}
.header .menu a {
  font-family: "Involve", sans-serif;
  font-size: 25px;
  font-weight: 600;
  line-height: 35px;
  color: #78DBA0;
  cursor: pointer;
  text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.5);
}
.header .menu a:hover {
  opacity: 0.8;
  text-shadow: 3px 3px 0px rgba(0, 0, 0, 0.7);
  transform: scale(1.05);
}
.header .submenu {
  display: flex;
  position: absolute;
  width: 260px;
  height: 170px;
  background: rgba(72, 220, 189, 0.7);
  backdrop-filter: blur(3px);
  border-radius: 10px;
  flex-direction: column;
  top: 100%;
  left: 0;
  transform: scaleY(0);
  transform-origin: 0 0;
  margin: 10px -78px;
  transition: 0.12s ease-in-out;
  z-index: 10;
}
.header .submenu li {
  width: 224px;
  height: 40px;
  margin: 15px auto 0;
  line-height: 40px;
  border-radius: 7px;
  border: 1px solid #feb31c;
  background: #001c24;
  padding: 0 10px;
  overflow: hidden;
  cursor: default;
}
.header .submenu li:last-child {
  margin-bottom: 18px;
}
.header .submenu p {
  font-size: 11px;
  color: rgb(254.1118421053, 187.5, 53.3881578947);
  line-height: 13px;
}
.header .submenu a {
  font-size: 15px;
  color: #ffffff;
  padding: 0 10px;
}
.header .submenu span:first-child {
  height: 25px;
  margin-left: 50px;
  color: rgb(254.0447368421, 182.4, 38.1552631579);
  font-size: 18px;
  line-height: 25px;
  font-weight: 500;
}
.header .x,
.header .x_1 {
  transition: 0.12s ease-in-out;
}
.header .show.x,
.header .show.x_1 {
  font-size: 30px;
  font-weight: 600;
  height: auto;
  display: block;
  margin-bottom: 10px;
  overflow: auto;
}
.header .show.x p,
.header .show.x_1 p {
  font-size: 13px;
  line-height: 15px;
}
.header .x a,
.header .x_1 a {
  width: fit-content;
  height: 37px;
  display: inline-block;
  margin-top: 18px;
  margin-bottom: 15px;
  border-radius: 5px;
  border: 1px solid #feb31c;
  cursor: pointer;
  transition: background 0.2s;
}
.header .x a:hover,
.header .x_1 a:hover {
  background: #228b22;
  color: white;
}
.header .links {
  width: 143px;
  height: 110px;
  margin: 30px 0 0 8px;
}
.header .links .social {
  height: 45px;
  display: flex;
}
.header .links .social a,
.header .links .social img {
  width: 43px;
  height: 43px;
  transition: transform 0.2s ease;
  padding: 2px;
}
.header .links .social a:hover,
.header .links .social img:hover {
  transform: scale(1.1);
}
.header .links .social .tg,
.header .links .social .vk {
  margin-right: 15px;
}
.header .links .social .ds {
  margin: 0;
}
.header .links .vote_small {
  margin-top: 10px;
}
.header .links .vote_small a {
  display: inline-block;
  width: 75px;
  height: 35px;
}
.header .links .vote_small img {
  width: 88px;
  height: 31px;
}
.header {
  /*---Счетчик онлайна---*/
}
.header .online {
  width: 159px;
  height: 154px;
  margin: 65px 0 0 95px;
}
.header .online p {
  font-family: "Involve", sans-serif;
  font-weight: bold;
  font-size: 21px;
  color: #B4CF44;
  text-align: center;
  height: fit-content;
}
.header .online .counter {
  margin: auto;
  width: fit-content;
  height: fit-content;
  font-family: "Involve", sans-serif;
  font-weight: 200;
  font-size: 70px;
  line-height: 84.72px;
  color: #ffffff;
  text-align: center;
}
.header {
  /*--- Логотип ---*/
}
.header .logo {
  width: 190px;
  height: 245px;
  margin: 40px 0 0 115px;
  opacity: 0.9;
}
.header .logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.header {
  /*--- Анимация игроков ---*/
}
.header .anim {
  width: 235px;
  height: 172px;
  margin: 66px 0 0 54px;
}
.header .anim p {
  font-family: "Involve", sans-serif;
  font-weight: bold;
  font-size: 21px;
  color: #B4CF44;
  text-align: center;
  height: fit-content;
}
.header .auth {
  width: 20%;
}
.header .auth .button,
.header .auth .lform,
.header .auth .links1234 {
  margin: 0 auto;
  width: 215px;
}
.header .auth .button {
  background-color: #FE901B;
  border-bottom: 4px solid rgb(203.6069868996, 105.3755458515, 0.8930131004);
  border-right: 2px solid rgb(228.9956331878, 118.5152838428, 1.0043668122);
  transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  position: relative;
  top: 0;
  left: 0;
}
.header .auth .button:hover {
  filter: brightness(1.05);
  transform: translate(-1px, -1px);
  border-bottom-width: 5px;
  border-right-width: 3px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
}
.header .auth .button:active {
  transform: translate(1px, 3px);
  border-bottom-width: 1px;
  border-right-width: 1px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  transition: all 0.05s ease;
}
.header .auth .button {
  height: 70px;
  padding: 16px 0;
  border-radius: 10px;
  margin: 20px 72px 10px 18px;
  background: #CDFD6D;
  color: #2d2f3b;
  font-family: "Involve", sans-serif;
  font-weight: 500;
  font-size: 30px;
  cursor: pointer;
  transition: filter 0.2s;
}
.header .auth .button:hover {
  filter: brightness(1.1);
}
.header .auth .lform {
  height: auto;
}
.header .auth .lform p {
  width: 20%;
  height: auto;
  font-family: "Involve", sans-serif;
  font-weight: 100;
  text-align: center;
  font-size: 15px;
  line-height: 18px;
  color: #ffffff;
  margin: 0 auto;
  padding-bottom: 5px;
}
.header .auth .lform input {
  width: 215px;
  height: 28px;
  background: rgba(0, 150, 141, 0.27);
  backdrop-filter: blur(4.4px);
  border: 2px solid #CDFD6D;
  color: #ffffff;
  font-size: 15px;
  outline: none;
  text-indent: 10px;
  transition: border-color 0.2s;
}
.header .auth .lform input:focus {
  background-color: #FE901B;
  border-bottom: 4px solid rgb(203.6069868996, 105.3755458515, 0.8930131004);
  border-right: 2px solid rgb(228.9956331878, 118.5152838428, 1.0043668122);
  transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  position: relative;
  top: 0;
  left: 0;
}
.header .auth .lform input:focus:hover {
  filter: brightness(1.05);
  transform: translate(-1px, -1px);
  border-bottom-width: 5px;
  border-right-width: 3px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
}
.header .auth .lform input:focus:active {
  transform: translate(1px, 3px);
  border-bottom-width: 1px;
  border-right-width: 1px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  transition: all 0.05s ease;
}
.header .auth .lform input:focus {
  border-color: #FEB61D;
  background-color: rgba(72, 220, 189, 0.7);
}
.header .auth #wrong {
  color: #ff0000;
  font-size: 17px;
  display: none;
  text-align: center;
  width: fit-content;
  height: fit-content;
  margin: 5px auto;
}
.header .auth .links1234 {
  height: auto;
  display: flex;
  margin: 7px auto 0;
  justify-content: space-between;
}
.header .auth .links1234 a {
  width: auto;
  font-family: "Involve", sans-serif;
  font-weight: 500;
  font-size: 13px;
  color: #13A49B;
}
.header .auth .links1234 a:hover {
  text-decoration: underline;
}

.main-layout {
  width: 1280px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-flow: row wrap;
  position: relative;
  z-index: 1;
  justify-content: space-between;
}

.content-area {
  width: 1011px;
}

.preview {
  position: relative;
  background: url("../../img/preview.webp") no-repeat center;
  background-size: cover;
  width: 981px;
  height: 409px;
  margin: 7px auto;
  overflow: hidden;
}
.preview__text {
  position: absolute;
  z-index: 5;
  top: 83px;
  left: 47px;
}
.preview__label {
  font-family: "Involve", sans-serif;
  color: white;
  font-size: 10px;
  display: block;
  margin-bottom: 0;
}
.preview__title {
  width: 481px;
  margin-bottom: 7px;
}
.preview__subtitle {
  margin-bottom: 5px;
}
.preview__subtitle--fun {
  color: #CDFD6D;
}
.preview__desc {
  margin-top: 10px;
  font-family: "Involve", sans-serif;
  font-size: 14px;
  color: white;
  height: 60px;
  margin-bottom: 30px;
  line-height: 1.4;
}
.preview__layer,
.preview .parallax-layers__item {
  position: absolute;
  transition: transform 2s ease;
  pointer-events: none;
}
.preview:hover .parallax-layers__item {
  transform: translateX(6px) translateY(5px) scale(1.1);
  transition: transform 1s linear;
}

.clsr {
  width: 77px;
  height: 74px;
  left: 433px;
  top: 248px;
}

.clsrght {
  width: 86px;
  height: 72px;
  left: 845px;
  top: 203px;
}

.clsup {
  width: 47px;
  height: 35px;
  left: 953px;
  top: 97px;
}

.frth {
  width: 13px;
  height: 15px;
  left: 741px;
  top: 63px;
}

.frup {
  width: 14px;
  height: 13px;
  left: 875px;
  top: 40px;
}

.vrfr {
  width: 15.41px;
  height: 15.22px;
  left: 484.94px;
  top: 59.07px;
}

.mdlup {
  width: 27.55px;
  height: 27px;
  left: 807.89px;
  top: 92.07px;
}

.btn--play {
  background-color: #FEB61D;
  border-bottom: 4px solid rgb(205.59030837, 140.0925110132, 0.90969163);
  border-right: 2px solid rgb(230.9779735683, 157.3920704846, 1.0220264317);
  transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  position: relative;
  top: 0;
  left: 0;
}
.btn--play:hover {
  filter: brightness(1.05);
  transform: translate(-1px, -1px);
  border-bottom-width: 5px;
  border-right-width: 3px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
}
.btn--play:active {
  transform: translate(1px, 3px);
  border-bottom-width: 1px;
  border-right-width: 1px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  transition: all 0.05s ease;
}
.btn--play {
  width: 157px;
  height: 58px;
  background-color: #CDFD6D;
  font-family: "Involve", sans-serif;
  font-size: 22px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: transform 0.2s ease, filter 0.2s ease;
}
.btn--play:hover {
  transform: scale(1.05);
  filter: brightness(1.1);
}

.news {
  display: flex;
  flex-direction: column;
  margin-top: 80px;
}
.news-grid {
  width: 1011px;
  min-height: 469px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  background: url("/assets/img/news/cheese.png") center no-repeat;
  margin: 0 auto;
}
.news .btn-news-all {
  background-color: #d6a110;
  border-bottom: 4px solid rgb(142.8217391304, 107.45, 10.6782608696);
  border-right: 2px solid rgb(166.547826087, 125.3, 12.452173913);
  transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  position: relative;
  top: 0;
  left: 0;
}
.news .btn-news-all:hover {
  filter: brightness(1.05);
  transform: translate(-1px, -1px);
  border-bottom-width: 5px;
  border-right-width: 3px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
}
.news .btn-news-all:active {
  transform: translate(1px, 3px);
  border-bottom-width: 1px;
  border-right-width: 1px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  transition: all 0.05s ease;
}
.news .btn-news-all {
  border-radius: 4px;
  width: 420px;
  height: 80px;
  align-self: center;
  background: #fe901b;
  color: #f5f7f9;
  font-family: "Involve", sans-serif;
  font-size: 26px;
  font-weight: 900;
  text-align: center;
  line-height: 80px;
  transition: filter 0.2s;
}
.news .btn-news-all:hover {
  filter: brightness(1.1);
}

.news-card {
  background: url("/assets/img/news/newsbg.png") center no-repeat;
  width: 255px;
  height: 343px;
  z-index: 1;
  margin: 75px 35px;
  position: relative;
  overflow: visible;
}
.news-card__title {
  width: 220px;
  margin: 15px auto 0;
  text-align: center;
}
.news-card__title a {
  font-family: "Joystix-Monospace", monospace;
  font-size: 14px;
  color: #223540;
}
.news-card__img {
  width: 320px;
  height: 150px;
  position: relative;
  top: 10px;
  left: -32.5px;
  object-fit: cover;
}
.news-card__meta {
  width: 153px;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 15px 0 0 15px;
  font-family: "Involve", sans-serif;
  font-size: 13px;
  color: #223540;
}
.news-card__meta img {
  width: 14px;
  height: 9px;
}
.news-card__excerpt {
  width: 225px;
  height: 82px;
  margin: 10px 15px;
  font-family: "Involve", sans-serif;
  font-size: 15px;
  line-height: 1.3;
  overflow: hidden;
  display: -webkit-box;
  line-clamp: 4;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}
.news-card .btn--more {
  background-color: #FE901B;
  border-bottom: 3px solid rgb(203.6069868996, 105.3755458515, 0.8930131004);
  border-right: 2px solid rgb(228.9956331878, 118.5152838428, 1.0043668122);
  transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  position: relative;
  top: 0;
  left: 0;
}
.news-card .btn--more:hover {
  filter: brightness(1.05);
  transform: translate(-1px, -1px);
  border-bottom-width: 4px;
  border-right-width: 3px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
}
.news-card .btn--more:active {
  transform: translate(1px, 2px);
  border-bottom-width: 1px;
  border-right-width: 1px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  transition: all 0.05s ease;
}
.news-card .btn--more {
  border-radius: 4px;
  display: block;
  width: 172px;
  height: 51px;
  background: #223540;
  color: #f5f7f9;
  font-family: "Involve", sans-serif;
  font-size: 18px;
  line-height: 51px;
  text-align: center;
  margin: 10px auto 0;
  transition: background 0.2s;
}
.news-card .btn--more:hover {
  background: rgb(51.693877551, 80.5816326531, 97.306122449);
}
.news-card .social-promo {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 80px auto 0;
  position: relative;
}
.news-card .social-promo__link {
  display: block;
  transition: transform 0.2s ease, filter 0.2s ease;
}
.news-card .social-promo__link:hover {
  transform: translateY(-5px) scale(1.02);
  filter: brightness(1.1);
}
.news-card .social-promo__link:active {
  transform: translateY(2px);
}
.news-card .social-promo__link img {
  width: auto;
  display: block;
}
.news-card .social-promo__link--discord {
  max-height: 146px;
}
.news-card .social-promo__link--vk {
  max-height: 128px;
  margin: 20px 0;
}
.news-card .social-promo__link--telegram {
  max-height: 139px;
}

.sidebar {
  width: 254px;
  margin-top: -57px;
  font-family: "Involve", sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.sidebar__title {
  font-family: "Joystix-Monospace", sans-serif;
  font-size: 22px;
  margin-bottom: 24px;
  text-align: center;
}
.sidebar__status {
  text-align: center;
  margin-bottom: 10px;
}

.server-card {
  position: relative;
  width: 215px;
  height: 132px;
  background: linear-gradient(357deg, rgba(0, 0, 0, 0) 2%, #6CA2B3 158%), #C7CFD2;
  border-radius: 20px;
  margin-bottom: 20px;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  user-select: none;
}
.server-card:active {
  background-color: #FEB61D;
  border-bottom: 4px solid rgb(205.59030837, 140.0925110132, 0.90969163);
  border-right: 2px solid rgb(230.9779735683, 157.3920704846, 1.0220264317);
  transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  position: relative;
  top: 0;
  left: 0;
}
.server-card:active:hover {
  filter: brightness(1.05);
  transform: translate(-1px, -1px);
  border-bottom-width: 5px;
  border-right-width: 3px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
}
.server-card:active:active {
  transform: translate(1px, 3px);
  border-bottom-width: 1px;
  border-right-width: 1px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  transition: all 0.05s ease;
}
.server-card:active {
  transform: scale(0.97);
}
.server-card:hover {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.server-card:hover .server-card__badge {
  background: #FEB61D;
  color: #2e3b3d;
}
.server-card__badge {
  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  background: #2e3b3d;
  color: #FEB61D;
  padding: 2px 10px;
  border-radius: 10px;
  font-size: 13px;
  transition: 0.3s;
}
.server-card__main {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 31px 15px 0;
}
.server-card__main img {
  width: 45px;
  height: 45px;
}
.server-card__main p {
  font-size: 14px;
  color: #fff;
  line-height: 1.1;
  margin: 0;
}
.server-card__info {
  color: #ffffff;
  padding-left: 7px;
}
.server-card__footer {
  display: flex;
  justify-content: center;
  gap: 5px;
  margin-top: 10px;
}
.server-card__footer .tag {
  background: #2e3b3d;
  color: #fff;
  font-size: 10px;
  padding: 1px 8px;
  border-radius: 10px;
  text-transform: uppercase;
}
.server-card__tag {
  display: inline-block;
  font-family: "Involve", sans-serif;
  font-size: 10px;
  font-weight: 500;
  color: white;
  background: #2e3b3d;
  border-radius: 10px;
  width: 40px;
  height: 18px;
  line-height: 16px;
  text-align: center;
  text-transform: uppercase;
}
.server-card__tag--alt {
  margin-left: 3px;
}
.server-card__tag--wipe {
  background: #d32f2f;
}
.server-card__tag--work {
  background: #388e3c;
}
.server-card__count {
  color: #ffffff;
  font-size: 16px;
}
.server-card .server-card__indicator {
  position: relative;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.server-card .server-card__indicator .progress-ring {
  transform: rotate(-90deg);
}
.server-card .server-card__indicator .progress-ring__circle {
  transition: stroke-dashoffset 0.5s ease-out;
  stroke-linecap: round;
  stroke-dasharray: 163;
  stroke-dashoffset: 163;
}
.server-card .server-card__indicator .progress-ring__circle--work {
  stroke: #13e4bf;
}
.server-card .server-card__indicator .progress-ring__circle--wipe {
  stroke: #feb61d;
}
.server-card .server-card__indicator .server-card__online-count {
  position: absolute;
  font-family: "Involve", sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
}
.server-card .pulse-dot--work {
  filter: drop-shadow(0 0 5px rgba(19, 228, 191, 0.6));
  animation: pulse-glow 2s infinite ease-in-out;
}
@keyframes pulse-glow {
  0% {
    filter: drop-shadow(0 0 2px rgba(19, 228, 191, 0.4));
  }
  50% {
    filter: drop-shadow(0 0 8px rgba(19, 228, 191, 0.8));
  }
  100% {
    filter: drop-shadow(0 0 2px rgba(19, 228, 191, 0.4));
  }
}

.stats {
  width: 215px;
  background: rgba(245, 247, 249, 0.65);
  border: 1px solid #0e1820;
  backdrop-filter: blur(4.75px);
  border-radius: 20px;
  padding: 15px;
  margin-top: 45px;
}
.stats__row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 11px;
}
.stats__row:last-child {
  margin-bottom: 0;
}
.stats__row .value {
  font-weight: bold;
  color: #2e3b3d;
}

@font-face {
  font-family: "Joystix-Monospace";
  src: url("../fonts/joystix monospace.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Involve";
  src: url("../fonts/Involve-Regular.ttf") format("truetype");
  font-display: fallback;
}
* {
  margin: 0;
  padding: 0;
  border: 0;
  box-sizing: border-box;
}

html, body {
  height: 100%;
}

body {
  background-image: url("../../img/bg.webp");
  height: auto;
  font-family: "Involve", sans-serif;
  cursor: default;
}

h1 {
  font-family: "Joystix-Monospace", monospace;
  font-size: 40px;
  color: #ffffff;
}

h2 {
  font-family: "Joystix-Monospace", monospace;
  font-size: 22px;
  color: #78DBA0;
}

h3 {
  font-family: "Joystix-Monospace", monospace;
  font-size: 14px;
  color: #223540;
}

a {
  text-decoration: none;
  color: inherit;
  transition: 0.2s ease-in-out;
}

.footer-area {
  width: 1265px;
  height: 1525px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.leaderboard {
  width: 1280px;
  height: 1123px;
  margin: 140px auto 0;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
}
.leaderboard__title {
  width: 1265px;
  height: 48px;
  text-align: center;
  font-family: "Joystix-Monospace", sans-serif;
  font-size: 32px;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.2);
  transition: all 0.2s ease;
}
.leaderboard__title:hover {
  color: hsl(0, 0%, 110%);
  text-shadow: 0 0 10px hsla(0, 0%, 120%, 0.8), 0 0 20px hsla(0, 0%, 120%, 0.4);
  transform: scale(1.02);
}
.leaderboard__grid {
  display: flex;
  gap: 150px;
}

.stats-card {
  width: 475px;
  height: 935px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.stats-card__label {
  width: 300px;
  height: 60px;
  margin: 90px auto 0;
  text-align: center;
  font-family: "Involve";
  font-size: 24px;
  line-height: 60px;
  box-sizing: border-box;
  border: 3px solid;
}
.stats-card.voters {
  background: url("../../img/voters.webp") center no-repeat;
}
.stats-card.voters .stats-card__label {
  color: #e9ffbd;
  border-color: #CDFD6D;
}
.stats-card.voters .stats-table {
  color: #e9ffbd;
  border-color: #CDFD6D;
}
.stats-card.voters .btn--more {
  background-color: #CDFD6D;
  border-bottom: 6px solid rgb(179.1554054054, 251.9662162162, 33.5337837838);
  border-right: 2px solid rgb(187.7702702703, 252.3108108108, 58.6891891892);
  transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  position: relative;
  top: 0;
  left: 0;
}
.stats-card.voters .btn--more:hover {
  filter: brightness(1.05);
  transform: translate(-1px, -1px);
  border-bottom-width: 7px;
  border-right-width: 3px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
}
.stats-card.voters .btn--more:active {
  transform: translate(1px, 5px);
  border-bottom-width: 1px;
  border-right-width: 1px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  transition: all 0.05s ease;
}
.stats-card.voters .btn--more {
  color: #2B3F4A;
}
.stats-card.refs {
  background: url("../../img/referals.webp") center no-repeat;
}
.stats-card.refs .stats-card__label {
  color: #253646;
  border-color: #253646;
}
.stats-card.refs .stats-table {
  color: #253646;
  border-color: #253646;
}
.stats-card.refs .btn--more {
  background-color: #2B3F4A;
  border-bottom: 6px solid rgb(14.8846153846, 21.8076923077, 25.6153846154);
  border-right: 2px solid rgb(24.2564102564, 35.5384615385, 41.7435897436);
  transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  position: relative;
  top: 0;
  left: 0;
}
.stats-card.refs .btn--more:hover {
  filter: brightness(1.05);
  transform: translate(-1px, -1px);
  border-bottom-width: 7px;
  border-right-width: 3px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
}
.stats-card.refs .btn--more:active {
  transform: translate(1px, 5px);
  border-bottom-width: 1px;
  border-right-width: 1px;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  transition: all 0.05s ease;
}
.stats-card.refs .btn--more {
  color: #CDFD6D;
}

.stats-table {
  width: 357px;
  height: 501px;
  margin: 50px auto 0;
  border-collapse: collapse;
  font-family: "Involve";
}
.stats-table thead th {
  font-size: 13px;
  text-align: left;
  padding: 6px;
}
.stats-table thead th:last-child {
  text-align: right;
}
.stats-table__row td {
  font-size: 25px;
  padding: 6px;
  border-bottom: 3px solid;
  text-align: left;
}
.stats-table__row td:last-child {
  text-align: right;
}

.btn--more {
  width: 255px;
  height: 66px;
  margin: 60px auto 100px;
  font-family: "Involve";
  font-size: 25px;
  border: none;
  outline: none;
}

.podval {
  width: 1265px;
  height: 162px;
  font-family: "Involve", sans-serif;
  color: #c4f2d3;
  margin: 0 auto;
}
.podval__credits {
  width: 1265px;
  height: 108px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.podval__credits .footlogo {
  height: 108px;
  width: 87px;
}
.podval__credits .footlogo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.podval__credits .command {
  width: 308px;
  height: 60px;
  text-align: center;
}
.podval__credits .command p {
  width: 308px;
  height: 30px;
  font-size: 25px;
  font-weight: 500;
  margin: 0;
  text-align: justify;
  text-align-last: center;
}
.podval__credits .command span {
  font-size: 18px;
  font-weight: 200;
  display: block;
  margin-top: 5px;
}
.podval__credits .cheese {
  width: 54px;
  height: 53px;
}
.podval__credits .cheese img {
  width: 100%;
  height: auto;
}
.podval__credits .arrow {
  width: 44px;
  height: 48px;
  cursor: pointer;
  transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.podval__credits .arrow:hover {
  transform: translateY(-8px);
  filter: drop-shadow(0 5px 15px rgba(196, 242, 211, 0.3));
}
.podval__credits .arrow:active {
  transform: scale(0.9);
}
.podval__policies {
  width: 1265px;
  height: 22px;
  margin-top: 32px;
  display: flex;
  justify-content: flex-start;
}
.podval__policies .policies__link {
  margin-left: 41px;
  font-size: 18px;
  font-weight: 200;
  color: #c4f2d3;
  text-decoration: none;
  transition: all 0.2s ease;
}
.podval__policies .policies__link:first-child {
  margin-left: 0;
}
.podval__policies .policies__link span {
  border-bottom: 1px solid transparent;
  transition: border-bottom 0.3s ease;
}
.podval__policies .policies__link:hover {
  color: #fff;
}
.podval__policies .policies__link:hover span {
  border-bottom: 1px solid #c4f2d3;
}

.footer {
  background: url("../../img/footimg.webp") no-repeat;
  background-size: 100% 100%;
  height: 1525px;
  min-width: 1265px;
  margin-top: 140px;
}

.footwrap-small {
  width: 1265px;
  height: 421px;
  margin-top: 140px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.footwrap-small .podval {
  margin-top: 152.13px;
}

/*# sourceMappingURL=main.css.map */