:root
{
  --app-bg-color: rgba(25, 51, 98, 1);
  --tile-background: #ffffff11;
  --popup-page-background: #1C2033;
  --dark-background: #1C2033;

  --annoce-bg-color: #2C303EF0;

  --base-text-color: #F2f2f2EE;
  --secondary-text-color: #193362;
  --hint-color: #F2f2f2AA;
  --alert-color: #ff0000;
  --alert-border-color: #ff333350;
  --success-color: #55DD55;

  --gold-color: #CCA933;
  --gold-color-new: #CFA550;
  --gold-color-light: #CCA933;
  --gold-border-light: #CCA93350;

  --light-buttons-bg: #FFFFFFEE;
  --light-buttons-text: #1C2033EE;

  --gold-buttons-bg: #F4D15D;
  --gold-buttons-text: #1C2033;

  --title-font-weight: bold;

  --disable-background: #ccae72f2;
  --disable-color: #193362;
}

body, html
{
  margin: 0px;
  padding: 0px;

  color: var(--base-text-color);

  font-family: Arial;
  font-size: 14px;

  box-sizing: border-box;

  background: var(--app-bg-color) !important;

  border: none!important;
}

body .text-left
{
  text-align: left;
}

body .text-right
{
  text-align: right;
}

body .empty
{
  padding: 10px 0px;

  text-align: center;
}

@media (min-width: 290px)
{
  body, html
  {
    font-size: 11px;
  }
}

@media (min-width: 320px)
{
  body, html
  {
    font-size: 14px;
  }
}

@media (min-width: 420px)
{
  body, html
  {
    font-size: 16px;
  }
}

body
{
  max-width: 100vw;

  position: relative;

  overflow: hidden;
}

body a
{
  color: var(--base-text-color);

  text-decoration: none;

  outline: none;

  cursor: default;
}


/* elements */

body .title
{
  color: var(--base-text-color);
  font-size: 120%;
  font-weight: bold;
}

body .text
{
  color: var(--base-text-color);
  font-size: 100%;
}

body .text .coin
{
  display1: inline-block;
  position: relative;
  margin-bottom: -2px;

  width: 15px;
  height: 15px;

  border-radius: 11px;

  padding: 0px 2px;

  box-shadow: 0px 0px 3px rgb(0 0 0 / 30%);
}

body .coins
{
  display: flex;
  align-items: center;
}

body .coins svg,
body .coins img
{
  width: 20px;
  height: 20px;

  margin: 0px 5px;
}

body .hint
{
  color: var(--hint-color);
  font-size: 95%;

  text-align: center;
}

body .hint
{
  display: flex;
  align-items: center;
  justify-content: center;

  margin: 1vw 5vw;
}

body .hint svg,
body .hint img
{
  width: 5vw;
  height: 5vw;
}

body .d-flex
{
  display: flex;

  align-items: center;
  justify-content: center;

  line-height: 1;
}

body .d-flex.gap-5
{
  gap: 5px;
}

/* buttons */

body .buttons
{
  display: flex;
  align-items: center;
  justify-content: center;

  gap: 10px;
}

body .buttons.top-control
{
  margin-bottom: 10px;

  justify-content: end;
}

body .button
{

  height: 8vw;

  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;

  gap: 1.5vw;

  /* color: var(--secondary-text-color); */
  font-size: 95%;

  /* padding: 0.2vw 2.5vw; */

  /* border-radius: 2vw; */
  /* border: 1px solid var(--gold-border-light); */

  text-align: center;
  text-decoration: none !important;

  /* background: var(--light-buttons-bg); */

  box-sizing: border-box;

  padding: 7px 15px;
  background: var(--gold-color-new);
  color: var(--secondary-text-color);
  border-radius: 5px!important;
}

body .button.icon-style
{
  padding: 4.5vw 1.5vw;

  background: var(--gold-color-new);
}

body .button.wide
{
  width: 100%;
  /* max-width: 300px; */
}

body .button.gold
{
  color: var(--gold-buttons-text);

  background: var(--gold-buttons-bg) !important;
}

body .button.telegram
{
  background-color: #1c93e3!important;

  color: #fff;
}

body .button svg,
body .button img
{
  width: 4.5vw;
  height: 4.5vw;

  vertical-align: middle;
}

body .button.icon-style svg,
body .button.icon-style img
{
  height: 8vw;
  width: 8vw;
}

body .button.light
{
  color: var(--secondary-text-color);

  /* border: 1px solid var(--gold-border-light); */
  background: var(--gold-color-new) !important;
}

body .button.link
{
  width: auto !important;
}

body .button.link:has(img),
body .button.link:has(svg)
{
  padding1: 5px 10px !important;
}


body .button.square
{
  width: 9vw;
  padding: 0px;

}
body .button.square svg,
body .button.square img
{
  height: 4vw;
}


body .button.middle
{
  height: 7vw;
  font-size: 95%;

  padding: 0vw 2.5vw;
}

body .button.middle.light
{
  color: var(--popup-page-background);

  border: 1px solid var(--popup-page-background);
  background: var(--gold-color) !important;
}

body .button.disable
{
  color: var(--disable-color)!important;

  background: var(--disable-background)!important;
}

body .small-button,
body .button.small
{
  position: relative;
  height: 7vw;
  font-size: 95%;

  border-radius: 1.8vw;

  margin-left: 0.5vw;
  margin-right: 0.5vw;
}

body .button.small svg,
body .button.small img
{
  width: 3.5vw;
  height: 3.5vw;
}

body .button.small.square
{
  width: 7vw;
}



body .buttons .waiting
{
  font-size: 120%;
}


body .page .element.alert
{
  color: var(--alert-color);
}
body .page .element.alert .image img
{
  border-color: var(--alert-border-color);
}



body input, body textarea
{
  color: var(--base-text-color);
  background: var(--tile-background);

  border: 1px solid var(--gold-border-light);
}

body input
{
  height: 6vw;

  padding: 3px 5px;

  font-size: 100%;

  border-radius: 10px;

  text-align: center;
}

body .detail input
{
  text-align: left;
}

body .form
{
  margin: 10px 0px;
}

body .form.page-block
{
  margin: 10px 5vw;
}

body .form .row
{
  display: flex;
  align-items: center;

  justify-content: center;

  gap: 1.5vw;

  padding: 1.5vw 0px;
}

body .form .row:has(input[type=radio])
{
  justify-content1: left;
}

body .form .row .name
{
  width: 35vw;
}

body .form .row .val
{
  width: 100%;
}

body .form .row .input-group
{
  display: flex;
  align-items: center;

  justify-content: center;

  gap: 0.5vw;
}

body .form .row .input-group.column
{
  flex-direction: column;
}

body .form .row .input-group.w-100
{
  width: 100%;
}

body .form input
{
  width: 20vw;
}

body .form input[type=radio]
{
  width: auto;
  height: auto;

  padding: 0px;
  margin: 0px;
}

body .form input.link, body .form .row .val input.w-100
{
  width: calc(100% - 14px);
}

body .form input.phone
{
  width: 60vw;
}

body .form input.count
{
  width: 10vw;
}

body .form svg.coin, body .form img.coin
{
  width: 22px;
  height: 22px;
}

body .form .total
{
  font-size: 120%;
  font-weight: bold;

  text-decoration: none !important;
}

body .form .alert
{
  color: var(--alert-color);
}

body .form .value-control
{
  display: flex;

  gap: 5px;

  align-items: center;
}

body .form .value-control .value-place
{
  display: flex;

  gap: 5px;

  align-items: center;
}

body .form .value-control a
{
  display: flex;

  width: 18px;
  height: 18px;

  align-items: center;
  justify-content: center;

  background: var(--app-bg-color);

  border-radius: 1vw;
}

body .form .value-control input
{
  width: 35px;

  padding: 0px;

  border: none;

  background: none;

  outline: none;
}

/* Loader */

body .scene.loaded, body .qr-place.loaded
{
  display: block;
}

body .thumbnail-place
{
  margin-top: 70px;

  display: flex;
  flex-direction: column;
  justify-content: space-evenly;

  background-image1: url("/src/thumbnail1.jpg");
  background-size1: cover;
}

body .loading
{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50vh;
}

body .loading img
{
   width: 70vw;
   margin-top: 15vh;
}

body .tip
{
  height: calc(50vh - 140px);
  text-align: center;
}

body .tip img
{
   max-width: 90vw;
}

body .thumbnail-place.loaded, body .hide-till-lang
{
  display: none;
}

body .load-screen-title
{
  font-size: 120%;

  text-align: center;

   margin-bottom: 2vw;
}

body .load-screen-text
{
  position: fixed;
  bottom: 150px;

  width: 85%;

  display: flex;
  padding: 0px 10px;
}

body .load-screen-text ul li
{
  list-style-type: none;

  font-size: 90%;

  padding: 3px 0px;
}




body .qr-place
{
  display: none;

  text-align: center;

  color: #FFFFFF;
}

body .overlay
{
  display: none;

  position: absolute;

  top: 0px;
  left: 0px;

  width: 100%;
  height: 100%;

  background: rgba(0, 0, 0, 0.5);

  z-index: 1;
}

body .overlay.alert-style
{
  z-index: 2;
}

body .annonce
{
  display: none;

  position: absolute;

  top: 0px;
  left: 0px;

  width: 100%;
  height: 100%;

  background: var(--annoce-bg-color);

  z-index: 1000;
}

body .annonce .annonce-content
{
  padding: 25% 15%;
}

body .annonce .annonce-content .title
{
  font-size: 110%;
  font-weight: bold;
}


body .scroll-container
{
  max-height: 100vh;

  overflow-y: auto;

  padding-bottom: 20px;

  box-sizing: border-box;
}

/* scene layout */
body .scene
{
  position: relative;

  display: none;

  max-width: 600px;
  min-height: 100vh;

  margin: 0px auto 0px auto;
  padding: 60px 0px 90px 0px;

  color: #fff;
}

body .scene .scene-container
{
  width: calc(100% - 80px);
  min-width: 320px;

  margin-left: auto;
  margin-right: auto;
}

body .main-page
{
  min-height: 100vh;

  color: var(--base-text-color);
}



/* pages layout */

body .bottom-slide
{
  position: fixed;

  left: -2px;

  width: calc(100% + 1px);

  overflow: hidden;

  border-radius: 40px 40px 0px 0px;

  border-top: 1px solid var(--gold-color-light);
  border-left: 1px solid var(--gold-color-light);
  border-right: 1px solid var(--gold-color-light);

  box-shadow1: 0px 1px 9px rgb(255 234 177 / 70%);

  background: var(--app-bg-color);
}

body .bottom-slide .pages, body .bottom-slide .pages .pages-content
{
  height: 100%;
}

body .bottom-slide.open .pages
{
  padding-top: 15px;

  background: var(--app-bg-color);
}

body .bottom-slide .pages .pages-content
{
  overflow-y: auto;
}

body .bottom-slide .pages .pages-content .page
{
  min-height: calc(100% - 125px);

  padding-bottom: 125px;

  background: var(--app-bg-color);
}


body .pages-data
{
  display: none;

  position: relative;

  overflow: hidden;
}

body .pages-data.loaded
{
  display: block;
}

body .page
{
  display: none;

  padding-top: 2vw;

  color: var(--base-text-color);
}

body .page.active
{
  display: block;
}

body .page .page-title
{
  /* font-size: 125%; */
  font-size: 20px;
  font-weight: var(--title-font-weight);

  padding: 15px 15px 10px 15px;

  text-align: center;
}

body .page .page-title1
{
  font-size: 110%;
  font-weight: var(--title-font-weight);

  padding: 1vw 4vw 1vw 4vw;

  text-align: center;
}

body .page .page-title2
{
  display: flex;

  gap: 2vw;

  align-items: center;
  justify-content: center;

  font-size: 100%;
  font-weight: var(--title-font-weight);

  padding: 1vw 4vw 1vw 4vw;

  text-align: center;
}

body .page .page-title2 svg,
body .page .page-title2 img
{
  width: 6vw;
  height: 6vw;
}

body .page .page-title3
{
  font-size: 95%;
  font-weight: var(--title-font-weight);

  padding: 1vw 4vw 1vw 4vw;

  text-align: center;
}

body .page .page-image
{
  text-align: center;
  padding: 0px 5px 10px 0px;

  height: 25vw;
}
body .page .page-image img,
body .page .page-image svg
{
  max-height: 25vw;
}

body .page .page-image.big-round svg,
body .page .page-image.big-round img
{
  width: 25vw;
  height: 25vw;
  max-height: none;


  border-radius: 15vw;

  box-shadow: 0px 0px 50px rgba(255, 255, 255, 0.3);
}

body .page .page-text
{
  font-size: 18px;
  margin-top: 15px;

  padding: 0px 15px 10px 15px;

  text-align: center;
}


body .page .page-block
{
  margin: 0vw 0vw 4vw 0vw;
}

body .page .page-block .page-block
{
  padding-top: 4vw;
}

body .page .page-block.middle
{
  /* margin-left: 4vw;
  margin-right: 4vw; */
}


body .page .page-block a
{
  text-decoration: underline;
}

body .page .top-filters
{
  display: flex;

  justify-content: space-between;

  gap: 5vw;
}


body .page .steps ul,
body .page .steps ol
{
  margin: 1vw 6vw;
  padding: 0px;
}

body .page .steps li
{
  padding: 2.5vw 0vw;
}

body .page .content
{
  padding: 10vw 3vw 2vw 3vw;
}

body .page .content.hold
{
  padding: 2vw 25px;
}

body .page .content .top-tabs-menu
{
  padding-top: 3vw;
  margin-bottom: 0px;
}

body .page .content .title
{
  font-size: 110%;
  font-weight: var(--title-font-weight);

  margin-bottom1: 10px;
}

body .page .content .page_text
{
  font-size: 90%;

  text-align: center;

  margin: 0px 0px 20px 0px;
}

body .page .tabs
{
  margin: 15px 10px 10px 10px;
}

body .page .tabs .page-tab, body .page .page-tab-group
{
  display: none;
}

body .page .tabs .page-tab.active, body .page .page-tab-group.active
{
  display: block;
}

body .page .tabs .page-tab
{
  text-align: center;
}


/* clist */

body .page .list
{
  display: flex;

  gap: 2vw;

  flex-direction: column;

  margin: 10px 0px 20px 0px;
}

body .page .list .element
{
  display: flex;

  gap: 2.5vw;

  flex-direction: row;
  align-items: center;
  justify-content: space-between;

  padding: 9px 9px;

  border-radius: 10px;
  background: var(--tile-background);
}

body .page .list .element.disable
{
  filter: grayscale(1);
  opacity: 0.5;
}

body .page .list .element .title
{
  width: 100%;

  font-size: 100%;
  font-weight: normal;
  margin: 0px;
}

body .page .list .element .avatar
{
  width: 8vw;
  height: 8vw;
}
body .page .list .element .avatar img
{
  width: 8vw;
  height: 8vw;

  border-radius: 4px;
}


body .page .list .element .id
{
  width: 5vw;
}

body .page .list .element .sum
{
  width: 20vw;
}

body .page .list .element .sum.flex
{
  display: flex;

  width: auto;

  gap: 1vw;

  align-items: center;
}

body .page .list .element .date
{
  width: 20vw;
}


body .page .list .element .hint
{
  width: 100%;

  font-size1: 100%;
  margin: 4px 0px 0px 0px;

  text-align: left;
}

body .page .list .element .hint.center
{
  text-align: center;
}

body .page .list .element .bottom_text
{
  font-size: 95%;
}

body .page .list .element .link
{
  color1: var(--hint-color);
  width: 90%;

  font-size: 82%;
  margin: 0px;

  overflow: hidden;
}

body .page .list .element .link span
{
  color: var(--base-text-color);
  font-size: 120%;
  display: block;

  margin-bottom: 3px;
}

body .page .list .element .link a
{
  display: block;
  color: var(--hint-color);
  text-decoration: none;
}


body .page .list .element textarea
{
  color: var(--base-text-color);

  width: 100%;
  font-size: 100%;

  border: none;
  background: var(--tile-background);
}

body .page .list .element .icon
{
  display: block;

  min-width: 10vw;
  height: 10vw;

  overflow: hidden;

  padding: 3px;

  line-height: 0px;

  border-radius: 8px;
  border1: 1px solid var(--gold-border-light);
}

body .page .list .element .icon img
{
  max-height: 100%;
}

body .page .list .element .main-info
{
  width: 100%;
}

body .page .content .list .element .coins
{
  display: flex;

  font-size: 100%;

  justify-content: right;
  align-items: center;
}

body .page .content .list .element .coins.prize
{
  font-size: 100%;
  font-weight: var(--title-font-weight);
}

body .page .content .list .element .coins a
{
  display: flex;

  align-items: center;
  text-decoration: none;
}

body .page .content .list .element .coins svg,
body .page .content .list .element .coins img
{
  width: 20px;
  height: 20px;

  margin: 0px 5px;
}

body .page .list .element .empty
{
  padding: 4vh 1vw;
}

/* cpoups */

body .popup
{
  position: fixed;

  bottom: -100vh;

  z-index: 2;

  width: 100vw;

  font-size: 90%;

  color: var(--base-color);

  box-sizing: border-box;

  overflow-x: hidden;
}

body .popup.alert-style
{
  display: none;

  position: absolute;

  top: 0px;
  bottom: inherit;

  width: 96vw;
  max-width: 400px;

  margin-left: 2vw;

  z-index: 3;
}

body .popup .popup-content
{
  position: relative;

  left: 0px;

  width: calc(100% + 0px);

  padding: 20px 20px 65px 20px;

  background: var(--app-bg-color);

  border-top: 1px solid rgba(246, 190, 41, 0.4);
  border-left: 1px solid rgba(246, 190, 41, 0.4);
  border-right: 1px solid rgba(246, 190, 41, 0.4);

  border-radius: 40px 40px 0px 0px;

  box-sizing: border-box;

  box-shadow: 0px 1px 5px rgba(246, 190, 41, 0.4);
}

body .popup.alert-style .popup-content
{
  padding: 20px;

  border: 1px solid rgba(246, 190, 41, 0.4);

  border-radius: 40px;
}

body .popup .popup-content .popup-scroll
{
  max-height: calc(100vh - 290px);

  overflow-y: auto;
}

body .popup .popup-content .popup-block
{
  margin: 3vw 0vw 3vw 0vw;
}


body .popup .block
{
  margin: 0vw 0vw 5vw 0vw;
}
body .popup .block .buttons
{
  margin: 2vw 5vw;
}

body .popup .popup-block
{
  margin: 3vw 1.5vw;
}

body .popup .popup-block.middle
{
  margin-left: 4vw;
  margin-right: 4vw;
}

body .popup .popup-block a
{
  text-decoration: underline;
}


body .popup .share
{
  position: absolute;

  right: 15px;
  top: 15px;
}

body .popup  .title
{
  padding-bottom: 15px;

  font-size: 130%;

  text-align: center;
}

body .popup .share + .title
{
  margin-left: 30px;
  margin-right: 30px;
}

body .popup .popup-content .text
{
  margin-top: 5px;
  margin-bottom: 5px;

  text-align: center;

  font-size: 105%;

  line-height: 1.3;
}

body .popup .popup-content .text ul,
body .popup .popup-content .text ol
{
  text-align: left;

  padding: 0px;

  margin: 1vw 0vw 1vw 0vw;
}

body .popup .popup-content .image
{
  min-height: 100px;

  margin-bottom: 10px;

  text-align: center;
}

body .popup .popup-content .image img
{
  width: 45vw;

  max-height: none;
}

body .popup .popup-content .image .qr
{
  display: flex;

  justify-content: center;
}

body .popup .popup-content .image .qr
{
  min-height: 32vw;
}

body .popup .popup-content .image .qr img,
body .popup .popup-content .image .qr canvas
{
  width: 28vw;
  height: 28vw;

  border-radius: 0px;

  border: 2vw solid #FFF;
}

body .popup .popup-content .input
{
  text-align: center;
}

body .popup .popup-content .input textarea
{
  width: 90%;
  height: 15vw;

  font-size: 100%;

  border-radius: 10px;
}

body .popup .popup-content .buttons1
{
  margin: 0px 10% 15px 10%;
}

body .popup .buttons,
body .popup .sub-buttons
{
  display: flex;
  gap: 10px;

  flex-direction: row;

  padding: 3vw 5vw 3vw 5vw;

  text-align: center;
}

body .popup .sub-buttons
{
  margin-top: 0px;
}

body .popup .button
{
  width: 100%;

  font-size: 115%;
  font-weight: 400;
}

body .popup .button.middle
{
  width: auto;
}

body .popup .button.small
{
  width: auto;
}

body .popup .popup-content .link_preview
{
  font-size: 100%;
}

body .popup .attach-file-place
{
}

body .popup .attach-file-place label
{
  display: flex;

  padding: 10px 15px;
  margin: 0px auto;

  background: var(--tile-background);

  border-radius: 10px;

  font-size: 115%;

  text-align: left;

  justify-content: space-between;
  align-items: center;

  line-height: 1.2;
}

body .popup .attach-file-place label svg
{
  width: 17px;
  height: 17px;

  margin-left: 2vw;
}

body .popup .days
{

}

body .popup .days .day
{
  display: inline-block;

  width: 75px;

  text-align: center;

  padding: 0px;

  border-radius: 15px;
  margin: 5px;

  overflow: hidden;

  border-width: 1px;
  border-style: solid;
  border-color: var(--gold-color);
}

body .popup .days .day .day-icon
{
  width: 100%;
  height: 70px;
}

body .popup .days .day .count
{
  font-size: 80%;
  color: var(--button-color);

  padding: 1px 3px 1px 3px;

  border-radius: 4px;

  background: #F6BE29;
}

body .popup .hint
{
  margin: 5px 30px;
}


body .popup .coins
{
  display: flex;

  justify-content: center;

  align-items: center;

  gap: 5px;

  text-align: center;

  font-size: 140%;
  font-weight: var(--title-font-weight);
}

body .popup .coins.small
{
  font-size: 100%;
  font-weight: normal;
}

body .popup .coins svg
{
  width: 22px;
  height: 22px;
}

body .popup .coins.small svg
{
  width: 16px;
  height: 16px;

  margin: 0;
}

/* cinfo */

body .info
{
  display: flex;

  gap: 10px;

  margin: 2vw 0vw;

  flex-direction: row;
  justify-content: center;
}

body .info .block
{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1vh;
  width: 100%;

  font-size: 100%;
  font-weight: normal;

  padding: 8px 23px;
  margin: 0px;

  border-radius: 5px;

  background: var(--gold-color-new);
  color: var(--secondary-text-color);
  font-size: 18px;

  text-align: center;
}

body .info .block .hint
{
  padding: 0vw;
}

body .info .block svg,
body .info .block img
{
  width: 4.5vw;
  height: 4.5vw;
}



.d-none
{
  display: none;
}

.d-none-important
{
  display: none!important;
}

*[data-animation-type]
{
  position: relative;
}


/* ctiles */

body .page .content .tiles
{
  display: flex;

  gap: 10px;

  justify-content: space-between;

  align-items: top;

  flex-wrap: wrap;
}

body .page .content .tiles .tile
{
  display: flex;
  justify-content: center;
  width: calc(50% - 30px);

  padding: 10px 12px;

  border-radius: 10px;

  background: var(--tile-background);
}

body .page .content .tiles .tile .coins
{
  display: flex;
  align-items: center;

  gap: 2px;

  font-weight: bold;
}

body .page .content .tiles .tile .coins svg
{
  width: 20px;
  height: 20px;

  margin-right: 3px;
}



/* cfilters */

body .filter
{
  margin-bottom: 10px;
}

body .filter.line-style
{
  display: flex;

  gap: 5px;

  flex-wrap: wrap;

  justify-content: space-between;
}

body .filter > a
{
  display: inline-block;

  padding: 5px 7px;

  font-size: 80%;
}

body .filter > a.active
{
  border-radius: 5px;

  background: var(--app-bg-color);
}



/* chints */

body .page .content .hint
{
  color: white;

  font-size: 16px;

  padding-bottom: 2px;
}

body .page .content .hint b
{
  color: var(--gold-color-light);
}



/* calerts */

body .alerts
{
  position: absolute;

  top: 0px;
  left: 0px;

  width: 100%;

  color: var(--base-text-color);
  opacity: 0.9;

  z-index: 2;
}

body .alerts .alert
{
  position: relative;

  width: 94%;

  padding: 3px 4px;
  margin: 5px 3%;

  border-radius: 10px;

  background: var(--app-bg-color);

  box-sizing: border-box;
}

body .alerts .alert.load
{
  position: absolute;
}

body .alerts .alert .wrapper
{
  display: flex;

  gap: 5px;

  align-items: center;

}

body .alerts .alert .wrapper .data
{
  width: 100%;
  gap: 3px;

  font-size: 100%;

  display: flex;

  align-items: center;
}

body .alerts .alert .wrapper .data .icon
{
  width: 26px;
  text-align: center;
}

body .alerts .alert .wrapper .data .icon svg
{
  width: 16px;
  height: 16px;
}

body .alerts .alert .close
{
}

body .alerts .alert .close a
{
  cursor: pointer;

  display: flex;
  align-items: center;
}

body .alerts .alert .close svg
{
  width: 26px;
  height: 26px;
}


/* cflyeffect */

body .fly-effect-item
{
  position: absolute;

  width: 30px;
  height: 30px;

  z-index: 5;
}

body .fly-effect-item svg
{
  max-width: 100%;
  max-height: 100%;
}

/* ctabs */

body .tabs_list
{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;

  gap: 2vw;

  margin: 0px auto 20px auto;
}

body .main_tabs_list
{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 2vw;
}
body .main_tabs_list .button
{
  width: 31%!important;
  padding: 6px 7px!important;
  font-size: 12px!important;
}



body .link_preview
{
  font-size: 85%;
  margin: 20px 0vw;
  padding: 2vw;
  border-radius: 3vw;
  border: 0.5px solid var(--gold-color-new);

  /* background: var(--tile-background); */
}

body .text_preview
{
  height: 20vw;
  overflow-y: scroll;

  font-size: 85%;

  margin: 2vw 0vw;
  padding: 2vw;

  border-radius: 3vw;

  background: var(--tile-background);
}

body .img_preview
{
  font-size: 85%;
  margin: 20px 0vw;
  padding: 2vw;
  border-radius: 3vw;
  border: 0.5px solid var(--gold-color-new);

  text-align: center;
}

body .img_preview img
{
  max-width: 45vw;
}

body .page .qr .page-block
{
  position: relative;
}

body .page .qr .page-block .page-title, body .page .qr .page-block .page-text
{
  position: absolute;

  z-index: 1;
}

body .page .qr .page-block .page-title
{
  top: 2vh;
}

body .page .qr .page-block .page-text
{
  bottom: 2vh;
}

body .page .qr .page-block .scan-area
{
  width: 94vw;
  height: calc(100vh - 200px);
}

body .center-page-container
{
  display: flex;

  flex-direction: column;

  height: 100vh;

  justify-content: center;

  align-items: center;
}

body .center-page-container.login-style
{
  gap: 5vh;
}

body .center-page-container .logo
{
  text-align: center;
}
.mt-20{
  margin-top: 20px!important;
}
.mt-10{
  margin-top: 10px!important;
}
.mt-7{
  margin-top: 7px!important;
}
.fs-24{
  font-size: 24px!important;
}
.fs-21{
  font-size: 21px!important;
}
.fs-18{
  font-size: 18px!important;
}
.fs-16{
  font-size: 16px!important;
}
.fs-14{
  font-size: 14px!important;
}
.fw-bold{
  font-weight: bold!important;
}
.new-btn{
  padding: 7px 15px!important;
  background: var(--gold-color-new)!important;
  color: var(--secondary-text-color)!important;
  border-radius: 5px!important;
}
.new-btn-play{
  padding: 6px 8px!important;
  background: var(--gold-color-new)!important;
  color: var(--secondary-text-color)!important;
  border-radius: 5px!important;
}
.new-btn-big{
  padding: 10px 15px!important;
  background: var(--gold-color-new)!important;
  color: var(--secondary-text-color)!important;
  border-radius: 5px!important;
}
.mb-30{
  margin-bottom: 30px!important;
}
.mb-15{
  margin-bottom: 15px!important;
}
.mt-15{
  margin-top: 15px!important;
}
.mr-5{
  margin-right: 5px!important;
}
.mx-5{
  margin: 0px 5px!important;
}
.bg-white{
  background: white!important;
}
.fixed-icon{
  width: 36px!important;
  height: 36px!important;
}
.fixed-icon-product{
  width: 30px!important;
  height: 30px!important;
}
/* .fixed-icon img{
  width: 100%!important;
  height: 100%!important;
} */
/* .fixed-icon span{
  width: 40px!important;
  height: 40px!important;
} */
.counter-block{
  position: absolute;
  left: 38%;
  top: 6.5%;
}
.d-flex{
  display: flex!important;
}
.align-items-center{
  align-items: center!important;
}
.justify-content-center{
  justify-content: center!important;
}
.flex-column{
  flex-direction: column!important;
}
.color-white{
  color: white!important;
}
.timer-force-size{
  width: 20px;
  height: 20px;
}
.img-fluid{
  width: 100%;
  height: 100%;
}
.head-icons-fix{
  width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
}
.img-shadow-circle{
  position: absolute;
    border-radius: 100%;
    width: 146vw;
    height: 71vw;
    background: #ffffff;
    z-index: -1;
    background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 47%);
    filter: blur(33px);
}