@charset "utf-8";

/* CSS Document */
@font-face {
  font-family: 'Montserrat Thin';
  src: local('Montserrat Thin'), local('Montserrat Thin'),
    url(../fonts/Montserrat-Thin.ttf) format('opentype'),
    url('../fonts/Montserrat-Thin.woff') format('woff');
  font-style: normal;
}

@font-face {
  font-family: 'Montserrat Regular';
  src: local('Montserrat Regular'), local('Montserrat Regular'),
    url(../fonts/Montserrat-Regular.ttf) format('opentype'),
    url('../fonts/Montserrat-Regular.woff') format('woff');
  font-style: normal;
}

@font-face {
  font-family: 'Montserrat Medium';
  src: local('Montserrat Medium'), local('Montserrat Medium'),
    url(../fonts/Montserrat-Medium.ttf) format('opentype'),
    url('../fonts/Montserrat-Medium.woff') format('woff');
  font-style: normal;
}

@font-face {
  font-family: 'Montserrat Bold';
  src: local('Montserrat Bold'), local('Montserrat Bold'),
    url(../fonts/Montserrat-Bold.ttf) format('opentype'),
    url('../fonts/Montserrat-Bold.woff') format('woff');
  font-style: normal;
}

@font-face {
  font-family: 'Montserrat Black';
  src: local('Montserrat Black'), local('Montserrat Black'),
    url(../fonts/Montserrat-Black.ttf) format('opentype'),
    url('../fonts/Montserrat-Black.woff') format('woff');
  font-style: normal;
}



:root {
  --font-family-1: "Montserrat Thin";
  --font-family-2: "Montserrat Regular";
  --font-family-3: "Montserrat Medium";
  --font-family-4: "Montserrat Bold";
  --font-family-4: "Montserrat Black";

  /*COLORS*/
  --color1: #ffffff;
  /*Белый*/
  --color2: #060322;
  /*Синий*/
  --color2a: #260856;
  /*Голубой*/
  --color3: #7667a4;
  /*Голубой 2*/
  --color3a: #1BE4FF;
  /*Голубой 2*/
  --color4: #000000;
  /*Чёрный*/
  --color5: #A20AFF;
  /*Фиолетовый*/
  --color6: #045dff;
  /*Синий*/
  --color7: #ff04d5;
  /*Розовый*/
  --color8: #43568d;
  /*СЕРО-СИНИЙ*/
  --color9: #374776;
  /*СЕРО-СИНИЙ2*/
}

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  background: var(--color2a);
  width: 100%;
  height: 100%;
  z-index: 999;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.preloader img {
  height: 50px;
  width: 50px;
  display: block;
  margin: auto;
}

html {
  height: 100%;
  width: 100%;
}

* {
  margin: 0;
  padding: 0;
  outline: none !important;
}

*::-webkit-scrollbar,
html *::-webkit-scrollbar {
  height: 12px;
  width: 10px;
}

*::-webkit-scrollbar-track,
html *::-webkit-scrollbar-track {
  background: var(--color3);
  border-radius: 5px;
}

*::-webkit-scrollbar-thumb,
html *::-webkit-scrollbar-thumb {
  background-color: var(--color9);
  border-radius: 5px;
  border: 3px solid transparent;
  cursor: pointer;
}

*::-webkit-scrollbar-thumb:hover,
html *::-webkit-scrollbar-thumb:hover {
  background-color: var(--color2a);
  border-radius: 5px;
  border: 3px solid transparent;
  cursor: pointer;
}

input::placeholder {
  color: var(--color1);
}

input::-webkit-input-placeholder {
  color: var(--color1);
}

input::-moz-placeholder {
  color: var(--color1);
}

input:-moz-placeholder {
  color: var(--color1);
}

input:-ms-input-placeholder {
  color: var(--color1);
}

body {
  font-family: var(--font-family-2);
  position: relative;
  background-color: #060322;
  background-repeat: repeat;
  height: 100%;
  width: 100%;
  color: var(--color1);
}

.flex-column {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.flex-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.overflow-x {
  overflow-x: hidden;
  overflow-y: hidden;
}

.ellipse1 {
  position: absolute;
  width: 80%;
  height: 400px;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  background-image: url('../images/Ellipse1.png');
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
}

.login-form {
    max-width: 500px;
    width: 100%;
    height: 100%;
    margin: auto;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.login-form-wrap {
  min-height: 500px;
}

.login-logo {
  width: 100%;
  text-align: center;
  margin-bottom: 30px;
}

.login-logo img {
  width: 60%;
  display: block;
  margin: auto;
}

.login-generator {
    width:90%;
    margin: auto;
}

.login-generator img{
    width:100%;
    margin: auto;
}

.login-language-head {
  font-family: var(--font-family-3);
  text-align: center;
  padding: 10px 0;
  font-size: 22px;
}

.login-language>div {
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
    text-align:center;
    margin-bottom: 15px;
}

.login-language-title {
  text-align: left;
  padding-left: 15px !important;
}

.login-language-value>div {
  width: calc(100% / 3);
}

.login-language-value input {
  display: none;
}

.login-language-value input+label {
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  font-size: 14px;
}

.login-language-value input+label:after {
  content: '';
  position: absolute;
  top: 1px;
  left: 0;
  width: 20px;
  height: 20px;
  border: 2px solid var(--color5);
  border-radius: 10px;
  display: none !important;
}

.login-language-value input:checked+label:before {
  content: '';
  position: absolute;
  top: 4px;
  left: 3px;
  width: 14px;
  height: 14px;
  background: rgb(162, 10, 255);
  background: linear-gradient(180deg, rgba(162, 10, 255, 1) 0%, rgba(2, 46, 178, 1) 100%);
  border-radius: 10px;
  display: none !important;
}

.login-language-value input+label img  {
  border: 6px solid rgba(0,255,25,0);
  border-radius:50%;
}

.login-language-value input:checked+label img  {
  border: 6px solid rgba(0,255,25,0.4);
  border-radius:50%;
}

.login-inputs {
  padding: 15px;
}

.form-input {
  margin-bottom: 15px;
}

.form-input input {
  width: 100%;
  padding: 15px 25px;
  background-color: var(--color3);
  color: var(--color1);
  border: 0;
  border-radius: 30px;
}

.form-button {
  color: var(--color1);
  font-size: 16px;
  font-family: var(--font-family-3);
  font-weight: 700;
  border-radius: 30px;
  padding: 12px 15px;
  text-decoration: none;
  margin: auto;
  display: block;
  border: 0;
  background: linear-gradient(130deg,
      var(--color5),
      var(--color7));
  max-width: 270px;
  min-width: 270px;
  text-align: center;
}

.button-readmore {
  color: var(--color1);
  font-size: 16px;
  font-family: var(--font-family-3);
  font-weight: 700;
  border-radius: 10px;
  padding: 12px 15px;
  text-decoration: none;
  margin: auto;
  display: block;
  border: 0;
  background: linear-gradient(130deg,
      var(--color5),
      var(--color7));
  text-align: center;
}

@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 75%;
  }

  100% {
    background-position: 0% 50%;
  }
}

.form-button:hover,
.button-readmore:hover {
  background: linear-gradient(130deg,
      var(--color5),
      var(--color3a),
      var(--color7));
  color: var(--color1);
  background-size: 500% 100%;
  animation: gradient 8s ease infinite;
  transform: translate3d(0, 0, 0);
}

.form-button-outline {
  color: var(--color1);
  font-size: 16px;
  font-family: var(--font-family-3);
  font-weight: 700;
  border-radius: 30px;
  padding: 12px 15px;
  text-decoration: none;
  margin: auto;
  display: block;
  border: 1px solid var(--color7);
  max-width: 270px;
  min-width: 270px;
  text-align: center;
  cursor: pointer;
  -moz-transform: translateX(0px);
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.4s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.4s ease-in-out;
}

.form-button-outline:hover {
  border: 1px solid var(--color7);
  color: var(--color7);
}

.form-link {
  margin: auto;
  text-align: center;
  color: var(--color1);
  font-size: 12px;
  text-decoration: none;
  display: block;
  padding: 15px 0;
  -moz-transform: translateX(0px);
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.4s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.4s ease-in-out;
}

.form-link:hover {
  color: var(--color7);
}

.form-error {
  font-size: 12px;
  color: red;
  text-align: center;
  padding: 5px;
}

.form-checkbox input {
  display: none;
}

.form-checkbox {
  padding: 15px 0;
}

.form-checkbox input+label {
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  font-size: 14px;
}

.form-checkbox input+label:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  border: 2px solid var(--color5);
  border-radius: 10px;
}

.form-checkbox input:checked+label:before {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 14px;
  height: 14px;
  background: rgb(162, 10, 255);
  background: linear-gradient(180deg, rgba(162, 10, 255, 1) 0%, rgba(2, 46, 178, 1) 100%);
  border-radius: 10px;
}

.left-panel {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 3;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: var(--color2);
  width: 320px;
  color: var(--color1);
  height: 100%;
  min-height: 400px;
  -webkit-box-shadow: 10px 5px 17px -11px rgb(90 50 255 / 80%);
  box-shadow: 10px 5px 17px -11px rgb(90 50 255 / 80%);
  background-size: 200%;
  background-repeat: no-repeat;
  background-position: top center;
  -moz-transform: translateX(0px);
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.4s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.4s ease-in-out;
  background-image: url(../images/Ellipse3.png);
  background-size: 300%;
  background-position: 20% -350px;
}

.left-panel-wrap {
  width: 100;
  position: relative;
  height:100%;
}

.left-panel-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 20px;
  height: 20px;
  background-image: url('../images/icon-close.png');
  background-size: contain;
  cursor: pointer;
  display: none;
}

.left-panel-login {
  padding: 30px 0 30px 12px;
}

.left-panel-login img {
  width: 270px;
}

.left-panel-links {
  padding: 15px 10px;
}

.left-panel-links i{
  font-size: 30px;
}

.left-panel-links ul {
  margin: 0;
  padding: 0;
}

.left-panel-links ul li {
  display: block;
  margin-bottom: 20px;
}

.left-panel-links ul li a {
  display: block;
  color: var(--color1);
  text-decoration: none;
  font-size: 14px;
  -moz-transform: translateX(0px);
  -moz-transition: all 0.6s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.6s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.6s ease-in-out;
}

.left-panel-links ul li a:hover {
  text-shadow: 0 1px 10px rgba(255, 255, 255, 0.8);
  -moz-transform: translateX(0px);
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.3s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.3s ease-in-out;
}

.left-panel-links span {
  margin-left: 15px;
  color: var(--color1);
}

.left-panel-links img {
  width: 30px;
}

.left-panel+.center-panel {
  padding-left: 320px;
}

.center-panel {
  position: relative;
  z-index: 2;
}

.top-panel {
  display: none;
  position: relative;
  width: 100%;
  height: 60px;
  background-color: rgba(2, 46, 178, 0.2);
}

.mobile-menu-icon {
  position: absolute;
  top: 15px;
  right: 15px;
}

.mobile-menu-icon-wrap {
  position: relative;
  width: 30px;
  height: 30px;
  cursor: pointer;
}

.mobile-menu-icon-wrap span:nth-child(1) {
  display: block;
  background-color: var(--color3a);
  position: absolute;
  top: 5px;
  width: 100%;
  height: 2px;
}

.mobile-menu-icon-wrap span:nth-child(2) {
  display: block;
  background-color: var(--color3a);
  position: absolute;
  top: 15px;
  width: 100%;
  height: 2px;
}

.mobile-menu-icon-wrap span:nth-child(3) {
  display: block;
  background-color: var(--color3a);
  position: absolute;
  top: 25px;
  width: 100%;
  height: 2px;
}

.content-panel {
  padding: 30px;
}

.content-panel-title {
    padding:15px;
}

.content-panel-title h1 {
  font-family: var(--font-family-3);
  font-size: 22px;
  font-weight: 600;
  text-align: center;
}

.address-wallet {
  background-color: var(--color8);
  padding: 30px;
  border-radius: 30px;
  box-shadow: 0 2px 30px -10px rgba(0, 0, 0, 0.3);
}

.address-wallet label {
  font-size: 12px;
  margin-bottom: 5px;
}

.button-dual {
  background: linear-gradient(130deg, var(--color5), var(--color7));
  border: 0;
}


.button-dual img {
  width: 30px;
}

.form-input-dual {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.form-input-dual input {
  width: 90%;
  background-color: transparent;
  border-left: 1px solid var(--color3);
  border-top: 1px solid var(--color3);
  border-bottom: 1px solid var(--color3);
  border-right: none;
  padding: 10px;
  border-radius: 15px 0 0 15px;
  color: var(--color1);
}

.form-input-dual button {
  width: 10%;
  border-radius: 0 15px 15px 0;
}

.form-input-dual-text input {
  width: 70%;
  background-color: transparent;
  border-left: 1px solid var(--color3);
  border-top: 1px solid var(--color3);
  border-bottom: 1px solid var(--color3);
  border-right: none;
  border-radius: 30px 0 0 30px;
  box-sizing: border-box;
  padding: 15px 25px;
  display: inline-block;
  color: var(--color1);
}

.form-input-dual-text button {
  width: 29%;
  box-sizing: border-box;
  border-radius: 0 30px 30px 0;
  color: var(--color1);
  padding: 16px 0;
  margin-left: -5px;
}

.swal-footer {
  text-align: center;
}

.swal-button {
  background: linear-gradient(130deg, var(--color5), var(--color7));
  border: 0;
}

.notification {
  position: absolute;
  top: 30px;
  right: 30px;
  width: 36px;
  height: 36px;
  cursor: pointer;
}

.notification-wrap {
  position: relative;
  width: 36px;
  height: 36px;
}

.notification-wrap img {
  width: 100%;
}

.notification-wrap span {
  position: absolute;
  top: -5px;
  right: -5px;
  font-size: 12px;
  line-height: 20px;
  width: 20px;
  height: 20px;
  background-color: var(--color5);
  border-radius: 15px;
  text-align: center;
}

.balance {
  padding: 30px 15px;
  text-align: left;
  font-family: var(--font-family-3);
}

.balance-title {
    font-size: 16px;
    font-weight: 100;
}

.balance-content {
    font-size: 22px;
    padding: 0;
    font-weight: bold;
}
.balance-content #balanceFiat{
    font-size: 12px;
    color:#8be58e;
}

.balance-content span {
  margin: 0 5px;
}

.button-outline {
  color: var(--color1);
  font-size: 16px;
  font-family: var(--font-family-3);
  font-weight: 700;
  border-radius: 30px;
  padding: 12px 15px;
  text-decoration: none;
  margin: auto;
  display: block;
  border: 1px solid var(--color7);
  max-width: 270px;
  min-width: 270px;
  text-align: center;
  cursor: pointer;
  -moz-transform: translateX(0px);
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.4s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.4s ease-in-out;
  margin-bottom: 15px;
  background-color: #fff0;
}

.button-outline:hover {
  border: 1px solid var(--color7);
  color: var(--color7);
}

.buttons-panel {
     display: flex;
    flex-direction: row;
    gap: 1%;
    justify-content: space-around;
}

.buttons-panel > div {
    width: 45%;
}

.buttons-panel > div > button {
    width:100% !important;
}

.button-outline img {
  width: 18px;
  vertical-align: sub;
}

.generator-item {
  width: 50%;
  padding: 10px;
}

.generator-item-wrap {
  background: #350061;
  background: linear-gradient(94deg, rgba(53, 0, 97, 1) 0%, rgba(38, 1, 59, 1) 20%, rgba(43, 3, 59, 1) 77%, rgba(43, 3, 59, 1) 77%, rgb(12 0 16) 100%);
  padding: 15px;
  box-sizing: border-box;
  border: 1px solid var(--color5);
  border-radius: 10px;
  height: 100%;
  -moz-transform: translateX(0px);
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.2s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.2s ease-in-out;
}

.generator-item-wrap:hover {
  box-shadow: 0 2px 30px -10px rgba(162, 10, 255, 1);
}

.generator-item-image {
  flex-grow: 0;
  flex-shrink: 0;
}

.generator-item-image-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.generator-item-image-wrap img{
   max-width:512px;
   width:100%;
}


/*КАДРЫ АНИМАЦИИ*/
/*ONE*/
.onegen {
  background-position: 0 0;
  background-size: 400%;
  width: 200px;
  height: 169px;
}

.onegen1 {
  background-position: 0 0;
}

.onegen2 {
  background-position: -200px 0;
}

.onegen3 {
  background-position: -400px 0;
}

.onegen4 {
  background-position: -600px 0;
}

.onegen5 {
  background-position: 0 -166.5px;
}

.onegen6 {
  background-position: -200px -166.5px;
}

.onegen7 {
  background-position: -400px -166.5px;
}

.onegen8 {
  background-position: -600px -166.5px;
}

.onegen9 {
  background-position: 0 -333px;
}

.onegen10 {
  background-position: -200px -333px;
}

.onegen11 {
  background-position: -400px -333px;
}

.onegen12 {
  background-position: -600px -333px;
}

.onegen13 {
  background-position: 0 -499px;
}

.onegen14 {
  background-position: -200px -499px;
}

/*TWO*/
.twogen {
  background-position: 0 0;
  background-size: 307%;
  width: 200px;
  height: 126px;
}

.twogen1 {
  background-position: 0 0;
}

.twogen2 {
  background-position: -205px 0;
}

.twogen3 {
  background-position: -409.5px 0;
}

.twogen4 {
  background-position: -614px 0;
}

.twogen5 {
  background-position: 0 -118.5px;
}

.twogen6 {
  background-position: -205px -118.5px;
}

.twogen7 {
  background-position: -409.5px -118.5px;
}

.twogen8 {
  background-position: -614px -118.5px;
}

.twogen9 {
  background-position: 0 -237px;
}

.twogen10 {
  background-position: -205px -237px;
}

.twogen11 {
  background-position: -409.5px -237px;
}

.twogen12 {
  background-position: -614px -237px;
}

.twogen13 {
  background-position: 0 -355.5px;
}

.twogen14 {
  background-position: -205px -355.5px;
}

/*three*/
.threegen {
  background-position: 0 0;
  background-size: 307%;
  width: 200px;
  height: 113px;
}

.threegen1 {
  background-position: 0 0;
}

.threegen2 {
  background-position: -205px 0;
}

.threegen3 {
  background-position: -409.5px 0;
}

.threegen4 {
  background-position: -614px 0;
}

.threegen5 {
  background-position: 0 -116px;
}

.threegen6 {
  background-position: -205px -116px;
}

.threegen7 {
  background-position: -409.5px -116px;
}

.threegen8 {
  background-position: -614px -116px;
}

.threegen9 {
  background-position: 0 -232.5px;
}

.threegen10 {
  background-position: -205px -232.5px;
}

.threegen11 {
  background-position: -409.5px -232.5px;
}

.threegen12 {
  background-position: -614px -232.5px;
}

.threegen13 {
  background-position: 0 -348.5px
}

.threegen14 {
  background-position: -205px -348.5px
}

/*fourgen*/
.fourgen {
  background-position: 0 0;
  background-size: 307%;
  width: 200px;
  height: 113px;
}

.fourgen1 {
  background-position: 0 0;
}

.fourgen2 {
  background-position: -205px 0;
}

.fourgen3 {
  background-position: -409.5px 0;
}

.fourgen4 {
  background-position: -614px 0;
}

.fourgen5 {
  background-position: 0 -116px;
}

.fourgen6 {
  background-position: -205px -116px;
}

.fourgen7 {
  background-position: -409.5px -116px;
}

.fourgen8 {
  background-position: -614px -116px;
}

.fourgen9 {
  background-position: 0 -232.5px;
}

.fourgen10 {
  background-position: -205px -232.5px;
}

.fourgen11 {
  background-position: -409.5px -232.5px;
}

.fourgen12 {
  background-position: -614px -232.5px;
}

.fourgen13 {
  background-position: 0 -348.5px
}

.fourgen14 {
  background-position: -205px -348.5px
}

/*fourgen*/
.fivegen {
  background-position: 0 0;
  background-size: 307%;
  width: 200px;
  height: 113px;
}

.fivegen1 {
  background-position: 0 0;
}

.fivegen2 {
  background-position: -205px 0;
}

.fivegen3 {
  background-position: -409.5px 0;
}

.fivegen4 {
  background-position: -614px 0;
}

.fivegen5 {
  background-position: 0 -116px;
}

.fivegen6 {
  background-position: -205px -116px;
}

.fivegen7 {
  background-position: -409.5px -116px;
}

.fivegen8 {
  background-position: -614px -116px;
}

.fivegen9 {
  background-position: 0 -232.5px;
}

.fivegen10 {
  background-position: -205px -232.5px;
}

.fivegen11 {
  background-position: -409.5px -232.5px;
}

.fivegen12 {
  background-position: -614px -232.5px;
}

.fivegen13 {
  background-position: 0 -348.5px
}

.fivegen14 {
  background-position: -205px -348.5px
}


/*КАДРЫ АНИМАЦИИ END*/

.generator-item-text {
  flex-grow: 1;
  flex-shrink: 1;
  padding: 0;
}

.generator-item-text-option {
  margin: 10px 0;
}

.generator-item-text-class {
  color: var(--color5);
}

.modal-style {
  background-color: var(--color8);
  color: var(--color1);
  border-radius: 30px;
  border: 0;
  padding: 5px 15px;
  box-sizing: border-box;
  box-shadow: 0 2px 40px -10px rgba(6, 68, 255, 0.9);
}

.modal-style .modal-header {
  border-bottom: 1px solid var(--color9);
}

.modal-style .modal-footer {
  border-top: 1px solid var(--color9);
  font-size: 12px;
}

.product-image {
  text-align: center;
  margin-bottom: 30px;
}

.product-image img {
  max-width: 100%;
  border-radius: 30px;
}

.product-install {
  margin-bottom: 15px;
  text-align: center;
}

.product-install span,
.product-install a {
  display: inline-block;
  margin-right: 30px;
}

.product-install span {
  padding: 10px 0;
  font-family: var(--font-family-3);
  font-size: 18px;
}

.product-install a {
  margin: inherit;
  padding: 10px 50px;
}

.textConfirm {
  text-align: center;
  margin-bottom: 15px;
}

.confirmButtons {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
}

.confirmButtons a {
  min-width: 200px;
  max-width: 200px;
}

.installed-generator {
    padding: 15px 10px;
}

.installed-generator-wrap {
  margin-bottom: 15px;
  padding: 15px;
  box-sizing: border-box;
  border: 1px solid #7624a9;
  border-radius: 10px;
  height: 100%;
  -moz-transform: translateX(0px);
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.2s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.2s ease-in-out;
  background: #350061;
  background: linear-gradient(94deg,rgba(53, 0, 97, 1) 0%, rgba(38, 1, 59, 1) 20%, rgba(28, 0, 43, 1) 50%, rgba(43, 3, 59, 1) 77%, rgba(67, 2, 89, 1) 100%);
}

.installed-generator-title {
    font-size: 20px;
    margin-bottom: 15px;
    font-weight: bolder;
}

.installed-generator-id {
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    font-size: 12px;
    margin-bottom: 5px;
    color: #be79ef;
}

.installed-generator-info {
  margin-bottom: 15px;
}

.installed-generator-info-earned {
  font-size: 20px;
}

.installed-generator-image {
  text-align: center;
}

.installed-generator-image img {
  max-width: 100%;
}

.topup-deposit {
  text-align: center;
  margin-bottom: 10px;
  color: var(--color3);
  font-style: italic;
  font-size: 14px;
}

.installed-generator-options-col {
  width: 33%;
  padding: 15px;
}

.progress {
  display: flex;
  height: 1.5rem;
  overflow: hidden;
  font-size: .75rem;
  background-color: var(--color2a);
  border-radius: 1rem;
  width: 80%;
  margin-right: 10px;
}

.progress-bar {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  background-color: #63d540;
}

.generator-gaz-title {
  color: var(--color3a);
  font-size: 14px;
  font-style: italic;
}

.installed-generator-options i {
    color:#af09f9;
}

.progress-add {
  font-size: 26px;
}

.progress-add i {
  vertical-align: super;
}

.installed-generator-buttons-col {
  width: 33%;
}

.installed-generator-buttons-col a,  .installed-generator-buttons-col button{
  max-width: 300px;
      min-width: 270px;
}

.modal-text-center {
  text-align: center;
  padding: 10px 0;
}

.modal-buttons {
  justify-content: center;
  padding: 10px 0;
}

.modal-buttons a, .modal-buttons button  {
  max-width: 350px;
  min-width: 200px;
  display: block;
}

.upgrade-detal-item {
  background-color: var(--color9);
  box-shadow: rgba(0, 0, 0, 0.2);
  padding: 15px;
  margin-bottom: 15px;
  border-radius: 20px;
  box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 0.2) inset;
}

.upgrade-detal-item-title {
  margin-bottom: 5px;
  font-family: var(--font-family-3);
  font-size: 20px;
}

.upgrade-detal-item-period {
  font-size: 14px;
  font-style: italic;
  margin-bottom: 15px;
  color: var(--color3a);
}

.upgrade-detal-item-image img {
  max-width: 120px;
}

.upgrade-detal-item-option {
  flex-grow: 1;
  flex-shrink: 1;
  padding: 5px 15px;
  box-sizing: border-box;
}

.modal-footer .modal-text-center {
  font-size: 14px;
}

.modal-notification {
  padding: 15px 0;
}

.installed-upgrades {
  padding: 15px;
}

.installed-upgrad-item-image {}

.installed-upgrad-item-image img {
  height: 60px;
}

.installed-upgrad-item-text {
  padding: 5px 5px 5px 30px;
  font-size: 16px;
  flex-grow: 1;
  flex-shrink: 1;
}

.installed-upgrad-item-title {
  font-family: var(--font-family-3);
  margin-bottom: 5px;
}

.installed-upgrad-item-time {
  color: var(--color3);
  font-size: 14px;
  font-style: italic;
}

.installed-upgrad-item-time span {
  margin-right: 3px;
}

.email-address {
  text-transform: uppercase;
  padding: 15px 0;
}

.settings-list,
.settings-text {
  width: 50%;
  padding: 15px 30px 15px 0;
  box-sizing: border-box;
}

.setting-item {
  padding: 10px 15px;
  background-color: var(--color8);
  border-radius: 20px;
  margin-bottom: 15px;
  cursor: pointer;
  position: relative;
  color: var(--color3a);
}

.setting-item:after {
  content: '→';
  width: 44px;
  height: 100%;
  line-height: 20px;
  font-size: 44px;
  border-radius: 50%;
  position: absolute;
  right: -3px;
  top: 0;
  color: var(--color1);
  font-size: 16px;
  font-family: var(--font-family-3);
  font-weight: 700;
  border-radius: 30px;
  padding: 12px 15px;
  text-decoration: none;
  margin: auto;
  display: block;
  border: 0;
  background: linear-gradient(130deg, var(--color5), var(--color7));
  text-align: center;
  -moz-transform: translateX(0px);
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.2s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.2s ease-in-out;
}

.setting-item:hover {
  color: var(--color1);
}

.setting-item:hover:after {
  right: -10px;
}

.table-style {
  width: 100%;
}

.table-style thead {
  background-color: var(--color9);
}

.table-style thead th {
  padding: 15px 0px;
}

.table-style tbody td {
  padding: 14px;
  font-size: 12px;
}

.table-style tbody tr:nth-child(odd) {
  background-color: rgba(0, 0, 0, 0.05);
}

.table-style tbody tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.05);
}

.table-style tbody td:first-child {
  text-align: left;
}

.earned-affiliate {
  padding: 15px 5px;
  font-size: 20px;
  font-family: var(--font-family-3);
}

.earned-affiliate span {
  color: var(--color3a);
}

.affiliate-stage {
  font-size: 14px;
  color: var(--color3a);
  font-style: italic;
}

.partners-list {
    padding:15px 0;
}

.partners-list-wrap {
    background-color: var(--color8);
    padding: 30px;
    border-radius: 30px;
    box-shadow: 0 2px 30px -10px rgb(0,0,0,0.3);
}

.partner-list-item {
    background-color: var(--color9);
    box-shadow: rgba(0, 0, 0, 0.2);
    padding: 10px 10px 10px 25px;
    margin-bottom: 15px;
    border-radius: 20px;
    box-shadow: 0 3px 10px -5px rgb(0,0,0,0.2) inset;
    position:relative;
}

.partner-list-item-level {
    box-shadow: rgba(0, 0, 0, 0.2);
    padding: 5px 10px 5px 25px;
    margin-bottom: 15px;
    border-radius: 20px;
    position:relative;
}
.partner-plus-level {
  width: 26px;
    height: 26px;
    line-height: 4px;
    font-size: 24px;
    border-radius: 50%;
    position: absolute;
    right: 37px;
    top: 0;
    color: var(--color1);
    font-size: 16px;
    font-family: var(--font-family-3);
    font-weight: 700;
    border-radius: 30px;
    padding: 12px 8px;
    text-decoration: none;
    margin: auto;
    display: block;
    border: 0;
    background: linear-gradient(130deg, var(--color5), var(--color7));
    text-align: center;
    -moz-transform: translateX(0px);
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transform: translateX(0px);
    -webkit-transition: all 0.2s ease-in-out;
    -o-transform: translateX(0px);
    -o-transition: all 0.2s ease-in-out;
}

.partner-plus {
  width: 52px;
  height: 52px;
  line-height: 20px;
  font-size: 44px;
  border-radius: 50%;
  position: absolute;
  right: -3px;
  top: 0;
  color: var(--color1);
  font-size: 16px;
  font-family: var(--font-family-3);
  font-weight: 700;
  border-radius: 30px;
  padding: 12px 15px;
  text-decoration: none;
  margin: auto;
  display: block;
  border: 0;
  background: linear-gradient(130deg, var(--color5), var(--color7));
  text-align: center;
  -moz-transform: translateX(0px);
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transform: translateX(0px);
  -webkit-transition: all 0.2s ease-in-out;
  -o-transform: translateX(0px);
  -o-transition: all 0.2s ease-in-out;
}

.partner-link-level-one {
    font-family:var(--font-family-3);
    font-size:20px;
}
.partner-link-level-two {
    font-family:var(--font-family-1);
    font-size:16px;
    padding: 5px 5px 5px 15px;
}

.partner-collapse {
    display:none;
}

.error {
    text-align:center;
    color:red;
}

.head_panel .medal {
    width:22%;
    text-align:center;
    padding: 20px 10px 0 10px;
}

.head_panel .medal img{
     width:100%;
     max-width:200px;
}

.head_panel .container-balance {
    width:78%;
}

#medal_icon {
    cursor:pointer;
}

.agree-modify {
    width: 26px;
    float: right;
    margin-right: 10px;
    margin-top: -3px;
}


/*********** анимация генераторов ****/




/***********  генератор 1 ***/
.anim1_1 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -3px -3px;
}

.anim1_2 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -521px -3px;
}

.anim1_3 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -3px -434px;
}

.anim1_4 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -521px -434px;
}

.anim1_5 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -1039px -3px;
}

.anim1_6 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -1039px -434px;
}

.anim1_7 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -3px -865px;
}

.anim1_8 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -521px -865px;
}

.anim1_9 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -1039px -865px;
}

.anim1_10 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -1557px -3px;
}

.anim1_11 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -1557px -434px;
}

.anim1_12 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -1557px -865px;
}

.anim1_13 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -3px -1296px;
}

.anim1_14 {
    width: 512px; height: 425px;
    background: url('css_sprites_1.png') -521px -1296px;
}


/***********  генератор 2 ***/

.anim2_1 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -542px -626px;
}

.anim2_2 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -1074px -10px;
}

.anim2_3 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -1074px -318px;
}

.anim2_4 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -1074px -626px;
}

.anim2_5 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -542px -934px;
}

.anim2_6 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -10px -934px;
}

.anim2_7 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -1074px -934px;
}

.anim2_8 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -10px -1242px;
}

.anim2_9 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -542px -1242px;
}


.anim2_10 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -10px -10px;
}

.anim2_11 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -542px -10px;
}

.anim2_12 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -10px -318px;
}

.anim2_13{
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -542px -318px;
}

.anim2_14 {
    width: 512px; height: 288px;
    background: url('css_sprites_2.png') -10px -626px;
}

/***********  генератор 3 ***/

.anim3_1 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -3px -3px;
}

.anim3_2 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -521px -3px;
}

.anim3_3 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -3px -297px;
}

.anim3_4 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -521px -297px;
}

.anim3_5 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -3px -591px;
}

.anim3_6 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -521px -591px;
}

.anim3_7 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -1039px -3px;
}

.anim3_8 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -1039px -297px;
}

.anim3_9 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -1039px -591px;
}

.anim3_10 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -3px -885px;
}

.anim3_11 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -521px -885px;
}

.anim3_12 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -1039px -885px;
}

.anim3_13 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -3px -1179px;
}

.anim3_14 {
    width: 512px; height: 288px;
    background: url('css_sprites_3.png') -521px -1179px;
}

/***********  генератор 4 ***/

.anim4_1 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -3px -3px;
}


.anim4_2 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -521px -3px;
}


.anim4_3 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -3px -297px;
}


.anim4_4 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -521px -297px;
}


.anim4_5 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -3px -591px;
}


.anim4_6 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -521px -591px;
}


.anim4_6 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -1039px -3px;
}


.anim4_7 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -1039px -297px;
}


.anim4_8 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -1039px -591px;
}


.anim4_9{
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -3px -885px;
}


.anim4_10{
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -521px -885px;
}


.anim4_11 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -1039px -885px;
}


.anim4_12 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -3px -1179px;
}


.anim4_13 {
    width: 512px; height: 288px;
    background: url('css_sprites_4.png') -521px -1179px;
}


/******/


.anim5_1 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -3px -3px;
}

.anim5_2 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -521px -3px;
}

.anim5_3 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -3px -297px;
}

.anim5_4 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -521px -297px;
}

.anim5_5 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -3px -591px;
}

.anim5_6 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -521px -591px;
}

.anim5_7 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -1039px -3px;
}

.anim5_8 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -1039px -297px;
}

.anim5_9 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -1039px -591px;
}

.anim5_10 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -3px -885px;
}

.anim5_11 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -521px -885px;
}

.anim5_12 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -1039px -885px;
}

.anim5_13 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -3px -1179px;
}

.anim5_14 {
    width: 512px; height: 288px;
    background: url('css_sprites_5.png') -521px -1179px;
}



/******/

.anim6_1 
{
background:url('css_sprites_6.png') 0px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_2 
{
background:url('css_sprites_6.png') -450px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_3 
{
background:url('css_sprites_6.png') -900px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_4 
{
background:url('css_sprites_6.png') -1350px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_5 
{
background:url('css_sprites_6.png') -1800px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_6 
{
background:url('css_sprites_6.png') -2250px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_7 
{
background:url('css_sprites_6.png') -2700px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_8 
{
background:url('css_sprites_6.png') -3150px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_9
{
background:url('css_sprites_6.png') -3600px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_10
{
background:url('css_sprites_6.png') -4050px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_11 
{
background:url('css_sprites_6.png') -4500px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_12 
{
background:url('css_sprites_6.png') -4950px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_13 
{
background:url('css_sprites_6.png') -5400px -0px;
width:450px;height:253px;
display:inline-block;
}

.anim6_14 
{
background:url('css_sprites_6.png') -5850px -0px;
width:450px;height:253px;
display:inline-block;
}



.anim7_1
{
background:url('css_sprites_7.png') 0px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_2
{
background:url('css_sprites_7.png') -450px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_3
{
background:url('css_sprites_7.png') -900px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_4
{
background:url('css_sprites_7.png') -1350px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_5
{
background:url('css_sprites_7.png') -1800px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_6
{
background:url('css_sprites_7.png') -2250px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_7
{
background:url('css_sprites_7.png') -2700px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_8
{
background:url('css_sprites_7.png') -3150px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_9
{
background:url('css_sprites_7.png') -3600px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_10
{
background:url('css_sprites_7.png') -4050px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_11
{
background:url('css_sprites_7.png') -4500px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_12
{
background:url('css_sprites_7.png') -4950px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_13
{
background:url('css_sprites_7.png') -5400px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_14
{
background:url('css_sprites_7.png') -5850px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_15
{
background:url('css_sprites_7.png') -6300px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_16
{
background:url('css_sprites_7.png') -6750px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_17
{
background:url('css_sprites_7.png') -7200px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_18
{
background:url('css_sprites_7.png') -7650px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim7_19
{
background:url('css_sprites_7.png') -8100px -0px;
width:450px;height:278px;
display:inline-block;
}

.anim9_1
{
background:url('css_sprites_9.png') 0px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_2
{
background:url('css_sprites_9.png') -512px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_3
{
background:url('css_sprites_9.png') -1024px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_4
{
background:url('css_sprites_9.png') -1536px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_5
{
background:url('css_sprites_9.png') -2048px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_6
{
background:url('css_sprites_9.png') -2560px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_7
{
background:url('css_sprites_9.png') -3072px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_8
{
background:url('css_sprites_9.png') -3584px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_9
{
background:url('css_sprites_9.png') -4096px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_10
{
background:url('css_sprites_9.png') -4608px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_11
{
background:url('css_sprites_9.png') -5120px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_12
{
background:url('css_sprites_9.png') -5632px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_13
{
background:url('css-sprite-combined.png') -6144px -0px;
width:512px;height:288px;
display:inline-block;
}

.anim9_14
{
background:url('css_sprites_9.png') -6656px -0px;
width:512px;height:288px;
display:inline-block;
}



.generator_image > div {
    margin:0 auto;
} 

.button-readmore {
    cursor:pointer;
}

.container_vivod {
    margin:0px 15px;
}

.container_vivod .item_vivod{
    margin:10px 0px;
    border-bottom: 1px solid var(--color5);
    text-align:center;
    padding:15px;
}

#notificationModal .item_msg {
    margin-bottom:10px;
    padding-bottom:7px;
   border-bottom: 1px solid var(--color5);
}

#notificationModal .item_msg .date_msg{
  text-align: right;
    font-style: italic;
    margin-bottom: 8px;
    font-size: 12px;
    color: #eee;
}

.modal-backdrop{
    z-index:1 !important;
}

.installed-generator-info-Level {
    font-size:14px;
    margin-bottom:10px;
}

.installed-generator-info-price {
    font-size: 14px;
    margin-bottom: 5px;
}

.installed-generator-info-earned {
    font-size: 20px;
    font-weight: bold;
    margin-bottom:5px;
}

.balanceFiatGenerator {
    font-size: 12px;
    color:#8be58e;
}

.installed-generator-info-count-fiat {
    font-size: 12px;
    color: #8be58e;
}
.installed-generator-info-count {
    font-size: 20px;
    font-weight: bold;
}

.list-generators {
    padding: 15px 0;
}

.modal {
    background-color: rgba(33, 4, 107, 80%);
}

.tonconnect-wrap {
    text-align:center;
    margin-bottom:10px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.add-balance {
    background-color: #7800eb;
    border: 0;
    color: #ffffff;
    padding: 2px 5px 0 5px;
    border-radius: 6px;
    line-height: 22px;
    font-size: 16px;
    vertical-align: text-bottom;
}

.form-label {
    text-align:center;
    width:100%;
    margin-bottom:5px;
}


#generetorModal  .price-product .price {
     font-size:24px;
}

#generetorModal  .price-product .price-comission {
     font-size:16px;
}

#generetorModal  .buy-product {
    margin-bottom:25px;
}

#generetorModal  .price-product {
    margin-bottom: 10px;
    
}


#generetorModal .error_msg {
    text-align:center;
    color:red;
    font-size:14px;
    
}

.msg-output-bit {
    font-size:14px;
    background: #fa05d82b;
    display:block !important;
}

.item-link {
    font-size:14px;
    cursor:pointer;
}

.ref-link {
    width:100%;
    position:absolute;
    bottom:15px;
    text-align:center;
    font-size:13px;
}

.bottom-form-payment-bt-for-ton {
    text-align:center;
}

.block-amount-bit {
    margin-bottom:20px;
    font-size:22px;
}

#addBalance .button-readmore {
    width:70%;
}

.generator-item-text-dohod   {padding-left: 10px;} 

.generator-item-dohod {
    margin-top:10px;
}
.generator-item-percent-dohod {
    display:flex;
     padding:5px ;
      
}

.generator-item-percent-dohod > div{
     padding:5px ;
}

.panel_marketing {
    display:flex;
    
}

.panel_marketing > div {
     padding:5px ;
    
    width: 33%;
    text-align: center;
        margin-bottom: 10px;
        
    }
    
.panel-ton-torg {
    padding:15px;
}   

.panel-ton-torg a{ 
    font-size:12px;
    color: #c3c3c3;
}