.flex-sbc, .flex-sbs, .flex-sbe,
.flex-cc, .flex-cs, .flex-ce,
.flex-sc, .flex-ss, .flex-se,
.flex-ec, .flex-es, .flex-ee {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.flex-sbc, .flex-sbs, .flex-sbe {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.flex-cc, .flex-cs, .flex-ce {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.flex-sc, .flex-ss, .flex-se {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.flex-ec, .flex-es, .flex-ee {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.flex-sbc, .flex-cc, .flex-sc, .flex-ec {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.flex-sbs, .flex-cs, .flex-ss, .flex-es {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.flex-sbe, .flex-ce, .flex-se, .flex-ee {
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}

.socials {
  width: 50px;
  height: auto;
  position: fixed;
  z-index: 10;
  top: calc( 100vh / 2);
  left: 60px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media (max-width: 1700px) {
  .socials {
    left: 30px;
  }
}

@media (max-width: 1600px) {
  .socials {
    left: 10px;
    width: 30px;
  }
}

@media (max-width: 1024px) {
  .socials {
    display: none;
  }
}

.socials__item:not(:last-child) {
  margin-bottom: 20px;
}

@media (min-width: 1024px) {
  .enchant-rate-item {
    width: 50% !important;

  }
  .enchant-rates-table {
    padding-right: 15px;
  }
}
.circle-button {
  width: 50px;
  height: 50px;
  border-radius: 50px;
  border: 1px solid #3c3c3b;
  box-shadow: 0 0 1px 0px #3c3c3b inset, 0 0 1px 0px #3c3c3b;
  position: relative;
}

.circle-button.orange {
  border: 1px solid #ff9c00;
  box-shadow: 0 0 1px 0px #ff9c00 inset, 0 0 1px 0px #ff9c00;
}

.circle-button:hover:after {
  background: #61615f;
}

.circle-button.orange:hover:after {
  background: #ffc63c;
}

.circle-button:after {
  content: '';
  width: calc( 100% - 8px);
  height: calc( 100% - 8px);
  border-radius: 50px;
  background: #3c3c3b;
  position: absolute;
  top: 4px;
  left: 4px;
  z-index: 1;
  -webkit-transition: background .3s ease-in-out;
  -o-transition: background .3s ease-in-out;
  transition: background .3s ease-in-out;
}

.circle-button.orange:after {
  background: #ff9c00;
}

.circle-button span {
  font-size: 18px;
  line-height: 18px;
  position: relative;
  z-index: 2;
  color: #cfcfcf;
  -webkit-transition: color .3s ease-in-out;
  -o-transition: color .3s ease-in-out;
  transition: color .3s ease-in-out;
}

.circle-button.orange span {
  color: #1f1f1f;
}

.circle-button:hover span {
  color: #fff;
}

.circle-button.orange:hover span {
  color: #1f1f1f;
}