:root {
  --primary: #207843;
  --secondary: #fdfdfd;
  --text: rgb(39, 39, 39);
  --hover-text: #142e1f;
  --button: #719780;
  --active-button: #3e5f4b;
  --border-radius-button: 17px;
  --button-text-weight: 600;
  --menu-padding: 30px 20px;
  --skin-button: rgb(22, 110, 93);
  --font-size: 14px;
  --center-height: 460px;
  --menu-height: 460px;
  --menu-widht: 421px;
}

#title, .top-users__inner h2 {
  font-size: 24px;
}

.skin-select {
  border: 1px solid var(--text);
  border-radius: var(--border-radius-button) !important;
  background: var(--button);
  font-weight: var(--button-text-weight);
}

.top-users__inner p {
  font-size: var(--font-size);
}

.menu__item>div:nth-child(2) {
  margin: 0 auto;
  width: fit-content;
}

.form-group__flex {
  gap: 10px;
  flex-direction: column-reverse;
  margin-bottom: 30px;
}

.svg.svg-icon>path {
  fill: var(--active-button) !important;
  stroke: var(--active-button) !important;
}

.alert-danger {
  background: var(--active-button) !important;
  border-color: var(--text);
}

.alert-danger * {
  color: var(--text) !important;
}

h1,
h2,
h3,
h4,
h5,
h6 label,
#title {
  color: var(--text) !important;
  margin-bottom: 1.25rem;
  margin-top: 0.25px;
  font-weight: 600;
}

p {
  color: var(--text) !important;
}

a {
  color: var(--button) !important;
}

.menu {
  box-shadow: 0px 0px 3px var(--primary);
  border-radius: var(--border-radius-button) !important;
  background: var(--primary) !important;
}

.btn-play,
.stats-btn__share-btn,
.stats-btn__continue,
.button-success,
#gamemode {
  background: var(--button);
  background-color: var(--button) !important;
  color: var(--text) !important;
  border-color: var(--button);
  border-radius: var(--border-radius-button) !important;
  font-weight: var(--button-text-weight);
  border-style: solid;
  border-width: 1px;
}

.btn-play,
.stats-btn__share-btn,
.stats-btn__continue,
.button-success {
  font-size: var(--font-size) !important;
}

.btn-play:hover,
.stats-btn__share-btn:hover,
.stats-btn__continue:hover,
.button-success:hover {
  background: var(--active-button);
  background-color: var(--active-button) !important;
  border-color: var(--active-button);
  color: var(--hover-text);
}

#nick,
#skin {
  background: var(--button) !important;
  border-color: var(--button) !important;
  border-radius: var(--border-radius-button) !important;
  color: var(--text) !important;
  font-weight: var(--button-text-weight);
}

#nick::placeholder,
#skin::placeholder {
  color: var(--hover-text) !important;
  opacity: 0.5;
}

.form-group__row {
  background: transparent !important;
}

#right-menu .top-users {
  padding: var(--menu-padding) !important;
  box-shadow: 0px 0px 3px var(--primary) !important;
  border-radius: var(--border-radius-button) !important;
  background: var(--primary) !important;
  color: var(--text) !important;
  border-color: var(--button) !important;
}



.skin-select__icon,
input {
  border-radius: var(--border-radius-button) !important;
}

.skin-select__icon-text,
.skin-select__icon,
input,
#gamemode {
  color: var(--text) !important;
}

.pretty .state label {
  color: var(--text) !important;
}

.svg-icon,
.svg {
  background: var(--button);
  border-radius: 2px;
}

.skin-select__icon-cross {
  background-color: var(--active-button);
  border-color: var(--active-button);
  border-radius: var(--border-radius-button) !important;
}

.stats__inner {
  width: 100% !important;
}

.menu .menu--stats-mode {
  width: 385px;
}

#gallery-header {
  background: rgba(35, 35, 35, 0.5) !important;
}

.skinName {
  color: var(--text) !important;
}

#gallery-content {
  background-color: var(--button) !important;
  border-radius: var(--border-radius-button) !important;
}

#btn-tab1 {
  background: var(--active-button) !important;
}

#btn-tab1:hover {
  background: var(--primary) !important;
}

#skins-premium .skin:hover .skin-action {
  background: rgba(35, 35, 35, 0.1);
}

.skin {
  background-color: rgba(35, 35, 35, 0.5) !important;
}

.stats__item>span {
  color: var(--text) !important;
}

.top-users__inner,
.top-users {
  height: var(--menu-height) !important;
  max-width: var(--menu-widht);
}

#menu-wrapper,
#right-menu {
  max-width: var(--menu-widht) !important;
  width: 100% !important;
}

#right-menu .top-users,
.menu {
  padding: var(--menu-padding) !important;
  overflow: hidden;
}

.top-users {
  overflow-y: auto;
}

.top-users__inner {
  height: 100% !important;
}

#menu {
  height: var(--center-height) !important;
}