@import url(https://fonts.googleapis.com/css2?family=Jersey+10+Charted&family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);
@charset "UTF-8";
.cssload-container {
  width: 100%;
  height: 11px;
  text-align: center;
}

.cssload-zenith {
  width: 11px;
  height: 11px;
  margin: 0 auto;
  border-radius: 50%;
  border-top-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
  box-shadow: 1px 1px 0px rgb(255, 255, 255);
  animation: cssload-spin 690ms infinite linear;
  -o-animation: cssload-spin 690ms infinite linear;
  -ms-animation: cssload-spin 690ms infinite linear;
  -webkit-animation: cssload-spin 690ms infinite linear;
  -moz-animation: cssload-spin 690ms infinite linear;
}

@keyframes cssload-spin {
  100% {
    transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
*:not(input):not(textarea):not([contenteditable=true]) {
  caret-color: transparent;
}

.fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

html {
  margin: 0;
  padding: 0;
}

body {
  background: black;
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  font-family: "Kanit", sans-serif;
  font-weight: 600;
  font-style: normal;
  margin: 0;
  padding: 0;
  color: white;
}
body.admin-dashboard div.buttons {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 30px;
}
body.admin-dashboard div.buttons button {
  display: block;
  border: 1px solid white;
  background-color: black;
  text-align: center;
  text-decoration: none;
  color: white;
  line-height: 30px;
}
body.admin-dashboard div.buttons button:hover, body.admin-dashboard div.buttons button:active, body.admin-dashboard div.buttons button:focus {
  background: red;
  cursor: pointer;
}
body.admin-dashboard div.checkbox {
  display: flex;
  align-items: center;
}
body.admin-dashboard div.checkbox input {
  width: 20px;
  height: 20px;
}
body.admin-log h2 {
  font-weight: bold;
  text-align: center;
  font-size: 1.5rem;
  line-height: 1.5rem;
  margin-bottom: 10px;
}
body.admin-log .filter-log {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "search users" "actions months" "date_from date_to" "submit reset";
  gap: 10px;
  margin-bottom: 20px;
}
body.admin-log .filter-log .ts-wrapper {
  font-size: 14px;
  min-height: 38px;
  border-radius: 4px;
  border-color: #ced4da;
}
body.admin-log .filter-log .ts-control {
  padding: 6px 10px;
}
body.admin-log .filter-log .form-group {
  display: flex;
  flex-direction: column;
}
body.admin-log .filter-log .form-group.log-search {
  grid-area: search;
}
body.admin-log .filter-log .form-group.log-users {
  grid-area: users;
}
body.admin-log .filter-log .form-group.log-actions {
  grid-area: actions;
}
body.admin-log .filter-log .form-group.log-months {
  grid-area: months;
}
body.admin-log .filter-log .form-group.log-from {
  grid-area: date_from;
  color: red;
}
body.admin-log .filter-log .form-group.log-to {
  grid-area: date_to;
}
body.admin-log .filter-log .form-group.log-submit {
  grid-area: submit;
}
body.admin-log .filter-log .form-group.log-reset {
  grid-area: reset;
}
body.admin-log .filter-log .form-control, body.admin-log .filter-log .form-select {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 0.3rem;
  font-size: 14px;
  line-height: 14px;
  border: 2px solid white;
  background: black;
  color: white;
}
body.admin-log .filter-log .form-control:hover, body.admin-log .filter-log .form-control:active, body.admin-log .filter-log .form-control:focus, body.admin-log .filter-log .form-control:focus-visible, body.admin-log .filter-log .form-select:hover, body.admin-log .filter-log .form-select:active, body.admin-log .filter-log .form-select:focus, body.admin-log .filter-log .form-select:focus-visible {
  border-color: white;
  box-shadow: 0 0 0 4px rgba(170, 25, 25, 0.3);
}
body.admin-log .filter-log .log-submit button, body.admin-log .filter-log .log-submit a, body.admin-log .filter-log .log-reset button, body.admin-log .filter-log .log-reset a {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 0.5rem;
  font-size: 14px;
  border: 2px solid red;
  background: red;
  color: white;
  line-height: 10px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
body.admin-log .filter-log .log-submit button:hover, body.admin-log .filter-log .log-submit button:active, body.admin-log .filter-log .log-submit button:focus, body.admin-log .filter-log .log-submit a:hover, body.admin-log .filter-log .log-submit a:active, body.admin-log .filter-log .log-submit a:focus, body.admin-log .filter-log .log-reset button:hover, body.admin-log .filter-log .log-reset button:active, body.admin-log .filter-log .log-reset button:focus, body.admin-log .filter-log .log-reset a:hover, body.admin-log .filter-log .log-reset a:active, body.admin-log .filter-log .log-reset a:focus {
  background: rgba(255, 0, 0, 0.8);
}
body.admin-log .filter-log .log-reset a {
  background: #6a6a6a;
  border: 2px solid #6a6a6a;
}
body.admin-log .filter-log .log-reset a:hover, body.admin-log .filter-log .log-reset a:active, body.admin-log .filter-log .log-reset a:focus {
  background: rgba(106, 106, 106, 0.8);
}
body.admin-log .table-log {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid white;
  margin-bottom: 20px;
}
body.admin-log .table-log tr {
  border: 1px solid white;
}
body.admin-log .table-log tr th, body.admin-log .table-log tr td {
  padding: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (min-width: 425px) {
  body.admin-log .table-log tr th, body.admin-log .table-log tr td {
    padding: 3px;
  }
}
body.admin-log .table-log tr th.left, body.admin-log .table-log tr td.left {
  text-align: left;
}
body.admin-log .table-log tr th.center, body.admin-log .table-log tr td.center {
  text-align: center;
}
body.admin-log .table-log tr th.right, body.admin-log .table-log tr td.right {
  text-align: right;
}
body.admin-log .table-log tr th button.toggle-details, body.admin-log .table-log tr td button.toggle-details {
  background: none;
  color: white;
  border-style: none;
}
body.admin-log .table-log tr td {
  font-size: 14px;
  font-weight: normal;
}
body.admin-log .table-log tr td.nickname {
  max-width: 60px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.admin-log .table-log tr td.nickname a {
  color: white;
}
body.admin-log .table-log tr td.action {
  max-width: 110px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #b5b5b5;
}
body.admin-log .table-log tr td.action > .marker:only-child, body.admin-log .table-log tr td.action > .marker:last-child {
  font-weight: bold;
  color: white;
}
body.admin-log .table-log tr td .toggle-details {
  cursor: pointer;
  padding: 0;
}
body.admin-log .detail-row table {
  border: none;
  width: 100%;
  background: black;
}
body.admin-log .detail-row table td {
  text-align: left;
  white-space: wrap;
}
body.admin-log .detail-row table .title {
  font-weight: bold;
}
body.admin-log .detail-row table .data {
  color: #b8b8b8;
}
body.admin-log .detail-row table a {
  color: white;
}
body.admin-signup button.new-day {
  background: red;
  padding: 7px 10px;
  border: 2px solid red;
  color: white;
  border-radius: 5px;
  margin-bottom: 15px;
  text-decoration: none;
}
body.admin-signup button.new-day:hover, body.admin-signup button.new-day:active, body.admin-signup button.new-day:focus {
  cursor: pointer;
  background: #ca0000;
  color: white;
}
body.admin-signup .table-days {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid white;
  margin-bottom: 20px;
}
body.admin-signup .table-days tr {
  border: 1px solid white;
}
body.admin-signup .table-days tr.open {
  border-bottom: none;
}
body.admin-signup .table-days tr th, body.admin-signup .table-days tr td {
  padding: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (min-width: 425px) {
  body.admin-signup .table-days tr th, body.admin-signup .table-days tr td {
    padding: 3px;
  }
}
body.admin-signup .table-days tr th.left, body.admin-signup .table-days tr td.left {
  text-align: left;
}
body.admin-signup .table-days tr th.center, body.admin-signup .table-days tr td.center {
  text-align: center;
}
body.admin-signup .table-days tr th.right, body.admin-signup .table-days tr td.right {
  text-align: right;
}
body.admin-signup .table-days tr th button.toggle-details, body.admin-signup .table-days tr td button.toggle-details {
  background: none;
  color: white;
  border-style: none;
}
body.admin-signup .table-days tr td {
  font-size: 14px;
  font-weight: normal;
}
body.admin-signup .table-days tr td.date::first-letter {
  text-transform: uppercase;
}
body.admin-signup .table-days tr td.nickname {
  max-width: 60px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.admin-signup .table-days tr td.nickname a {
  color: white;
}
body.admin-signup .table-days tr td.action {
  max-width: 110px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #b5b5b5;
}
body.admin-signup .table-days tr td.action > .marker:only-child, body.admin-signup .table-days tr td.action > .marker:last-child {
  font-weight: bold;
  color: white;
}
body.admin-signup .table-days tr td .toggle-details {
  cursor: pointer;
  padding: 0;
}
body.admin-signup .table-days tr.detail-row > td {
  padding: 10px;
}
body.admin-signup .table-days tr.detail-row > td .buttons {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr 1fr;
  margin-bottom: 10px;
}
body.admin-signup .table-days tr.detail-row > td .buttons .start, body.admin-signup .table-days tr.detail-row > td .buttons .edit, body.admin-signup .table-days tr.detail-row > td .buttons .delete {
  background: black;
  padding: 7px 10px;
  border: 2px solid white;
  color: white;
  border-radius: 5px;
  margin-bottom: 15px;
  text-decoration: none;
  margin-bottom: 0;
}
body.admin-signup .table-days tr.detail-row > td .buttons .start:hover, body.admin-signup .table-days tr.detail-row > td .buttons .start:active, body.admin-signup .table-days tr.detail-row > td .buttons .start:focus, body.admin-signup .table-days tr.detail-row > td .buttons .edit:hover, body.admin-signup .table-days tr.detail-row > td .buttons .edit:active, body.admin-signup .table-days tr.detail-row > td .buttons .edit:focus, body.admin-signup .table-days tr.detail-row > td .buttons .delete:hover, body.admin-signup .table-days tr.detail-row > td .buttons .delete:active, body.admin-signup .table-days tr.detail-row > td .buttons .delete:focus {
  cursor: pointer;
  background: black;
  color: red;
}
body.admin-signup .table-days tr.detail-row > td .desc textarea {
  box-sizing: border-box;
  width: 100%;
  height: 50px;
  border: 1px solid white;
}
body.admin-signup .table-days tr.detail-row > td table.users {
  width: 100%;
}
body.admin-signup .table-days tr.detail-row > td table.users .name a {
  color: white;
}
body .spinner {
  display: none;
  background: rgba(0, 0, 0, 0.8);
  bottom: 0;
  height: 100%;
  justify-content: center;
  align-items: center;
  min-height: 100%;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 102;
}
body .spinner.active {
  display: flex;
}
body .spinner svg {
  width: 100px;
  height: 100px;
  fill: white;
}
body .spinner .cssload-loader {
  position: relative;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  perspective: 4700px;
}
body .spinner .cssload-inner {
  position: absolute;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
}
body .spinner .cssload-inner.cssload-one {
  left: 0%;
  top: 0%;
  animation: cssload-rotate-one 1.15s linear infinite;
  -o-animation: cssload-rotate-one 1.15s linear infinite;
  -ms-animation: cssload-rotate-one 1.15s linear infinite;
  -webkit-animation: cssload-rotate-one 1.15s linear infinite;
  -moz-animation: cssload-rotate-one 1.15s linear infinite;
  border-bottom: 18px solid #505050;
}
body .spinner .cssload-inner.cssload-two {
  right: 0%;
  top: 0%;
  animation: cssload-rotate-two 1.15s linear infinite;
  -o-animation: cssload-rotate-two 1.15s linear infinite;
  -ms-animation: cssload-rotate-two 1.15s linear infinite;
  -webkit-animation: cssload-rotate-two 1.15s linear infinite;
  -moz-animation: cssload-rotate-two 1.15s linear infinite;
  border-right: 18px solid red;
}
body .spinner .cssload-inner.cssload-three {
  right: 0%;
  bottom: 0%;
  animation: cssload-rotate-three 1.15s linear infinite;
  -o-animation: cssload-rotate-three 1.15s linear infinite;
  -ms-animation: cssload-rotate-three 1.15s linear infinite;
  -webkit-animation: cssload-rotate-three 1.15s linear infinite;
  -moz-animation: cssload-rotate-three 1.15s linear infinite;
  border-top: 18px solid red;
}
@keyframes cssload-rotate-one {
  0% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}
@keyframes cssload-rotate-two {
  0% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}
@keyframes cssload-rotate-three {
  0% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}
body .daterangepicker {
  color: black;
}
body .daterangepicker .drp-calendar.right {
  display: none !important;
}
body .daterangepicker .calendar-table th, body .daterangepicker .calendar-table td {
  min-width: 30px !important;
}
body .daterangepicker td.active, body .daterangepicker td.active:hover, body .daterangepicker .calendar-table td.end-date {
  background-color: red !important;
  color: white !important;
}
body .daterangepicker td.in-range {
  background-color: #ececec !important;
}
body .info {
  position: relative;
  top: 3px;
  width: 17px;
  height: 17px;
  margin-left: 10px;
  border: none;
  background: none;
  cursor: pointer;
}
body .info svg {
  position: relative;
  left: -5px;
  width: 17px;
  height: 17px;
  fill: white;
}
body .info-rate {
  margin-left: 0;
}
body .info-rate svg {
  left: 0;
}
body .tippy-box[data-theme~=custom] .tippy-content {
  background-color: rgba(0, 0, 0, 0.56);
  text-align: left;
  color: white;
  border: 2px solid red;
  border-radius: 10px;
  padding: 10px;
}
body .tippy-box[data-theme~=custom] .tippy-content a {
  color: white;
}
body .tippy-box[data-theme~=custom] .tippy-content p {
  margin: 0 0 10px 0;
  font-size: 0.8rem;
}
body .tippy-box[data-theme~=custom] .tippy-content p:last-child {
  margin: 0;
}
body .tippy-box[data-theme~=custom] .tippy-content ul {
  margin: 0 0 10px 0;
  padding-left: 20px;
  font-size: 0.8rem;
  margin-bottom: 0;
}
body .tippy-box[data-theme~=custom][data-placement^=top] .tippy-arrow:before {
  border-top-color: red;
}
body .tippy-box[data-theme~=custom][data-placement^=bottom] .tippy-arrow:before {
  border-bottom-color: red;
}
body .tippy-box[data-theme~=custom][data-placement^=left] .tippy-arrow:before {
  border-left-color: red;
}
body .tippy-box[data-theme~=custom][data-placement^=right] .tippy-arrow:before {
  border-right-color: red;
}
body .content-wrapper {
  display: flex;
  justify-content: center;
  width: 100%;
  padding-top: 65px;
}
body .content-wrapper .content-inner {
  width: 90%;
  max-width: 400px;
  margin-bottom: 20px;
}
body .content-wrapper .content-inner h1 {
  text-align: center;
}
body .content-wrapper .content-inner .random-wrapper .roles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 20px;
}
@media (min-width: 400px) {
  body .content-wrapper .content-inner .random-wrapper .roles {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
  }
}
body .content-wrapper .content-inner .random-wrapper .roles .item {
  padding: 10px 0;
  border: 3px solid white;
  background-color: red;
}
body .content-wrapper .content-inner .random-wrapper .roles .item.maf, body .content-wrapper .content-inner .random-wrapper .roles .item.don, body .content-wrapper .content-inner .random-wrapper .roles .item.put {
  background-color: black;
}
body .content-wrapper .content-inner .random-wrapper .roles .item .img {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 70px;
}
body .content-wrapper .content-inner .random-wrapper .roles .item .img img {
  padding: 10px;
  width: 40px;
}
body .content-wrapper .content-inner .random-wrapper .roles .item .title {
  text-align: center;
}
body .content-wrapper .content-inner .random-wrapper .roles .item .result {
  text-align: center;
}
body .content-wrapper .content-inner .random-wrapper .random-actions {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  grid-template-areas: "count numb" "start start";
  gap: 10px;
}
body .content-wrapper .content-inner .random-wrapper .random-actions .count {
  grid-area: count;
}
body .content-wrapper .content-inner .random-wrapper .random-actions .numb {
  grid-area: numb;
}
body .content-wrapper .content-inner .random-wrapper .random-actions .count, body .content-wrapper .content-inner .random-wrapper .random-actions .numb {
  width: 100%;
}
body .content-wrapper .content-inner .random-wrapper .random-actions .count label, body .content-wrapper .content-inner .random-wrapper .random-actions .numb label {
  font-size: 0.8rem;
}
body .content-wrapper .content-inner .random-wrapper .random-actions .count input, body .content-wrapper .content-inner .random-wrapper .random-actions .numb input {
  width: 100%;
  box-sizing: border-box;
  padding: 5px 10px;
  text-align: center;
}
body .content-wrapper .content-inner .random-wrapper .random-actions .start {
  grid-area: start;
  display: flex;
  align-items: center;
  justify-content: center;
}
body .content-wrapper .content-inner .random-wrapper .random-actions .start button {
  padding: 5px 20px;
  background-color: red;
  border: 2px solid transparent;
  color: white;
  cursor: pointer;
}
body .content-wrapper .content-inner .random-wrapper .random-actions .start button:hover, body .content-wrapper .content-inner .random-wrapper .random-actions .start button:active, body .content-wrapper .content-inner .random-wrapper .random-actions .start button:focus {
  background-color: black;
  border: 2px solid red;
  color: red;
}
body .nav {
  display: flex;
  flex-grow: 1;
  align-items: center;
  justify-content: space-between;
  position: fixed;
  z-index: 101;
  top: 0;
  width: 100%;
  height: 50px;
  background: rgba(0, 0, 0, 0.8);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
body .nav .logo {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding: 10px;
}
body .nav .logo img {
  width: 40px;
  height: 40px;
}
body .nav .best-count a {
  color: white;
  text-decoration: none;
  padding: 5px 3px;
}
body .nav .best-count a .title {
  text-decoration: underline;
}
body .nav .best-count a .count {
  text-decoration: none;
}
body .nav .best-count .tippy-content a {
  text-decoration: underline;
}
body .nav .menu-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 50px;
  position: relative;
  background: none;
  border: 0;
  padding: 10px;
}
body .nav .menu-icon:hover {
  cursor: pointer;
}
body .nav .menu-icon svg {
  width: 40px;
  height: 40px;
  fill: white;
}
body .menu {
  position: fixed;
  animation: menu 0.6s cubic-bezier(0.23, 1, 0.32, 1) both;
  z-index: 102;
}
body .menu-wrapper {
  display: flex;
  justify-content: center;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 101;
  width: 100%;
  height: 100%;
  min-height: 100%;
  background: rgba(0, 0, 0, 0.8);
}
body .menu-wrapper-two {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
}
@keyframes menu {
  0% {
    transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    transform-origin: 50% 0%;
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    transform: translateY(0) scaleY(1) scaleX(1);
    transform-origin: 50% 50%;
    filter: blur(0);
    opacity: 1;
  }
}
body .menu a {
  display: flex;
  align-items: center;
  justify-content: center;
  background: black;
  width: 200px;
  height: 40px;
  border: 2px solid red;
  color: red;
  border-radius: 5px;
  margin-bottom: 15px;
  text-decoration: none;
}
body .menu a:hover, body .menu a:active, body .menu a:focus {
  background: red;
  color: black;
}
body .actions {
  position: fixed;
  animation: actions 0.6s cubic-bezier(0.23, 1, 0.32, 1) both;
}
body .actions-wrapper {
  display: flex;
  justify-content: center;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 101;
  width: 100%;
  height: 100%;
  min-height: 100%;
  background: rgba(0, 0, 0, 0.8);
}
body .actions-wrapper-two {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
}
@keyframes actions {
  0% {
    transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    transform-origin: 50% 0%;
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    transform: translateY(0) scaleY(1) scaleX(1);
    transform-origin: 50% 50%;
    filter: blur(0);
    opacity: 1;
  }
}
body .actions-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 20px;
  position: fixed;
  z-index: 101;
  right: 0;
  top: 50%;
  background: rgba(255, 0, 0, 0.5);
  transform: rotate(90deg);
}
body .actions-button:hover {
  cursor: pointer;
}
body .actions-button svg {
  fill: white;
}
body .actions button {
  display: flex;
  align-items: center;
  justify-content: center;
  background: black;
  width: 200px;
  height: 40px;
  border: 2px solid red;
  color: red;
  border-radius: 5px;
  margin-bottom: 15px;
  text-decoration: none;
}
body .actions button:hover, body .actions button:active, body .actions button:focus {
  cursor: pointer;
  background: red;
  color: black;
}
body .remove {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px;
  min-width: 200px;
  position: fixed;
  animation: actions 0.6s cubic-bezier(0.23, 1, 0.32, 1) both;
}
body .remove-wrapper {
  display: flex;
  justify-content: center;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
  min-height: 100%;
  background: rgba(0, 0, 0, 0.8);
}
body .remove-wrapper-two {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
}
@keyframes actions {
  0% {
    transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    transform-origin: 50% 0%;
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    transform: translateY(0) scaleY(1) scaleX(1);
    transform-origin: 50% 50%;
    filter: blur(0);
    opacity: 1;
  }
}
body .remove-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 20px;
  position: fixed;
  z-index: 101;
  right: 0;
  top: 50%;
  background: rgba(255, 0, 0, 0.5);
  transform: rotate(90deg);
}
body .remove-button:hover {
  cursor: pointer;
}
body .remove-button svg {
  fill: white;
}
body .remove input {
  box-sizing: border-box;
  text-align: center;
  width: 100%;
  height: 30px;
  border: 2px solid red;
  border-radius: 5px;
  margin-bottom: 15px;
}
body .remove button {
  display: flex;
  align-items: center;
  justify-content: center;
  background: black;
  width: 100%;
  height: 40px;
  border: 2px solid red;
  color: red;
  border-radius: 5px;
  margin-bottom: 15px;
  text-decoration: none;
}
body .remove button:hover, body .remove button:active, body .remove button:focus {
  cursor: pointer;
  background: red;
  color: black;
}
body.user-dashboard h2 {
  text-align: center;
}
body.user-dashboard .news {
  font-size: 0.8rem;
  color: #cdcdcd;
}
body.user-dashboard .news .item {
  border: 1px solid #cdcdcd;
  padding: 10px;
  margin-bottom: 15px;
}
body.user-dashboard .news .item h3 {
  font-weight: bold;
  margin-top: 0px;
  margin-bottom: 5px;
}
body.user-dashboard .news .item p {
  margin: 0 0 10px 0;
}
body.user-dashboard .news .item p:last-child {
  margin-bottom: 0;
}
body.user-dashboard .news .item a {
  color: white;
  font-weight: bold;
  text-decoration: underline;
}
body.user-dashboard .news .item a:hover, body.user-dashboard .news .item a:active, body.user-dashboard .news .item a:focus {
  color: red;
}
body.user-dashboard .news .item ul {
  padding: 0 0 0 15px;
}
body .form-nickname {
  margin-bottom: 20px;
}
body .form-nickname .message {
  display: none;
  font-size: 0.8rem;
  margin-bottom: 10px;
  margin-top: -10px;
  color: red;
}
body .form-nickname label {
  display: block;
  margin-bottom: 5px;
}
body .form-nickname input {
  display: block;
  width: 100%;
  border: 2px solid red;
  background: white;
  color: black;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
  text-decoration: none;
  margin-bottom: 15px;
}
body .form-nickname select {
  display: block;
  width: 100%;
  border: 2px solid red;
  background: white;
  color: black;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
  text-decoration: none;
  margin-bottom: 15px;
}
body .form-nickname button {
  display: block;
  width: 100%;
  border: 2px solid red;
  background: black;
  color: white;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
  text-decoration: none;
}
body .form-nickname button:hover, body .form-nickname button:active, body .form-nickname button:focus {
  cursor: pointer;
  background: red;
}
body.user-stats .user-stats-wrapper {
  display: grid;
  grid-template-columns: 48% 48%;
  gap: 15px;
}
body.user-stats .user-stats-wrapper.roles .numb {
  font-size: 1rem;
}
body.user-stats .user-stats-wrapper .item {
  border: 1px solid white;
  width: 100%;
  height: 80px;
  padding: 10px;
  box-sizing: border-box;
  background: #212121;
  margin-bottom: 0;
}
body.user-stats .user-stats-wrapper .item-data {
  display: flex;
  flex-direction: column;
  height: 100%;
}
body.user-stats .user-stats-wrapper .item .title {
  text-align: center;
}
body.user-stats .user-stats-wrapper .item .value {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 1rem;
  width: 100%;
  height: 100%;
}
body.user-stats .user-stats-wrapper .item .value .item-spinner {
  display: none;
  align-items: center;
  width: 100%;
  height: 100%;
}
body.user-stats .user-stats-wrapper .item .value .item-spinner.active {
  display: flex;
}
body.user-stats .user-stats-wrapper .item .value .numb {
  display: none;
}
body.user-stats .user-stats-wrapper .item .value .numb.active {
  display: flex;
}
body.user-stats .games {
  background-color: black;
  margin-bottom: 20px;
}
body.user-stats .games .items {
  margin-bottom: 20px;
}
body.user-stats .games .items .message {
  text-align: center;
  padding: 20px 0;
}
body.user-stats .games .items .item {
  border: 2px solid gray;
  padding: 5px;
  margin-bottom: 10px;
  position: relative;
}
body.user-stats .games .items .item > svg {
  display: none;
  position: absolute;
  right: -5px;
  top: -5px;
  width: 10px;
  height: 10px;
  fill: red;
}
body.user-stats .games .items .item .title {
  display: flex;
  width: 100%;
  background: none;
  border: none;
  position: relative;
  align-items: center;
  font-size: 1rem;
  line-height: 1rem;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  cursor: pointer;
}
body.user-stats .games .items .item .title div {
  text-align: left;
  margin: 0 5px;
  color: white;
}
body.user-stats .games .items .item .title div.id {
  width: 15%;
  max-width: 30px;
}
body.user-stats .games .items .item .title div.date {
  width: 25%;
  max-width: 800px;
  color: gray;
}
body.user-stats .games .items .item .title div.role {
  display: flex;
  align-items: center;
  width: 25%;
  max-width: 800px;
  color: #cacaca;
}
body.user-stats .games .items .item .title div.role img {
  width: 15px;
  height: 15px;
  margin-right: 5px;
}
body.user-stats .games .items .item .title div.score {
  width: 15%;
  max-width: 30px;
  text-align: right;
  font-weight: bold;
  color: white;
}
body.user-stats .games .items .item .title .handle {
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  background: none;
  position: absolute;
  right: 5px;
  width: 25px;
  height: 25px;
}
body.user-stats .games .items .item .title .handle img {
  width: 15px;
  height: 15px;
}
body.user-stats .games .items .item .content {
  display: none;
  justify-content: center;
  flex-wrap: wrap;
  padding: 20px;
}
body.user-stats .games .items .item .content h2 {
  text-align: center;
}
body.user-stats .games .items .item .content .extra {
  width: 100%;
  max-width: 300px;
  margin-bottom: 20px;
}
body.user-stats .games .items .item .content .extra .row {
  display: flex;
  justify-content: space-between;
  border: none;
  border-bottom: 1px dashed #cacaca;
}
body.user-stats .games .items .item .content .extra .row:last-child {
  border: none;
}
body.user-stats .games .items .item .content .buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}
body.user-stats .games .items .item .content .buttons a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80%;
  border: 2px solid white;
  background: none;
  color: white;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
  text-decoration: none;
  margin-bottom: 20px;
}
body.user-stats .games .items .item .content .buttons a:hover, body.user-stats .games .items .item .content .buttons a:active, body.user-stats .games .items .item .content .buttons a:focus {
  background: red;
}
body.user-stats .games .items .item .content .buttons a div {
  margin-right: 10px;
}
body.user-stats .games .items .item .content .buttons a svg {
  display: none;
  width: 20px;
  height: 20px;
}
body.user-stats .games .items .item .content .buttons a svg.active {
  display: inline-block;
}
body.user-stats .games .items .item .content .buttons a svg.svg-wait {
  fill: red;
}
body.user-stats .games .items .item .content .buttons a svg.svg-calc {
  fill: gold;
}
body.user-stats .games .items .item .content .buttons a svg.svg-ready {
  fill: green;
}
body.user-stats .games .items .item .content .buttons a.wait svg.svg-wait {
  display: inline-block;
}
body.user-stats .games .items .item .content .buttons a.calc svg.svg-calc {
  display: inline-block;
}
body.user-stats .games .items .item .content .buttons a.ready svg.svg-ready {
  display: inline-block;
}
body.user-stats .games .items .item.active .title .handle img {
  transform: rotate(180deg);
}
body.user-stats .games .items .item.active .content {
  display: flex;
}
body.user-stats .games .items .item.wait > svg {
  display: block;
}
body.user-stats .mafka-popup {
  border: 2px solid white;
  background: transparent;
}
body.user-stats .mafka-popup-overlay {
  background: rgba(0, 0, 0, 0.9);
}
body.user-stats .mafka-popup-content {
  padding: 0px;
}
body.user-stats .mafka-popup button.close {
  fill: white;
}
body.user-stats .mafka-popup .message {
  margin-bottom: 20px;
}
body.user-stats .mafka-popup .best {
  font-size: 0.8rem;
}
body.user-stats .mafka-popup .best button {
  display: flex;
  align-items: center;
  width: 100%;
  border: 2px solid white;
  background: black;
  color: white;
  margin-bottom: 20px;
  padding: 10px 10px 10px 30px;
  cursor: pointer;
}
body.user-stats .mafka-popup .best button:hover, body.user-stats .mafka-popup .best button:active, body.user-stats .mafka-popup .best button:focus {
  background: red;
}
body.user-stats .mafka-popup .best button:last-child {
  margin-bottom: 0;
}
body.user-stats .mafka-popup .best button .player {
  display: flex;
  align-items: center;
  width: 50%;
  min-width: 150px;
}
body.user-stats .mafka-popup .best button .player .numb {
  font-weight: bold;
  font-size: 16px;
  line-height: 16px;
  margin-right: 10px;
}
body.user-stats .mafka-popup .best button .player .nick {
  font-size: 16px;
  color: #b4b4b4;
}
body.user-stats .mafka-popup .best .result-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: black;
  border: 1px solid white;
  padding: 5px 10px;
  overflow: hidden;
}
body.user-stats .mafka-popup .best .result-item .from, body.user-stats .mafka-popup .best .result-item .to {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  width: 45%;
}
body.user-stats .mafka-popup .best .result-item .from .numb, body.user-stats .mafka-popup .best .result-item .to .numb {
  font-weight: bold;
  line-height: 16px;
  margin-right: 10px;
}
body.user-stats .mafka-popup .best .result-item .from .nick, body.user-stats .mafka-popup .best .result-item .to .nick {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #b4b4b4;
}
body.user-stats .mafka-popup .best .result-item .vote {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 10%;
  margin: 0px 10px 0 0;
}
body.user-stats .mafka-popup .best .result-item .vote svg {
  width: 14px;
  height: 14px;
  fill: white;
}
body.games .games-item {
  display: block;
  background: #2e2e2e;
  padding: 15px;
  border: 2px solid #ffffff;
  margin-bottom: 15px;
  color: #ffffff;
  animation: slide-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}
body.games .games-item .status {
  content: url(/images/process.svg?2ba007b2dd0fce0047ac0f085842faac);
  width: 20px;
  height: 20px;
  margin-right: 10px;
}
body.games .games-item.finished .status {
  content: url(/images/finished.svg?6c0fbce518a58100dc221aefaa8417e1);
  width: 20px;
  height: 20px;
}
body.games .games-item.finished.accepted .status {
  content: url(/images/accepted.svg?af946527cee46ef58a3a84ac5ebe2896);
  width: 20px;
  height: 20px;
}
body.games .games-item-title {
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
}
body.games .games-item-title .split {
  margin-left: 10px;
  margin-right: 10px;
}
body.games .games-item-title .handle {
  position: absolute;
  right: 0px;
  top: 2px;
}
body.games .games-item-title .handle img {
  width: 15px;
  height: 15px;
}
body.games .games-item-content {
  display: none;
}
body.games .games-item.active .games-item-title .handle img {
  transform: rotate(180deg);
}
body.games .games-item.active .games-item-content {
  display: block;
  padding-top: 20px;
}
body.games .games-item.active .games-item-content-actions {
  display: grid;
  grid-template-columns: 48% 48%;
  gap: 15px 4%;
}
body.games .games-item.active .games-item-content-actions .item {
  width: 100%;
}
body.games .games-item.active .games-item-content-actions .item input, body.games .games-item.active .games-item-content-actions .item button, body.games .games-item.active .games-item-content-actions .item a {
  display: block;
  width: 100%;
  border: 2px solid red;
  background: black;
  color: red;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  padding: 5px;
  box-sizing: border-box;
  text-decoration: none;
}
body.games .games-item.active .games-item-content-actions .item input:hover, body.games .games-item.active .games-item-content-actions .item input:active, body.games .games-item.active .games-item-content-actions .item input:focus, body.games .games-item.active .games-item-content-actions .item button:hover, body.games .games-item.active .games-item-content-actions .item button:active, body.games .games-item.active .games-item-content-actions .item button:focus, body.games .games-item.active .games-item-content-actions .item a:hover, body.games .games-item.active .games-item-content-actions .item a:active, body.games .games-item.active .games-item-content-actions .item a:focus {
  cursor: pointer;
  background: red;
  color: black;
}
body.games .games-item.active .games-item-content-actions .item input.count, body.games .games-item.active .games-item-content-actions .item button.count, body.games .games-item.active .games-item-content-actions .item a.count {
  border: 1px solid red;
  background: #b4b4b4;
}
body.games .games-item.active .games-item-content-players {
  display: grid;
  grid-template-columns: 48% 48%;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  gap: 15px 4%;
  min-height: 409px;
  margin-bottom: 20px;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
}
body.games .games-item.active .games-item-content-players .numb-wrapper {
  display: flex;
}
body.games .games-item.active .games-item-content-players .numb-wrapper .numb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 10%;
  color: white;
}
body.games .games-item.active .games-item-content-players .numb-wrapper .land {
  width: 85%;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3px 3px;
  border: 1px dashed #ababab;
}
body.games .games-item.active .games-item-content-players .numb-wrapper .land.drop-hover {
  border: 1px dashed red;
}
body.games .player-actions {
  position: fixed;
  width: 90%;
  max-width: 400px;
  background: #030000;
  border: 1px solid red;
  color: grey;
  margin-top: 80px;
  padding: 20px;
}
body.games .player-actions-wrapper {
  display: flex;
  justify-content: center;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
  min-height: 100%;
  background: rgba(0, 0, 0, 0.8);
}
body.games .player-actions-wrapper-two {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100vh;
}
body.games .player-actions .search {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}
body.games .player-actions .search input {
  box-sizing: border-box;
  width: 100%;
  padding: 5px 10px;
  font-size: 16px;
  line-height: 20px;
}
body.games .player-actions .search .player-clean {
  background: red;
  border: 1px solid red;
  color: white;
  cursor: pointer;
}
body.games .player-actions .search-result {
  display: grid;
  grid-template-columns: 32% 32% 32%;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  gap: 10px 2%;
  margin-bottom: 20px;
  min-height: 275px;
}
body.games .player-actions .search-result .user-item {
  width: 100%;
  height: 43px;
  border: 2px solid #ffffff;
  background: black;
  color: #ffffff;
  font-size: 16px;
  padding: 10px 15px;
  box-sizing: border-box;
  font-size: 16px;
  line-height: 20px;
}
body.games .player-actions .search-result .user-item:hover, body.games .player-actions .search-result .user-item:active, body.games .player-actions .search-result .user-item:focus, body.games .player-actions .search-result .user-item.active {
  cursor: pointer;
  background: #b9b9b9;
  color: white;
}
body.games .player-actions .search-result .user-item div {
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.games .player-actions-buttons {
  display: grid;
  grid-template-columns: 48% 48%;
  gap: 15px 4%;
}
body.games .player-actions-buttons button {
  width: 100%;
  border: 2px solid red;
  background: black;
  color: red;
  font-size: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
  cursor: pointer;
}
body.games .player-actions-buttons button:hover, body.games .player-actions-buttons button:active, body.games .player-actions-buttons button:focus {
  background: red;
  color: white;
}
body.rating h1, body.rating h2 {
  text-align: center;
}
body.rating h2 {
  margin: 30px 0 0 0;
}
body.rating .actions {
  max-width: 80%;
}
body.rating .rating-info {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 20px;
  padding: 10px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
body.rating .rating-info-item {
  display: flex;
  justify-content: space-between;
  margin-right: 10px;
  width: 100%;
}
body.rating .rating-info-item > * {
  display: block;
  white-space: nowrap;
}
body.rating .rating-info-item .title {
  margin-right: 5px;
  border-bottom: 1px dashed #5e5b5b;
}
body.rating .rating-info-item .border {
  width: 100%;
  border-bottom: 1px dashed #5e5b5b;
}
body.rating .rating-info-item .value {
  color: #878787;
  border-bottom: 1px dashed #5e5b5b;
}
body.rating .form-rating {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  border: 2px solid red;
  padding: 20px;
}
body.rating .form-rating .item {
  display: block;
  width: 100%;
  margin-bottom: 20px;
}
body.rating .form-rating .item label {
  display: block;
}
body.rating .form-rating .item input, body.rating .form-rating .item select {
  box-sizing: border-box;
  display: block;
  border: 1px solid red;
  width: 100%;
  height: 30px;
  line-height: 30px;
  font-size: 18px;
}
body.rating .form-rating .item.reset {
  display: flex;
  justify-content: center;
  margin-bottom: 0;
}
body.rating .form-rating .item.reset a {
  display: flex;
  align-items: center;
  justify-content: center;
  background: black;
  width: 200px;
  height: 40px;
  border: 2px solid red;
  color: red;
  border-radius: 5px;
  margin-bottom: 15px;
  text-decoration: none;
  margin-bottom: 0;
}
body.rating table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid white;
}
body.rating table tr {
  border: 1px solid white;
}
body.rating table tr th, body.rating table tr td {
  text-align: right;
  padding: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (min-width: 425px) {
  body.rating table tr th, body.rating table tr td {
    padding: 3px;
  }
}
body.rating table tr th.left, body.rating table tr td.left {
  text-align: left;
}
body.rating table tr th.center, body.rating table tr td.center {
  text-align: center;
}
body.rating table tr th.right, body.rating table tr td.right {
  text-align: right;
}
body.rating table tr td {
  font-weight: normal;
}
body.rating table tr td.name {
  max-width: 80px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.rating table tr td.name a {
  color: white;
}
body.rating table tr td.arrow button {
  border: none;
  background: none;
  padding: 0;
  margin: 0;
}
body.rating table tr td.arrow svg {
  position: relative;
  top: 1px;
  height: 13px;
  fill: green;
}
body.rating table tr td.arrow .tippy-content {
  border-color: green;
}
body.rating table tr td.arrow .tippy-arrow:before {
  border-top-color: green !important;
}
body.rating table tr td.arrow.down .tippy-content {
  border-color: red;
}
body.rating table tr td.arrow.down .tippy-arrow:before {
  border-top-color: red !important;
}
body.rating table tr td.arrow.down svg {
  fill: red;
}
body.rating table tr td.arrow.down svg {
  transform: rotate(180deg);
  fill: red;
}
body.user-rules h1 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
}
body.user-rules h1 span {
  display: block;
  line-height: 2rem;
  margin-right: 10px;
}
body.user-rules h1 form {
  display: flex;
  margin: 0;
}
body.user-rules h1 form select {
  font-size: 1rem;
}
body.user-rules .rules-nav {
  margin-bottom: 10px;
  text-align: center;
}
body.user-rules .rules-nav.active {
  display: block;
}
body.user-rules .rules-nav button {
  font-size: 18px;
  color: white;
  border: none;
  background: none;
  text-decoration: none;
  cursor: pointer;
}
body.user-rules .rules-nav button.active {
  text-decoration: underline;
}
body.user-rules .target {
  display: none;
}
body.user-rules .target.active {
  display: block;
}
body.user-rules .target .diff {
  color: red;
}
body.home {
  display: flex;
  justify-content: center;
  align-items: center;
}
body.home .content {
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: 100px auto auto 50px;
  gap: 15px;
  width: 90%;
  max-width: 300px;
}
body.home .content .logo {
  display: flex;
  justify-content: center;
}
body.home .content .logo img {
  width: auto;
  height: 100%;
}
body.home .content .message {
  text-align: center;
  color: red;
}
body.home .content .message ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
body.home .content form .item {
  margin-bottom: 15px;
}
body.home .content form .item input {
  box-sizing: border-box;
  width: 100%;
  height: 36px;
  font-size: 1.2rem;
  line-height: 2rem;
  padding: 3px 10px;
}
body.home .content form .item input.is-invalid {
  border: 2px solid red;
  color: red;
}
body.home .content form .remember-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
}
body.home .content form .remember-wrapper-item {
  width: 50%;
}
body.home .content form .remember-wrapper button {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 32px;
  color: white;
  font-size: 1.2rem;
  line-height: 1.2rem;
  padding: 3px 10px;
  border: 1px solid red;
  background: red;
  text-align: center;
  text-decoration: none;
}
body.home .content form .remember-wrapper .remember {
  display: flex;
  align-items: center;
  color: white;
}
body.home .content form .remember-wrapper .remember label {
  margin-right: 5px;
  font-size: 14px;
  line-height: 0px;
}
body.home .content form .remember-wrapper .remember input {
  margin: 0;
}
body.home .content form .login-menu {
  display: flex;
  justify-content: space-between;
  margin: 5px;
}
body.home .content form .login-menu a {
  font-size: 1rem;
  color: white;
}
body.home .content form .button button {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 32px;
  color: white;
  font-size: 1.2rem;
  line-height: 1.2rem;
  padding: 3px 10px;
  border: 1px solid red;
  background: red;
  text-align: center;
  text-decoration: none;
}
body.home .content a.google {
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  height: 36px;
  color: white;
  font-size: 1.2rem;
  line-height: 2rem;
  padding: 3px 10px;
  border: 1px solid black;
  background: #9bb3cd;
  margin-bottom: 15px;
  text-align: center;
  text-decoration: none;
}
body.home .content a.google svg {
  width: 20px;
  height: 20px;
  margin-right: 15px;
}
body.roles {
  background: red;
}
body.roles.black {
  background: black;
}
body.roles.black .role-item .role-action button {
  border: 2px solid #b9b9b9;
  background: transparent;
  color: #b9b9b9;
}
body.roles.black .role-item .role-action button:hover, body.roles.black .role-item .role-action button:active, body.roles.black .role-item .role-action button:focus {
  background: rgba(128, 128, 128, 0.53);
  color: white;
}
body.roles .nav {
  box-shadow: none;
  background: none;
}
body.roles .content-wrapper {
  padding-top: 30px;
}
body.roles .content-inner {
  display: flex;
  justify-content: center;
  height: 90vh;
}
body.roles .role-item {
  display: none;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
body.roles .role-item.show {
  display: block;
}
body.roles .role-item .player {
  display: none;
  height: 100%;
  position: relative;
}
body.roles .role-item .player.show {
  display: block;
}
body.roles .role-item .player-name {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  height: 100%;
  font-size: 48px;
}
body.roles .role-item .player-name .name {
  color: gold;
}
body.roles .role-item .player-action {
  display: flex;
  justify-content: center;
  width: 100%;
  position: absolute;
  bottom: 100px;
}
body.roles .role-item .player-action button {
  width: 100%;
  border: 2px solid #ff8e8e;
  background: transparent;
  color: #ff8e8e;
  font-size: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
}
body.roles .role-item .player-action button:hover, body.roles .role-item .player-action button:active, body.roles .role-item .player-action button:focus {
  cursor: pointer;
  background: rgba(245, 0, 0, 0.53);
  color: white;
}
body.roles .role-item .role {
  display: none;
  height: 100%;
  position: relative;
}
body.roles .role-item .role-img {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 50%;
  padding: 30px;
}
body.roles .role-item .role-img img {
  width: 100%;
  fill: red;
}
body.roles .role-item .role-img img svg {
  fill: white;
}
body.roles .role-item .role-name {
  display: flex;
  justify-content: center;
  width: 100%;
  font-size: 64px;
}
body.roles .role-item .role-action {
  display: flex;
  justify-content: center;
  width: 100%;
  position: absolute;
  bottom: 100px;
}
body.roles .role-item .role-action button {
  width: 100%;
  border: 2px solid #ff8e8e;
  background: transparent;
  color: #ff8e8e;
  font-size: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
}
body.roles .role-item .role-action button:hover, body.roles .role-item .role-action button:active, body.roles .role-item .role-action button:focus {
  cursor: pointer;
  background: rgba(245, 0, 0, 0.53);
  color: white;
}
body.roles .start-game {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 90%;
  height: 100%;
}
body.roles .start-game a {
  width: 80%;
  border: 3px solid white;
  background: transparent;
  color: white;
  font-size: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
  text-decoration: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
body.roles .start-game a:hover, body.roles .start-game a:active, body.roles .start-game a:focus {
  cursor: pointer;
  background: white;
  color: red;
}
body.process .content-wrapper {
  padding-top: 40px;
}
body.process .content-inner {
  width: 80%;
  height: 100%;
  min-height: 100vh;
  max-width: 400px;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  position: relative;
}
body.process .content-inner .role-name {
  font-size: 28px;
  color: red;
  text-align: center;
}
body.process .content-inner .message {
  margin-bottom: 10px;
  text-align: center;
}
body.process .content-inner .result-nav, body.process .content-inner .day-nav {
  display: none;
  margin-bottom: 10px;
  text-align: center;
}
body.process .content-inner .result-nav.active, body.process .content-inner .day-nav.active {
  display: block;
}
body.process .content-inner .result-nav button, body.process .content-inner .day-nav button {
  font-size: 18px;
  color: white;
  border: none;
  background: none;
  text-decoration: none;
  cursor: pointer;
}
body.process .content-inner .result-nav button.active, body.process .content-inner .day-nav button.active {
  text-decoration: underline;
}
body.process .content-inner .result-nav button.day-nav-lh, body.process .content-inner .day-nav button.day-nav-lh {
  display: none;
}
body.process .content-inner .news {
  display: none;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(7, 1fr);
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  margin-bottom: 10px;
}
body.process .content-inner .news.active {
  display: block;
}
body.process .content-inner .lh {
  display: none;
}
body.process .content-inner .lh.active {
  display: block;
}
body.process .content-inner .lh-message {
  margin-bottom: 10px;
  text-align: center;
}
body.process .content-inner .discuss, body.process .content-inner .lh-players {
  display: none;
  margin-bottom: 10px;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(6, 1fr);
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  margin-bottom: 20px;
}
body.process .content-inner .discuss.active, body.process .content-inner .lh-players.active {
  display: grid;
}
body.process .content-inner .discuss .item, body.process .content-inner .lh-players .item {
  border: 1px solid white;
  padding: 5px 10px;
}
body.process .content-inner .discuss button.numb, body.process .content-inner .lh-players button.numb {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  font-size: 18px;
  position: relative;
  color: white;
  border: 2px solid white;
  background: transparent;
}
body.process .content-inner .discuss button.numb .role, body.process .content-inner .lh-players button.numb .role {
  display: none;
  margin-right: 5px;
}
body.process .content-inner .discuss button.numb .role img, body.process .content-inner .lh-players button.numb .role img {
  height: 20px;
}
body.process .content-inner .discuss button.numb:hover, body.process .content-inner .discuss button.numb:focus, body.process .content-inner .lh-players button.numb:hover, body.process .content-inner .lh-players button.numb:focus {
  cursor: pointer;
  background: red;
}
body.process .content-inner .discuss button.numb:disabled, body.process .content-inner .lh-players button.numb:disabled {
  background: rgba(255, 255, 255, 0.33);
}
body.process .content-inner .discuss button.numb:disabled:hover, body.process .content-inner .discuss button.numb:disabled:active, body.process .content-inner .discuss button.numb:disabled:focus, body.process .content-inner .lh-players button.numb:disabled:hover, body.process .content-inner .lh-players button.numb:disabled:active, body.process .content-inner .lh-players button.numb:disabled:focus {
  cursor: auto;
  background: rgba(255, 255, 255, 0.33);
}
body.process .content-inner .discuss button.numb.active, body.process .content-inner .lh-players button.numb.active {
  color: white;
}
body.process .content-inner .discuss button.numb .icons, body.process .content-inner .lh-players button.numb .icons {
  display: flex;
  align-items: flex-end;
  position: absolute;
  height: 20px;
  width: 60px;
  left: 0;
  bottom: 0;
}
body.process .content-inner .discuss button.numb .icons span, body.process .content-inner .lh-players button.numb .icons span {
  display: none;
  width: 20px;
  height: 20px;
  margin-right: 2px;
}
body.process .content-inner .discuss button.numb .icons span.icon-dead, body.process .content-inner .lh-players button.numb .icons span.icon-dead {
  content: url(/images/skull.svg?3061c3c11163b1d139869dd9b952a14e);
}
body.process .content-inner .discuss button.numb .icons span.icon-put-1, body.process .content-inner .discuss button.numb .icons span.icon-put-2, body.process .content-inner .lh-players button.numb .icons span.icon-put-1, body.process .content-inner .lh-players button.numb .icons span.icon-put-2 {
  width: 15px;
  height: 15px;
  content: url(/images/put.svg?fba42456f538232af778791702966d5b);
}
body.process .content-inner .discuss button.numb .icons span.icon-doc-1, body.process .content-inner .discuss button.numb .icons span.icon-doc-2, body.process .content-inner .lh-players button.numb .icons span.icon-doc-1, body.process .content-inner .lh-players button.numb .icons span.icon-doc-2 {
  width: 15px;
  height: 15px;
  content: url(/images/doc.svg?533694596ef312cef5686befdf979a09);
}
body.process .content-inner .discuss button.numb .icons span.icon-foul-1, body.process .content-inner .discuss button.numb .icons span.icon-foul-2, body.process .content-inner .lh-players button.numb .icons span.icon-foul-1, body.process .content-inner .lh-players button.numb .icons span.icon-foul-2 {
  width: 15px;
  height: 15px;
  content: url(/images/check.svg?25573df9287e151e282f939c72b3cb55);
}
body.process .content-inner .discuss button.numb.frozen .icon-put-1, body.process .content-inner .lh-players button.numb.frozen .icon-put-1 {
  display: block;
}
body.process .content-inner .discuss button.numb.dead .icons .icon-dead, body.process .content-inner .lh-players button.numb.dead .icons .icon-dead {
  display: flex;
}
body.process .content-inner .discuss button.numb.put-1.show-icons .icons .icon-put-1, body.process .content-inner .discuss button.numb.put-1.show-icons .icons .icon-put-2, body.process .content-inner .discuss button.numb.put-2.show-icons .icons .icon-put-1, body.process .content-inner .discuss button.numb.put-2.show-icons .icons .icon-put-2, body.process .content-inner .lh-players button.numb.put-1.show-icons .icons .icon-put-1, body.process .content-inner .lh-players button.numb.put-1.show-icons .icons .icon-put-2, body.process .content-inner .lh-players button.numb.put-2.show-icons .icons .icon-put-1, body.process .content-inner .lh-players button.numb.put-2.show-icons .icons .icon-put-2 {
  display: block;
}
body.process .content-inner .discuss button.numb.doc-1.show-icons .icons .icon-doc-1, body.process .content-inner .discuss button.numb.doc-1.show-icons .icons .icon-doc-2, body.process .content-inner .discuss button.numb.doc-2.show-icons .icons .icon-doc-1, body.process .content-inner .discuss button.numb.doc-2.show-icons .icons .icon-doc-2, body.process .content-inner .lh-players button.numb.doc-1.show-icons .icons .icon-doc-1, body.process .content-inner .lh-players button.numb.doc-1.show-icons .icons .icon-doc-2, body.process .content-inner .lh-players button.numb.doc-2.show-icons .icons .icon-doc-1, body.process .content-inner .lh-players button.numb.doc-2.show-icons .icons .icon-doc-2 {
  display: block;
}
body.process .content-inner .discuss button.numb.dead.show-icons .icons .icon-put-1, body.process .content-inner .discuss button.numb.dead.show-icons .icons .icon-put-2, body.process .content-inner .discuss button.numb.dead.show-icons .icons .icon-doc-1, body.process .content-inner .discuss button.numb.dead.show-icons .icons .icon-doc-2, body.process .content-inner .lh-players button.numb.dead.show-icons .icons .icon-put-1, body.process .content-inner .lh-players button.numb.dead.show-icons .icons .icon-put-2, body.process .content-inner .lh-players button.numb.dead.show-icons .icons .icon-doc-1, body.process .content-inner .lh-players button.numb.dead.show-icons .icons .icon-doc-2 {
  display: none;
}
body.process .content-inner .discuss button.numb .points, body.process .content-inner .lh-players button.numb .points {
  display: none;
  position: absolute;
  right: 4px;
  bottom: 0px;
  font-size: 14px;
}
body.process .content-inner .discuss button.numb.foul-1 .icons .icon-foul-1, body.process .content-inner .lh-players button.numb.foul-1 .icons .icon-foul-1 {
  display: block;
}
body.process .content-inner .discuss button.numb.foul-2 .icons .icon-foul-2, body.process .content-inner .lh-players button.numb.foul-2 .icons .icon-foul-2 {
  display: block;
}
body.process .content-inner .discuss button.numb.foul-2 .icons .icon-foul-3, body.process .content-inner .lh-players button.numb.foul-2 .icons .icon-foul-3 {
  display: block;
}
body.process .content-inner .lh button.numb.active {
  background-color: black;
  color: white;
}
body.process .content-inner .players {
  display: none;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(6, 1fr);
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  margin-bottom: 20px;
}
body.process .content-inner .players.active {
  display: grid;
}
body.process .content-inner .players .item {
  border: 1px solid white;
  padding: 5px 10px;
}
body.process .content-inner .players button.numb {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  font-size: 18px;
  position: relative;
  color: white;
  border: 2px solid white;
  background: transparent;
  cursor: pointer;
}
body.process .content-inner .players button.numb .role {
  display: flex;
  align-items: center;
  margin-right: 5px;
}
body.process .content-inner .players button.numb .role img {
  height: 20px;
}
body.process .content-inner .players button.numb.empty img {
  display: none;
}
body.process .content-inner .players button.numb:disabled {
  background: rgba(255, 255, 255, 0.33);
}
body.process .content-inner .players button.numb:disabled:hover, body.process .content-inner .players button.numb:disabled:active, body.process .content-inner .players button.numb:disabled:focus {
  cursor: auto;
  background: rgba(255, 255, 255, 0.33);
}
body.process .content-inner .players button.numb.active {
  background: red;
  color: white;
}
body.process .content-inner .players button.numb .icons {
  display: flex;
  align-items: flex-end;
  position: absolute;
  height: 20px;
  width: 60px;
  left: 0;
  bottom: 0;
}
body.process .content-inner .players button.numb .icons span {
  display: none;
  width: 20px;
  height: 20px;
  margin-right: 2px;
}
body.process .content-inner .players button.numb .icons span.icon-dead {
  content: url(/images/skull.svg?3061c3c11163b1d139869dd9b952a14e);
}
body.process .content-inner .players button.numb .icons span.icon-put-1, body.process .content-inner .players button.numb .icons span.icon-put-2 {
  width: 15px;
  height: 15px;
  content: url(/images/put.svg?fba42456f538232af778791702966d5b);
}
body.process .content-inner .players button.numb .icons span.icon-doc-1, body.process .content-inner .players button.numb .icons span.icon-doc-2 {
  width: 15px;
  height: 15px;
  content: url(/images/doc.svg?533694596ef312cef5686befdf979a09);
}
body.process .content-inner .players button.numb .icons span.icon-foul-1, body.process .content-inner .players button.numb .icons span.icon-foul-2 {
  width: 15px;
  height: 15px;
  content: url(/images/check.svg?25573df9287e151e282f939c72b3cb55);
}
body.process .content-inner .players button.numb.frozen .icon-put-1 {
  display: block;
}
body.process .content-inner .players button.numb.dead .icons .icon-dead {
  display: flex;
}
body.process .content-inner .players button.numb.put-1.show-icons .icons .icon-put-1, body.process .content-inner .players button.numb.put-1.show-icons .icons .icon-put-2, body.process .content-inner .players button.numb.put-2.show-icons .icons .icon-put-1, body.process .content-inner .players button.numb.put-2.show-icons .icons .icon-put-2 {
  display: block;
}
body.process .content-inner .players button.numb.doc-1.show-icons .icons .icon-doc-1 {
  display: block;
}
body.process .content-inner .players button.numb.doc-2.show-icons .icons .icon-doc-2 {
  display: block;
}
body.process .content-inner .players button.numb.dead.show-icons .icons .icon-put-1, body.process .content-inner .players button.numb.dead.show-icons .icons .icon-put-2, body.process .content-inner .players button.numb.dead.show-icons .icons .icon-doc-1, body.process .content-inner .players button.numb.dead.show-icons .icons .icon-doc-2 {
  display: none;
}
body.process .content-inner .players button.numb .points {
  display: none;
  position: absolute;
  right: 4px;
  bottom: 0px;
  font-size: 14px;
}
body.process .content-inner .players button.numb.foul-1 .icons .icon-foul-1 {
  display: block;
}
body.process .content-inner .players button.numb.foul-2 .icons .icon-foul-2 {
  display: block;
}
body.process .content-inner .players button.numb.foul-2 .icons .icon-foul-3 {
  display: block;
}
body.process .content-inner .result {
  display: none;
}
body.process .content-inner .result.active {
  display: block;
}
body.process .content-inner .result .item {
  border: 1px solid white;
  padding: 5px 10px;
}
body.process .content-inner .result .item.active .details {
  display: block;
}
body.process .content-inner .result .item.active .title {
  font-size: 16px;
}
body.process .content-inner .result .item.active .title .badge button img {
  transform: rotate(180deg);
}
body.process .content-inner .result .item .title {
  display: grid;
  grid-template-columns: 1fr 1fr 20px 25px;
  grid-template-rows: 1fr;
  gap: 10px;
}
body.process .content-inner .result .item .title .numb {
  display: block;
  margin-right: 15px;
  text-align: right;
}
body.process .content-inner .result .item .title .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.process .content-inner .result .item .title .name a {
  color: white;
  text-decoration: underline;
}
body.process .content-inner .result .item .title div {
  display: flex;
  align-items: center;
}
body.process .content-inner .result .item .title div img {
  margin-right: 5px;
  width: 15px;
  height: 15px;
}
body.process .content-inner .result .item .title button {
  background: none;
  border: none;
  width: 30px;
  height: 30px;
  color: white;
}
body.process .content-inner .result .item .points {
  display: flex;
  align-items: center;
  justify-content: center;
}
body.process .content-inner .result .item .badge {
  display: flex;
  align-items: center;
  justify-content: center;
}
body.process .content-inner .result .item .badge button {
  width: 30px;
  height: 30px;
  background-color: transparent;
  border: none;
  cursor: pointer;
}
body.process .content-inner .result .details {
  display: none;
}
body.process .content-inner .result .details-item {
  display: grid;
  grid-template-columns: 1fr 1fr 20px 25px;
  grid-template-rows: 1fr;
  gap: 20px;
  color: #d5d5d5;
  font-size: 14px;
}
body.process .content-inner .result .details-item .stage::first-letter {
  text-transform: uppercase;
}
body.process .content-inner .result .details-item .target {
  display: flex;
  align-items: center;
  gap: 5px;
}
body.process .content-inner .result .details-item .target img {
  width: 15px;
  height: 15px;
}
body.process .content-inner .result .details-item .points {
  text-align: right;
}
body.process .content-inner .actions-all {
  display: none;
}
body.process .content-inner .actions-all.active {
  display: block;
}
body.process .content-inner .actions-all .item {
  display: grid;
  grid-template-columns: 0.5fr 1fr 1fr;
  gap: 20px;
}
body.process .content-inner .buttons {
  display: flex;
  justify-content: center;
  width: 100%;
}
body.process .content-inner .buttons button {
  width: 90%;
  border: 2px solid white;
  background: transparent;
  color: white;
  font-size: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
  position: fixed;
  bottom: 40px;
  max-width: 400px;
}
body.process .content-inner .buttons button:disabled {
  border: 1px solid #969696;
  color: #969696;
}
body.process .content-inner .buttons button:disabled:hover, body.process .content-inner .buttons button:disabled:active {
  border: 1px solid #969696;
  color: #969696;
}
body.process .content-inner .buttons button:hover, body.process .content-inner .buttons button:active {
  cursor: pointer;
  background: rgba(245, 0, 0, 0.53);
  color: white;
}
body.process .content-inner .timer {
  display: none;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
}
body.process .content-inner .timer.active {
  display: flex;
}
body.process .content-inner .timer .time {
  text-align: right;
  font-size: 2.8rem;
  line-height: 3rem;
  margin-right: 20px;
  min-width: 55px;
}
body.process .content-inner .timer .time.attention {
  color: gold;
}
body.process .content-inner .timer-actions button {
  background-color: transparent;
  border: 2px solid white;
  color: white;
  padding: 10px;
  cursor: pointer;
  margin-right: 10px;
}
body.process .content-inner .timer-actions button:hover, body.process .content-inner .timer-actions button:focus {
  background: black;
}
body.process .player-extra {
  position: fixed;
  width: 90%;
  max-width: 300px;
  background: #030000;
  border: 1px solid red;
  color: grey;
  margin-top: 80px;
  padding: 20px;
}
body.process .player-extra-buttons {
  display: grid;
  grid-template-columns: 48% 48%;
  gap: 15px 4%;
}
body.process .player-extra-buttons button {
  width: 100%;
  border: 2px solid red;
  background: black;
  color: red;
  font-size: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
}
body.process .player-extra-buttons button:hover, body.process .player-extra-buttons button:active, body.process .player-extra-buttons button:focus {
  background: red;
  color: white;
}
body.process .player-extra-wrapper {
  display: flex;
  justify-content: center;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
  min-height: 100%;
  background: rgba(0, 0, 0, 0.8);
}
body.process .player-extra-wrapper-two {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100vh;
}
body.process .player-extra-wrapper.black .player-extra-items .item .extra-actions button svg {
  fill: red;
}
body.process .player-extra-wrapper.black .player-extra-items .item .extra-actions button svg:hover, body.process .player-extra-wrapper.black .player-extra-items .item .extra-actions button svg:active, body.process .player-extra-wrapper.black .player-extra-items .item .extra-actions button svg:focus {
  fill: #a66d6d;
}
body.process .player-extra-info span {
  margin-right: 10px;
  font-size: 18px;
  font-weight: bold;
  color: gold;
}
body.process .player-extra-items {
  margin-bottom: 20px;
}
body.process .player-extra-items .item {
  display: flex;
  gap: 10px;
}
body.process .player-extra-items .item .extra-actions button {
  height: 30px;
  width: 30px;
  background: none;
  border: none;
  cursor: pointer;
}
body.process .player-extra-items .item .extra-actions button svg {
  fill: red;
  height: 15px;
  width: 20px;
}
body.process .player-extra-custom-item {
  margin-bottom: 15px;
}
body.process .player-extra-custom-item label {
  display: block;
  width: 100%;
}
body.process .player-extra-custom-item input, body.process .player-extra-custom-item select {
  box-sizing: border-box;
  width: 100%;
  height: 30px;
  text-align: center;
}
body.process .player-extra-custom-item textarea {
  box-sizing: border-box;
  width: 100%;
  height: 50px;
}
body.process .player-extra-custom-item button {
  width: 100%;
  border: 2px solid red;
  background: black;
  color: red;
  font-size: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
}
body.process .player-extra-custom-item button:hover, body.process .player-extra-custom-item button:active, body.process .player-extra-custom-item button:focus {
  cursor: pointer;
  background: red;
  color: white;
}
body.process .player-extra-actions button {
  width: 100%;
  border: 2px solid red;
  background: black;
  color: red;
  font-size: 16px;
  text-align: center;
  padding: 10px 15px;
  box-sizing: border-box;
}
body.process .player-extra-actions button:hover, body.process .player-extra-actions button:active, body.process .player-extra-actions button:focus {
  background: red;
  color: white;
}
body.process.day {
  background: red;
}
body.process.day .nav {
  background: red;
}
body.process.day .content-inner .role-name {
  color: gold;
}
body.process.day .content-inner button.numb.active {
  cursor: pointer;
  background: #323232;
}
body.process.day .content-inner button.numb:disabled {
  background: rgba(0, 0, 0, 0.16);
}
body.process.day .content-inner button.numb:disabled:hover, body.process.day .content-inner button.numb:disabled:active, body.process.day .content-inner button.numb:disabled:focus {
  cursor: auto;
  background: rgba(0, 0, 0, 0.16);
}
body.process.day .content-inner .discuss button.numb.active {
  background: transparent;
}
body.result.red {
  background: red;
}
body.result.red .content-inner .title {
  color: white;
}
body.result.red .nav {
  background: red;
}
body.result.black {
  background: black;
}
body.result .content-wrapper {
  padding-top: 100px;
}
body.result .content-inner {
  width: 80%;
  height: 100%;
  min-height: 100vh;
  max-width: 400px;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  position: relative;
}
body.result .content-inner .title {
  font-size: 36px;
  color: red;
  text-align: center;
  margin-bottom: 20px;
}
body.result .result-nav {
  margin-bottom: 10px;
  text-align: center;
}
body.result .result-nav.active {
  display: block;
}
body.result .result-nav button {
  font-size: 18px;
  color: white;
  border: none;
  background: none;
  text-decoration: none;
  cursor: pointer;
}
body.result .result-nav button.active {
  text-decoration: underline;
}
body.result .panel {
  display: none;
}
body.result .panel.active {
  display: block;
}
body.result .panel.game-players.active {
  display: grid;
}
body.result .panel.game-players {
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(7, 1fr);
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  min-height: 410px;
  margin-bottom: 10px;
}
body.result .panel.game-players .player {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  font-size: 18px;
  position: relative;
  color: white;
  border: 2px solid white;
  background: transparent;
}
body.result .panel.game-players .player .role {
  display: flex;
  align-items: center;
  margin-right: 5px;
}
body.result .panel.game-players .player .role img {
  height: 20px;
}
body.result .panel.game-players .player:hover, body.result .panel.game-players .player:active, body.result .panel.game-players .player:focus {
  cursor: pointer;
  background: red;
}
body.result .panel.game-players .player.empty img {
  display: none;
}
body.result .panel.game-players .player:disabled {
  background: rgba(255, 255, 255, 0.33);
}
body.result .panel.game-players .player:disabled:hover, body.result .panel.game-players .player:disabled:active, body.result .panel.game-players .player:disabled:focus {
  cursor: auto;
  background: rgba(255, 255, 255, 0.33);
}
body.result .panel.game-players .player .points {
  position: absolute;
  right: 4px;
  bottom: 0px;
  font-size: 14px;
}
body.result .game-result {
  display: none;
}
body.result .game-result.active {
  display: block;
}
body.result .game-result .item {
  border: 1px solid white;
  padding: 5px 10px;
}
body.result .game-result .item.active .details {
  display: block;
}
body.result .game-result .item.active .item-title {
  font-size: 16px;
}
body.result .game-result .item.active .item-title .badge button img {
  transform: rotate(180deg);
}
body.result .game-result .item-title {
  display: grid;
  grid-template-columns: 1fr 1fr 20px 25px;
  grid-template-rows: 1fr;
  gap: 20px;
}
body.result .game-result .item-title div {
  display: flex;
  align-items: center;
}
body.result .game-result .item-title div img {
  margin-right: 5px;
  width: 15px;
  height: 15px;
}
body.result .game-result .item-title button {
  background: none;
  border: none;
  width: 30px;
  height: 30px;
  color: white;
}
body.result .game-result .item .points {
  display: flex;
  align-items: center;
  justify-content: center;
}
body.result .game-result .item .badge {
  display: flex;
  align-items: center;
  justify-content: center;
}
body.result .game-result .item .badge button {
  display: flex;
  align-items: center;
  width: 30px;
  height: 30px;
  background-color: transparent;
  border: none;
  cursor: pointer;
}
body.result .game-result .details {
  display: none;
}
body.result .game-result .details-item {
  display: grid;
  grid-template-columns: 1fr 1fr 20px 25px;
  grid-template-rows: 1fr;
  gap: 20px;
  color: #d5d5d5;
  font-size: 14px;
}
body.result .game-result .details-item .stage::first-letter {
  text-transform: uppercase;
}
body.result .game-result .details-item .target {
  display: flex;
  align-items: center;
  gap: 5px;
}
body.result .game-result .details-item .target img {
  width: 15px;
  height: 15px;
}
body.result .game-result .details-item .points {
  text-align: right;
}
body.result .game-actions .item {
  display: flex;
}
body.result .game-actions .item div {
  width: 33%;
}
body.new-game .game {
  width: 95%;
  max-width: 400px;
}
body.new-game .game-new {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
body.new-game .game-new button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  height: 40px;
  background: none;
  border: 2px solid red;
  color: red;
  border-radius: 5px;
}
body.new-game .game-new button:hover, body.new-game .game-new button:active, body.new-game .game-new button:focus {
  cursor: pointer;
  background: red;
  color: black;
}
body.new-game .game-count {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: black;
}
body.new-game .game-count label {
  margin-bottom: 10px;
}
body.new-game .game-count input {
  width: 200px;
  height: 30px;
  margin-bottom: 20px;
  text-align: center;
}
body.new-game .game-count button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  height: 40px;
  background: none;
  border: 2px solid red;
  color: red;
  border-radius: 5px;
}
body.new-game .game-count button:hover, body.new-game .game-count button:active, body.new-game .game-count button:focus {
  cursor: pointer;
  background: red;
  color: black;
}
body.new-game .names-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 95%;
  max-width: 400px;
}
body.new-game .names-wrapper .names {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  width: 95%;
  max-width: 400px;
  background: black;
  margin-bottom: 20px;
}
body.new-game .names-wrapper .names-item {
  display: flex;
  align-items: center;
  color: white;
  width: 48%;
}
body.new-game .names-wrapper .names-item label {
  display: inline-block;
  width: 25px;
  min-width: 25px;
  padding: 1px;
  position: absolute;
  color: black;
  z-index: 1;
  text-align: center;
}
body.new-game .names-wrapper .names-item .tag-helper {
  display: none;
}
body.new-game .names-wrapper .names-item .tag-sel-ctn {
  padding-left: 30px;
  overflow-x: hidden;
  font-size: 14px;
}
body.new-game .names-wrapper .names-item .tag-sel-ctn .tag-sel-item {
  position: absolute;
}
body.new-game .names-wrapper .names-item .tag-sel-ctn .tag-sel-item .name {
  white-space: nowrap;
  overflow: hidden;
  display: inline-flex;
  height: 100%;
  max-height: 22px;
  max-width: 90px;
}
body.new-game .names-wrapper .select-roles-button-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}
body.new-game .names-wrapper .select-roles-button-wrapper button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  height: 40px;
  background: none;
  border: 2px solid red;
  color: red;
  border-radius: 5px;
}
body.new-game .names-wrapper .select-roles-button-wrapper button:hover, body.new-game .names-wrapper .select-roles-button-wrapper button:active, body.new-game .names-wrapper .select-roles-button-wrapper button:focus {
  cursor: pointer;
  background: red;
  color: black;
}
body.glory h1 {
  font-size: 1.3rem;
  font-weight: 900;
}
body.glory .items .item {
  padding: 20px;
  border: 1px solid white;
  position: relative;
  margin-bottom: 20px;
  border-radius: 5px;
  background: black;
  box-shadow: rgba(249, 0, 0, 0.3) 0px 30px 20px 0px;
}
body.glory .items .item:last-child {
  box-shadow: none;
}
body.glory .items .item .date {
  display: flex;
  align-items: center;
  font-size: 0.8rem;
  line-height: 0.8rem;
  position: absolute;
  top: 5px;
  left: 5px;
}
body.glory .items .item .date svg {
  fill: white;
  width: 12px;
  height: 12px;
  margin-right: 5px;
}
body.glory .items .item h2 {
  font-size: 1rem;
  line-height: 1.2rem;
  margin: 10px 0 10px 0;
  color: gold;
  font-weight: 900;
  text-shadow: -0.0075em 0.0075em 0 #ff0f0f, 0.005em 0.005em 0 #ff6666, 0.01em 0.01em 0 #ff6161, 0.015em 0.015em #ff5c5c, 0.02em 0.02em 0 #ff5757, 0.025em 0.025em 0 #ff5252, 0.03em 0.03em 0 #ff4d4d, 0.035em 0.035em 0 #ff4747;
}
body.glory .items .item h3 {
  font-size: 0.8rem;
  margin: 0 0 10px 0;
}
body.glory .items .item ul {
  margin: 0 0 10px;
  padding: 0;
  list-style: none;
}
body.glory .items .item ul li {
  display: flex;
  align-items: center;
  font-size: 0.8rem;
  margin-left: 10px;
  margin-bottom: 10px;
}
body.glory .items .item ul li span {
  margin-right: 5px;
}
body.glory .items .item ul li a {
  color: white;
  font-weight: bold;
}
body.glory .items .item ul li svg {
  width: 15px;
  height: 15px;
  margin-right: 5px;
}
body.glory .items .item ul li.numb-1 svg {
  fill: gold;
}
body.glory .items .item ul li.numb-2 svg {
  fill: silver;
}
body.glory .items .item ul li.numb-3 svg {
  fill: #CD7F32;
}
body.glory .items .item .games span {
  font-size: 0.8rem;
}
body.glory .items .item .games a {
  color: white;
  font-size: 0.8rem;
}
body.master .master-users-table .top {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 30px;
  margin-bottom: 15px;
}
body.master .master-users-table .top .filter-custom select {
  width: 100%;
  border: 1px solid white;
  color: white;
  background: black;
  font-size: 14px;
  padding: 5px;
}
body.master .master-users-table .top .filter-custom select option {
  background: white;
  color: black;
}
body.master .master-users-table .top .dt-search {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
body.master .master-users-table .top .dt-search input {
  border: 1px solid white;
  border-radius: 0;
  font-size: 14px;
  padding: 5px 10px;
}
body.master .master-users-table .table {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  width: 100%;
  border-collapse: collapse;
  border: 1px solid white;
  margin-bottom: 15px;
}
body.master .master-users-table .table thead {
  border: 1px solid white;
}
body.master .master-users-table .table thead th {
  padding: 3px 5px;
}
body.master .master-users-table .table thead th.th-id {
  text-align: center;
}
body.master .master-users-table .table thead th.th-count {
  text-align: center;
}
body.master .master-users-table .table thead th.dt-ordering-asc .dt-column-order {
  position: relative;
  left: 5px;
  top: 3px;
}
body.master .master-users-table .table thead th.dt-ordering-desc .dt-column-order {
  position: relative;
  left: 5px;
  top: -3px;
}
body.master .master-users-table .table tr {
  border-top: 1px solid white;
  border-right: 1px solid white;
  border-left: 1px solid white;
  border-bottom: 1px solid white;
}
body.master .master-users-table .table tr:last-child td, body.master .master-users-table .table tr:last-child th {
  border-bottom: 1px solid white;
}
body.master .master-users-table .table tr.shown {
  border-bottom: none;
}
body.master .master-users-table .table tr.child-row-class {
  border-top: none;
}
body.master .master-users-table .table td {
  padding: 3px 5px;
  width: auto;
}
body.master .master-users-table .table td.id, body.master .master-users-table .table td.count {
  width: 20%;
  min-width: 20px;
  text-align: center;
}
body.master .master-users-table .table td.id a, body.master .master-users-table .table td.count a {
  color: white;
}
body.master .master-users-table .table td.nickname {
  max-width: 100px;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.master .master-users-table .table td.nickname a {
  color: white;
}
body.master .master-users-table .table td.master-actions button {
  color: white;
  background: none;
  border: none;
  text-decoration: underline;
}
body.master .master-users-table .table td.dt-control {
  position: relative;
  top: 2px;
  right: 3px;
  cursor: pointer;
}
body.master .master-users-table .table td.dt-control:before {
  display: none;
}
body.master .master-users-table .table td.dt-control img {
  width: 15px;
  height: 15px;
}
body.master .master-users-table .table tr.shown td.dt-control img {
  transform: rotate(180deg);
}
body.master .master-users-table .bottom .dt-info {
  text-align: center;
  font-size: 12px;
  margin-bottom: 5px;
}
body.master .master-users-table .bottom .custom-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 10px;
}
body.master .master-users-table .bottom .custom-pagination select {
  width: 40px;
  height: 25px;
  padding: 0;
}
body.master .master-users-table .bottom .custom-pagination select option {
  color: black;
}
body.master .master-users-table .bottom .custom-pagination nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
}
body.master .master-users-table .bottom .custom-pagination nav .dt-paging-button {
  width: 25px;
  height: 25px;
  padding: 0;
  border: 1px solid white;
}
body.master .master-users-table .bottom .custom-pagination nav .dt-paging-button:hover, body.master .master-users-table .bottom .custom-pagination nav .dt-paging-button:active, body.master .master-users-table .bottom .custom-pagination nav .dt-paging-button:focus {
  background: red;
}
body.master .master-users-table .bottom .custom-pagination nav .dt-paging-button.current {
  border: 1px solid white;
  background: red;
}
body.master .master-users-table .bottom .custom-pagination nav .dt-paging-button.current:hover, body.master .master-users-table .bottom .custom-pagination nav .dt-paging-button.current:active, body.master .master-users-table .bottom .custom-pagination nav .dt-paging-button.current:focus {
  background: red;
  cursor: auto;
}
body.badges {
  /*.badges-wrapper {
      .item {
          .img {
              position: relative;
              img {
                  filter: grayscale(100%);
                  opacity: .5;
              }
              .counter {
                  position: absolute;
                  top: 45%;
                  left: 50%;
                  transform: translate(-50%, -50%);
                  font-size: 6rem;
                  font-weight: 300;
                  color: #c9c9c9;
                  text-shadow: 2px 8px 1px rgb(103 103 108);
                  pointer-events: none;
              }
          }
          &.active img {
              filter: none;
              opacity: 1;
          }
      }
  }*/
}
body.badges .badges-popup-title {
  display: inline-block;
  position: relative;
  padding: 0 20px;
  text-align: center;
  margin: 10px 0;
  color: white;
  font-size: 1.2rem;
  font-weight: 900;
}
body.badges .badges-popup-title::before, body.badges .badges-popup-title::after {
  content: "⭐";
  font-size: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
body.badges .badges-popup-title::before {
  left: -25px; /* расстояние слева */
}
body.badges .badges-popup-title::after {
  right: -25px; /* расстояние слева */
}
body.badges .badges-popup-title-wrapper {
  display: flex;
  justify-content: center;
}
body.badges .badges-popup-desc {
  color: lightgray;
  text-align: center;
  margin-bottom: 15px;
}
body.badges .badges-popup-table table {
  width: 100%;
  border-collapse: collapse;
}
body.badges .badges-popup-table table tr.me {
  position: relative;
  outline: 2px solid #f7f7f7;
  background-color: #808080 !important;
  outline-offset: -2px;
  background-color: rgba(255, 215, 0, 0.05);
}
body.badges .badges-popup-table table th, body.badges .badges-popup-table table td {
  padding: 3px 5px;
}
body.badges .badges-popup-table table th.left, body.badges .badges-popup-table table td.left {
  text-align: left;
}
body.badges .badges-popup-table table th.center, body.badges .badges-popup-table table td.center {
  text-align: center;
}
body.badges .badges-popup-table table th.right, body.badges .badges-popup-table table td.right {
  text-align: right;
}
body.badges .badges-popup-table table th a, body.badges .badges-popup-table table td a {
  color: lightgray;
}
body.badges .badges-popup-table table td:last-child {
  padding-right: 20px;
}
body.badges .badges-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  max-width: 420px;
  margin: 0 auto;
  padding: 0 8px;
}
body.badges .badges-wrapper .item {
  background: transparent;
  border-radius: 12px;
  text-align: center;
  position: relative;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s ease;
  cursor: pointer;
}
body.badges .badges-wrapper .item:hover {
  box-shadow: 0 8px 20px rgba(244, 48, 48, 0.62);
}
body.badges .badges-wrapper .item .img {
  display: flex;
  justify-content: center;
  position: relative;
}
body.badges .badges-wrapper .item .img img {
  width: auto;
  height: 90px;
  -o-object-fit: contain;
     object-fit: contain;
  display: block;
  filter: grayscale(1);
  opacity: 0.4;
}
body.badges .badges-wrapper .item .img img:hover, body.badges .badges-wrapper .item .img img:active, body.badges .badges-wrapper .item .img img:focus {
  filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.8));
}
body.badges .badges-wrapper .item .img .counter {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 2rem;
  font-weight: 300;
  color: #3e3e3e;
  text-shadow: none;
  pointer-events: none;
  text-align: center;
}
body.badges .badges-wrapper .item.active .img img {
  filter: none;
  opacity: 1;
}
body.badges .badges-wrapper .item.active .img .counter {
  color: #dcdcdc;
  text-shadow: 0 0px 16px rgb(255, 2, 2);
}
body.badges .badges-wrapper .item .name {
  font-size: 12px;
  font-weight: 500;
  color: #cccccc;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 360px) {
  body.badges .badges-wrapper {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
  body.badges .badges-wrapper .item .name {
    font-size: 11px;
  }
  body.badges .badges-wrapper .item .counter {
    font-size: 1rem;
  }
}

.single.player {
  display: flex;
  align-items: center;
  padding-right: 25px;
  box-sizing: border-box;
  width: 100%;
  position: relative;
  max-width: 160px;
  height: 30px;
  max-height: 30px;
  background: #616161;
  padding-left: 10px;
}
.single.player.guest {
  background: #a2a2a2;
}
.single.player .player-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 16px;
  line-height: 20px;
  color: white;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
}
.single.player .handle {
  display: flex;
  align-items: center;
  height: 100%;
  position: absolute;
  right: 5px;
}
.single.player .handle svg {
  width: 20px;
  height: 20px;
  fill: #fff;
}

.user-stats-menu, .user-rating-menu {
  display: grid;
  grid-template-columns: 32% 32% 32%;
  gap: 10px;
  margin-bottom: 20px;
}
.user-stats-menu a, .user-rating-menu a {
  display: block;
  border: 1px solid white;
  text-align: center;
  text-decoration: none;
  color: white;
  line-height: 30px;
}
.user-stats-menu a:hover, .user-stats-menu a:active, .user-stats-menu a:focus, .user-stats-menu a.active, .user-rating-menu a:hover, .user-rating-menu a:active, .user-rating-menu a:focus, .user-rating-menu a.active {
  background-color: red;
}

.user-stats-menu {
  grid-template-columns: 50% 50%;
}

.user-rating-menu {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-areas: "rating rating lh lh li li" "roles roles roles del del del";
}
.user-rating-menu .rating {
  grid-area: rating;
}
.user-rating-menu .lh {
  grid-area: lh;
}
.user-rating-menu .li {
  grid-area: li;
}
.user-rating-menu .roles {
  grid-area: roles;
}
.user-rating-menu .del {
  grid-area: del;
}

.admin-menu {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr 1fr;
  margin-bottom: 20px;
}
.admin-menu a {
  display: block;
  border: 1px solid white;
  text-align: center;
  text-decoration: none;
  color: white;
  line-height: 30px;
}
.admin-menu a:hover, .admin-menu a:active, .admin-menu a:focus {
  background: red;
}
.admin-menu a.active {
  background: red;
}

.mafka-popup {
  border: 2px solid red;
  background-color: #000;
  color: white;
  padding: 30px 20px 20px 20px;
  position: relative;
  width: 400px;
  max-width: 80%;
}
.mafka-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.75);
  display: none;
  align-items: center;
  justify-content: center;
}
.mafka-popup-overlay.position-absolute {
  position: fixed;
  inset: 0;
  overflow-y: auto;
  justify-content: center;
  align-items: flex-start;
  padding: 55px 5px;
}
.mafka-popup-overlay.position-absolute .mafka-popup {
  border-radius: 12px;
  max-width: 600px;
  width: 100%;
  padding: 5px;
  box-sizing: border-box;
}
.mafka-popup-overlay.position-absolute .mafka-popup-content {
  padding: 10px;
}
.mafka-popup-overlay.active {
  display: flex;
}
.mafka-popup button.close {
  background: none;
  border: none;
  text-decoration: none;
  color: red;
  fill: red;
  position: absolute;
  right: 15px;
  top: 10px;
}
.mafka-popup button.close:hover, .mafka-popup button.close:active, .mafka-popup button.close:focus {
  cursor: pointer;
}
.mafka-popup-content {
  padding: 20px;
}

.mafka-pagination {
  display: flex;
  justify-content: center;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  margin-bottom: 20px;
}
.mafka-pagination ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
  list-style-type: none;
  padding: 0;
  margin: 0;
}
.mafka-pagination ul .page-item .page-link {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  border: 1px solid white;
  background-color: transparent;
  margin: 0;
  color: white;
  font-size: 1rem;
  line-height: 1.5rem;
  text-decoration: none;
}
.mafka-pagination ul .page-item .page-link:hover, .mafka-pagination ul .page-item .page-link:active, .mafka-pagination ul .page-item .page-link:focus {
  cursor: pointer;
  background-color: red;
}
.mafka-pagination ul .page-item.active .page-link {
  background-color: red;
}
.mafka-pagination ul .page-item.active .page-link:hover, .mafka-pagination ul .page-item.active .page-link:active, .mafka-pagination ul .page-item.active .page-link:focus {
  cursor: auto;
}
.mafka-pagination ul .page-item.disabled .page-link:hover, .mafka-pagination ul .page-item.disabled .page-link:active, .mafka-pagination ul .page-item.disabled .page-link:focus {
  cursor: auto;
  background-color: transparent;
}

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