.profile-theme {
  padding: 30px 10px 20px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.profile-theme > div {
  display: flex;
  align-items: center;
  text-align: center;
}

.profile-title {
  padding: 30px 10px 20px 10px;
}

.profile-title h2 {
  margin-bottom: 0 !important;
  vertical-align: middle;
}

.profile-title .settings {
  height: 26px;
  vertical-align: middle;
  display: inline-block;
}

.profile-flag img {
  height: 26px;
  align-self: stretch;
  margin-left: 5px;
  background-size: cover !important;
}

.profile-badges img {
  height: 35px;
  margin-right: 5px;
  margin-bottom: 5px;
  vertical-align: middle;
  transition: transform 0.1s ease-in-out;
  -webkit-transition: -webkit-transform 0.1s ease-in-out;
}

.profile-badges img:hover {
  transform: scale(1.07);
}

.profile-badges .potm-count {
  font-family: "hk_groteskbold", sans-serif;
  margin-left: -17px;
  margin-top: -5px;
  font-size: 11px !important;
  color: #D43057;
  background: #FFFFFF;
  border: 1px solid #D43057;
  display: inline-block;
  height: 19px;
  padding: 0px 2px 1px 2px;
  border-radius: 4px;
  z-index: 10;
}

.profile-stats .levels-percentage {
  font-size: 20px;
}

.profile-stats .stat {
  display: inline-block;
}

hr {
  border-top: 1px solid rgba(205, 208, 219, 0.4);
}

h3 {
  color: var(--heading-color);
}

h5 {
  color: var(--heading-color);
  font-size: 14px;
  font-weight: 300;
}

.table a {
  color: #259fff;
}

.table a:hover {
  color: #217fc6;
  text-decoration: none;
}

#leaderboardContent tbody tr:nth-child(1) {
  background-color: var(--first-place);
}

#leaderboardContent tbody tr:nth-child(2) {
  background-color: var(--second-place);
}

#leaderboardContent tbody tr:nth-child(3) {
  background-color: var(--third-place);
}

.leaderboard-table a {
  color: #259fff;
}

.leaderboard-table a:hover {
  text-decoration: none;
}

.leaderboard-table .gold {
  background-color: var(--first-place);
}

.leaderboard-table .silver {
  background-color: var(--second-place);
}

.leaderboard-table .bronze {
  background-color: var(--third-place);
}

.leaderboard-table td {
  color: var(--leaderboard-font);
}

.winner-box {
  padding-left: 0;
}

.winner-box .winner-badge-box .winner-badge {
  height: 30px;
  display: inline-block;
  vertical-align: middle;
  transition: transform 0.1s ease-in-out;
  -webkit-transition: -webkit-transform 0.1s ease-in-out;
}

.winner-box .winner-badge-box .winner-badge:hover {
  transform: scale(1.07);
}

.winner-box .winner-badge-box h5 {
  color: var(--heading-color);
  font-size: 16px;
  display: inline-block;
  vertical-align: middle;
  margin: 0;
}

.winner-box .winner-name-box a {
  font-size: 16px;
  font-weight: 300;
  color: #259fff;
  display: inline-block;
  vertical-align: middle;
}

.winner-box .winner-name-box .flag {
  height: 16px;
  display: inline-block;
  vertical-align: middle;
  cursor: initial;
}

.row.winner-div {
  margin: 0;
}

.gamemode label {
  color: #594200;
  background-color: #ffbf00;
  cursor: pointer;
}

.gamemode label.active {
  color: #ffbf00 !important;
  background-color: #594200 !important;
}

.leaderboard-table {
  width: 100% !important;
}

#premium-btn {
  display: inline-block;
  font-weight: bold;
  font-size: 14px !important;
  padding: 6px 17px;
  margin-top: 4px;
  border-radius: 5px;
  box-sizing: border-box;
  text-decoration: none;
  text-transform: uppercase;
  color: #fff;
  background: linear-gradient(160deg, #fcff9e 0%, #c67700 100%);
  box-shadow: inset 0 -0.6em 0 -0.35em rgba(0, 0, 0, 0.17);
  text-align: center;
  position: relative;
}

#register-btn {
  display: inline-block;
  width: initial;
}

.premium-container h1 {
  color: #fff;
  text-align: center;
  padding: 20px;
  background: linear-gradient(160deg, #fcff9e 0%, #c67700 100%);
  border-radius: 5px;
}

.premium-container p {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.33;
  color: #798792;
}

.premium-container .card-deck h5 {
  font-size: 20px;
  font-weight: 600;
}

.premium-container .card-body {
  background-color: var(--footer-background);
}

.dropdown-menu a {
  text-decoration: none;
}

.btn-primary {
  border-radius: 5px;
  background-color: #249fff;
  font-weight: bold;
  font-size: 14px !important;
  color: #ffffff;
  padding: 6px 17px;
  text-transform: uppercase;
  margin-top: 4px;
  border: 0;
}

.dropdown-item.active,
.dropdown-item:active {
  background-color: #249fff;
}

.alert.parsley {
  margin-top: 5px;
  margin-bottom: 0px;
  padding: 10px 15px 10px 15px;
}

.check .alert {
  margin-top: 20px;
}

.credit-card-box .panel-title {
  display: inline;
  font-weight: bold;
}

.credit-card-box .display-td {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  text-align: center;
}

.credit-card-box .display-tr {
  display: table-row;
}

:root {
  --first-place: #fef7eb;
  --second-place: #f8f8f8;
  --third-place: #f8f0ee;
  --auth-user-place: #fff3cd;
}

[data-theme=dark] {
  --first-place: #2C4357;
  --second-place: #243748;
  --third-place: #1E2E3C;
  --auth-user-place: #1A3849;
}

.my-score {
  background-color: var(--auth-user-place);
}

.delete-button {
  background-color: #eb0000;
  color: #fff;
  border: 0;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  text-align: center;
}

.app-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin: 20px auto 0;
  gap: 10px;
}

.app-buttons__badge-apple {
  width: 150px !important;
}

.app-buttons__badge-google {
  width: 150px !important;
}

@media (max-width: 575px) {
  .app-buttons__badge-apple {
    width: initial !important;
    height: 46px !important;
  }

  .app-buttons__badge-google {
    width: initial !important;
    height: 46px !important;
  }
}