/**
 * Copyright (c) 2025
 * Social Listening Tools Web App (1.222.0)
 * Author: LifeWeb <info@lifeweb.ir> [https://lifewebco.com]
 * Contributors:
 *  - Javad Shariati <jsh1400@yahoo.com> [http://github.com/jsh1400]
 *  - MinooTavakoli <minootavakoli28@gmail.com> [http://github.com/minootavakoli]
 */
:root {
  --wA4cm: 29.7cm;
  --hA4cm: 21cm;
  --wA4px: 842px;
  --hA4px: 595px;
  --dA4cm: 1cm;
  --dA4px: 28px;
}
.main-power-slide {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  overflow: auto;
  z-index: 50;
  --wA4: var(--wA4cm);
  --hA4: var(--hA4cm);
  --dA4: var(--dA4cm);
  background-color: #f1f1f1;
  background-size: 300px auto;
  background-position: left bottom;
  background-repeat: repeat-x;
}
.main-power-slide-page-info,
.main-power-slide-page-info-control,
.main-power-slide-page-content,
.main-power-slide-page-list-item,
.main-power-slide-page-wave-item,
.main-power-slide-page-wave-item > div,
.main-power-slide-page-info > div > div,
.main-power-slide-page-wave-platform-list,
.main-power-slide-page-wave-platform-list > div {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
.main-power-slide-page {
  position: relative;
  background: var(--mainColor6);
  width: var(--wA4);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  margin: 5rem auto 0 auto;
}
.step-page {
  width: var(--wA4);
  height: var(--hA4);
  max-height: var(--hA4);
  max-width: var(--wA4);
}

.main-power-slide-page-info {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.1);
  padding: 1rem;
  justify-content: space-between;
  z-index: 51;
  backdrop-filter: blur(5px);
}
.main-power-slide-page-control {
  position: fixed;
  left: 0;
  bottom: 0;
  right: 0;
  font-size: 1rem;
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
}
.main-power-slide-page-info > div > div {
  padding: 0.5rem;
  border-radius: 3px;
  cursor: pointer;
  width: 2.5rem;
  height: 2.5rem;
  font-size: 1rem;
}
.main-power-slide-page-list {
  position: absolute;
  overflow: auto;
  top: calc(var(--dA4) * 10);
  right: calc(var(--dA4) * 10);
  height: calc(var(--dA4) * 10);
  width: calc(var(--dA4) * 15);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  background-color: rgba(250, 250, 250, 1);
  z-index: 2;
}
.main-power-slide-page-list-item,
.main-power-slide-page-wave-item {
  justify-content: start;
  cursor: pointer;
  height: 4rem;
  padding: 0.5rem;
}
.main-power-slide-page-wave-item {
  flex-direction: column;
}
.main-power-slide .main-power-slide-page-wave-item * {
  font-size: 2rem !important;
}
.main-power-slide-page-list-item:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
/*.main-power-slide * {*/
/*  font-size: 1rem !important;*/
/*}*/
.main-power-slide-page-wave-platform-list {
  margin-top: calc(var(--dA4) * 1);
  color: #ccc !important;
}
.main-power-slide-page-wave-platform-list > div {
  flex-direction: column;
}
.main-power-slide-page-wave-platform-list > div > span {
  font-size: 0.85rem !important;
}
.main-power-slide-page-wave-platform .brandmi-icon * {
  font-size: 2rem !important;
}
.main-power-slide-page-wave-platform {
  cursor: pointer;
  color: #555555;
}
.main-power-slide-page-wave-platform-active,
.main-power-slide-page-wave-platform:hover {
  color: var(--mainColor6);
}
.main-power-slide .rmdp-input {
  direction: ltr;
  text-align: center;
}

.main-power-slide-step-title {
  padding: 0 3rem 0 1rem;
  font-size: 2rem !important;
  height: calc(var(--dA4) * 2) !important;
  line-height: calc(var(--dA4) * 2) !important;
  background: rgba(229, 229, 229, 0.3);
  font-family: "B Titr", "BTitr", "B-Nazanin", "samim", Verdana, Geneva, Tahoma,
    sans-serif !important;
  backdrop-filter: blur(5px);
}
.main-power-slide-step-content {
  height: calc(var(--dA4) * 18) !important;
  display: flex;
  justify-content: center;
}
.main-power-slide-step-footer {
  height: calc(var(--dA4) * 1) !important;
  background: rgba(198, 198, 198, 0.18);
  padding: calc(var(--dA4) / 4) !important;
}
.main-power-slide .card {
  box-shadow: none !important;
  margin: 0 !important;
}
.main-power-slide .card-header {
  display: none;
}
.main-power-slide .card * {
  max-width: var(--wA4) !important;
}
.main-power-slide .card-header {
  display: none;
}
.main-power-slide-step-content > .card {
  width: calc(var(--wA4) - calc(var(--dA4) * 2)) !important;
  margin: auto;
  background-color: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(5px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.main-power-slide-step-content > .card > .card-content {
  height: calc(var(--dA4) * 18) !important;
  width: calc(var(--wA4) - calc(var(--dA4) * 2)) !important;
  display: flex;
  flex-direction: column;
}
.main-power-slide-step-content .chart-parent {
  width: calc(var(--wA4) - calc(var(--dA4) * 4)) !important;
  height: calc(var(--dA4) * 16) !important;
}
/*.main-power-slide-step-content .chart-parent*/
/*.main-power-slide-step-content .word-cloud-list,*/
/*.main-power-slide-step-content .chart-parent .highcharts-container  */
/*{*/
/*  height: calc(var(--dA4) * 16) !important;*/
/*}*/
.main-power-slide-step-content .chart-parent .highcharts-container,
.main-power-slide-step-content .chart-parent .highcharts-container > svg {
  height: 100% !important;
  width: 100% !important;
}
.main-power-slide-step-content .word-cloud-list {
  display: block !important;
  width: 200px;
}
.main-power-slide-step-content .word-cloud-item .chart-parent,
.main-power-slide-step-content
  .word-cloud-item
  .chart-parent
  .highcharts-container,
.main-power-slide-step-content
  .word-cloud-item
  .chart-parent
  .highcharts-container
  > svg {
  width: calc(var(--wA4) - calc(var(--dA4) * 8)) !important;
}
.main-power-slide-step-content .word-cloud-item {
  align-items: center;
}
.main-power-slide-step-content .form-select {
  display: none;
}
.main-power-slide-page .step-page {
  background-size: contain;
}
.main-power-slide-page .statistics-wrapper {
  border: none !important;
  max-width: calc(var(--dA4) * 7);
}

.main-power-slide-page .step-page .wave-selected {
  backdrop-filter: blur(5px);
  width: 80%;
  margin: 0 auto;
  position: relative;
  margin-top: calc(var(--dA4) * 7);
  color: var(--mainColor6);
  background-color: rgba(255, 255, 255, 0.1);
  padding: var(--dA4);
  border-radius: calc(var(--dA4) / 4);
}
.main-power-slide-page-list-t {
  width: var(--wA4) !important;
  margin: calc(var(--dA4) / 4) auto 7rem auto;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  background: var(--mainColor6);
  display: flex;
  overflow: auto;
  flex-wrap: wrap;
}
.main-power-slide-page-list-t > div {
  cursor: pointer;
  margin: 0.5rem;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
  height: calc(var(--dA4) * 1);
  width: calc(var(--dA4) * 4);
  display: flex;
  text-align: center;
  overflow: hidden;
  justify-content: center;
  align-items: center;
}
.main-power-slide-page-list-t .select-page {
  background: #002649aa;
  color: var(--mainColor6);
}

.main-power-slide .data-info-statistic {
  margin: 2rem !important;
  color: #555 !important;
  font-size: 1.5rem !important;
}
.main-power-slide .data-info-statistic * {
  font-size: 1.5rem !important;
  color: #000 !important;
}
.main-power-slide-step-content {
  width: calc(var(--wA4) - calc(var(--dA4) * 3)) !important;
  margin: auto;
}

@media print {
  @page {
    size: a4 landscape;
    width: var(--wA4) !important;
    height: var(--hA4) !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .main-power-slide-page-control,
  .main-power-slide-page-info,
  .main-power-slide-page-list-t {
    display: none;
  }
  .main-power-slide {
    width: var(--wA4) !important;
    position: unset !important;
    background-color: blue;
    overflow: hidden !important;
  }
  .main-power-slide-page {
    height: fit-content !important;
    max-width: var(--wA4) !important;
    max-height: unset !important;
    position: relative !important;
    margin: 0 !important;
    box-shadow: none !important;
  }
  .step-page {
    display: grid !important;
    width: var(--wA4) !important;
    height: var(--hA4) !important;
    position: unset !important;
  }
  .main-power-slide-step-content > .card > .card-content {
    height: calc(var(--dA4) * 18) !important;
    width: calc(var(--wA4) - calc(var(--dA4) * 3)) !important;
    display: flex;
    flex-direction: column;
  }
  .main-power-slide-step-content .chart-parent,
  .main-power-slide-step-content .chart-parent .highcharts-container {
    width: calc(var(--wA4) - calc(var(--dA4) * 5)) !important;
  }
  .main-power-slide-step-content .chart-parent,
  /*.main-power-slide-step-content .word-cloud-list,*/
  .main-power-slide-step-content .chart-parent .highcharts-container {
    height: calc(var(--dA4) * 16) !important;
  }
  .main-power-slide-step-content .word-cloud-item .chart-parent,
  .main-power-slide-step-content
    .word-cloud-item
    .chart-parent
    .highcharts-container {
    width: calc(var(--wA4) - calc(var(--dA4) * 10)) !important;
  }
  .main-power-slide-step-content .chart-parent,
  .main-power-slide-step-content .word-cloud-list,
  .main-power-slide-step-content .chart-parent .highcharts-container {
    max-height: calc(var(--dA4) * 16) !important;
  }
  .main-power-slide-step-content > .card {
    display: flex !important;
  }
  .main-power-slide-step-content .card-content {
    border-radius: calc(var(--dA4) / 4);
  }
}

.invoice-letter-number {
  position: absolute;
  top: 5.4%;
  left: 12.3%;
  color: #585373;
  font-weight: bold;
}

.invoice-letter-date {
  position: absolute;
  top: 7.9%;
  left: 12.3%;
  color: #585373;
  font-weight: bold;
}

.invoice-letter-attach {
  position: absolute;
  top: 10.5%;
  left: 19.6%;
  color: #585373;
  font-weight: bold;
}

.invoice-company-info-component {
  position: absolute;
  top: 24%;
  right: 0;
  left: 0;
  height: 15%;
  overflow: hidden;
  /* background-color: rgba(0, 0, 0, 0.3); */
}

.invoice-company-name-info {
  /* background-color: tomato; */
  margin-top: 0.7%;
  margin-right: 25%;
  color: #717171;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 65%;
}

.invoice-company-info-details {
  display: flex;
  /* justify-content: space-between; */
  /* background-color: rgb(245, 245, 245); */
  margin-top: 1.9%;
  margin-right: 25.5%;
  color: #717171;
  flex-wrap: wrap;
  width: 100%;
}

.invoice-company-info-economic-code {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 13%;
}

.invoice-company-info-phone {
  margin-right: 7.5%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 14%;
}

.invoice-company-info-email {
  margin-right: 9%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 44%;
}

.invoice-company-info-national-id {
  margin-top: 2%;
  margin-right: 1%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 12%;
}

.invoice-company-info-fax {
  margin-top: 2%;
  margin-right: 8.4%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 14%;
}

.invoice-company-info-postal-code {
  margin-top: 1.9%;
  margin-right: 11%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 16%;
}

.invoice-company-info-address {
  margin-top: 1.8%;
  margin-right: 22%;
  color: #717171;
  flex-wrap: wrap;
  text-align: justify;
  width: 68%;
}

@media only screen and (max-width: 640px) {
  .invoice-company-name-info {
    margin-top: -1%;
    font-size: 10px;
  }
  .invoice-company-info-details {
    /* width: 100%; */
  }
  .invoice-company-info-details {
    margin-top: 0.5%;
    font-size: 10px;
    margin-right: 0;
  }
  .invoice-company-info-economic-code {
    font-size: 8.5px;
    width: 14%;
    margin-right: 25.5%;
  }
  .invoice-company-info-phone {
    font-size: 8.5px;
    margin-right: 7%;
    margin-top: 0.2%;
    width: 15%;
  }
  .invoice-company-info-email {
    font-size: 6.5px;
    margin-right: 7%;
    margin-top: 0.6%;
    width: 30%;
  }
  .invoice-company-info-national-id {
    font-size: 8.5px;
    margin-top: 0.6%;
    margin-right: 26%;
    width: 14%;
  }
  .invoice-company-info-fax {
    font-size: 8.5px;
    margin-top: 0.6%;
    margin-right: 5.4%;
    width: 15%;
  }
  .invoice-company-info-postal-code {
    font-size: 8.5px;
    margin-top: 0.5%;
    width: 16%;
  }
  .invoice-company-info-address {
    font-size: 8.5px;
    margin-top: 0.6%;
    margin-right: 22%;
    color: #717171;
    flex-wrap: wrap;
    width: 68%;
  }
}

.invoice-service-component {
  position: absolute;
  top: 40%;
  right: 0;
  left: 0;
  width: 100%;
}

.invoice-service-wrapper {
  height: 100%;
  display: flex;
  justify-content: center;
}

.invoice-service-head-wrapper {
  width: 100%;
  height: 38px;
  background-color: #16b4a9;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--mainColor6);
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #bfbfbf;
}

.invoice-head-service {
  width: 48%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.invoice-head-period {
  width: 25%;
  display: flex;
  justify-content: center;
}
.invoice-head-sum {
  width: 27%;
  display: flex;
  justify-content: center;
}

.invoice-head-line {
  border-left: 1px solid #bfbfbf;
  height: 100%;
  margin: 0;
}

.invoice-service-body-wrapper {
  width: 100%;
  height: 38px;
  background-color: var(--mainColor6);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  font-size: 14px;
  border: 1px solid #bfbfbf;
}

.invoice-body-service {
  width: 48%;
  height: 100%;
  overflow: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.invoice-body-period {
  width: 25%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.invoice-body-sum {
  width: 27%;
  display: flex;
  justify-content: center;
  position: relative;
}

.invoice-service-body-details-wrapper {
  width: 100%;
  height: 38px;
  background-color: #f2f2f2;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  font-size: 14px;
  border: 1px solid #bfbfbf;
}

.invoice-service-details-wrapper {
  background-color: #f2f2f2;
  width: 48%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.invoice-service-details-sum-wrapper {
  background-color: #16b4a9;
  color: var(--mainColor6);
  width: 25%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}

.invoice-service-details-sum-wrapper-precent {
  background-color: #f2f2f2;
  color: #000;
  width: 25%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.invoice-service-details-sum-wrapper-price-precent {
  background-color: #f2f2f2;
  color: #000;
  width: 27%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.invoice-service-details-sum-wrapper-price {
  background-color: #16b4a9;
  color: var(--mainColor6);
  width: 27%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}

.invoice-service-body-desc-wrapper {
  width: 100%;
  min-height: 100px;
  max-height: 152px;
  overflow: auto;
  background-color: #f2f2f2;
  display: flex;
  align-items: flex-start;
  color: #000;
  padding: 8px;
  border: 1px solid #bfbfbf;
  text-align: justify;
}

.invoice-service-footer-title-wrapper {
  width: 100%;
  height: 38px;
  background-color: #16b4a9;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mainColor6);
  font-weight: bold;
  font-size: 13px;
  border: 1px solid #bfbfbf;
}

.invoice-service-footer-desc-wrapper {
  width: 100%;
  min-height: 80px;
  max-height: 200px;
  overflow: auto;
  background-color: #f2f2f2;
  align-items: flex-start;
  color: #000;
  padding: 8px;
  border: 1px solid #bfbfbf;
}

.invoice-footer-desc-service {
  margin: 4px 0;
}

.invoice-footer-sign-service {
  float: left;
  width: 140px;
}

.invoice-service-footer-description-wrapper {
  width: 100%;
  height: 38px;
  background-color: #f2f2f2;
  display: flex;
  justify-content: flex-start;
  color: #000;
  font-size: 13px;
  padding: 8px;
  border: 1px solid #bfbfbf;
}

@media only screen and (max-width: 640px) {
  .invoice-service-head-wrapper {
    font-size: 12px;
  }
  .invoice-service-body-wrapper {
    font-size: 12px;
  }
  .invoice-service-body-details-wrapper {
    font-size: 11px;
  }
  .invoice-footer-sign-service {
    width: 90px;
  }
  .invoice-service-footer-description-wrapper {
    height: auto;
  }
}

.invoice-component {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--mainColor6);
  overflow: auto;
}

.invoice-wrapper {
  position: relative;
  margin: 50px auto;
  width: 800px;
  max-width: 100%;
  min-width: 800px;
}

.invoice-wrapper img {
  width: 100%;
}

@media print {
  body {
    margin: 0;
  }
  .invoice-wrapper {
    margin: 0;
  }
  .wa__btn_popup {
    display: none;
  }
}

.card-tab-details-tabs .card-tab-details-title {
  padding: 0;
  background-color: var(--mainColor5);
  border-radius: 0;
  height: 46px;
}
.card-tab-details-tabs {
}
.card-tab-details-tabs-list ul {
  padding: 0;
  margin: 0 36px 0 16px;
  list-style: none;
  border-radius: 6px 6px 0 0;
  overflow: hidden;
  display: flex;
  background-color: var(--mainColor5);
  max-width: calc(100vw - 100px);
}
.tab-item1 {
  display: inline-block;
  padding: 10px 16px;
  cursor: pointer;
  color: var(--mainColor4);
  white-space: nowrap;
  border: none;
  border-radius: 6px 6px 0 0;
  height: 40px;
  margin: 6px 2px 0 2px;
}
.tab-item1 svg * {
  /* stroke: #a5acc6; */
}
.tab-item1:hover {
  border: none;
  color: var(--mainColor4);
  background-color: var(--mainColor10);
  height: 40px;
}
.tab-item1-last {
  display: inline-block;
  cursor: default;
  width: 100%;
}
.tab-item1-active,
.tab-item1-active:hover {
  background-color: var(--mainColor4);
  color: var(--mainColor2);
  cursor: pointer;
  border: none;
  border-radius: 6px 6px 0 0;
  height: 40px;
}
.tab-item1-active svg *,
.tab-item1-active:hover svg * {
  /* stroke: var(--mainColor5); */
  border: none;
}
.tab-item1-disable,
.tab-item1-disable:hover {
  color: #d6dce4;
  cursor: not-allowed;
  border: none;
}
.tab-item1-disable svg *,
.tab-item1-disable:hover svg * {
  /* stroke: #d6dce4; */
}
.tab-item1-icon {
  margin: 0 4px;
}

.card-tab-details {
  position: relative;
  /* box-shadow: 0px 2px 20px rgba(180, 188, 188, 0.2); */
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  min-height: 100px;
}
.card-tab-details-header {
  display: flex;
  margin-bottom: 4px;
}
.card-tab-details-space {
  flex: 1;
  background-color: var(--mainColor5);
}
.card-tab-details-icon {
  position: absolute;
  right: 8px;
  top: 16px;
  width: 20px;
  height: 20px;
  z-index: 1;
  overflow: hidden;
}
.card-tab-details-extra {
  position: relative;
  margin-left: 8px;
  margin-top: 8px;
}
.card-tab-details-title {
  padding: 16px 32px;
  background-color: transparent;
  border-radius: 8px 8px 0 0;
  font-size: 14px;
  color: #a5acc6;
  /* font-weight: 700; */
}
.card-tab-details-footer {
  padding: 16px 16px;
  background-color: transparent;
  border-radius: 0 0 8px 8px;
}
.card-tab-details-content {
  padding: 16px;
  flex: auto;
  align-items: center;
  height: 100%;
}
.card-tab-details-extra-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.card-tab-details-extra-list li {
  margin: 0 2px 0 0;
  padding: 4px;
  text-align: center;
  border-radius: 4px;
  color: var(--themIconBgColor);
  justify-content: center;
  align-items: center;
  display: inline-flex;
  cursor: pointer;
}
.card-tab-details-extra-list li svg * {
  stroke: var(--themIconTextColor);
}
.card-tab-details-extra-list li:hover {
  background-color: var(--themIconHoverBgColor);
  color: var(--themIconHoverTextColor);
}
.card-tab-details-extra-list li:hover svg * {
  stroke: var(--themIconHoverTextColor);
}
.card-tab-details-extra-list li.active {
  background-color: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
}
.card-tab-details-extra-list li.active svg * {
  stroke: var(--themIconActiveTextColor);
}
.card-tab-details-extra-list li.disable {
  background-color: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
  cursor: not-allowed;
}
.card-tab-details-extra-list li.disable svg * {
  stroke: var(--themIconDisableTextColor);
}

.card-tab-details-extra-list li {
  cursor: pointer;
  outline: none;
  background-color: transparent;
  color: var(--mainColor5);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
}
.card-tab-details-extra-list li .brandmi-icon {
}

@media only screen and (max-width: 640px) {
  .card-tab-details-content {
    padding: 0;
  }
}

.public-service-page {
  background: var(--mainColor6);
  height: 100vh;
  padding: 50px;
  overflow: auto;
}
.public-service-container {
  margin: auto;
  width: min(100%, 900px);
}

.lottery-number {
  background: var(--mainColor6);
  min-height: 100vh;
  width: 100%;
}

.IntroMonitoringList {
  display: flex;
  flex-wrap: wrap;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  align-items: center;
  justify-content: center;
}
.IntroMonitoringList-item {
  background: rgba(250, 250, 250, 0.7);
  width: 220px;
  height: 220px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px;
  position: relative;
  overflow: hidden;
  transition: all 0.3s;
  color: #000;
  border: 2px solid #333;
}

.IntroMonitoringList-item:before {
  content: "";
  width: 350px;
  height: 300px;
  border-radius: 50%;
  background: linear-gradient(
    230deg,
    #fff,
    rgba(250, 250, 250, 0.3),
    transparent
  );
  position: absolute;
  left: 0;
  top: -65%;
  z-index: 2;
}
.IntroMonitoringList-item:hover {
  background: rgba(255, 243, 164, 0.5);
  box-shadow: 0 0 5px 1px #333;
  transition: all 0.3s;
  color: #000;
}

.IntroMonitoringList-item img {
  position: absolute;
  width: 130px;
  transition: 0.3s;
}
.IntroMonitoringList-item:hover img {
  transform: rotate(3deg) scale(1.2);
  transition: 0.3s;
  opacity: 0.9;
}
.IntroMonitoringList-item span {
  position: absolute;
  width: 200px;
  bottom: 0;
  text-align: center;
  background-color: #333;
  color: var(--mainColor6);
  padding: 5px;
  border: 2px solid #333;
  border-radius: 15px 15px 0 0;
}

.iran-heat-map-main {
  width: 190px;
  height: 250px;
  border-radius: 5px;
  margin: 5px;
  overflow: auto;
  padding: 0px;
  font-size: 10px;
  position: relative;
}

.iran-heat-map-title {
  text-align: center;
  position: sticky;
  z-index: 2;
  top: 0;
}

.iran-heat-map-title h3 {
  margin: 0;
  padding: 10px;
}
.iran-heat-map-content {
  padding: 2px;
}
.iran-heat-map-content-meta > div {
  display: flex;
  align-items: center;
  border-bottom: 1px dashed #ccc;
  padding: 2px;
}
.iran-heat-map-content-meta > div > span {
  width: 80px;
  overflow: hidden;
  white-space: nowrap;
  margin: 0 2px;
  text-overflow: ellipsis;
}
.iran-heat-map-content-meta > div > div {
  height: 4px;
  margin: 2px;
  width: 100%;
}
.iran-heat-map-content-meta > div > div > div {
  height: 4px;
  margin: 2px;
}
.iran-heat-map-content-list-item {
  display: flex;
  align-items: center;
  border-bottom: 1px dashed #ccc;
  padding: 2px;
}
.iran-heat-map-content-list-item-name {
  width: 80px;
  overflow: hidden;
  white-space: nowrap;
  margin: 0 2px;
  text-overflow: ellipsis;
}

#optionsContainer {
  width: 500px;
  overflow: auto;
}
div.vis-configuration-wrapper {
  width: 100% !important;
}
div.vis-configuration.vis-config-item {
  width: 300px;
}
.myvis {
  background-color: var(--mainColor6);
  height: 100%;
  display: flex;
  direction: ltr;
}
.myvis > div {
  height: 100%;
  flex: 1;
}
.vis-loading {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.1);
}
.vis-loading-text {
  background-color: #f2f2f2;
  padding: 5px;
  border-radius: 2px;
}

#vis-demo-options {
  width: 310px;
  max-width: 310px;
  direction: ltr;
  overflow: auto;
}
input.vis-configuration.vis-config-range {
  width: 100px;
}
.vis-config-item .vis-configuration {
  padding: 0 !important;
  background-color: inherit;
}

.invoice-letter-number {
  position: absolute;
  top: 5.4%;
  left: 12.3%;
  color: #585373;
  font-weight: bold;
  direction: rtl;
}

.invoice-letter-date {
  position: absolute;
  top: 7.9%;
  left: 12.3%;
  color: #585373;
  font-weight: bold;
}

.invoice-letter-attach {
  position: absolute;
  top: 10.5%;
  left: 19.6%;
  color: #585373;
  font-weight: bold;
}

.invoice-company-info-component {
  position: absolute;
  top: 24%;
  right: 0;
  left: 0;
  height: 15%;
  overflow: hidden;
  /* background-color: rgba(0, 0, 0, 0.3); */
}

.invoice-company-name-info {
  /* background-color: tomato; */
  margin-top: 0.7%;
  margin-right: 25%;
  color: #717171;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 65%;
}

.invoice-company-info-details {
  display: flex;
  /* justify-content: space-between; */
  /* background-color: rgb(245, 245, 245); */
  margin-top: 2.2%;
  margin-right: 25.5%;
  color: #717171;
  flex-wrap: wrap;
  width: 100%;
}

.invoice-company-info-economic-code {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 13%;
}

.invoice-company-info-phone {
  margin-right: 7.5%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 14%;
}

.invoice-company-info-email {
  margin-right: 9%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 44%;
}

.invoice-company-info-national-id {
  margin-top: 2%;
  margin-right: 1%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 12%;
}

.invoice-company-info-fax {
  margin-top: 2%;
  margin-right: 8.4%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 14%;
}

.invoice-company-info-postal-code {
  margin-top: 1.9%;
  margin-right: 11%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 16%;
}

.invoice-company-info-address {
  margin-top: 1.8%;
  margin-right: 22%;
  color: #717171;
  flex-wrap: wrap;
  text-align: justify;
  width: 68%;
}

@media only screen and (max-width: 640px) {
  .invoice-company-name-info {
    margin-top: -1%;
    font-size: 10px;
  }
  .invoice-company-info-details {
    /* width: 100%; */
  }
  .invoice-company-info-details {
    margin-top: 0.5%;
    font-size: 10px;
    margin-right: 0;
  }
  .invoice-company-info-economic-code {
    font-size: 8.5px;
    width: 14%;
    margin-right: 25.5%;
  }
  .invoice-company-info-phone {
    font-size: 8.5px;
    margin-right: 7%;
    margin-top: 0.2%;
    width: 15%;
  }
  .invoice-company-info-email {
    font-size: 6.5px;
    margin-right: 7%;
    margin-top: 0.6%;
    width: 30%;
  }
  .invoice-company-info-national-id {
    font-size: 8.5px;
    margin-top: 0.6%;
    margin-right: 26%;
    width: 14%;
  }
  .invoice-company-info-fax {
    font-size: 8.5px;
    margin-top: 0.6%;
    margin-right: 5.4%;
    width: 15%;
  }
  .invoice-company-info-postal-code {
    font-size: 8.5px;
    margin-top: 0.5%;
    width: 16%;
  }
  .invoice-company-info-address {
    font-size: 8.5px;
    margin-top: 0.6%;
    margin-right: 22%;
    color: #717171;
    flex-wrap: wrap;
    width: 68%;
  }
}

.invoice-service-component {
  position: absolute;
  top: 40%;
  right: 0;
  left: 0;
  width: 100%;
}

.invoice-service-wrapper {
  height: 100%;
  display: flex;
  justify-content: center;
}

.invoice-service-head-wrapper {
  width: 100%;
  height: 38px;
  background-color: #16b4a9;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--mainColor6);
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #bfbfbf;
}

.invoice-head-service {
  width: 48%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.invoice-head-period {
  width: 25%;
  display: flex;
  justify-content: center;
}
.invoice-head-sum {
  width: 27%;
  display: flex;
  justify-content: center;
}

.invoice-head-line {
  border-left: 1px solid #bfbfbf;
  height: 100%;
  margin: 0;
}

.invoice-service-body-wrapper {
  width: 100%;
  height: 38px;
  background-color: var(--mainColor6);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  font-size: 14px;
  border: 1px solid #bfbfbf;
}

.invoice-body-service {
  width: 48%;
  height: 100%;
  overflow: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.invoice-body-period {
  width: 25%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.invoice-body-sum {
  width: 27%;
  display: flex;
  justify-content: center;
  position: relative;
}

.invoice-service-body-details-wrapper {
  width: 100%;
  height: 38px;
  background-color: #f2f2f2;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  font-size: 14px;
  border: 1px solid #bfbfbf;
}

.invoice-service-details-wrapper {
  background-color: #f2f2f2;
  width: 48%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.invoice-service-details-sum-wrapper {
  background-color: #16b4a9;
  color: var(--mainColor6);
  width: 25%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}

.invoice-service-details-sum-wrapper-precent {
  background-color: #f2f2f2;
  color: #000;
  width: 25%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.invoice-service-details-sum-wrapper-price-precent {
  background-color: #f2f2f2;
  color: #000;
  width: 27%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.invoice-service-details-sum-wrapper-price {
  background-color: #16b4a9;
  color: var(--mainColor6);
  width: 27%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}

.invoice-service-body-desc-wrapper {
  width: 100%;
  min-height: 100px;
  max-height: 152px;
  overflow: auto;
  background-color: #f2f2f2;
  display: flex;
  align-items: flex-start;
  color: #000;
  padding: 8px;
  border: 1px solid #bfbfbf;
  text-align: justify;
}

.invoice-service-footer-title-wrapper {
  width: 100%;
  height: 38px;
  background-color: #16b4a9;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mainColor6);
  font-weight: bold;
  font-size: 13px;
  border: 1px solid #bfbfbf;
}

.invoice-service-footer-desc-wrapper {
  width: 100%;
  min-height: 80px;
  max-height: 200px;
  overflow: auto;
  background-color: #f2f2f2;
  align-items: flex-start;
  color: #000;
  padding: 8px;
  border: 1px solid #bfbfbf;
}

.invoice-footer-desc-service {
  margin: 4px 0;
}

.invoice-footer-sign-service {
  float: left;
  width: 140px;
}

.invoice-service-footer-description-wrapper {
  width: 100%;
  height: 38px;
  background-color: #f2f2f2;
  display: flex;
  justify-content: flex-start;
  color: #000;
  font-size: 13px;
  padding: 8px;
  border: 1px solid #bfbfbf;
}

.invoice-body-desc-service {
  display: flex;
  width: 100%;
}

@media only screen and (max-width: 640px) {
  .invoice-service-head-wrapper {
    font-size: 12px;
  }
  .invoice-service-body-wrapper {
    font-size: 12px;
  }
  .invoice-service-body-details-wrapper {
    font-size: 11px;
  }
  .invoice-footer-sign-service {
    width: 90px;
  }
  .invoice-service-footer-description-wrapper {
    height: auto;
  }
}

.brandmi-icon {
  line-height: 0;
  padding: 0;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.brandmi-icon-size-normal {
  font-size: inherit;
}
.brandmi-icon-size-xs {
  font-size: 12px;
}
.brandmi-icon-size-sm {
  font-size: 16px;
}
.brandmi-icon-size-md {
  font-size: 20px;
}
.brandmi-icon-size-lg {
  font-size: 24px;
}
.brandmi-icon-size-xl {
  font-size: 28px;
}

.brandmi-icon-size-xxl {
  font-size: 34px;
}

.brandmi-icon-size-xxxl {
  font-size: 42px;
}

.brandmi-icon-size-xxxxl {
  font-size: 48px;
}

.brandmi-icon-size-xxxxxl {
  font-size: 80px;
}
.app-logo {
  margin: 0 5px;
}
#header .header-logo h1 {
  align-items: center;
}

@font-face {
  font-family: 'BBardiya';
  src: url(/ddc7a21c4cdeaf58954e.eot?) format('eot'),  /* IE6–8 */
       url(/405d39817590d35de6b3.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/f14803f5cad2030553ae.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BHoma';
  src: url(/959ad6c2fe4b328057b6.eot?) format('eot'),  /* IE6–8 */
       url(/315435beef6fce1701ec.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/5970a9c0119ac443d8f0.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BKoodak';
  src: url(/315e850873da123eda85.eot?) format('eot'),  /* IE6–8 */
       url(/61474940e1952d35876b.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/52103c7edea89c9a70ed.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BLotus';
  src: url(/03441c54838568d1abcc.eot?) format('eot'),  /* IE6–8 */
       url(/b16e517b41ff1c6ba0d9.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/bcadddc53937452c4c3f.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BMitra';
  src: url(/edb9e9c3faa60f7c05cf.eot?) format('eot'),  /* IE6–8 */
       url(/7236bb3b773257b0d456.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/191c3628967bbdf61a99.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BNasim';
  src: url(/a4f4c0e9357a3a660c1e.eot?) format('eot'),  /* IE6–8 */
       url(/f09ebc98f5f46fa6f07a.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/8041aed8f69cd3df1e80.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BNazanin';
  src: url(/162969bfbb953b67cc23.eot?) format('eot'),  /* IE6–8 */
       url(/7280f8679e532a429c83.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/5e9461d63bcf4bcbe433.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BTabassom';
  src: url(/925ef5bd69e88f873119.eot?) format('eot'),  /* IE6–8 */
       url(/954b57e6b2c1e167510a.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/2a62ca46d9c44d557637.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BTehran';
  src: url(/974d1f9eb900e9841180.eot?) format('eot'),  /* IE6–8 */
       url(/d5a3cf72727a64385772.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/242064b4df80ec50766d.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BTitr';
  src: url(/07c6a3b47e20539a5c5b.eot?) format('eot'),  /* IE6–8 */
       url(/6da9759946c3a45bba5a.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/3209a92b71e5a09732c6.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BTraffic';
  src: url(/4037c8744d83af479783.eot?) format('eot'),  /* IE6–8 */
       url(/6dba0191e5e5662993bf.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/05df90771ecaa2f5ea83.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BYekan';
  src: url(/604596cb183c11c7abf7.eot?) format('eot'),  /* IE6–8 */
       url(/cc0dbf9e16189e73a7be.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/f717454db8f70fbcd198.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: 'BZar';
  src: url(/6060bc9e66c48e409c59.eot?) format('eot'),  /* IE6–8 */
       url(/bfc9d06114bd5b3eb18d.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/08a4cd71bf27052a8da0.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}


@font-face {
  font-family: "brandmi";
  src: url(/0c78f7a6cdc64cf1675a.eot?2f9d58);
  src: url(/0c78f7a6cdc64cf1675a.eot?2f9d58#iefix)
      format("embedded-opentype"),
    url(/6d7316d25e62e7f93a74.ttf?2f9d58) format("truetype"),
    url(/3a5d421bf1570a665cdc.woff?2f9d58) format("woff"),
    url(/4d7549d0f90c1b0feb71.svg?2f9d58#brandmi) format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="ic-"],
[class*=" ic-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "brandmi" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ic-ActiveUser:before {
  content: "\e968";
}
.ic-AddEvent:before {
  content: "\e900";
}
.ic-Aionet:before {
  content: "\e995";
}
.ic-AllSection:before {
  content: "\e901";
}
.ic-AnalyzeAccount:before {
  content: "\e902";
}
.ic-AnalyzeCampaign:before {
  content: "\e903";
}
.ic-AnalyzeIndustry:before {
  content: "\e904";
}
.ic-AnalyzeWave:before {
  content: "\e905";
}
.ic-Aparat:before {
  content: "\e981";
}
.ic-Archive:before {
  content: "\e906";
}
.ic-ArrowLeft:before {
  content: "\e907";
}
.ic-ArrowRight:before {
  content: "\e908";
}
.ic-ArrowT1Down:before {
  content: "\e909";
}
.ic-ArrowT1LeftFill:before {
  content: "\e90a";
}
.ic-ArrowT2Down:before {
  content: "\e90b";
}
.ic-ArrowT2DownFill:before {
  content: "\e90c";
}
.ic-ArrowT2Left:before {
  content: "\e90d";
}
.ic-ArrowT2LeftFill:before {
  content: "\e90e";
}
.ic-ArrowT2Right:before {
  content: "\e90f";
}
.ic-ArrowT2RightFill:before {
  content: "\e910";
}
.ic-ArrowT2Up:before {
  content: "\e911";
}
.ic-ArrowT2UpFill:before {
  content: "\e912";
}
.ic-BolletFill:before {
  content: "\e913";
}
.ic-Bourse:before {
  content: "\e993";
}
.ic-BrandCompare:before {
  content: "\e915";
}
.ic-Bulletin:before {
  content: "\e914";
}
.ic-BulletinDate:before {
  content: "\e969";
}
.ic-ChangeChart:before {
  content: "\e916";
}
.ic-ChartBar:before {
  content: "\e918";
}
.ic-ChartCloud:before {
  content: "\e989";
}
.ic-ChartColumn:before {
  content: "\e917";
}
.ic-ChartDonat:before {
  content: "\e919";
}
.ic-ChartNeo:before {
  content: "\e98a";
}
.ic-ChartPie:before {
  content: "\e91a";
}
.ic-ChartTimeline:before {
  content: "\e98b";
}
.ic-Check:before {
  content: "\e91b";
}
.ic-CheckAll:before {
  content: "\e91c";
}
.ic-CheckFalse:before {
  content: "\e91d";
}
.ic-CheckTrue:before {
  content: "\e91e";
}
.ic-Close:before {
  content: "\e91f";
}
.ic-Codal:before {
  content: "\e994";
}
.ic-Comment:before {
  content: "\e920";
}
.ic-CommentAdd:before {
  content: "\e96a";
}
.ic-CommentBulletin:before {
  content: "\e97a";
}
.ic-Dalfak:before {
  content: "\e982";
}
.ic-Date:before {
  content: "\e921";
}
.ic-Delete:before {
  content: "\e953";
}
.ic-Deselect:before {
  content: "\e97b";
}
.ic-Dideo:before {
  content: "\e983";
}
.ic-DisLike:before {
  content: "\e99a";
}
.ic-Download:before {
  content: "\e922";
}
.ic-DownloadNews:before {
  content: "\e923";
}
.ic-Edit:before {
  content: "\e94e";
}
.ic-EffectiveUser:before {
  content: "\e96b";
}
.ic-EghtesadiGisheCategory:before {
  content: "\e95d";
}
.ic-Email:before {
  content: "\e963";
}
.ic-EventDiagram:before {
  content: "\e975";
}
.ic-ExcelFile:before {
  content: "\e99b";
}
.ic-ExclamationMark:before {
  content: "\e95c";
}
.ic-Export:before {
  content: "\e924";
}
.ic-Filter:before {
  content: "\e925";
}
.ic-FulScreen:before {
  content: "\e94f";
}
.ic-Gishe:before {
  content: "\e933";
}
.ic-GisheMaker:before {
  content: "\e979";
}
.ic-Gmail:before {
  content: "\e964";
}
.ic-Grid:before {
  content: "\e926";
}
.ic-GrowthFollower:before {
  content: "\e976";
}
.ic-Heart:before {
  content: "\e927";
}
.ic-HeartFill:before {
  content: "\e928";
}
.ic-Help:before {
  content: "\e929";
}
.ic-HtmlFile:before {
  content: "\e950";
}
.ic-Image:before {
  content: "\e96c";
}
.ic-Instagram:before {
  content: "\e92a";
}
.ic-InstagramHighlight:before {
  content: "\e954";
}
.ic-Jabeh:before {
  content: "\e984";
}
.ic-Like:before {
  content: "\e99c";
}
.ic-Link:before {
  content: "\e92b";
}
.ic-Linkdin:before {
  content: "\e965";
}
.ic-Logout:before {
  content: "\e92c";
}
.ic-MagGisheCategory:before {
  content: "\e95e";
}
.ic-Marker:before {
  content: "\e96d";
}
.ic-ModeDark:before {
  content: "\e92d";
}
.ic-ModeLight:before {
  content: "\e92e";
}
.ic-MoreH:before {
  content: "\e92f";
}
.ic-MoreL:before {
  content: "\e930";
}
.ic-MoshahedehMohtava:before {
  content: "\e985";
}
.ic-MyBrand:before {
  content: "\e931";
}
.ic-Namasha:before {
  content: "\e986";
}
.ic-Nav:before {
  content: "\e932";
}
.ic-News:before {
  content: "\e934";
}
.ic-Newspaper:before {
  content: "\e97d";
}
.ic-Notification:before {
  content: "\e935";
}
.ic-Notify:before {
  content: "\e977";
}
.ic-Ocr:before {
  content: "\e97e";
}
.ic-OmumiGisheCategory:before {
  content: "\e95f";
}
.ic-OstaniGisheCategory:before {
  content: "\e960";
}
.ic-OtherGisheCategory:before {
  content: "\e961";
}
.ic-Output:before {
  content: "\e955";
}
.ic-PauseFill:before {
  content: "\e936";
}
.ic-PdfFile:before {
  content: "\e951";
}
.ic-PickNote:before {
  content: "\e978";
}
.ic-Pishfactor:before {
  content: "\e987";
}
.ic-PlayFill:before {
  content: "\e937";
}
.ic-Profile:before {
  content: "\e938";
}
.ic-PropagationProcedure:before {
  content: "\e972";
}
.ic-Quote:before {
  content: "\e939";
}
.ic-Rahavard:before {
  content: "\e996";
}
.ic-RaidoFalse:before {
  content: "\e93a";
}
.ic-RaidoTrue:before {
  content: "\e93b";
}
.ic-ReTweet:before {
  content: "\e93d";
}
.ic-Reply:before {
  content: "\e93c";
}
.ic-Request:before {
  content: "\e956";
}
.ic-RoshdNemoudar:before {
  content: "\e988";
}
.ic-Sahamyab:before {
  content: "\e997";
}
.ic-SchedulPost:before {
  content: "\e999";
}
.ic-Search:before {
  content: "\e93e";
}
.ic-SendTo:before {
  content: "\e93f";
}
.ic-Setting:before {
  content: "\e940";
}
.ic-Share:before {
  content: "\e966";
}
.ic-SmartBulletin:before {
  content: "\e957";
}
.ic-SmartSecretary:before {
  content: "\e941";
}
.ic-SocialBase:before {
  content: "\e96e";
}
.ic-SortDown:before {
  content: "\e942";
}
.ic-SortUp:before {
  content: "\e943";
}
.ic-SouratHesab:before {
  content: "\e98c";
}
.ic-Support:before {
  content: "\e944";
}
.ic-Switch:before {
  content: "\e958";
}
.ic-Tag:before {
  content: "\e945";
}
.ic-Tamasha:before {
  content: "\e98d";
}
.ic-TaskRasane:before {
  content: "\e97c";
}
.ic-Telegram:before {
  content: "\e946";
}
.ic-TelegramChannel:before {
  content: "\e959";
}
.ic-TelegramChannel1:before {
  content: "\e96f";
}
.ic-TelegramGroup:before {
  content: "\e95a";
}
.ic-TelegramGroup1:before {
  content: "\e970";
}
.ic-TelegramUser:before {
  content: "\e98e";
}
.ic-Telewibion:before {
  content: "\e98f";
}
.ic-TimePerioud:before {
  content: "\e973";
}
.ic-TitleBase:before {
  content: "\e971";
}
.ic-ToggleFalse:before {
  content: "\e947";
}
.ic-ToggleTrue:before {
  content: "\e948";
}
.ic-Transaction:before {
  content: "\e990";
}
.ic-Translate:before {
  content: "\e97f";
}
.ic-Tsetmc:before {
  content: "\e998";
}
.ic-TvRadio:before {
  content: "\e980";
}
.ic-Twitter:before {
  content: "\e949";
}
.ic-Upload:before {
  content: "\e94a";
}
.ic-VarzeshiGisheCategory:before {
  content: "\e962";
}
.ic-Video:before {
  content: "\e974";
}
.ic-View:before {
  content: "\e94b";
}
.ic-ViewFalse:before {
  content: "\e94c";
}
.ic-ViewShenasnameh:before {
  content: "\e95b";
}
.ic-ViewTrue:before {
  content: "\e94d";
}
.ic-WebAddress:before {
  content: "\e991";
}
.ic-Whatsapp:before {
  content: "\e967";
}
.ic-WordFile:before {
  content: "\e952";
}
.ic-Youtube:before {
  content: "\e992";
}

.brandmi-icon img {
  width: 16px;
  height: 16px;
}

.icon-danger-fill,
.icon-info-fill,
.icon-success-fill,
.icon-danger-fill-h {
  color: var(--mainColor6);
  border-radius: 50%;
}
.icon-info-fill {
  background-color: #ccc;
}
.icon-success-fill {
  background-color: var(--mainColor5);
}
.icon-danger-fill {
  background-color: #d04863;
}

.icon-danger-fill:hover {
  background-color: #ed94a6;
}

.icon-danger-fill-h {
  color: #d04863;
  background: #ffd7dd;
}
.icon-danger-fill-h:hover {
  color: var(--mainColor6);
  background-color: #ed94a6;
}

.monitoring-nav-open {
  position: fixed;
  top: 20px;
  right: 0;
  opacity: 0.6;
  border-radius: 10px 0 0 10px;
  padding: 5px;
  background: #333;
  z-index: 9;
  width: 40px;
  height: 40px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--mainColor6);
}
.monitoring-nav-open:hover {
  opacity: 1;
}
.monitoring-nav {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  background: #333;
  color: var(--mainColor6);
  width: 250px;
  display: flex;
  flex-direction: column;
  padding: 10px;
  box-shadow: -10px 0 15px rgba(0, 0, 0, 0.5);
  transition: all 0.5s;
  z-index: 10;
}
.monitoring-nav-items {
  height: calc(100vh - 200px);
  padding: 10px;
  overflow-y: auto;
}
.monitoring-nav-footer {
  height: 200px;
  border-top: 1px solid #666;
  padding: 10px;
}
.monitoring-nav-item,
.monitoring-nav a {
  color: var(--mainColor6);
  display: block;
  transition: all 0.3s;
  border-radius: 5px;
  border: 1px solid #666;
  margin: 5px 0;
}
.monitoring-nav a {
  padding: 10px;
}
.monitoring-nav-items a {
  border: none;
  cursor: pointer;
}
.monitoring-nav-item {
  display: flex;
}
.monitoring-nav-item span:hover,
.monitoring-nav a:hover {
  color: #d0f862;
  background-color: rgba(0, 0, 0, 0.1);
}
.monitoring-nav-item-active {
  border-right: 8px solid #d0f862;
}
.monitoring-nav-item-active > a:first-of-type {
  font-weight: bold;
  color: #d0f862;
}

.monitoring-nav-item a:first-of-type {
  display: block;
  width: 100%;
}
.monitoring-nav-item {
  display: flex;
  justify-content: space-between;
}
.item-c {
  background: var(--mainColor6);
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.3s ease-in-out;
}
.change-size-e,
.change-size-i {
  position: absolute;
  justify-content: center;
  align-items: center;
  display: flex;
  z-index: 3;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out;
}
.change-size-e {
  background-color: rgba(111, 225, 255, 0.3);
}
.change-size-i {
  background-color: rgba(255, 215, 134, 0.3);
}
.item-c:hover .change-size-e,
.item-c:hover .change-size-i {
  opacity: 0.5;
  visibility: initial;
}
.item-c .change-size-e:hover,
.item-c .change-size-i:hover {
  opacity: 1;
}
.item-c .card {
  width: 100%;
}
.widget-item-c > div > .card {
  height: 100%;
  min-height: auto !important;
}
.add-item-c {
  background: #ddd;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  flex-direction: column;
}
.add-item-c img {
  opacity: 0.3;
  transition: all 0.3s ease-in-out;
}
.add-item-c span {
  opacity: 0;
  transition: all 0.3s ease-in-out;
  visibility: hidden;
  display: inline-block;
  transform: scale(0.1);
  background: rgba(0, 0, 0, 0.5);
  color: #d8fca5;
  padding: 0;
  border-radius: 5px;
}
.add-item-c:hover {
  background: #fff3cd;
  transition: all 0.3s ease-in-out;
}
.add-item-c:hover img {
  opacity: 0.7;
  transition: all 0.3s ease-in-out;
  transform: scale(1.2);
}
.add-item-c:hover span {
  opacity: 1;
  transition: all 0.3s ease-in-out;
  transform: scale(1.2);
  visibility: inherit;
  margin: 10px 0;
  padding: 5px;
}
.widget-item-remove,
.widget-item-move,
.widget-item-edit {
  position: absolute;
  left: 20px;
  width: 30px;
  height: 30px;
  background: rgba(0, 0, 0, 0.3);
  color: var(--mainColor6);
  z-index: 5;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
}
.widget-item-remove {
  position: absolute;
  top: 20px;
}
.widget-item-move {
  top: 55px;
}
.widget-item-edit {
  top: 90px;
}
.item-c:hover .widget-item-remove,
.item-c:hover .widget-item-move,
.item-c:hover .widget-item-edit {
  opacity: 0.5;
  visibility: initial;
}
.item-c:hover .widget-item-remove:hover,
.item-c:hover .widget-item-move:hover,
.item-c:hover .widget-item-edit:hover {
  opacity: 1;
  background: rgba(0, 0, 0, 0.9);
}
.preview-widget {
  max-height: 400px;
  height: 100%;
  position: relative;
}
.preview-widget .card-extra {
  display: none !important;
}
.dashboard-setting {
  position: fixed;
  right: 0;
  top: 20px;
  background: #999;
  padding: 10px;
  border-radius: 5px 0 0 5px;
  color: #333;
  cursor: pointer;
  opacity: 0.3;
  line-height: 0;
  transition: all 0.3s ease-in-out;
}
.dashboard-setting-close {
  position: fixed;
  left: 0;
  top: 20px;
  background: #999;
  padding: 10px;
  border-radius: 0 5px 5px 0;
  color: #333;
  cursor: pointer;
  opacity: 0.3;
  line-height: 0;
  transition: all 0.3s ease-in-out;
}
.dashboard-setting-n {
  width: 10px;
  height: 10px;
  background: red;
  border-radius: 50%;
  position: fixed;
  right: 8px;
  top: 23px;
  z-index: 3;
  animation: dashboard-setting-n 1s ease-in-out infinite;
}
@keyframes dashboard-setting-n {
  0% {
    box-shadow: 0 0 0 0 #ff0000;
  }
  50% {
    box-shadow: 0 0 5px 3px #ff0059;
  }
}

.dashboard-setting:hover,
.dashboard-setting-close:hover {
  background: #333;
  color: var(--mainColor6);
  opacity: 1;
}
.preview-list-grid {
  display: flex;
  flex-direction: column;
  background-color: #999;
  width: 300px;
  height: 200px;
  align-items: stretch;
  justify-content: stretch;
  margin: auto;
}
.preview-list-grid > div {
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  width: 100%;
  height: 100%;
}
.preview-list-grid > div > div {
  background: rgba(0, 0, 0, 0.1);
  border: 1px solid #ccc;
  width: 100%;
  height: 100%;
}
.notification-info {
  border-radius: 5px;
  background: #dae9ff;
  color: #2375ef;
  padding: 10px;
  margin: 5px;
  text-align: justify;
}
.notification-alert {
  border-radius: 5px;
  background: #ffdae4;
  color: #ef2364;
  padding: 10px;
  margin: 5px;
  text-align: justify;
}
.notification-alert b {
  margin: 0 0 0 2px;
}
#download-img {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.widget-item {
  position: fixed;
  background: var(--mainColor6);
  border: 1px solid #ccc;
}
.widget-item-c,
.item_widget {
  overflow: hidden;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  width: 100%;
  height: 100%;
  flex-direction: column;
  container-type: inline-size;
}
.item_widget .content-wrapper-link,
.item_widget .reaction-component,
.item_widget .images-slide {
  display: none;
}
.widget-item-c > h3 {
  margin: 0;
  text-align: center;
  padding: 2px;
  background: var(--mainColor5);
  color: var(--mainColor6);
  font-size: 12px;
}
.widget-item-c > .card,
.item_widget > .card {
  min-height: 50% !important;
  /*height: calc(100% - 30px) !important;*/
  height: 100% !important;
  margin: 2px !important;
  padding: 2px !important;
  box-shadow: none !important;
}
.item_widget .card-header,
.item_widget .checkbox-wrapper,
.item_widget .statistics-more {
  display: none;
}
.widget-item-c .word-cloud-list {
  display: block;
}
.chart-subject {
  height: 100% !important;
  position: relative;
  overflow: hidden;
}
.chart-subject ul {
  z-index: 2;
  background: rgba(255, 255, 255, 0.7);
  position: inherit;
}
.item_widget .chart-parent {
  max-width: 100% !important;
}
.item_widget .highcharts-container svg {
  margin: auto !important;
  width: 100%;
  height: 100%;
}
.item_widget .map,
.item_widget .map svg {
  margin: auto !important;
  width: 100% !important;
  height: 100% !important;
}
/*.item_widget .highcharts-container * {*/
/*  font-size: 0.9em !important;*/
/*}*/
.item_widget .card-content {
  padding: 2px 4px !important;
}
.item_widget
  .card-content
  *:not(.info-platform):not(.info-platform *):not(.word-cloud-item *) {
  font-size: 1em !important;
}
.item_widget .card-content .text-wrapper {
  height: auto !important;
  max-height: 10rem !important;
}
.item_widget .content-wrapper-link,
.item_widget .link-icon {
  width: fit-content !important;
  margin: 0 !important;
}

.item_widget .chart-donat-data {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: stretch;
  height: 100%;
}
.item_widget .chart-donat-data > div {
  height: 100% !important;
}
.monitoring-data-live {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: 5px;
  background: red;
  border-radius: 10px;
  animation: data-live 1s linear infinite;
}
@keyframes data-live {
  0% {
    filter: grayscale(0) blur(0px);
    box-shadow: 0 0 5px 5px #f00;
  }
  50% {
    /*background: #600;*/
    filter: grayscale(0.5) blur(0px);
    box-shadow: 0 0 1px 1px #f00;
  }
  100% {
    filter: grayscale(0) blur(0px);
    box-shadow: 0 0 5px 5px #f00;
  }
}
.lifeweb-company {
  background: var(--mainColor6);
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 8px;
  padding: 5px;
  height: 50px;
  border-radius: 8px 8px 0 0;
  box-shadow: inset 0 0 30px rgba(10, 0, 10, 0.3), 0 -5px 5px rgba(0, 0, 0, 0.8);
  animation: lifeweb-company-a 5s linear infinite;
  position: absolute;
  bottom: -10px;
  left: 0;
  right: 0;
  z-index: 1;
}
@keyframes lifeweb-company-a {
  0% {
    filter: hue-rotate(0deg);
    /*box-shadow: inset 0 0 50px rgba(10, 0, 10, 0.2);*/
  }
  25% {
    filter: hue-rotate(90deg);
    /*box-shadow: inset 5px 5px 30px rgba(10, 0, 10, 0.2);*/
  }
  50% {
    filter: hue-rotate(180deg);
    /*box-shadow: inset -5px -5px 30px rgba(10, 0, 10, 0.2);*/
  }
  75% {
    filter: hue-rotate(270deg);
    /*box-shadow: inset 5px 5px 30px rgba(10, 0, 10, 0.2);*/
  }
  100% {
    filter: hue-rotate(360deg);
    /*box-shadow: inset 0 0 50px rgba(10, 0, 10, 0.2);*/
  }
}
.add-item-c.hover img {
  display: none;
}

.item_widget .post-emotions {
  text-align: center;
  height: 100%;
}
.item_widget .post-emotions h4 + div {
  display: flex;
}
.item_widget .post-emotions div,
.item_widget .post-emotions span {
  max-width: 100% !important;
  width: 100% !important;
}
.item_widget > .card,
.item_widget > .card > .card-content {
  height: 100% !important;
  max-height: 100% !important;
  width: 100% !important;
}
.item_widget {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
}
.item_widget .info-platform {
  padding: 0.2em !important;
  margin: 0.2em !important;
}
.item_widget .info-platform h2 {
  font-size: 1em !important;
  padding: 0.5em 1em !important;
  margin-bottom: 0.4em !important;
}
.item_widget .info-platform h2 + div {
  font-size: 0.9em !important;
  inset: unset !important;
  left: 7em !important;
  right: 0.5em !important;
  line-height: 2em !important;
}
.item_widget .info-platform .brandmi-icon-size-xxxxxl {
  font-size: 4em !important;
}
.item_widget .info-platform > .card {
  min-width: 20em !important;
  min-height: 9em !important;
  margin: 0.2em !important;
}
.item_widget .info-platform .card-content div {
  margin: 0.1em !important;
}

.item_widget .statistics-content-wrapper {
  margin: 0.5em;
  height: 4em;
  padding: 0.5em;
}
.item_widget .statistics-content-wrapper-data {
  margin: 0.2em;
  padding: 0.2em;
}

.item_widget .statistics-content-details {
  height: 3em;
  margin: 0.2em;
  padding: 0.2em 0.8em;
  display: flex;
  width: 90%;
}

.item_widget .statistics-content-wrapper span,
.item_widget .statistics-content-details span {
  white-space: pre;
}
.item_widget .statistics-content-wrapper div {
  width: 100%;
}
.item_widget .statistics-content-wrapper div span,
.item_widget .statistics-content-details span:first-of-type {
  overflow: hidden;
  text-overflow: ellipsis;
  width: 60%;
}
.item_widget .post-item *:not(.info-platform):not(.info-platform *) {
  font-size: 1.01em !important;
}
.item_widget
  .post-item
  .card-content
  .text-content
  *:not(.info-platform):not(.info-platform *) {
  font-size: 0.9em !important;
}
.item_widget
  .post-item
  .card-footer
  *:not(.info-platform):not(.info-platform *) {
  font-size: 0.991em !important;
}
.item_widget .post-item .card-content .text-content mark {
  display: inline-block;
}

.image_ppt_fixed {
  position: fixed;
  z-index: -1;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
}

.image_ppt_fixed .card-content .text-wrapper {
  height: fit-content !important;
  max-height: fit-content !important;
}

.image_ppt_fixed .content-wrapper-link {
  height: 40px !important;
}
.image_ppt_fixed .card {
  animation: none !important;
}

.alertWords,
.alertWords h3 {
  animation: 1s alertWords 1s linear infinite;
}

@keyframes alertWords {
  0% {
    background-color: #ff0000;
    color: var(--mainColor6);
    box-shadow: none;
  }
  60% {
    color: #660000;
    background-color: #fdb9b9;
    box-shadow: 0 0 10px 10px rgba(250, 0, 0, 0.8);
  }
  100% {
    background-color: #ff0000;
    color: var(--mainColor6);
    box-shadow: none;
  }
}

@media screen and (max-width: 700px) {
  .p_item {
    display: none;
  }
  .widget-item {
    position: unset;
    width: 95% !important;
    height: 100vw !important;
    max-height: 90vh !important;
    margin: 1rem auto !important;
    border-radius: 1rem !important;
    overflow: hidden !important;
  }
  .widget-item-c .card-content {
    user-select: none !important;
  }
  .widget-item-c .card-content > .col-24,
  .widget-item-c .card-content > .col-24 > .d-flex {
    overflow: hidden !important;
    max-height: 100vh !important;
  }
  .widget-item-c .text-wrapper {
    height: 100% !important;
  }
  .monitoring-nav-items .brandmi-icon,
  .monitoring-nav-items > div:last-of-type,
  .monitoring-nav-footer > div:first-of-type,
  .monitoring-board > div:last-of-type {
    display: none !important;
  }

  .widget-item-c .map > div:last-of-type {
    width: 80% !important;
  }
}

.loadings {
  display: flex;
  align-items: center;
  justify-content: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute;
  z-index: 1000;
  background-color: rgba(250, 250, 250, 0.5);
  user-select: none;
}
.lds-roller {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  box-shadow: 0 0 3px rgb(117 198 209);
  background: #f3f3f3;
}
.lds-roller div {
  animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 40px 40px;
}
.lds-roller div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mainColor2);
  margin: -4px 0 0 -4px;
}
.lds-roller div:nth-child(1) {
  animation-delay: -0.036s;
  opacity: 0.1;
}
.lds-roller div:nth-child(1):after {
  top: 63px;
  left: 63px;
}
.lds-roller div:nth-child(2) {
  animation-delay: -0.072s;
  opacity: 0.2;
}
.lds-roller div:nth-child(2):after {
  top: 68px;
  left: 56px;
}
.lds-roller div:nth-child(3) {
  animation-delay: -0.108s;
  opacity: 0.4;
}
.lds-roller div:nth-child(3):after {
  top: 71px;
  left: 48px;
}
.lds-roller div:nth-child(4) {
  animation-delay: -0.144s;
  opacity: 0.6;
}
.lds-roller div:nth-child(4):after {
  top: 72px;
  left: 40px;
}
.lds-roller div:nth-child(5) {
  animation-delay: -0.18s;
  opacity: 0.8;
}
.lds-roller div:nth-child(5):after {
  top: 71px;
  left: 32px;
}
.lds-roller div:nth-child(6) {
  animation-delay: -0.216s;
  opacity: 0.9;
}
.lds-roller div:nth-child(6):after {
  top: 68px;
  left: 24px;
}
.lds-roller div:nth-child(7) {
  animation-delay: -0.252s;
  opacity: 1;
}
.lds-roller div:nth-child(7):after {
  top: 63px;
  left: 17px;
}
.lds-roller div:nth-child(8) {
  animation-delay: -0.288s;
  opacity: 1;
}
.lds-roller div:nth-child(8):after {
  top: 56px;
  left: 12px;
}
@keyframes lds-roller {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.loading-background {
  width: 100%;
  height: 100%;
  background-color: rgba(211, 211, 211, 0.185);
  position: relative;
  filter: grayscale(1) blur(5px);
}
.loading-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 10001;
  flex-flow: column;
  color: var(--mainColor5);
}
.loading-wrapper > div:first-of-type {
  /*background-color: red;*/
  border-radius: 50%;
  /*filter: opacity(0.5) drop-shadow(-0.1rem 0.2rem 0.1rem rgba(0, 0, 0, 0.5));*/
}
.loading-wrapper > div:first-of-type {
  animation: loading-animation-color 1.5s linear infinite;
  transform-origin: 50% 50%;
  /*stroke: #fff;*/
  /*stroke-width: 4%;*/
}
@keyframes loading-animation-color {
  0% {
    transform: rotate(0deg);
    /*filter: invert(0.5);*/
  }
  50% {
    transform: rotate(180deg);
    /*filter: invert(0.9);*/
  }
  100% {
    transform: rotate(360deg);
    /*filter: invert(0.5);*/
  }
}

.loading-text {
  margin: 10px;
  padding: 2px 10px;
  border-radius: 5px;
  background: var(--mainColor7);
  color: var(--mainColor5);
}

.box-slider-datetime {
  font-family: "BTitr", "B-Nazanin", Verdana, Geneva, Tahoma, sans-serif;
  position: fixed;
  min-width: 20vh;
  background-color: rgba(0, 0, 0, 0.75);
  border-radius: 20px;
  justify-content: center;
  text-align: center;
  flex-direction: row;
  padding: 50px;
  z-index: 100;
  top: 3vh;
  left: 1vw;
  font-weight: bold;
  /* font-family: tahoma, "Courier New", Courier, monospace; */
}

.box-slider-datetime-date {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  font-size: 2.3rem;
  text-shadow: 0 1px 5px rgb(0, 0,0);
  /* text-shadow: 0 9px 5px rgb(90, 84, 84); */
  color: #dbe4e6;
  margin: 2vh auto;
}
.box-slider-datetime-time {
  border-radius: 80px;
  justify-content: center;
  display: flex;
  text-align: center;
  padding: 10px;
  z-index: 100;
  color: #e1e9eb;
  font-size: 4.5rem;
  font-weight: bold;
  /* text-shadow: 0 9px 5px rgb(68, 105, 105); */
  text-shadow: 0 1px 5px rgb(0, 0,0);
}

.messagebox-fullpage {
  position: fixed;
  background-color: rgba(0, 0, 0, 0.7);
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: fit-content;
  z-index: 1000;
  top: 50%;
  left: 50%;
  padding: 20px;
  border-radius: 10px;
  transform: translate(-50%, -50%);
}
.text-message-in-box {
  font-family: "B-Nazanin", Verdana, Geneva, Tahoma, sans-serif;
  color: #fff;
}

@font-face {
  font-family: 'BTitr';
  src: url(/07c6a3b47e20539a5c5b.eot?) format('eot'),  /* IE6–8 */
       url(/6da9759946c3a45bba5a.woff) format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url(/3209a92b71e5a09732c6.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
.body-fullPage {
  position: fixed;
  direction: ltr;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: 0;
  /* background-image: url("./bg.png"); */
  background-color: rgb(165, 207, 247);
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  
}
.body-fullPage *{
  font-family: "BTitr", "B-Nazanin", Verdana, Geneva, Tahoma, sans-serif;
}
.logodesign-fullpage {
  width: 8vw;
  z-index: 1;
  right: 1vw;
  top: 3vh;
  position: fixed;
  padding: 30px;
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.7);
}

.footer-fullpage {
  position: absolute;
  bottom: 0;
  /* background: linear-gradient(0deg, #999, #fff, #ccc); */
  /* background: linear-gradient(0deg, rgb(0, 0, 0, 0.658), rgb(12, 11, 11), rgb(0, 0, 0, 0.658)); */

  background: rgba(0, 0, 0); 
  
  left: 0;
  right: 0;
  /* border-top: 3px solid #f1f1f1; */
  height: 6.5vh;
  /* box-shadow: 0 -5px 15px #000; */
}
.footer-content-fullpage {
  overflow: hidden;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  
}
.textanime-fullpage {
  display: block;
  margin-right: 30px;
  /* color: black; */

  color: #dbe4e6;

  font-size: 2rem;
  right: 0;
  left: 9999px;
  position: absolute;
  white-space: nowrap;
  overflow: hidden;
  left: 0;
  width: 100%;
}
.imgdesign-fullpage {
  height: 100vh;
  width: 100%;
}

.imgnews-fullpage {
  position: relative;
}
.imageSlid-fullpage {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}
.imageSliderFile-fullpage {
  position: relative;
  width: 90vw;
  height: 85vh;
  margin: auto;
  border-radius: 21px;
  transition: 1s;
}
.myVideo-fullpage {
  position: absolute;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  /* z-index: "-1"; */
}

.textMove-fullpage {
  display: block;
  margin-left: 30px;
  margin-right: 30px;
  position: fixed;
  z-index: 2;
  text-overflow: ellipsis;
  /* animation-direction: alternate-reverse; */
  animation-name: anime-footer-fullpage;
  animation-iteration-count: infinite;
  animation-fill-mode: backwards;
  left: 0;
  right: 100%;
  overflow:hidden ;
  direction: rtl;
  bottom: 10px;
  line-height: 4vh;
}

@keyframes anime-footer-fullpage {
  /* from {right: 0%;}
  to {left: 100%; } */
  0% {
    right: 100%;
  }
  /* 25% {
    right: 90%;
  }
  50% {
    right: 90%;
  }
  75% {
    right: 0;
  } */
  100% {
    right: 0;
  }
}

@font-face {
  font-family: 'B-Nazanin';
  src: url(/d7478a9ecad2d8496d98.ttf) format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
/*!
* @package IcoFont
* @version 1.0.1
* @author IcoFont https://icofont.com
* @copyright Copyright (c) 2015 - 2021 IcoFont
* @license - https://icofont.com/license/
*/
@font-face {
  font-family: IcoFont;
  font-weight: 400;
  font-style: Regular;
  src: url(/5a3739abbada4bead250.woff2) format("woff2"), url(/60d9a073750c5bc09174.woff) format("woff");
}
[class*=" icofont-"],
[class^="icofont-"] {
  font-family: IcoFont !important;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  line-height: 1;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}
.icofont-search-1:before {
  content: "\ed11";
}
.icofont-search-2:before {
  content: "\ed12";
}
.icofont-search-document:before {
  content: "\ed13";
}
.icofont-search-folder:before {
  content: "\ed14";
}
.icofont-search-job:before {
  content: "\ed15";
}
.icofont-search-map:before {
  content: "\ed16";
}
.icofont-search-property:before {
  content: "\ed17";
}
.icofont-search-restaurant:before {
  content: "\ed18";
}
.icofont-search-stock:before {
  content: "\ed19";
}
.icofont-search-user:before {
  content: "\ed1a";
}
.icofont-search:before {
  content: "\ed1b";
}
.icofont-chart-arrows-axis:before {
  content: "\e978";
}
.icofont-chart-bar-graph:before {
  content: "\e979";
}
.icofont-chart-flow-1:before {
  content: "\e97a";
}
.icofont-chart-flow-2:before {
  content: "\e97b";
}
.icofont-chart-flow:before {
  content: "\e97c";
}
.icofont-chart-growth:before {
  content: "\e97d";
}
.icofont-chart-histogram-alt:before {
  content: "\e97e";
}
.icofont-chart-histogram:before {
  content: "\e97f";
}
.icofont-chart-line-alt:before {
  content: "\e980";
}
.icofont-chart-line:before {
  content: "\e981";
}
.icofont-chart-pie-alt:before {
  content: "\e982";
}
.icofont-chart-pie:before {
  content: "\e983";
}
.icofont-chart-radar-graph:before {
  content: "\e984";
}
.icofont-angry:before {
  content: "\eaf4";
}
.icofont-astonished:before {
  content: "\eaf5";
}
.icofont-confounded:before {
  content: "\eaf6";
}
.icofont-confused:before {
  content: "\eaf7";
}
.icofont-crying:before {
  content: "\eaf8";
}
.icofont-dizzy:before {
  content: "\eaf9";
}
.icofont-expressionless:before {
  content: "\eafa";
}
.icofont-heart-eyes:before {
  content: "\eafb";
}
.icofont-laughing:before {
  content: "\eafc";
}
.icofont-nerd-smile:before {
  content: "\eafd";
}
.icofont-open-mouth:before {
  content: "\eafe";
}
.icofont-rage:before {
  content: "\eaff";
}
.icofont-rolling-eyes:before {
  content: "\eb00";
}
.icofont-sad:before {
  content: "\eb01";
}
.icofont-simple-smile:before {
  content: "\eb02";
}
.icofont-slightly-smile:before {
  content: "\eb03";
}
.icofont-smirk:before {
  content: "\eb04";
}
.icofont-stuck-out-tongue:before {
  content: "\eb05";
}
.icofont-wink-smile:before {
  content: "\eb06";
}
.icofont-worried:before {
  content: "\eb07";
}
.icofont-bank-alt:before {
  content: "\e961";
}
.icofont-bank:before {
  content: "\e962";
}
.icofont-barcode:before {
  content: "\e963";
}
.icofont-bill-alt:before {
  content: "\e964";
}
.icofont-billboard:before {
  content: "\e965";
}
.icofont-briefcase-1:before {
  content: "\e966";
}
.icofont-briefcase-2:before {
  content: "\e967";
}
.icofont-businessman:before {
  content: "\e968";
}
.icofont-businesswoman:before {
  content: "\e969";
}
.icofont-chair:before {
  content: "\e96a";
}
.icofont-coins:before {
  content: "\e96b";
}
.icofont-company:before {
  content: "\e96c";
}
.icofont-contact-add:before {
  content: "\e96d";
}
.icofont-files-stack:before {
  content: "\e96e";
}
.icofont-handshake-deal:before {
  content: "\e96f";
}
.icofont-id-card:before {
  content: "\e970";
}
.icofont-meeting-add:before {
  content: "\e971";
}
.icofont-money-bag:before {
  content: "\e972";
}
.icofont-pie-chart:before {
  content: "\e973";
}
.icofont-presentation-alt:before {
  content: "\e974";
}
.icofont-presentation:before {
  content: "\e975";
}
.icofont-stamp:before {
  content: "\e976";
}
.icofont-stock-mobile:before {
  content: "\e977";
}
.icofont-boy:before {
  content: "\eceb";
}
.icofont-business-man-alt-1:before {
  content: "\ecec";
}
.icofont-business-man-alt-2:before {
  content: "\eced";
}
.icofont-business-man-alt-3:before {
  content: "\ecee";
}
.icofont-business-man:before {
  content: "\ecef";
}
.icofont-female:before {
  content: "\ecf0";
}
.icofont-funky-man:before {
  content: "\ecf1";
}
.icofont-girl-alt:before {
  content: "\ecf2";
}
.icofont-girl:before {
  content: "\ecf3";
}
.icofont-group:before {
  content: "\ecf4";
}
.icofont-hotel-boy-alt:before {
  content: "\ecf5";
}
.icofont-hotel-boy:before {
  content: "\ecf6";
}
.icofont-kid:before {
  content: "\ecf7";
}
.icofont-man-in-glasses:before {
  content: "\ecf8";
}
.icofont-people:before {
  content: "\ecf9";
}
.icofont-support:before {
  content: "\ecfa";
}
.icofont-user-alt-1:before {
  content: "\ecfb";
}
.icofont-user-alt-2:before {
  content: "\ecfc";
}
.icofont-user-alt-3:before {
  content: "\ecfd";
}
.icofont-user-alt-4:before {
  content: "\ecfe";
}
.icofont-user-alt-5:before {
  content: "\ecff";
}
.icofont-user-alt-6:before {
  content: "\ed00";
}
.icofont-user-alt-7:before {
  content: "\ed01";
}
.icofont-user-female:before {
  content: "\ed02";
}
.icofont-user-male:before {
  content: "\ed03";
}
.icofont-user-suited:before {
  content: "\ed04";
}
.icofont-user:before {
  content: "\ed05";
}
.icofont-users-alt-1:before {
  content: "\ed06";
}
.icofont-users-alt-2:before {
  content: "\ed07";
}
.icofont-users-alt-3:before {
  content: "\ed08";
}
.icofont-users-alt-4:before {
  content: "\ed09";
}
.icofont-users-alt-5:before {
  content: "\ed0a";
}
.icofont-users-alt-6:before {
  content: "\ed0b";
}
.icofont-users-social:before {
  content: "\ed0c";
}
.icofont-users:before {
  content: "\ed0d";
}
.icofont-waiter-alt:before {
  content: "\ed0e";
}
.icofont-waiter:before {
  content: "\ed0f";
}
.icofont-woman-in-glasses:before {
  content: "\ed10";
}
.icofont-paper:before {
  content: "\eae5";
}
.icofont-atom:before {
  content: "\eacd";
}
.icofont-bell-alt:before {
  content: "\eacf";
}
.icofont-black-board:before {
  content: "\ead0";
}
.icofont-book-alt:before {
  content: "\ead1";
}
.icofont-book:before {
  content: "\ead2";
}
.icofont-electron:before {
  content: "\ead8";
}
.icofont-file-alt:before {
  content: "\eb08";
}
.icofont-file-audio:before {
  content: "\eb09";
}
.icofont-file-avi-mp4:before {
  content: "\eb0a";
}
.icofont-file-bmp:before {
  content: "\eb0b";
}
.icofont-file-code:before {
  content: "\eb0c";
}
.icofont-file-css:before {
  content: "\eb0d";
}
.icofont-file-document:before {
  content: "\eb0e";
}
.icofont-file-eps:before {
  content: "\eb0f";
}
.icofont-file-excel:before {
  content: "\eb10";
}
.icofont-file-exe:before {
  content: "\eb11";
}
.icofont-file-file:before {
  content: "\eb12";
}
.icofont-file-flv:before {
  content: "\eb13";
}
.icofont-file-gif:before {
  content: "\eb14";
}
.icofont-file-html5:before {
  content: "\eb15";
}
.icofont-file-image:before {
  content: "\eb16";
}
.icofont-file-iso:before {
  content: "\eb17";
}
.icofont-file-java:before {
  content: "\eb18";
}
.icofont-file-javascript:before {
  content: "\eb19";
}
.icofont-file-jpg:before {
  content: "\eb1a";
}
.icofont-file-midi:before {
  content: "\eb1b";
}
.icofont-file-mov:before {
  content: "\eb1c";
}
.icofont-file-mp3:before {
  content: "\eb1d";
}
.icofont-file-pdf:before {
  content: "\eb1e";
}
.icofont-file-php:before {
  content: "\eb1f";
}
.icofont-file-png:before {
  content: "\eb20";
}
.icofont-file-powerpoint:before {
  content: "\eb21";
}
.icofont-file-presentation:before {
  content: "\eb22";
}
.icofont-file-psb:before {
  content: "\eb23";
}
.icofont-file-psd:before {
  content: "\eb24";
}
.icofont-file-python:before {
  content: "\eb25";
}
.icofont-file-ruby:before {
  content: "\eb26";
}
.icofont-file-spreadsheet:before {
  content: "\eb27";
}
.icofont-file-sql:before {
  content: "\eb28";
}
.icofont-file-svg:before {
  content: "\eb29";
}
.icofont-file-text:before {
  content: "\eb2a";
}
.icofont-file-tiff:before {
  content: "\eb2b";
}
.icofont-file-video:before {
  content: "\eb2c";
}
.icofont-file-wave:before {
  content: "\eb2d";
}
.icofont-file-wmv:before {
  content: "\eb2e";
}
.icofont-file-word:before {
  content: "\eb2f";
}
.icofont-file-zip:before {
  content: "\eb30";
}
.icofont-align-center:before {
  content: "\eddf";
}
.icofont-align-left:before {
  content: "\ede0";
}
.icofont-align-right:before {
  content: "\ede1";
}
.icofont-all-caps:before {
  content: "\ede2";
}
.icofont-bold:before {
  content: "\ede3";
}
.icofont-brush:before {
  content: "\ede4";
}
.icofont-clip-board:before {
  content: "\ede5";
}
.icofont-code-alt:before {
  content: "\ede6";
}
.icofont-color-bucket:before {
  content: "\ede7";
}
.icofont-color-picker:before {
  content: "\ede8";
}
.icofont-copy-invert:before {
  content: "\ede9";
}
.icofont-copy:before {
  content: "\edea";
}
.icofont-cut:before {
  content: "\edeb";
}
.icofont-delete-alt:before {
  content: "\edec";
}
.icofont-edit-alt:before {
  content: "\eded";
}
.icofont-eraser-alt:before {
  content: "\edee";
}
.icofont-font:before {
  content: "\edef";
}
.icofont-heading:before {
  content: "\edf0";
}
.icofont-indent:before {
  content: "\edf1";
}
.icofont-italic-alt:before {
  content: "\edf2";
}
.icofont-italic:before {
  content: "\edf3";
}
.icofont-justify-all:before {
  content: "\edf4";
}
.icofont-justify-center:before {
  content: "\edf5";
}
.icofont-justify-left:before {
  content: "\edf6";
}
.icofont-justify-right:before {
  content: "\edf7";
}
.icofont-link-broken:before {
  content: "\edf8";
}
.icofont-outdent:before {
  content: "\edf9";
}
.icofont-paper-clip:before {
  content: "\edfa";
}
.icofont-paragraph:before {
  content: "\edfb";
}
.icofont-pin:before {
  content: "\edfc";
}
.icofont-printer:before {
  content: "\edfd";
}
.icofont-redo:before {
  content: "\edfe";
}
.icofont-rotation:before {
  content: "\edff";
}
.icofont-save:before {
  content: "\ee00";
}
.icofont-small-cap:before {
  content: "\ee01";
}
.icofont-strike-through:before {
  content: "\ee02";
}
.icofont-sub-listing:before {
  content: "\ee03";
}
.icofont-subscript:before {
  content: "\ee04";
}
.icofont-superscript:before {
  content: "\ee05";
}
.icofont-table:before {
  content: "\ee06";
}
.icofont-text-height:before {
  content: "\ee07";
}
.icofont-text-width:before {
  content: "\ee08";
}
.icofont-trash:before {
  content: "\ee09";
}
.icofont-underline:before {
  content: "\ee0a";
}
.icofont-undo:before {
  content: "\ee0b";
}
.icofont-mathematical-alt-1:before {
  content: "\ebec";
}
.icofont-calculator-alt-1:before {
  content: "\ebdd";
}
.icofont-calculator-alt-2:before {
  content: "\ebde";
}
.icofont-abacus-alt:before {
  content: "\ebd7";
}
.icofont-android-nexus:before {
  content: "\ea29";
}
.icofont-android-tablet:before {
  content: "\ea2a";
}
.icofont-apple-watch:before {
  content: "\ea2b";
}
.icofont-drawing-tablet:before {
  content: "\ea2c";
}
.icofont-earphone:before {
  content: "\ea2d";
}
.icofont-flash-drive:before {
  content: "\ea2e";
}
.icofont-game-console:before {
  content: "\ea2f";
}
.icofont-game-controller:before {
  content: "\ea30";
}
.icofont-game-pad:before {
  content: "\ea31";
}
.icofont-game:before {
  content: "\ea32";
}
.icofont-headphone-alt-1:before {
  content: "\ea33";
}
.icofont-headphone-alt-2:before {
  content: "\ea34";
}
.icofont-headphone-alt-3:before {
  content: "\ea35";
}
.icofont-headphone-alt:before {
  content: "\ea36";
}
.icofont-headphone:before {
  content: "\ea37";
}
.icofont-htc-one:before {
  content: "\ea38";
}
.icofont-imac:before {
  content: "\ea39";
}
.icofont-ipad:before {
  content: "\ea3a";
}
.icofont-iphone:before {
  content: "\ea3b";
}
.icofont-ipod-nano:before {
  content: "\ea3c";
}
.icofont-ipod-touch:before {
  content: "\ea3d";
}
.icofont-keyboard-alt:before {
  content: "\ea3e";
}
.icofont-keyboard-wireless:before {
  content: "\ea3f";
}
.icofont-keyboard:before {
  content: "\ea40";
}
.icofont-laptop-alt:before {
  content: "\ea41";
}
.icofont-laptop:before {
  content: "\ea42";
}
.icofont-macbook:before {
  content: "\ea43";
}
.icofont-magic-mouse:before {
  content: "\ea44";
}
.icofont-micro-chip:before {
  content: "\ea45";
}
.icofont-microphone-alt:before {
  content: "\ea46";
}
.icofont-microphone:before {
  content: "\ea47";
}
.icofont-monitor:before {
  content: "\ea48";
}
.icofont-mouse:before {
  content: "\ea49";
}
.icofont-mp3-player:before {
  content: "\ea4a";
}
.icofont-nintendo:before {
  content: "\ea4b";
}
.icofont-playstation-alt:before {
  content: "\ea4c";
}
.icofont-psvita:before {
  content: "\ea4d";
}
.icofont-radio-mic:before {
  content: "\ea4e";
}
.icofont-radio:before {
  content: "\ea4f";
}
.icofont-refrigerator:before {
  content: "\ea50";
}
.icofont-samsung-galaxy:before {
  content: "\ea51";
}
.icofont-surface-tablet:before {
  content: "\ea52";
}
.icofont-ui-head-phone:before {
  content: "\ea53";
}
.icofont-ui-keyboard:before {
  content: "\ea54";
}
.icofont-washing-machine:before {
  content: "\ea55";
}
.icofont-wifi-router:before {
  content: "\ea56";
}
.icofont-wii-u:before {
  content: "\ea57";
}
.icofont-windows-lumia:before {
  content: "\ea58";
}
.icofont-wireless-mouse:before {
  content: "\ea59";
}
.icofont-xbox-360:before {
  content: "\ea5a";
}
.icofont-prescription:before {
  content: "\ec30";
}
.icofont-pulse:before {
  content: "\ec31";
}
.icofont-medical-sign:before {
  content: "\ec27";
}
.icofont-heart-beat-alt:before {
  content: "\ec1e";
}
.icofont-heart-beat:before {
  content: "\ec1f";
}
.icofont-breakdown:before {
  content: "\ee4f";
}
.icofont-celsius:before {
  content: "\ee50";
}
.icofont-clouds:before {
  content: "\ee51";
}
.icofont-cloudy:before {
  content: "\ee52";
}
.icofont-dust:before {
  content: "\ee53";
}
.icofont-eclipse:before {
  content: "\ee54";
}
.icofont-fahrenheit:before {
  content: "\ee55";
}
.icofont-forest-fire:before {
  content: "\ee56";
}
.icofont-full-night:before {
  content: "\ee57";
}
.icofont-full-sunny:before {
  content: "\ee58";
}
.icofont-hail-night:before {
  content: "\ee59";
}
.icofont-hail-rainy-night:before {
  content: "\ee5a";
}
.icofont-hail-rainy-sunny:before {
  content: "\ee5b";
}
.icofont-hail-rainy:before {
  content: "\ee5c";
}
.icofont-hail-sunny:before {
  content: "\ee5d";
}
.icofont-hail-thunder-night:before {
  content: "\ee5e";
}
.icofont-hail-thunder-sunny:before {
  content: "\ee5f";
}
.icofont-hail-thunder:before {
  content: "\ee60";
}
.icofont-hail:before {
  content: "\ee61";
}
.icofont-hill-night:before {
  content: "\ee62";
}
.icofont-hill-sunny:before {
  content: "\ee63";
}
.icofont-hurricane:before {
  content: "\ee64";
}
.icofont-meteor:before {
  content: "\ee65";
}
.icofont-night:before {
  content: "\ee66";
}
.icofont-rainy-night:before {
  content: "\ee67";
}
.icofont-rainy-sunny:before {
  content: "\ee68";
}
.icofont-rainy-thunder:before {
  content: "\ee69";
}
.icofont-rainy:before {
  content: "\ee6a";
}
.icofont-snow-alt:before {
  content: "\ee6b";
}
.icofont-snow-flake:before {
  content: "\ee6c";
}
.icofont-snow-temp:before {
  content: "\ee6d";
}
.icofont-snow:before {
  content: "\ee6e";
}
.icofont-snowy-hail:before {
  content: "\ee6f";
}
.icofont-snowy-night-hail:before {
  content: "\ee70";
}
.icofont-snowy-night-rainy:before {
  content: "\ee71";
}
.icofont-snowy-night:before {
  content: "\ee72";
}
.icofont-snowy-rainy:before {
  content: "\ee73";
}
.icofont-snowy-sunny-hail:before {
  content: "\ee74";
}
.icofont-snowy-sunny-rainy:before {
  content: "\ee75";
}
.icofont-snowy-sunny:before {
  content: "\ee76";
}
.icofont-snowy-thunder-night:before {
  content: "\ee77";
}
.icofont-snowy-thunder-sunny:before {
  content: "\ee78";
}
.icofont-snowy-thunder:before {
  content: "\ee79";
}
.icofont-snowy-windy-night:before {
  content: "\ee7a";
}
.icofont-snowy-windy-sunny:before {
  content: "\ee7b";
}
.icofont-snowy-windy:before {
  content: "\ee7c";
}
.icofont-snowy:before {
  content: "\ee7d";
}
.icofont-sun-alt:before {
  content: "\ee7e";
}
.icofont-sun-rise:before {
  content: "\ee7f";
}
.icofont-sun-set:before {
  content: "\ee80";
}
.icofont-sun:before {
  content: "\ee81";
}
.icofont-sunny-day-temp:before {
  content: "\ee82";
}
.icofont-sunny:before {
  content: "\ee83";
}
.icofont-thunder-light:before {
  content: "\ee84";
}
.icofont-tornado:before {
  content: "\ee85";
}
.icofont-umbrella-alt:before {
  content: "\ee86";
}
.icofont-umbrella:before {
  content: "\ee87";
}
.icofont-volcano:before {
  content: "\ee88";
}
.icofont-wave:before {
  content: "\ee89";
}
.icofont-wind-scale-0:before {
  content: "\ee8a";
}
.icofont-wind-scale-1:before {
  content: "\ee8b";
}
.icofont-wind-scale-10:before {
  content: "\ee8c";
}
.icofont-wind-scale-11:before {
  content: "\ee8d";
}
.icofont-wind-scale-12:before {
  content: "\ee8e";
}
.icofont-wind-scale-2:before {
  content: "\ee8f";
}
.icofont-wind-scale-3:before {
  content: "\ee90";
}
.icofont-wind-scale-4:before {
  content: "\ee91";
}
.icofont-wind-scale-5:before {
  content: "\ee92";
}
.icofont-wind-scale-6:before {
  content: "\ee93";
}
.icofont-wind-scale-7:before {
  content: "\ee94";
}
.icofont-wind-scale-8:before {
  content: "\ee95";
}
.icofont-wind-scale-9:before {
  content: "\ee96";
}
.icofont-wind-waves:before {
  content: "\ee97";
}
.icofont-wind:before {
  content: "\ee98";
}
.icofont-windy-hail:before {
  content: "\ee99";
}
.icofont-windy-night:before {
  content: "\ee9a";
}
.icofont-windy-raining:before {
  content: "\ee9b";
}
.icofont-windy-sunny:before {
  content: "\ee9c";
}
.icofont-windy-thunder-raining:before {
  content: "\ee9d";
}
.icofont-windy-thunder:before {
  content: "\ee9e";
}
.icofont-windy:before {
  content: "\ee9f";
}
.icofont-ui-add:before {
  content: "\ec3e";
}
.icofont-ui-alarm:before {
  content: "\ec3f";
}
.icofont-ui-battery:before {
  content: "\ec40";
}
.icofont-ui-block:before {
  content: "\ec41";
}
.icofont-ui-bluetooth:before {
  content: "\ec42";
}
.icofont-ui-brightness:before {
  content: "\ec43";
}
.icofont-ui-browser:before {
  content: "\ec44";
}
.icofont-ui-calendar:before {
  content: "\ec45";
}
.icofont-ui-call:before {
  content: "\ec46";
}
.icofont-ui-camera:before {
  content: "\ec47";
}
.icofont-ui-cart:before {
  content: "\ec48";
}
.icofont-ui-cell-phone:before {
  content: "\ec49";
}
.icofont-ui-chat:before {
  content: "\ec4a";
}
.icofont-ui-check:before {
  content: "\ec4b";
}
.icofont-ui-clip-board:before {
  content: "\ec4c";
}
.icofont-ui-clip:before {
  content: "\ec4d";
}
.icofont-ui-clock:before {
  content: "\ec4e";
}
.icofont-ui-close:before {
  content: "\ec4f";
}
.icofont-ui-contact-list:before {
  content: "\ec50";
}
.icofont-ui-copy:before {
  content: "\ec51";
}
.icofont-ui-cut:before {
  content: "\ec52";
}
.icofont-ui-delete:before {
  content: "\ec53";
}
.icofont-ui-dial-phone:before {
  content: "\ec54";
}
.icofont-ui-edit:before {
  content: "\ec55";
}
.icofont-ui-email:before {
  content: "\ec56";
}
.icofont-ui-file:before {
  content: "\ec57";
}
.icofont-ui-fire-wall:before {
  content: "\ec58";
}
.icofont-ui-flash-light:before {
  content: "\ec59";
}
.icofont-ui-flight:before {
  content: "\ec5a";
}
.icofont-ui-folder:before {
  content: "\ec5b";
}
.icofont-ui-game:before {
  content: "\ec5c";
}
.icofont-ui-handicapped:before {
  content: "\ec5d";
}
.icofont-ui-home:before {
  content: "\ec5e";
}
.icofont-ui-image:before {
  content: "\ec5f";
}
.icofont-ui-laoding:before {
  content: "\ec60";
}
.icofont-ui-lock:before {
  content: "\ec61";
}
.icofont-ui-love-add:before {
  content: "\ec62";
}
.icofont-ui-love-broken:before {
  content: "\ec63";
}
.icofont-ui-love-remove:before {
  content: "\ec64";
}
.icofont-ui-love:before {
  content: "\ec65";
}
.icofont-ui-map:before {
  content: "\ec66";
}
.icofont-ui-message:before {
  content: "\ec67";
}
.icofont-ui-messaging:before {
  content: "\ec68";
}
.icofont-ui-movie:before {
  content: "\ec69";
}
.icofont-ui-music-player:before {
  content: "\ec6a";
}
.icofont-ui-music:before {
  content: "\ec6b";
}
.icofont-ui-mute:before {
  content: "\ec6c";
}
.icofont-ui-network:before {
  content: "\ec6d";
}
.icofont-ui-next:before {
  content: "\ec6e";
}
.icofont-ui-note:before {
  content: "\ec6f";
}
.icofont-ui-office:before {
  content: "\ec70";
}
.icofont-ui-password:before {
  content: "\ec71";
}
.icofont-ui-pause:before {
  content: "\ec72";
}
.icofont-ui-play-stop:before {
  content: "\ec73";
}
.icofont-ui-play:before {
  content: "\ec74";
}
.icofont-ui-pointer:before {
  content: "\ec75";
}
.icofont-ui-power:before {
  content: "\ec76";
}
.icofont-ui-press:before {
  content: "\ec77";
}
.icofont-ui-previous:before {
  content: "\ec78";
}
.icofont-ui-rate-add:before {
  content: "\ec79";
}
.icofont-ui-rate-blank:before {
  content: "\ec7a";
}
.icofont-ui-rate-remove:before {
  content: "\ec7b";
}
.icofont-ui-rating:before {
  content: "\ec7c";
}
.icofont-ui-record:before {
  content: "\ec7d";
}
.icofont-ui-remove:before {
  content: "\ec7e";
}
.icofont-ui-reply:before {
  content: "\ec7f";
}
.icofont-ui-rotation:before {
  content: "\ec80";
}
.icofont-ui-rss:before {
  content: "\ec81";
}
.icofont-ui-search:before {
  content: "\ec82";
}
.icofont-ui-settings:before {
  content: "\ec83";
}
.icofont-ui-social-link:before {
  content: "\ec84";
}
.icofont-ui-tag:before {
  content: "\ec85";
}
.icofont-ui-text-chat:before {
  content: "\ec86";
}
.icofont-ui-text-loading:before {
  content: "\ec87";
}
.icofont-ui-theme:before {
  content: "\ec88";
}
.icofont-ui-timer:before {
  content: "\ec89";
}
.icofont-ui-touch-phone:before {
  content: "\ec8a";
}
.icofont-ui-travel:before {
  content: "\ec8b";
}
.icofont-ui-unlock:before {
  content: "\ec8c";
}
.icofont-ui-user-group:before {
  content: "\ec8d";
}
.icofont-ui-user:before {
  content: "\ec8e";
}
.icofont-ui-v-card:before {
  content: "\ec8f";
}
.icofont-ui-video-chat:before {
  content: "\ec90";
}
.icofont-ui-video-message:before {
  content: "\ec91";
}
.icofont-ui-video-play:before {
  content: "\ec92";
}
.icofont-ui-video:before {
  content: "\ec93";
}
.icofont-ui-volume:before {
  content: "\ec94";
}
.icofont-ui-weather:before {
  content: "\ec95";
}
.icofont-ui-wifi:before {
  content: "\ec96";
}
.icofont-ui-zoom-in:before {
  content: "\ec97";
}
.icofont-ui-zoom-out:before {
  content: "\ec98";
}
.icofont-cloudapp:before {
  content: "\ed26";
}
.icofont-dropbox:before {
  content: "\ed30";
}
.icofont-facebook-messenger:before {
  content: "\ed36";
}
.icofont-facebook:before {
  content: "\ed37";
}
.icofont-github:before {
  content: "\ed3e";
}
.icofont-google-buzz:before {
  content: "\ed40";
}
.icofont-google-hangouts:before {
  content: "\ed41";
}
.icofont-google-map:before {
  content: "\ed42";
}
.icofont-google-plus:before {
  content: "\ed43";
}
.icofont-google-talk:before {
  content: "\ed44";
}
.icofont-hype-machine:before {
  content: "\ed45";
}
.icofont-instagram:before {
  content: "\ed46";
}
.icofont-kakaotalk:before {
  content: "\ed47";
}
.icofont-kickstarter:before {
  content: "\ed48";
}
.icofont-kik:before {
  content: "\ed49";
}
.icofont-line-messenger:before {
  content: "\ed4b";
}
.icofont-line:before {
  content: "\ed4c";
}
.icofont-linkedin:before {
  content: "\ed4d";
}
.icofont-live-messenger:before {
  content: "\ed4f";
}
.icofont-nimbuss:before {
  content: "\ed56";
}
.icofont-oscommerce:before {
  content: "\ed59";
}
.icofont-photobucket:before {
  content: "\ed5b";
}
.icofont-prestashop:before {
  content: "\ed5e";
}
.icofont-readernaut:before {
  content: "\ed61";
}
.icofont-reddit:before {
  content: "\ed62";
}
.icofont-renren:before {
  content: "\ed63";
}
.icofont-rss:before {
  content: "\ed64";
}
.icofont-shopify:before {
  content: "\ed65";
}
.icofont-skype:before {
  content: "\ed67";
}
.icofont-slack:before {
  content: "\ed68";
}
.icofont-snapchat:before {
  content: "\ed6c";
}
.icofont-soundcloud:before {
  content: "\ed6d";
}
.icofont-spotify:before {
  content: "\ed6e";
}
.icofont-stack-exchange:before {
  content: "\ed6f";
}
.icofont-stack-overflow:before {
  content: "\ed70";
}
.icofont-steam:before {
  content: "\ed71";
}
.icofont-technorati:before {
  content: "\ed74";
}
.icofont-telegram:before {
  content: "\ed75";
}
.icofont-trello:before {
  content: "\ed77";
}
.icofont-tumblr:before {
  content: "\ed78";
}
.icofont-twitch:before {
  content: "\ed79";
}
.icofont-twitter:before {
  content: "\ed7a";
}
.icofont-viber:before {
  content: "\ed7d";
}
.icofont-wechat:before {
  content: "\ed84";
}
.icofont-whatsapp:before {
  content: "\ed86";
}
.icofont-yahoo:before {
  content: "\ed88";
}
.icofont-youtube:before {
  content: "\ed8b";
}
.icofont-arrow-down:before {
  content: "\ea5b";
}
.icofont-arrow-left:before {
  content: "\ea5c";
}
.icofont-arrow-right:before {
  content: "\ea5d";
}
.icofont-arrow-up:before {
  content: "\ea5e";
}
.icofont-block-down:before {
  content: "\ea5f";
}
.icofont-block-left:before {
  content: "\ea60";
}
.icofont-block-right:before {
  content: "\ea61";
}
.icofont-block-up:before {
  content: "\ea62";
}
.icofont-bubble-down:before {
  content: "\ea63";
}
.icofont-bubble-left:before {
  content: "\ea64";
}
.icofont-bubble-right:before {
  content: "\ea65";
}
.icofont-bubble-up:before {
  content: "\ea66";
}
.icofont-caret-down:before {
  content: "\ea67";
}
.icofont-caret-left:before {
  content: "\ea68";
}
.icofont-caret-right:before {
  content: "\ea69";
}
.icofont-caret-up:before {
  content: "\ea6a";
}
.icofont-circled-down:before {
  content: "\ea6b";
}
.icofont-circled-left:before {
  content: "\ea6c";
}
.icofont-circled-right:before {
  content: "\ea6d";
}
.icofont-circled-up:before {
  content: "\ea6e";
}
.icofont-collapse:before {
  content: "\ea6f";
}
.icofont-cursor-drag:before {
  content: "\ea70";
}
.icofont-curved-double-left:before {
  content: "\ea71";
}
.icofont-curved-double-right:before {
  content: "\ea72";
}
.icofont-curved-down:before {
  content: "\ea73";
}
.icofont-curved-left:before {
  content: "\ea74";
}
.icofont-curved-right:before {
  content: "\ea75";
}
.icofont-curved-up:before {
  content: "\ea76";
}
.icofont-dotted-down:before {
  content: "\ea77";
}
.icofont-dotted-left:before {
  content: "\ea78";
}
.icofont-dotted-right:before {
  content: "\ea79";
}
.icofont-dotted-up:before {
  content: "\ea7a";
}
.icofont-double-left:before {
  content: "\ea7b";
}
.icofont-double-right:before {
  content: "\ea7c";
}
.icofont-expand-alt:before {
  content: "\ea7d";
}
.icofont-hand-down:before {
  content: "\ea7e";
}
.icofont-hand-drag:before {
  content: "\ea7f";
}
.icofont-hand-drag1:before {
  content: "\ea80";
}
.icofont-hand-drag2:before {
  content: "\ea81";
}
.icofont-hand-drawn-alt-down:before {
  content: "\ea82";
}
.icofont-hand-drawn-alt-left:before {
  content: "\ea83";
}
.icofont-hand-drawn-alt-right:before {
  content: "\ea84";
}
.icofont-hand-drawn-alt-up:before {
  content: "\ea85";
}
.icofont-hand-drawn-down:before {
  content: "\ea86";
}
.icofont-hand-drawn-left:before {
  content: "\ea87";
}
.icofont-hand-drawn-right:before {
  content: "\ea88";
}
.icofont-hand-drawn-up:before {
  content: "\ea89";
}
.icofont-hand-grippers:before {
  content: "\ea8a";
}
.icofont-hand-left:before {
  content: "\ea8b";
}
.icofont-hand-right:before {
  content: "\ea8c";
}
.icofont-hand-up:before {
  content: "\ea8d";
}
.icofont-line-block-down:before {
  content: "\ea8e";
}
.icofont-line-block-left:before {
  content: "\ea8f";
}
.icofont-line-block-right:before {
  content: "\ea90";
}
.icofont-line-block-up:before {
  content: "\ea91";
}
.icofont-long-arrow-down:before {
  content: "\ea92";
}
.icofont-long-arrow-left:before {
  content: "\ea93";
}
.icofont-long-arrow-right:before {
  content: "\ea94";
}
.icofont-long-arrow-up:before {
  content: "\ea95";
}
.icofont-rounded-collapse:before {
  content: "\ea96";
}
.icofont-rounded-double-left:before {
  content: "\ea97";
}
.icofont-rounded-double-right:before {
  content: "\ea98";
}
.icofont-rounded-down:before {
  content: "\ea99";
}
.icofont-rounded-expand:before {
  content: "\ea9a";
}
.icofont-rounded-left-down:before {
  content: "\ea9b";
}
.icofont-rounded-left-up:before {
  content: "\ea9c";
}
.icofont-rounded-left:before {
  content: "\ea9d";
}
.icofont-rounded-right-down:before {
  content: "\ea9e";
}
.icofont-rounded-right-up:before {
  content: "\ea9f";
}
.icofont-rounded-right:before {
  content: "\eaa0";
}
.icofont-rounded-up:before {
  content: "\eaa1";
}
.icofont-scroll-bubble-down:before {
  content: "\eaa2";
}
.icofont-scroll-bubble-left:before {
  content: "\eaa3";
}
.icofont-scroll-bubble-right:before {
  content: "\eaa4";
}
.icofont-scroll-bubble-up:before {
  content: "\eaa5";
}
.icofont-scroll-double-down:before {
  content: "\eaa6";
}
.icofont-scroll-double-left:before {
  content: "\eaa7";
}
.icofont-scroll-double-right:before {
  content: "\eaa8";
}
.icofont-scroll-double-up:before {
  content: "\eaa9";
}
.icofont-scroll-down:before {
  content: "\eaaa";
}
.icofont-scroll-left:before {
  content: "\eaab";
}
.icofont-scroll-long-down:before {
  content: "\eaac";
}
.icofont-scroll-long-left:before {
  content: "\eaad";
}
.icofont-scroll-long-right:before {
  content: "\eaae";
}
.icofont-scroll-long-up:before {
  content: "\eaaf";
}
.icofont-scroll-right:before {
  content: "\eab0";
}
.icofont-scroll-up:before {
  content: "\eab1";
}
.icofont-simple-down:before {
  content: "\eab2";
}
.icofont-simple-left-down:before {
  content: "\eab3";
}
.icofont-simple-left-up:before {
  content: "\eab4";
}
.icofont-simple-left:before {
  content: "\eab5";
}
.icofont-simple-right-down:before {
  content: "\eab6";
}
.icofont-simple-right-up:before {
  content: "\eab7";
}
.icofont-simple-right:before {
  content: "\eab8";
}
.icofont-simple-up:before {
  content: "\eab9";
}
.icofont-square-down:before {
  content: "\eaba";
}
.icofont-square-left:before {
  content: "\eabb";
}
.icofont-square-right:before {
  content: "\eabc";
}
.icofont-square-up:before {
  content: "\eabd";
}
.icofont-stylish-down:before {
  content: "\eabe";
}
.icofont-stylish-left:before {
  content: "\eabf";
}
.icofont-stylish-right:before {
  content: "\eac0";
}
.icofont-stylish-up:before {
  content: "\eac1";
}
.icofont-swoosh-down:before {
  content: "\eac2";
}
.icofont-swoosh-left:before {
  content: "\eac3";
}
.icofont-swoosh-right:before {
  content: "\eac4";
}
.icofont-swoosh-up:before {
  content: "\eac5";
}
.icofont-thin-double-left:before {
  content: "\eac6";
}
.icofont-thin-double-right:before {
  content: "\eac7";
}
.icofont-thin-down:before {
  content: "\eac8";
}
.icofont-thin-left:before {
  content: "\eac9";
}
.icofont-thin-right:before {
  content: "\eaca";
}
.icofont-thin-up:before {
  content: "\eacb";
}
.icofont-brand-amazon:before {
  content: "\e8a1";
}
.icofont-brand-apple:before {
  content: "\e8a7";
}
.icofont-brand-whatsapp:before {
  content: "\e957";
}
.icofont-brand-ubuntu:before {
  content: "\e94e";
}
.icofont-bootstrap:before {
  content: "\ed24";
}
.icofont-addons:before {
  content: "\eea0";
}
.icofont-address-book:before {
  content: "\eea1";
}
.icofont-adjust:before {
  content: "\eea2";
}
.icofont-alarm:before {
  content: "\eea3";
}
.icofont-anchor:before {
  content: "\eea4";
}
.icofont-archive:before {
  content: "\eea5";
}
.icofont-at:before {
  content: "\eea6";
}
.icofont-attachment:before {
  content: "\eea7";
}
.icofont-audio:before {
  content: "\eea8";
}
.icofont-automation:before {
  content: "\eea9";
}
.icofont-badge:before {
  content: "\eeaa";
}
.icofont-bag-alt:before {
  content: "\eeab";
}
.icofont-bag:before {
  content: "\eeac";
}
.icofont-ban:before {
  content: "\eead";
}
.icofont-bar-code:before {
  content: "\eeae";
}
.icofont-bars:before {
  content: "\eeaf";
}
.icofont-basket:before {
  content: "\eeb0";
}
.icofont-battery-empty:before {
  content: "\eeb1";
}
.icofont-battery-full:before {
  content: "\eeb2";
}
.icofont-battery-half:before {
  content: "\eeb3";
}
.icofont-battery-low:before {
  content: "\eeb4";
}
.icofont-beaker:before {
  content: "\eeb5";
}
.icofont-bed:before {
  content: "\eeb7";
}
.icofont-bell:before {
  content: "\eeb8";
}
.icofont-beverage:before {
  content: "\eeb9";
}
.icofont-bill:before {
  content: "\eeba";
}
.icofont-bin:before {
  content: "\eebb";
}
.icofont-binary:before {
  content: "\eebc";
}
.icofont-binoculars:before {
  content: "\eebd";
}
.icofont-bluetooth:before {
  content: "\eebe";
}
.icofont-bomb:before {
  content: "\eebf";
}
.icofont-book-mark:before {
  content: "\eec0";
}
.icofont-box:before {
  content: "\eec1";
}
.icofont-briefcase:before {
  content: "\eec2";
}
.icofont-broken:before {
  content: "\eec3";
}
.icofont-bucket:before {
  content: "\eec4";
}
.icofont-bucket1:before {
  content: "\eec5";
}
.icofont-bucket2:before {
  content: "\eec6";
}
.icofont-bug:before {
  content: "\eec7";
}
.icofont-building:before {
  content: "\eec8";
}
.icofont-bulb-alt:before {
  content: "\eec9";
}
.icofont-bullet:before {
  content: "\eeca";
}
.icofont-bullhorn:before {
  content: "\eecb";
}
.icofont-bullseye:before {
  content: "\eecc";
}
.icofont-calendar:before {
  content: "\eecd";
}
.icofont-camera-alt:before {
  content: "\eece";
}
.icofont-camera:before {
  content: "\eecf";
}
.icofont-card:before {
  content: "\eed0";
}
.icofont-cart-alt:before {
  content: "\eed1";
}
.icofont-cart:before {
  content: "\eed2";
}
.icofont-cc:before {
  content: "\eed3";
}
.icofont-charging:before {
  content: "\eed4";
}
.icofont-chat:before {
  content: "\eed5";
}
.icofont-check-alt:before {
  content: "\eed6";
}
.icofont-check-circled:before {
  content: "\eed7";
}
.icofont-check:before {
  content: "\eed8";
}
.icofont-checked:before {
  content: "\eed9";
}
.icofont-children-care:before {
  content: "\eeda";
}
.icofont-clip:before {
  content: "\eedb";
}
.icofont-clock-time:before {
  content: "\eedc";
}
.icofont-close-circled:before {
  content: "\eedd";
}
.icofont-close-line-circled:before {
  content: "\eede";
}
.icofont-close-line-squared-alt:before {
  content: "\eedf";
}
.icofont-close-line-squared:before {
  content: "\eee0";
}
.icofont-close-line:before {
  content: "\eee1";
}
.icofont-close-squared-alt:before {
  content: "\eee2";
}
.icofont-close-squared:before {
  content: "\eee3";
}
.icofont-close:before {
  content: "\eee4";
}
.icofont-cloud-download:before {
  content: "\eee5";
}
.icofont-cloud-refresh:before {
  content: "\eee6";
}
.icofont-cloud-upload:before {
  content: "\eee7";
}
.icofont-cloud:before {
  content: "\eee8";
}
.icofont-code-not-allowed:before {
  content: "\eee9";
}
.icofont-code:before {
  content: "\eeea";
}
.icofont-comment:before {
  content: "\eeeb";
}
.icofont-compass-alt:before {
  content: "\eeec";
}
.icofont-compass:before {
  content: "\eeed";
}
.icofont-computer:before {
  content: "\eeee";
}
.icofont-connection:before {
  content: "\eeef";
}
.icofont-console:before {
  content: "\eef0";
}
.icofont-contacts:before {
  content: "\eef1";
}
.icofont-contrast:before {
  content: "\eef2";
}
.icofont-copyright:before {
  content: "\eef3";
}
.icofont-credit-card:before {
  content: "\eef4";
}
.icofont-crop:before {
  content: "\eef5";
}
.icofont-crown:before {
  content: "\eef6";
}
.icofont-cube:before {
  content: "\eef7";
}
.icofont-cubes:before {
  content: "\eef8";
}
.icofont-dashboard-web:before {
  content: "\eef9";
}
.icofont-dashboard:before {
  content: "\eefa";
}
.icofont-data:before {
  content: "\eefb";
}
.icofont-database-add:before {
  content: "\eefc";
}
.icofont-database-locked:before {
  content: "\eefd";
}
.icofont-database-remove:before {
  content: "\eefe";
}
.icofont-database:before {
  content: "\eeff";
}
.icofont-delete:before {
  content: "\ef00";
}
.icofont-diamond:before {
  content: "\ef01";
}
.icofont-dice-multiple:before {
  content: "\ef02";
}
.icofont-dice:before {
  content: "\ef03";
}
.icofont-disc:before {
  content: "\ef04";
}
.icofont-diskette:before {
  content: "\ef05";
}
.icofont-document-folder:before {
  content: "\ef06";
}
.icofont-download-alt:before {
  content: "\ef07";
}
.icofont-download:before {
  content: "\ef08";
}
.icofont-downloaded:before {
  content: "\ef09";
}
.icofont-drag:before {
  content: "\ef0a";
}
.icofont-drag1:before {
  content: "\ef0b";
}
.icofont-drag2:before {
  content: "\ef0c";
}
.icofont-drag3:before {
  content: "\ef0d";
}
.icofont-earth:before {
  content: "\ef0e";
}
.icofont-ebook:before {
  content: "\ef0f";
}
.icofont-edit:before {
  content: "\ef10";
}
.icofont-eject:before {
  content: "\ef11";
}
.icofont-email:before {
  content: "\ef12";
}
.icofont-envelope-open:before {
  content: "\ef13";
}
.icofont-envelope:before {
  content: "\ef14";
}
.icofont-eraser:before {
  content: "\ef15";
}
.icofont-error:before {
  content: "\ef16";
}
.icofont-excavator:before {
  content: "\ef17";
}
.icofont-exchange:before {
  content: "\ef18";
}
.icofont-exclamation-circle:before {
  content: "\ef19";
}
.icofont-exclamation-square:before {
  content: "\ef1a";
}
.icofont-exclamation-tringle:before {
  content: "\ef1b";
}
.icofont-exclamation:before {
  content: "\ef1c";
}
.icofont-exit:before {
  content: "\ef1d";
}
.icofont-expand:before {
  content: "\ef1e";
}
.icofont-external-link:before {
  content: "\ef1f";
}
.icofont-external:before {
  content: "\ef20";
}
.icofont-eye-alt:before {
  content: "\ef21";
}
.icofont-eye-blocked:before {
  content: "\ef22";
}
.icofont-eye-dropper:before {
  content: "\ef23";
}
.icofont-eye:before {
  content: "\ef24";
}
.icofont-favourite:before {
  content: "\ef25";
}
.icofont-fax:before {
  content: "\ef26";
}
.icofont-file-fill:before {
  content: "\ef27";
}
.icofont-film:before {
  content: "\ef28";
}
.icofont-filter:before {
  content: "\ef29";
}
.icofont-fire-alt:before {
  content: "\ef2a";
}
.icofont-fire-burn:before {
  content: "\ef2b";
}
.icofont-fire:before {
  content: "\ef2c";
}
.icofont-flag-alt-1:before {
  content: "\ef2d";
}
.icofont-flag-alt-2:before {
  content: "\ef2e";
}
.icofont-flag:before {
  content: "\ef2f";
}
.icofont-flame-torch:before {
  content: "\ef30";
}
.icofont-flash-light:before {
  content: "\ef31";
}
.icofont-flash:before {
  content: "\ef32";
}
.icofont-flask:before {
  content: "\ef33";
}
.icofont-focus:before {
  content: "\ef34";
}
.icofont-folder-open:before {
  content: "\ef35";
}
.icofont-folder:before {
  content: "\ef36";
}
.icofont-foot-print:before {
  content: "\ef37";
}
.icofont-garbage:before {
  content: "\ef38";
}
.icofont-gear-alt:before {
  content: "\ef39";
}
.icofont-gear:before {
  content: "\ef3a";
}
.icofont-gears:before {
  content: "\ef3b";
}
.icofont-gift:before {
  content: "\ef3c";
}
.icofont-glass:before {
  content: "\ef3d";
}
.icofont-globe:before {
  content: "\ef3e";
}
.icofont-graffiti:before {
  content: "\ef3f";
}
.icofont-grocery:before {
  content: "\ef40";
}
.icofont-hand:before {
  content: "\ef41";
}
.icofont-hanger:before {
  content: "\ef42";
}
.icofont-hard-disk:before {
  content: "\ef43";
}
.icofont-heart-alt:before {
  content: "\ef44";
}
.icofont-heart:before {
  content: "\ef45";
}
.icofont-history:before {
  content: "\ef46";
}
.icofont-home:before {
  content: "\ef47";
}
.icofont-horn:before {
  content: "\ef48";
}
.icofont-hour-glass:before {
  content: "\ef49";
}
.icofont-id:before {
  content: "\ef4a";
}
.icofont-image:before {
  content: "\ef4b";
}
.icofont-inbox:before {
  content: "\ef4c";
}
.icofont-infinite:before {
  content: "\ef4d";
}
.icofont-info-circle:before {
  content: "\ef4e";
}
.icofont-info-square:before {
  content: "\ef4f";
}
.icofont-info:before {
  content: "\ef50";
}
.icofont-institution:before {
  content: "\ef51";
}
.icofont-interface:before {
  content: "\ef52";
}
.icofont-invisible:before {
  content: "\ef53";
}
.icofont-jacket:before {
  content: "\ef54";
}
.icofont-jar:before {
  content: "\ef55";
}
.icofont-jewlery:before {
  content: "\ef56";
}
.icofont-karate:before {
  content: "\ef57";
}
.icofont-key-hole:before {
  content: "\ef58";
}
.icofont-key:before {
  content: "\ef59";
}
.icofont-label:before {
  content: "\ef5a";
}
.icofont-lamp:before {
  content: "\ef5b";
}
.icofont-layers:before {
  content: "\ef5c";
}
.icofont-layout:before {
  content: "\ef5d";
}
.icofont-leaf:before {
  content: "\ef5e";
}
.icofont-leaflet:before {
  content: "\ef5f";
}
.icofont-learn:before {
  content: "\ef60";
}
.icofont-lego:before {
  content: "\ef61";
}
.icofont-lens:before {
  content: "\ef62";
}
.icofont-letter:before {
  content: "\ef63";
}
.icofont-letterbox:before {
  content: "\ef64";
}
.icofont-library:before {
  content: "\ef65";
}
.icofont-license:before {
  content: "\ef66";
}
.icofont-life-bouy:before {
  content: "\ef67";
}
.icofont-life-buoy:before {
  content: "\ef68";
}
.icofont-life-jacket:before {
  content: "\ef69";
}
.icofont-life-ring:before {
  content: "\ef6a";
}
.icofont-light-bulb:before {
  content: "\ef6b";
}
.icofont-lighter:before {
  content: "\ef6c";
}
.icofont-lightning-ray:before {
  content: "\ef6d";
}
.icofont-like:before {
  content: "\ef6e";
}
.icofont-line-height:before {
  content: "\ef6f";
}
.icofont-link-alt:before {
  content: "\ef70";
}
.icofont-link:before {
  content: "\ef71";
}
.icofont-list:before {
  content: "\ef72";
}
.icofont-listening:before {
  content: "\ef73";
}
.icofont-listine-dots:before {
  content: "\ef74";
}
.icofont-listing-box:before {
  content: "\ef75";
}
.icofont-listing-number:before {
  content: "\ef76";
}
.icofont-live-support:before {
  content: "\ef77";
}
.icofont-location-arrow:before {
  content: "\ef78";
}
.icofont-location-pin:before {
  content: "\ef79";
}
.icofont-lock:before {
  content: "\ef7a";
}
.icofont-login:before {
  content: "\ef7b";
}
.icofont-logout:before {
  content: "\ef7c";
}
.icofont-lollipop:before {
  content: "\ef7d";
}
.icofont-long-drive:before {
  content: "\ef7e";
}
.icofont-look:before {
  content: "\ef7f";
}
.icofont-loop:before {
  content: "\ef80";
}
.icofont-luggage:before {
  content: "\ef81";
}
.icofont-lunch:before {
  content: "\ef82";
}
.icofont-lungs:before {
  content: "\ef83";
}
.icofont-magic-alt:before {
  content: "\ef84";
}
.icofont-magic:before {
  content: "\ef85";
}
.icofont-magnet:before {
  content: "\ef86";
}
.icofont-mail-box:before {
  content: "\ef87";
}
.icofont-mail:before {
  content: "\ef88";
}
.icofont-male:before {
  content: "\ef89";
}
.icofont-map-pins:before {
  content: "\ef8a";
}
.icofont-map:before {
  content: "\ef8b";
}
.icofont-maximize:before {
  content: "\ef8c";
}
.icofont-measure:before {
  content: "\ef8d";
}
.icofont-medicine:before {
  content: "\ef8e";
}
.icofont-mega-phone:before {
  content: "\ef8f";
}
.icofont-megaphone-alt:before {
  content: "\ef90";
}
.icofont-megaphone:before {
  content: "\ef91";
}
.icofont-memorial:before {
  content: "\ef92";
}
.icofont-memory-card:before {
  content: "\ef93";
}
.icofont-mic-mute:before {
  content: "\ef94";
}
.icofont-mic:before {
  content: "\ef95";
}
.icofont-military:before {
  content: "\ef96";
}
.icofont-mill:before {
  content: "\ef97";
}
.icofont-minus-circle:before {
  content: "\ef98";
}
.icofont-minus-square:before {
  content: "\ef99";
}
.icofont-minus:before {
  content: "\ef9a";
}
.icofont-mobile-phone:before {
  content: "\ef9b";
}
.icofont-molecule:before {
  content: "\ef9c";
}
.icofont-money:before {
  content: "\ef9d";
}
.icofont-moon:before {
  content: "\ef9e";
}
.icofont-mop:before {
  content: "\ef9f";
}
.icofont-muffin:before {
  content: "\efa0";
}
.icofont-mustache:before {
  content: "\efa1";
}
.icofont-navigation-menu:before {
  content: "\efa2";
}
.icofont-navigation:before {
  content: "\efa3";
}
.icofont-network-tower:before {
  content: "\efa4";
}
.icofont-network:before {
  content: "\efa5";
}
.icofont-news:before {
  content: "\efa6";
}
.icofont-newspaper:before {
  content: "\efa7";
}
.icofont-no-smoking:before {
  content: "\efa8";
}
.icofont-not-allowed:before {
  content: "\efa9";
}
.icofont-notebook:before {
  content: "\efaa";
}
.icofont-notepad:before {
  content: "\efab";
}
.icofont-notification:before {
  content: "\efac";
}
.icofont-numbered:before {
  content: "\efad";
}
.icofont-opposite:before {
  content: "\efae";
}
.icofont-optic:before {
  content: "\efaf";
}
.icofont-options:before {
  content: "\efb0";
}
.icofont-package:before {
  content: "\efb1";
}
.icofont-page:before {
  content: "\efb2";
}
.icofont-paint:before {
  content: "\efb3";
}
.icofont-paper-plane:before {
  content: "\efb4";
}
.icofont-paperclip:before {
  content: "\efb5";
}
.icofont-papers:before {
  content: "\efb6";
}
.icofont-pay:before {
  content: "\efb7";
}
.icofont-penguin-linux:before {
  content: "\efb8";
}
.icofont-pestle:before {
  content: "\efb9";
}
.icofont-phone-circle:before {
  content: "\efba";
}
.icofont-phone:before {
  content: "\efbb";
}
.icofont-picture:before {
  content: "\efbc";
}
.icofont-pine:before {
  content: "\efbd";
}
.icofont-pixels:before {
  content: "\efbe";
}
.icofont-plugin:before {
  content: "\efbf";
}
.icofont-plus-circle:before {
  content: "\efc0";
}
.icofont-plus-square:before {
  content: "\efc1";
}
.icofont-plus:before {
  content: "\efc2";
}
.icofont-polygonal:before {
  content: "\efc3";
}
.icofont-power:before {
  content: "\efc4";
}
.icofont-price:before {
  content: "\efc5";
}
.icofont-print:before {
  content: "\efc6";
}
.icofont-puzzle:before {
  content: "\efc7";
}
.icofont-qr-code:before {
  content: "\efc8";
}
.icofont-queen:before {
  content: "\efc9";
}
.icofont-question-circle:before {
  content: "\efca";
}
.icofont-question-square:before {
  content: "\efcb";
}
.icofont-question:before {
  content: "\efcc";
}
.icofont-quote-left:before {
  content: "\efcd";
}
.icofont-quote-right:before {
  content: "\efce";
}
.icofont-random:before {
  content: "\efcf";
}
.icofont-recycle:before {
  content: "\efd0";
}
.icofont-refresh:before {
  content: "\efd1";
}
.icofont-repair:before {
  content: "\efd2";
}
.icofont-reply-all:before {
  content: "\efd3";
}
.icofont-reply:before {
  content: "\efd4";
}
.icofont-resize:before {
  content: "\efd5";
}
.icofont-responsive:before {
  content: "\efd6";
}
.icofont-retweet:before {
  content: "\efd7";
}
.icofont-road:before {
  content: "\efd8";
}
.icofont-robot:before {
  content: "\efd9";
}
.icofont-royal:before {
  content: "\efda";
}
.icofont-rss-feed:before {
  content: "\efdb";
}
.icofont-safety:before {
  content: "\efdc";
}
.icofont-sale-discount:before {
  content: "\efdd";
}
.icofont-satellite:before {
  content: "\efde";
}
.icofont-send-mail:before {
  content: "\efdf";
}
.icofont-server:before {
  content: "\efe0";
}
.icofont-settings-alt:before {
  content: "\efe1";
}
.icofont-settings:before {
  content: "\efe2";
}
.icofont-share-alt:before {
  content: "\efe3";
}
.icofont-share-boxed:before {
  content: "\efe4";
}
.icofont-share:before {
  content: "\efe5";
}
.icofont-shield:before {
  content: "\efe6";
}
.icofont-shopping-cart:before {
  content: "\efe7";
}
.icofont-sign-in:before {
  content: "\efe8";
}
.icofont-sign-out:before {
  content: "\efe9";
}
.icofont-signal:before {
  content: "\efea";
}
.icofont-site-map:before {
  content: "\efeb";
}
.icofont-smart-phone:before {
  content: "\efec";
}
.icofont-soccer:before {
  content: "\efed";
}
.icofont-sort-alt:before {
  content: "\efee";
}
.icofont-sort:before {
  content: "\efef";
}
.icofont-space:before {
  content: "\eff0";
}
.icofont-spanner:before {
  content: "\eff1";
}
.icofont-speech-comments:before {
  content: "\eff2";
}
.icofont-speed-meter:before {
  content: "\eff3";
}
.icofont-spinner-alt-1:before {
  content: "\eff4";
}
.icofont-spinner-alt-2:before {
  content: "\eff5";
}
.icofont-spinner-alt-3:before {
  content: "\eff6";
}
.icofont-spinner-alt-4:before {
  content: "\eff7";
}
.icofont-spinner-alt-5:before {
  content: "\eff8";
}
.icofont-spinner-alt-6:before {
  content: "\eff9";
}
.icofont-spinner:before {
  content: "\effa";
}
.icofont-spreadsheet:before {
  content: "\effb";
}
.icofont-square:before {
  content: "\effc";
}
.icofont-ssl-security:before {
  content: "\effd";
}
.icofont-star-alt-1:before {
  content: "\effe";
}
.icofont-star-alt-2:before {
  content: "\efff";
}
.icofont-star:before {
  content: "\f000";
}
.icofont-street-view:before {
  content: "\f001";
}
.icofont-support-faq:before {
  content: "\f002";
}
.icofont-tack-pin:before {
  content: "\f003";
}
.icofont-tag:before {
  content: "\f004";
}
.icofont-tags:before {
  content: "\f005";
}
.icofont-tasks-alt:before {
  content: "\f006";
}
.icofont-tasks:before {
  content: "\f007";
}
.icofont-telephone:before {
  content: "\f008";
}
.icofont-telescope:before {
  content: "\f009";
}
.icofont-terminal:before {
  content: "\f00a";
}
.icofont-thumbs-down:before {
  content: "\f00b";
}
.icofont-thumbs-up:before {
  content: "\f00c";
}
.icofont-tick-boxed:before {
  content: "\f00d";
}
.icofont-tick-mark:before {
  content: "\f00e";
}
.icofont-ticket:before {
  content: "\f00f";
}
.icofont-tie:before {
  content: "\f010";
}
.icofont-toggle-off:before {
  content: "\f011";
}
.icofont-toggle-on:before {
  content: "\f012";
}
.icofont-tools-alt-2:before {
  content: "\f013";
}
.icofont-tools:before {
  content: "\f014";
}
.icofont-touch:before {
  content: "\f015";
}
.icofont-traffic-light:before {
  content: "\f016";
}
.icofont-transparent:before {
  content: "\f017";
}
.icofont-tree:before {
  content: "\f018";
}
.icofont-unique-idea:before {
  content: "\f019";
}
.icofont-unlock:before {
  content: "\f01a";
}
.icofont-unlocked:before {
  content: "\f01b";
}
.icofont-upload-alt:before {
  content: "\f01c";
}
.icofont-upload:before {
  content: "\f01d";
}
.icofont-usb-drive:before {
  content: "\f01e";
}
.icofont-usb:before {
  content: "\f01f";
}
.icofont-vector-path:before {
  content: "\f020";
}
.icofont-verification-check:before {
  content: "\f021";
}
.icofont-wall-clock:before {
  content: "\f022";
}
.icofont-wall:before {
  content: "\f023";
}
.icofont-wallet:before {
  content: "\f024";
}
.icofont-warning-alt:before {
  content: "\f025";
}
.icofont-warning:before {
  content: "\f026";
}
.icofont-water-drop:before {
  content: "\f027";
}
.icofont-web:before {
  content: "\f028";
}
.icofont-wifi-alt:before {
  content: "\f02a";
}
.icofont-wifi:before {
  content: "\f02b";
}
.icofont-world:before {
  content: "\f02c";
}
.icofont-zipped:before {
  content: "\f02e";
}
.icofont-xs {
  font-size: 0.5em;
}
.icofont-sm {
  font-size: 0.75em;
}
.icofont-md {
  font-size: 1.25em;
}
.icofont-lg {
  font-size: 1.5em;
}
.icofont-1x {
  font-size: 1em;
}
.icofont-2x {
  font-size: 2em;
}
.icofont-3x {
  font-size: 3em;
}
.icofont-4x {
  font-size: 4em;
}
.icofont-5x {
  font-size: 5em;
}
.icofont-6x {
  font-size: 6em;
}
.icofont-7x {
  font-size: 7em;
}
.icofont-8x {
  font-size: 8em;
}
.icofont-9x {
  font-size: 9em;
}
.icofont-10x {
  font-size: 10em;
}
.icofont-fw {
  text-align: center;
  width: 1.25em;
}
.icofont-ul {
  list-style-type: none;
  padding-left: 0;
  margin-left: 0;
}
.icofont-ul > li {
  position: relative;
  line-height: 2em;
}
.icofont-ul > li .icofont {
  display: inline-block;
  vertical-align: middle;
}
.icofont-border {
  border: solid 0.08em #f1f1f1;
  border-radius: 0.1em;
  padding: 0.2em 0.25em 0.15em;
}
.icofont-pull-left {
  float: left;
}
.icofont-pull-right {
  float: right;
}
.icofont.icofont-pull-left {
  margin-right: 0.3em;
}
.icofont.icofont-pull-right {
  margin-left: 0.3em;
}
.icofont-spin {
  -webkit-animation: icofont-spin 2s infinite linear;
  animation: icofont-spin 2s infinite linear;
  display: inline-block;
}
.icofont-pulse {
  -webkit-animation: icofont-spin 1s infinite steps(8);
  animation: icofont-spin 1s infinite steps(8);
  display: inline-block;
}
@-webkit-keyframes icofont-spin {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes icofont-spin {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.icofont-rotate-90 {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
.icofont-rotate-180 {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.icofont-rotate-270 {
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
}
.icofont-flip-horizontal {
  -webkit-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.icofont-flip-vertical {
  -webkit-transform: scale(1, -1);
  transform: scale(1, -1);
}
.icofont-flip-horizontal.icofont-flip-vertical {
  -webkit-transform: scale(-1, -1);
  transform: scale(-1, -1);
}
:root .icofont-flip-horizontal,
:root .icofont-flip-vertical,
:root .icofont-rotate-180,
:root .icofont-rotate-270,
:root .icofont-rotate-90 {
  -webkit-filter: none;
  filter: none;
  display: inline-block;
}
.icofont-inverse {
  color: var(--mainColor6);
}
.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

@font-face {
  font-family: Samim;
  src: url(/702948ab618b3d20605b.eot);
  src: url(/702948ab618b3d20605b.eot?#iefix) format("embedded-opentype"),
    url(/840fbd0c6f8aa87175a7.woff) format("woff"), url(/64267944073da130ef1a.ttf) format("truetype");
  font-weight: 400;
}

@font-face {
  font-family: Samim;
  src: url(/a03e1f0daeacbaa08e81.eot);
  src: url(/a03e1f0daeacbaa08e81.eot?#iefix) format("embedded-opentype"),
    url(/689a1b05fbf854dab44e.woff) format("woff"),
    url(/924af5e4d304ec1c2385.ttf) format("truetype");
  font-weight: 700;
}

@media print {
  @font-face {
    font-family: Samim;
    src: url(/91290fe5d00d2d7f4013.ttf) format("truetype");
    font-weight: 500;
  }
}

html,
body,
p,
a,
table,
th,
td,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
div,
button,
input,
select,
textarea,
ol,
ul,
li {
  font-family: Samim, arial, sans-serif;
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  background: #fefefe;
  display: grid;
  font-size: 12px;
}
body {
  overflow-x: hidden;
}
a {
  text-decoration: none;
  color: dodgerblue;
}
a:hover {
  color: royalblue;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(206, 202, 202, 0.5);
  border-radius: 5px;
  background-color: #f4f5fa;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background-color: #f5f5f5;
  cursor: pointer;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 6px rgba(219, 218, 218, 0.836);
  background-color: #cfd3e5;
}

a {
  color: var(--mainColor9);
}
a:hover {
  color: var(--color8);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

#app {
  min-height: 100vh;
  direction: rtl;
}
.gr {
  color: var(--mainColor6);
  background: linear-gradient(135deg, var(--color4), var(--color5));
}

.gr-1 {
  color: var(--mainColor6);
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
.text-color-1 {
  color: var(--mainColor1);
}
.text-color-2 {
  color: var(--mainColor2);
}
.text-color-3 {
  color: var(--mainColor3);
}
.text-color-4 {
  color: var(--mainColor4);
}

.pull-right {
  display: flex;
  justify-content: flex-end;
}

.h1 {
  margin-top: 10px !important;
  margin-bottom: 20px !important;
}
input,
select,
textarea,
button {
  border: 0 solid var(--color6);
  background: #eeeeee;
  padding: 12px;
  margin: 0;
  border-radius: 4px;
  outline: none;
  transition: 0.1s;
}
/* 
input:focus, */
select:focus,
/* textarea:focus, */
button:hover {
  border: 0 solid var(--color2);
  outline: none;
  opacity: 0.6;
  /* background: #f6f6f6; */
}

input[type="checkbox"] {
  display: inline-block;
}
/* input[type="checkbox"] + *::before {
  content: "";
  display: inline-block;
  vertical-align: bottom;
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0.5rem;
  margin-left: 0.3rem;
  border-radius: 10%;
  border: 0.1rem solid var(--color1);
  line-height: 0.8rem;
  flex-shrink: 0;
} */
input[type="checkbox"]:checked + * {
  color: var(--color2);
  user-select: none;
}
/* input[type="checkbox"]:checked + *::before {
  content: "✓";
  color: white;
  text-align: right;
  background: var(--color2);
  border-color: var(--color2);
} */

.color-1 {
  color: var(--color1);
}
.color-2 {
  color: var(--color2);
}
.color-3 {
  color: var(--color3);
}
.color-4 {
  color: var(--color4);
}
.color-5 {
  color: var(--color5);
}
.color-6 {
  color: var(--color6);
}

.background-1 {
  background: var(--color1);
}
.background-2 {
  background: var(--color2);
}
.background-3 {
  background: var(--color3);
}
.background-4 {
  background: var(--color4);
}
.background-5 {
  background: var(--color5);
}
.background-6 {
  background: var(--color6);
}

.border-color-1 {
  border-color: var(--color1);
}
.border-color-2 {
  border-color: var(--color2);
}
.border-color-3 {
  border-color: var(--color3);
}
.border-color-4 {
  border-color: var(--color4);
}
.border-color-5 {
  border-color: var(--color5);
}
.border-color-6 {
  border-color: var(--color6);
}

.br4 {
  border-radius: 4px;
}
.br8 {
  border-radius: 8px;
}
.br12 {
  border-radius: 12px;
}
.br16 {
  border-radius: 16px;
}
.br20 {
  border-radius: 20px;
}
.br50 {
  border-radius: 50%;
}

.rc-tooltip-inner {
  min-height: 20px !important;
}

.main-color1 {
  background-color: var(--mainColor1);
  color: var(--color0);
}
.main-color2 {
  background-color: var(--mainColor4);
  color: var(--mainColor2);
}

.tab-item-active svg {
  animation: deepanimation 0.3s 1 ease-in-out both;
}
.highcharts-container {
  margin: auto;
}
.highcharts-tooltip {
  z-index: 9998;
}
.highcharts-data-label {
  z-index: -1;
}

@keyframes deepanimation {
  0% {
    transform: rotate(10deg) scale(1.05, 1.05);
    filter: blur(1px);
  }
  20% {
    transform: rotate(-10deg) scale(0.95, 0.95);
    filter: blur(2px);
  }
  50% {
    transform: rotate(10deg) scale(0.95, 0.95);
    filter: blur(0px);
  }
  70% {
    transform: rotate(-10deg) scale(1.05, 1.05);
    filter: blur(2px);
  }
  100% {
    transform: rotate(0deg) scale(1, 1);
    filter: blur(0);
  }
}

@media only screen and (min-width: 1600px) {
  body {
    background-color: var(--color5);
    background-image: url(/3aab7a9ae264a6befcee.svg);
    background-size: auto 400px;
    background-position: bottom right;
    background-attachment: fixed;
    background-repeat: no-repeat;
  }
  .main {
    width: 1600px;
    margin: auto;
  }
}

html,
body,
p,
a,
table,
th,
td,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
div,
button,
input,
select,
textarea,
ol,
ul,
li {
  font-family: Samim, arial, sans-serif;
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  background: #fefefe;
  display: grid;
  font-size: 12px;
}
body {
  overflow-x: hidden;
}
a {
  text-decoration: none;
  color: dodgerblue;
}
a:hover {
  color: royalblue;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(206, 202, 202, 0.5);
  border-radius: 5px;
  background-color: #f4f5fa;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background-color: #f5f5f5;
  cursor: pointer;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 6px rgba(219, 218, 218, 0.836);
  background-color: #cfd3e5;
}

a {
  color: var(--mainColor9);
}
a:hover {
  color: var(--color8);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

#app {
  min-height: 100vh;
  direction: rtl;
}
.gr {
  color: var(--mainColor6);
  background: linear-gradient(135deg, var(--color4), var(--color5));
}

.gr-1 {
  color: var(--mainColor6);
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
.text-color-1 {
  color: var(--mainColor1);
}
.text-color-2 {
  color: var(--mainColor2);
}
.text-color-3 {
  color: var(--mainColor3);
}
.text-color-4 {
  color: var(--mainColor4);
}

.pull-right {
  display: flex;
  justify-content: flex-end;
}

.h1 {
  margin-top: 10px !important;
  margin-bottom: 20px !important;
}
input,
select,
textarea,
button {
  border: 0 solid var(--color6);
  background: #eeeeee;
  padding: 12px;
  margin: 0;
  border-radius: 4px;
  outline: none;
  transition: 0.1s;
}
/* 
input:focus, */
select:focus,
/* textarea:focus, */
button:hover {
  border: 0 solid var(--color2);
  outline: none;
  opacity: 0.6;
  /* background: #f6f6f6; */
}

input[type="checkbox"] {
  display: inline-block;
}
/* input[type="checkbox"] + *::before {
  content: "";
  display: inline-block;
  vertical-align: bottom;
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0.5rem;
  margin-left: 0.3rem;
  border-radius: 10%;
  border: 0.1rem solid var(--color1);
  line-height: 0.8rem;
  flex-shrink: 0;
} */
input[type="checkbox"]:checked + * {
  color: var(--color2);
  user-select: none;
}
/* input[type="checkbox"]:checked + *::before {
  content: "✓";
  color: white;
  text-align: right;
  background: var(--color2);
  border-color: var(--color2);
} */

.color-1 {
  color: var(--color1);
}
.color-2 {
  color: var(--color2);
}
.color-3 {
  color: var(--color3);
}
.color-4 {
  color: var(--color4);
}
.color-5 {
  color: var(--color5);
}
.color-6 {
  color: var(--color6);
}

.background-1 {
  background: var(--color1);
}
.background-2 {
  background: var(--color2);
}
.background-3 {
  background: var(--color3);
}
.background-4 {
  background: var(--color4);
}
.background-5 {
  background: var(--color5);
}
.background-6 {
  background: var(--color6);
}

.border-color-1 {
  border-color: var(--color1);
}
.border-color-2 {
  border-color: var(--color2);
}
.border-color-3 {
  border-color: var(--color3);
}
.border-color-4 {
  border-color: var(--color4);
}
.border-color-5 {
  border-color: var(--color5);
}
.border-color-6 {
  border-color: var(--color6);
}

.br4 {
  border-radius: 4px;
}
.br8 {
  border-radius: 8px;
}
.br12 {
  border-radius: 12px;
}
.br16 {
  border-radius: 16px;
}
.br20 {
  border-radius: 20px;
}
.br50 {
  border-radius: 50%;
}

.rc-tooltip-inner {
  min-height: 20px !important;
}

.main-color1 {
  background-color: var(--mainColor1);
  color: var(--color0);
}
.main-color2 {
  background-color: var(--mainColor4);
  color: var(--mainColor2);
}

.tab-item-active svg {
  animation: deepanimation 0.3s 1 ease-in-out both;
}
.highcharts-container {
  margin: auto;
}
.highcharts-tooltip {
  z-index: 9998;
}
.highcharts-data-label {
  z-index: -1;
}

@keyframes deepanimation {
  0% {
    transform: rotate(10deg) scale(1.05, 1.05);
    filter: blur(1px);
  }
  20% {
    transform: rotate(-10deg) scale(0.95, 0.95);
    filter: blur(2px);
  }
  50% {
    transform: rotate(10deg) scale(0.95, 0.95);
    filter: blur(0px);
  }
  70% {
    transform: rotate(-10deg) scale(1.05, 1.05);
    filter: blur(2px);
  }
  100% {
    transform: rotate(0deg) scale(1, 1);
    filter: blur(0);
  }
}

@media only screen and (min-width: 1600px) {
  body {
    background-color: var(--color5);
    background-image: url(/3aab7a9ae264a6befcee.svg);
    background-size: auto 400px;
    background-position: bottom right;
    background-attachment: fixed;
    background-repeat: no-repeat;
  }
  .main {
    width: 1600px;
    margin: auto;
  }
}

html,
body,
p,
a,
table,
th,
td,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
div,
button,
input,
select,
textarea,
ol,
ul,
li {
  font-family: Samim, arial, sans-serif;
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  background: #fefefe;
  display: grid;
  font-size: 12px;
}
body {
  overflow-x: hidden;
}
a {
  text-decoration: none;
  color: dodgerblue;
}
a:hover {
  color: royalblue;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(206, 202, 202, 0.5);
  border-radius: 5px;
  background-color: #f4f5fa;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background-color: #f5f5f5;
  cursor: pointer;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 6px rgba(219, 218, 218, 0.836);
  background-color: #cfd3e5;
}

a {
  color: var(--mainColor9);
}
a:hover {
  color: var(--color8);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

#app {
  min-height: 100vh;
  direction: rtl;
}
.gr {
  color: var(--mainColor6);
  background: linear-gradient(135deg, var(--color4), var(--color5));
}

.gr-1 {
  color: var(--mainColor6);
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
.text-color-1 {
  color: var(--mainColor1);
}
.text-color-2 {
  color: var(--mainColor2);
}
.text-color-3 {
  color: var(--mainColor3);
}
.text-color-4 {
  color: var(--mainColor4);
}

.pull-right {
  display: flex;
  justify-content: flex-end;
}

.h1 {
  margin-top: 10px !important;
  margin-bottom: 20px !important;
}
input,
select,
textarea,
button {
  border: 0 solid var(--color6);
  background: #eeeeee;
  padding: 12px;
  margin: 0;
  border-radius: 4px;
  outline: none;
  transition: 0.1s;
}
/* 
input:focus, */
select:focus,
/* textarea:focus, */
button:hover {
  border: 0 solid var(--color2);
  outline: none;
  opacity: 0.6;
  /* background: #f6f6f6; */
}

input[type="checkbox"] {
  display: inline-block;
}
/* input[type="checkbox"] + *::before {
  content: "";
  display: inline-block;
  vertical-align: bottom;
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0.5rem;
  margin-left: 0.3rem;
  border-radius: 10%;
  border: 0.1rem solid var(--color1);
  line-height: 0.8rem;
  flex-shrink: 0;
} */
input[type="checkbox"]:checked + * {
  color: var(--color2);
  user-select: none;
}
/* input[type="checkbox"]:checked + *::before {
  content: "✓";
  color: white;
  text-align: right;
  background: var(--color2);
  border-color: var(--color2);
} */

.color-1 {
  color: var(--color1);
}
.color-2 {
  color: var(--color2);
}
.color-3 {
  color: var(--color3);
}
.color-4 {
  color: var(--color4);
}
.color-5 {
  color: var(--color5);
}
.color-6 {
  color: var(--color6);
}

.background-1 {
  background: var(--color1);
}
.background-2 {
  background: var(--color2);
}
.background-3 {
  background: var(--color3);
}
.background-4 {
  background: var(--color4);
}
.background-5 {
  background: var(--color5);
}
.background-6 {
  background: var(--color6);
}

.border-color-1 {
  border-color: var(--color1);
}
.border-color-2 {
  border-color: var(--color2);
}
.border-color-3 {
  border-color: var(--color3);
}
.border-color-4 {
  border-color: var(--color4);
}
.border-color-5 {
  border-color: var(--color5);
}
.border-color-6 {
  border-color: var(--color6);
}

.br4 {
  border-radius: 4px;
}
.br8 {
  border-radius: 8px;
}
.br12 {
  border-radius: 12px;
}
.br16 {
  border-radius: 16px;
}
.br20 {
  border-radius: 20px;
}
.br50 {
  border-radius: 50%;
}

.rc-tooltip-inner {
  min-height: 20px !important;
}

.main-color1 {
  background-color: var(--mainColor1);
  color: var(--color0);
}
.main-color2 {
  background-color: var(--mainColor4);
  color: var(--mainColor2);
}

.tab-item-active svg {
  animation: deepanimation 0.3s 1 ease-in-out both;
}
.highcharts-container {
  margin: auto;
}
.highcharts-tooltip {
  z-index: 9998;
}
.highcharts-data-label {
  z-index: -1;
}

@keyframes deepanimation {
  0% {
    transform: rotate(10deg) scale(1.05, 1.05);
    filter: blur(1px);
  }
  20% {
    transform: rotate(-10deg) scale(0.95, 0.95);
    filter: blur(2px);
  }
  50% {
    transform: rotate(10deg) scale(0.95, 0.95);
    filter: blur(0px);
  }
  70% {
    transform: rotate(-10deg) scale(1.05, 1.05);
    filter: blur(2px);
  }
  100% {
    transform: rotate(0deg) scale(1, 1);
    filter: blur(0);
  }
}

@media only screen and (min-width: 1600px) {
  body {
    background-color: var(--color5);
    background-image: url(/3aab7a9ae264a6befcee.svg);
    background-size: auto 400px;
    background-position: bottom right;
    background-attachment: fixed;
    background-repeat: no-repeat;
  }
  .main {
    width: 1600px;
    margin: auto;
  }
}

html,
body,
p,
a,
table,
th,
td,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
div,
button,
input,
select,
textarea,
ol,
ul,
li {
  font-family: Samim, arial, sans-serif;
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  background: #fefefe;
  display: grid;
  font-size: 12px;
}
body {
  overflow-x: hidden;
}
a {
  text-decoration: none;
  color: dodgerblue;
}
a:hover {
  color: royalblue;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(206, 202, 202, 0.5);
  border-radius: 5px;
  background-color: #f4f5fa;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background-color: #f5f5f5;
  cursor: pointer;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 6px rgba(219, 218, 218, 0.836);
  background-color: #cfd3e5;
}

a {
  color: var(--mainColor9);
}
a:hover {
  color: var(--color8);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

#app {
  min-height: 100vh;
  direction: rtl;
}
.gr {
  color: var(--mainColor6);
  background: linear-gradient(135deg, var(--color4), var(--color5));
}

.gr-1 {
  color: var(--mainColor6);
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
.text-color-1 {
  color: var(--mainColor1);
}
.text-color-2 {
  color: var(--mainColor2);
}
.text-color-3 {
  color: var(--mainColor3);
}
.text-color-4 {
  color: var(--mainColor4);
}

.pull-right {
  display: flex;
  justify-content: flex-end;
}

.h1 {
  margin-top: 10px !important;
  margin-bottom: 20px !important;
}
input,
select,
textarea,
button {
  border: 0 solid var(--color6);
  background: #eeeeee;
  padding: 12px;
  margin: 0;
  border-radius: 4px;
  outline: none;
  transition: 0.1s;
}
/* 
input:focus, */
select:focus,
/* textarea:focus, */
button:hover {
  border: 0 solid var(--color2);
  outline: none;
  opacity: 0.6;
  /* background: #f6f6f6; */
}

input[type="checkbox"] {
  display: inline-block;
}
/* input[type="checkbox"] + *::before {
  content: "";
  display: inline-block;
  vertical-align: bottom;
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0.5rem;
  margin-left: 0.3rem;
  border-radius: 10%;
  border: 0.1rem solid var(--color1);
  line-height: 0.8rem;
  flex-shrink: 0;
} */
input[type="checkbox"]:checked + * {
  color: var(--color2);
  user-select: none;
}
/* input[type="checkbox"]:checked + *::before {
  content: "✓";
  color: white;
  text-align: right;
  background: var(--color2);
  border-color: var(--color2);
} */

.color-1 {
  color: var(--color1);
}
.color-2 {
  color: var(--color2);
}
.color-3 {
  color: var(--color3);
}
.color-4 {
  color: var(--color4);
}
.color-5 {
  color: var(--color5);
}
.color-6 {
  color: var(--color6);
}

.background-1 {
  background: var(--color1);
}
.background-2 {
  background: var(--color2);
}
.background-3 {
  background: var(--color3);
}
.background-4 {
  background: var(--color4);
}
.background-5 {
  background: var(--color5);
}
.background-6 {
  background: var(--color6);
}

.border-color-1 {
  border-color: var(--color1);
}
.border-color-2 {
  border-color: var(--color2);
}
.border-color-3 {
  border-color: var(--color3);
}
.border-color-4 {
  border-color: var(--color4);
}
.border-color-5 {
  border-color: var(--color5);
}
.border-color-6 {
  border-color: var(--color6);
}

.br4 {
  border-radius: 4px;
}
.br8 {
  border-radius: 8px;
}
.br12 {
  border-radius: 12px;
}
.br16 {
  border-radius: 16px;
}
.br20 {
  border-radius: 20px;
}
.br50 {
  border-radius: 50%;
}

.rc-tooltip-inner {
  min-height: 20px !important;
}

.main-color1 {
  background-color: var(--mainColor1);
  color: var(--color0);
}
.main-color2 {
  background-color: var(--mainColor4);
  color: var(--mainColor2);
}

.tab-item-active svg {
  animation: deepanimation 0.3s 1 ease-in-out both;
}
.highcharts-container {
  margin: auto;
}
.highcharts-tooltip {
  z-index: 9998;
}
.highcharts-data-label {
  z-index: -1;
}

@keyframes deepanimation {
  0% {
    transform: rotate(10deg) scale(1.05, 1.05);
    filter: blur(1px);
  }
  20% {
    transform: rotate(-10deg) scale(0.95, 0.95);
    filter: blur(2px);
  }
  50% {
    transform: rotate(10deg) scale(0.95, 0.95);
    filter: blur(0px);
  }
  70% {
    transform: rotate(-10deg) scale(1.05, 1.05);
    filter: blur(2px);
  }
  100% {
    transform: rotate(0deg) scale(1, 1);
    filter: blur(0);
  }
}

@media only screen and (min-width: 1600px) {
  body {
    background-color: var(--color5);
    background-size: auto 400px;
    background-image: url(/3aab7a9ae264a6befcee.svg);
    background-position: bottom right;
    background-attachment: fixed;
    background-repeat: no-repeat;
  }
  .main {
    width: 1600px;
    margin: auto;
  }
}

html,
body,
p,
a,
table,
th,
td,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
div,
button,
input,
select,
textarea,
ol,
ul,
li {
  font-family: Samim, arial, sans-serif;
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  background: #fefefe;
  display: grid;
  font-size: 12px;
}
body {
  overflow-x: hidden;
}
a {
  text-decoration: none;
  color: dodgerblue;
}
a:hover {
  color: royalblue;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(206, 202, 202, 0.5);
  border-radius: 5px;
  background-color: #f4f5fa;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background-color: #f5f5f5;
  cursor: pointer;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 6px rgba(219, 218, 218, 0.836);
  background-color: #cfd3e5;
}

a {
  color: var(--mainColor9);
}
a:hover {
  color: var(--color8);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

#app {
  min-height: 100vh;
  direction: rtl;
}
.gr {
  color: var(--mainColor6);
  background: linear-gradient(135deg, var(--color4), var(--color5));
}

.gr-1 {
  color: var(--mainColor6);
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
.text-color-1 {
  color: var(--mainColor1);
}
.text-color-2 {
  color: var(--mainColor2);
}
.text-color-3 {
  color: var(--mainColor3);
}
.text-color-4 {
  color: var(--mainColor4);
}

.pull-right {
  display: flex;
  justify-content: flex-end;
}

.h1 {
  margin-top: 10px !important;
  margin-bottom: 20px !important;
}
input,
select,
textarea,
button {
  border: 0 solid var(--color6);
  background: #eeeeee;
  padding: 12px;
  margin: 0;
  border-radius: 4px;
  outline: none;
  transition: 0.1s;
}
/* 
input:focus, */
select:focus,
/* textarea:focus, */
button:hover {
  border: 0 solid var(--color2);
  outline: none;
  opacity: 0.6;
  /* background: #f6f6f6; */
}

input[type="checkbox"] {
  display: inline-block;
}
/* input[type="checkbox"] + *::before {
  content: "";
  display: inline-block;
  vertical-align: bottom;
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0.5rem;
  margin-left: 0.3rem;
  border-radius: 10%;
  border: 0.1rem solid var(--color1);
  line-height: 0.8rem;
  flex-shrink: 0;
} */
input[type="checkbox"]:checked + * {
  color: var(--color2);
  user-select: none;
}
/* input[type="checkbox"]:checked + *::before {
  content: "✓";
  color: white;
  text-align: right;
  background: var(--color2);
  border-color: var(--color2);
} */

.color-1 {
  color: var(--color1);
}
.color-2 {
  color: var(--color2);
}
.color-3 {
  color: var(--color3);
}
.color-4 {
  color: var(--color4);
}
.color-5 {
  color: var(--color5);
}
.color-6 {
  color: var(--color6);
}

.background-1 {
  background: var(--color1);
}
.background-2 {
  background: var(--color2);
}
.background-3 {
  background: var(--color3);
}
.background-4 {
  background: var(--color4);
}
.background-5 {
  background: var(--color5);
}
.background-6 {
  background: var(--color6);
}

.border-color-1 {
  border-color: var(--color1);
}
.border-color-2 {
  border-color: var(--color2);
}
.border-color-3 {
  border-color: var(--color3);
}
.border-color-4 {
  border-color: var(--color4);
}
.border-color-5 {
  border-color: var(--color5);
}
.border-color-6 {
  border-color: var(--color6);
}

.br4 {
  border-radius: 4px;
}
.br8 {
  border-radius: 8px;
}
.br12 {
  border-radius: 12px;
}
.br16 {
  border-radius: 16px;
}
.br20 {
  border-radius: 20px;
}
.br50 {
  border-radius: 50%;
}

.rc-tooltip-inner {
  min-height: 20px !important;
}

.main-color1 {
  background-color: var(--mainColor1);
  color: var(--color0);
}
.main-color2 {
  background-color: var(--mainColor4);
  color: var(--mainColor2);
}

.tab-item-active svg {
  animation: deepanimation 0.3s 1 ease-in-out both;
}
.highcharts-container {
  margin: auto;
}
.highcharts-tooltip {
  z-index: 9998;
}
.highcharts-data-label {
  z-index: -1;
}

@keyframes deepanimation {
  0% {
    transform: rotate(10deg) scale(1.05, 1.05);
    filter: blur(1px);
  }
  20% {
    transform: rotate(-10deg) scale(0.95, 0.95);
    filter: blur(2px);
  }
  50% {
    transform: rotate(10deg) scale(0.95, 0.95);
    filter: blur(0px);
  }
  70% {
    transform: rotate(-10deg) scale(1.05, 1.05);
    filter: blur(2px);
  }
  100% {
    transform: rotate(0deg) scale(1, 1);
    filter: blur(0);
  }
}

@media only screen and (min-width: 1600px) {
  body {
    background-color: var(--color5);
    background-image: url(/3aab7a9ae264a6befcee.svg);
    background-size: auto 400px;
    background-position: bottom right;
    background-attachment: fixed;
    background-repeat: no-repeat;
  }
  .main {
    width: 1600px;
    margin: auto;
  }
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col-13,
.col-14,
.col-15,
.col-16,
.col-17,
.col-18,
.col-19,
.col-20,
.col-21,
.col-22,
.col-23,
.col-24 {
  display: inline-block;
  margin: 0;
  line-height: inherit;
}

.position-middle {
  position: absolute;
}
.position-top {
  position: absolute;
  top: 0;
}
.position-bottom {
  position: absolute;
  bottom: 0;
}

/* Extra small devices (phones, 600px and down) */
@media /*only screen and*/ (max-width: 600px) {
  .col-xs-1 {
    width: calc(100% / 24) !important;
  }
  .col-xs-2 {
    width: calc(100% / 12) !important;
  }
  .col-xs-3 {
    width: calc(100% / 24 * 3) !important;
  }
  .col-xs-4 {
    width: calc(100% / 6) !important;
  }
  .col-xs-5 {
    width: calc(100% / 24 * 5) !important;
  }
  .col-xs-6 {
    width: calc(100% / 4) !important;
  }
  .col-xs-7 {
    width: calc(100% / 24 * 7) !important;
  }
  .col-xs-8 {
    width: calc(100% / 3) !important;
  }
  .col-xs-9 {
    width: calc(100% / 24 * 9) !important;
  }
  .col-xs-10 {
    width: calc(100% / 12 * 5) !important;
  }
  .col-xs-11 {
    width: calc(100% / 24 * 11) !important;
  }
  .col-xs-12 {
    width: calc(100% / 2) !important;
  }
  .col-xs-13 {
    width: calc(100% / 24 * 13) !important;
  }
  .col-xs-14 {
    width: calc(100% / 12 * 7) !important;
  }
  .col-xs-15 {
    width: calc(100% / 24 * 15) !important;
  }
  .col-xs-16 {
    width: calc(100% / 6 * 4) !important;
  }
  .col-xs-17 {
    width: calc(100% / 24 * 17) !important;
  }
  .col-xs-18 {
    width: calc(100% / 4 * 3) !important;
  }
  .col-xs-19 {
    width: calc(100% / 24 * 19) !important;
  }
  .col-xs-20 {
    width: calc(100% / 6 * 5) !important;
  }
  .col-xs-21 {
    width: calc(100% / 24 * 21) !important;
  }
  .col-xs-22 {
    width: calc(100% / 12 * 11) !important;
  }
  .col-xs-23 {
    width: calc(100% / 24 * 23) !important;
  }
  .col-xs-24 {
    width: calc(100%) !important;
  }
  .col-xs-hidden {
    display: none !important;
  }
  .col-sm-down-hidden {
    display: none !important;
  }

  .position-middle {
    position: relative;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media /*only screen and*/ (min-width: 600px) {
  .col-sm-1 {
    width: calc(100% / 24) !important;
  }
  .col-sm-2 {
    width: calc(100% / 12) !important;
  }
  .col-sm-3 {
    width: calc(100% / 24 * 3) !important;
  }
  .col-sm-4 {
    width: calc(100% / 6) !important;
  }
  .col-sm-5 {
    width: calc(100% / 24 * 5) !important;
  }
  .col-sm-6 {
    width: calc(100% / 4) !important;
  }
  .col-sm-7 {
    width: calc(100% / 24 * 7) !important;
  }
  .col-sm-8 {
    width: calc(100% / 3) !important;
  }
  .col-sm-9 {
    width: calc(100% / 24 * 9) !important;
  }
  .col-sm-10 {
    width: calc(100% / 12 * 5) !important;
  }
  .col-sm-11 {
    width: calc(100% / 24 * 11) !important;
  }
  .col-sm-12 {
    width: calc(100% / 2) !important;
  }
  .col-sm-13 {
    width: calc(100% / 24 * 13) !important;
  }
  .col-sm-14 {
    width: calc(100% / 12 * 7) !important;
  }
  .col-sm-15 {
    width: calc(100% / 24 * 15) !important;
  }
  .col-sm-16 {
    width: calc(100% / 6 * 4) !important;
  }
  .col-sm-17 {
    width: calc(100% / 24 * 17) !important;
  }
  .col-sm-18 {
    width: calc(100% / 4 * 3) !important;
  }
  .col-sm-19 {
    width: calc(100% / 24 * 19) !important;
  }
  .col-sm-20 {
    width: calc(100% / 6 * 5) !important;
  }
  .col-sm-21 {
    width: calc(100% / 24 * 21) !important;
  }
  .col-sm-22 {
    width: calc(100% / 12 * 11) !important;
  }
  .col-sm-23 {
    width: calc(100% / 24 * 23) !important;
  }
  .col-sm-24 {
    width: calc(100%) !important;
  }
  .col-sm-hidden {
    display: none !important;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media /*only screen and*/ (min-width: 768px) {
  .col-md-1 {
    width: calc(100% / 24) !important;
  }
  .col-md-2 {
    width: calc(100% / 12) !important;
  }
  .col-md-3 {
    width: calc(100% / 24 * 3) !important;
  }
  .col-md-4 {
    width: calc(100% / 6) !important;
  }
  .col-md-5 {
    width: calc(100% / 24 * 5) !important;
  }
  .col-md-6 {
    width: calc(100% / 4) !important;
  }
  .col-md-7 {
    width: calc(100% / 24 * 7) !important;
  }
  .col-md-8 {
    width: calc(100% / 3) !important;
  }
  .col-md-9 {
    width: calc(100% / 24 * 9) !important;
  }
  .col-md-10 {
    width: calc(100% / 12 * 5) !important;
  }
  .col-md-11 {
    width: calc(100% / 24 * 11) !important;
  }
  .col-md-12 {
    width: calc(100% / 2) !important;
  }
  .col-md-13 {
    width: calc(100% / 24 * 13) !important;
  }
  .col-md-14 {
    width: calc(100% / 12 * 7) !important;
  }
  .col-md-15 {
    width: calc(100% / 24 * 15) !important;
  }
  .col-md-16 {
    width: calc(100% / 6 * 4) !important;
  }
  .col-md-17 {
    width: calc(100% / 24 * 17) !important;
  }
  .col-md-18 {
    width: calc(100% / 4 * 3) !important;
  }
  .col-md-19 {
    width: calc(100% / 24 * 19) !important;
  }
  .col-md-20 {
    width: calc(100% / 6 * 5) !important;
  }
  .col-md-21 {
    width: calc(100% / 24 * 21) !important;
  }
  .col-md-22 {
    width: calc(100% / 12 * 11) !important;
  }
  .col-md-23 {
    width: calc(100% / 24 * 23) !important;
  }
  .col-md-24 {
    width: calc(100%) !important;
  }
  .col-md-hidden {
    display: none !important;
  }
}
/* Medium devices (landscape tablets, 768px and down) */
@media /*only screen and*/ (max-width: 768px) {
  .col-md-down-hidden {
    display: none !important;
  }
}

/* Large devices (laptops/desktops, 1023px and up) */
@media /*only screen and*/ (min-width: 992px) {
  .col-lg-1 {
    width: calc(100% / 24) !important;
  }
  .col-lg-2 {
    width: calc(100% / 12) !important;
  }
  .col-lg-3 {
    width: calc(100% / 24 * 3) !important;
  }
  .col-lg-4 {
    width: calc(100% / 6) !important;
  }
  .col-lg-5 {
    width: calc(100% / 24 * 5) !important;
  }
  .col-lg-6 {
    width: calc(100% / 4) !important;
  }
  .col-lg-7 {
    width: calc(100% / 24 * 7) !important;
  }
  .col-lg-8 {
    width: calc(100% / 3) !important;
  }
  .col-lg-9 {
    width: calc(100% / 24 * 9) !important;
  }
  .col-lg-10 {
    width: calc(100% / 12 * 5) !important;
  }
  .col-lg-11 {
    width: calc(100% / 24 * 11) !important;
  }
  .col-lg-12 {
    width: calc(100% / 2) !important;
  }
  .col-lg-13 {
    width: calc(100% / 24 * 13) !important;
  }
  .col-lg-14 {
    width: calc(100% / 12 * 7) !important;
  }
  .col-lg-15 {
    width: calc(100% / 24 * 15) !important;
  }
  .col-lg-16 {
    width: calc(100% / 6 * 4) !important;
  }
  .col-lg-17 {
    width: calc(100% / 24 * 17) !important;
  }
  .col-lg-18 {
    width: calc(100% / 4 * 3) !important;
  }
  .col-lg-19 {
    width: calc(100% / 24 * 19) !important;
  }
  .col-lg-20 {
    width: calc(100% / 6 * 5) !important;
  }
  .col-lg-21 {
    width: calc(100% / 24 * 21) !important;
  }
  .col-lg-22 {
    width: calc(100% / 12 * 11) !important;
  }
  .col-lg-23 {
    width: calc(100% / 24 * 23) !important;
  }
  .col-lg-24 {
    width: calc(100%) !important;
  }
  .col-lg-hidden {
    display: none !important;
  }
}
/* Large devices (laptops/desktops, 1023px and down) */
@media /*only screen and*/ (max-width: 992px) {
  .col-lg-down-hidden {
    display: none !important;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media /*only screen and*/ (min-width: 1200px) {
  .col-xl-1 {
    width: calc(100% / 24) !important;
  }
  .col-xl-2 {
    width: calc(100% / 12) !important;
  }
  .col-xl-3 {
    width: calc(100% / 24 * 3) !important;
  }
  .col-xl-4 {
    width: calc(100% / 6) !important;
  }
  .col-xl-5 {
    width: calc(100% / 24 * 5) !important;
  }
  .col-xl-6 {
    width: calc(100% / 4) !important;
  }
  .col-xl-7 {
    width: calc(100% / 24 * 7) !important;
  }
  .col-xl-8 {
    width: calc(100% / 3) !important;
  }
  .col-xl-9 {
    width: calc(100% / 24 * 9) !important;
  }
  .col-xl-10 {
    width: calc(100% / 12 * 5) !important;
  }
  .col-xl-11 {
    width: calc(100% / 24 * 11) !important;
  }
  .col-xl-12 {
    width: calc(100% / 2) !important;
  }
  .col-xl-13 {
    width: calc(100% / 24 * 13) !important;
  }
  .col-xl-14 {
    width: calc(100% / 12 * 7) !important;
  }
  .col-xl-15 {
    width: calc(100% / 24 * 15) !important;
  }
  .col-xl-16 {
    width: calc(100% / 6 * 4) !important;
  }
  .col-xl-17 {
    width: calc(100% / 24 * 17) !important;
  }
  .col-xl-18 {
    width: calc(100% / 4 * 3) !important;
  }
  .col-xl-19 {
    width: calc(100% / 24 * 19) !important;
  }
  .col-xl-20 {
    width: calc(100% / 6 * 5) !important;
  }
  .col-xl-21 {
    width: calc(100% / 24 * 21) !important;
  }
  .col-xl-22 {
    width: calc(100% / 12 * 11) !important;
  }
  .col-xl-23 {
    width: calc(100% / 24 * 23) !important;
  }
  .col-xl-24 {
    width: calc(100%) !important;
  }
  .col-xl-hidden {
    display: none !important;
  }
}
/* Extra large devices (large laptops and desktops, 1200px and down) */
@media /*only screen and*/ (max-width: 1200px) {
  .col-xl-down-hidden {
    display: none !important;
  }
}

.col-1 {
  width: calc(100% / 24);
}
.col-2 {
  width: calc(100% / 12);
}
.col-3 {
  width: calc(100% / 24 * 3);
}
.col-4 {
  width: calc(100% / 6);
}
.col-5 {
  width: calc(100% / 24 * 5);
}
.col-6 {
  width: calc(100% / 4);
}
.col-7 {
  width: calc(100% / 24 * 7);
}
.col-8 {
  width: calc(100% / 3);
}
.col-9 {
  width: calc(100% / 24 * 9);
}
.col-10 {
  width: calc(100% / 12 * 5);
}
.col-11 {
  width: calc(100% / 24 * 11);
}
.col-12 {
  width: calc(100% / 2);
}
.col-13 {
  width: calc(100% / 24 * 13);
}
.col-14 {
  width: calc(100% / 12 * 7);
}
.col-15 {
  width: calc(100% / 24 * 15);
}
.col-16 {
  width: calc(100% / 6 * 4);
}
.col-17 {
  width: calc(100% / 24 * 17);
}
.col-18 {
  width: calc(100% / 4 * 3);
}
.col-19 {
  width: calc(100% / 24 * 19);
}
.col-20 {
  width: calc(100% / 6 * 5);
}
.col-21 {
  width: calc(100% / 24 * 21);
}
.col-22 {
  width: calc(100% / 12 * 11);
}
.col-23 {
  width: calc(100% / 24 * 23);
}
.col-24 {
  width: calc(100%);
}
.col-hidden {
  display: none;
}

@media /*only screen and*/ (max-width: 640px) {
  .position-fixed {
    position: initial !important;
    top: 0 !important;
  }
  .col-24 {
    overflow: initial !important;
    height: initial !important;
    max-height: initial !important;
  }
}

.d-flex{display: flex;flex-wrap: wrap; position: relative; align-items: stretch;}
.justify-right{justify-content: right}
.justify-left{justify-content: left}
.justify-center{justify-content: center}
.align-right{align-items: flex-start}
.align-left{align-items: flex-end}
.align-center{align-items: center}
.main-theme {
  background-size: cover;
  top: 0;
  bottom: 0;
}
.main-theme,
.main-footer,
.main-content,
.main-header {
  position: fixed;
  left: 0;
  right: 0;
}
.main-header {
  top: 0;
  height: 50px;
}
.main-content {
  top: 50px;
  bottom: 50px;
}
.main-footer {
  bottom: 0;
  height: 50px;
}

.main-theme {
  background-size: cover;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.main-header {
  background: #333;
  color: var(--mainColor6);
}
.main-content {
  background: #444;
  color: var(--mainColor6);
}
.news-paper {
  position: fixed;
  background: #333;
  color: var(--mainColor6);
}
.main-footer {
  background: #333;
  color: var(--mainColor6);
}

.BoxOfficeSlider {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.BoxOfficeSlider-unActive {
  display: none;
}
.BoxOfficeSlider-active {
  display: block;
  width: 100%;
}
.BoxOfficeSlider-tools {
  position: relative;
}
.BoxOfficeSlider-count {
  position: absolute;
  left: 0;
  top: 0;
  padding: 2px;
  border-radius: 2px;
  background-color: rgba(0, 0, 0, 0.1);
}
.BoxOfficeSlider-content {
  display: flex;
  justify-content: stretch;
  align-items: stretch;
  height: 100%;
  width: 100%;
}

.BoxOfficeSlider-control {
  display: inline-grid;
  justify-items: center;
  align-items: center;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.3);
  min-width: 30px;
  text-align: center;
  opacity: 0;
  transition: 0.3s;
  z-index: 1;
  user-select: none;
  position: relative;
}
.BoxOfficeSlider-control:hover {
  opacity: 1;
  transition: 0.3s;
}
.BoxOfficeSlider-list {
  min-height: 100px;
  min-width: 60px;
  margin: 0 -30px;
  display: flex;
  overflow: hidden;
}
.BoxOfficeSlider-progress {
  height: 2px;
  background: red;
  position: absolute;
  display: inline-block;
  left: 0;
  top: 0;
  width: 0;
}

.map {
  height: 100%;
  display: block;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.map svg {
  height: 100%;
  max-width: 100%;
  /*height: 500px;*/
  /*width: 500px*/
}

.map .border,
.map .border path,
.map .island path {
  fill: #555;
  stroke: #555;
  transition: 0.3s;
}
.map:hover .border path {
  fill: #111;
  stroke: #111;
  transition: 0.3s;
}

.map .province path {
  fill: #999;
}

.map .province path.not-data {
  fill: #ccc;
}

.map .sea path,
.map .lake path {
  fill: #daf0ff;
}

.map .province path.active-click:hover,
.map .island path.active-click:hover,
.map .province path.hover,
.map .island path.hover {
  opacity: 0.7 !important;
  cursor: pointer;
}

.map .province path.not-data:hover,
.map .island path:hover,
.map .province path.not-data.hover,
.map .island path.not-data.hover {
  fill: #ccc !important;
  cursor: default;
}

@media (max-width: 515px) {
  .map {
    width: 100%;
  }
}

.modal-component {
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 1064;
}
.modal-wrapper {
  position: relative;
  background: var(--mainColor6);
  border-radius: 8px;
  overflow: hidden;
  min-width: 200px;
  min-height: 100px;
  max-height: calc(95vh - 100px);
  max-width: calc(min(1400px, calc(95vw - 100px)));
  display: flex;
  flex-direction: column;
  z-index: 1064;
  animation-name: modal-component-show;
  animation-duration: 0.3s;
  animation-timing-function: linear;
}
.modal-header {
  min-height: 30px;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  z-index: 1;
  margin-bottom: 5px;
}
.modal-title {
  padding: 8px;
  font-size: 14px;
  font-weight: bold;
  color: var(--mainColor2);
}
.modal-extra {
  position: absolute;
  display: inline-flex;
  left: 8px;
  top: 8px;
}
.modal-onclose {
  width: 20px;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.modal-content {
  padding: 4px 12px;
  font-size: 12px;
  overflow: auto;
}
.modal-footer {
  padding: 10px;
  font-size: 12px;
  box-shadow: 0 -2px 3px rgba(0, 0, 0, 0.3);
  z-index: 1;
  margin-top: 5px;
}

.modal-show-shadow-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1063;
}
.modal-wrapper-size-xl {
  width: calc(100%);
}
.modal-wrapper-size-lg {
  width: calc(80%);
}
.modal-wrapper-size-md {
  width: calc(55%);
}
.modal-wrapper-size-sm {
  width: calc(40%);
}
.modal-wrapper-size-xs {
  width: calc(30%);
}

@media only screen and (max-width: 768px) {
  .modal-wrapper-size-xl,
  .modal-wrapper-size-lg,
  .modal-wrapper-size-md,
  .modal-wrapper-size-sm,
  .modal-wrapper-size-xs,
  .modal-wrapper-size-custom,
  .modal-wrapper {
    height: calc(95vh - 100px);
    width: calc(95vw - 100px);
  }
}
@media only screen and (max-width: 600px) {
  .modal-wrapper-size-xl,
  .modal-wrapper-size-lg,
  .modal-wrapper-size-md,
  .modal-wrapper-size-sm,
  .modal-wrapper-size-xs,
  .modal-wrapper-size-custom,
  .modal-wrapper {
    height: calc(95vh - 100px);
    width: calc(98vw);
    max-height: calc(95vh);
    max-width: calc(96vw);
  }
}
@keyframes modal-component-show {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.element-selector {
  position: fixed;
  z-index: 10000000;
  background: rgba(0, 0, 0, 0.75);
  color: var(--mainColor6);
  text-shadow: 2px 2px 5px #000;
  font-size: 2rem;
  direction: rtl;
  display: inline-flex;
  white-space: pre-line;
}
.element-selector span {
  padding: 5px 15px;
  display: inline-block;
  height: fit-content;
  text-shadow: 0 5px 25px #000, 0 -5px 25px #000, 5px 0 25px #000,
    -5px 0 25px #000;
}
.element-selector-prev,
.element-selector-next,
.element-selector-close {
  position: fixed;
  z-index: 100000000;
  height: 35px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  color: var(--mainColor6);
  opacity: 0.8;
  border-radius: 3px;
  transition: 0.3s;
}
.element-selector-close {
  text-shadow: 1px 1px #000;
  font-weight: bold;
  width: 20px;
  height: 20px;
  font-size: 22px;
}
.element-selector-close:hover {
  color: #f00;
  transition: 0.3s;
  opacity: 0.9;
}

.element-selector-prev,
.element-selector-next {
  background: #996100;
  background-image: linear-gradient(30deg, #805501, #e89b15);
  bottom: 20px;
  border: 1px solid #996100;
  box-shadow: 1px 1px 3px #000;
  padding: 2px 15px;
}
.element-selector-prev {
  border: 1px solid #999999;
  background: #cccccc;
  background-image: linear-gradient(30deg, #555555, #999999);
}

.element-selector-prev {
  right: 20px;
}
.element-selector-next {
  left: 20px;
}

.element-selector-prev:hover,
.element-selector-next:hover {
  transition: 0.3s;
  opacity: 0.9;
  box-shadow: 2px 1px 5px #000;
}

html,
body,
p,
a,
table,
th,
td,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
div,
button,
input,
select,
textarea,
ol,
ul,
li {
  font-family: Samim, arial, sans-serif;
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  word-break: break-word !important;
}
html,
body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  background: #fefefe;
  display: grid;
  font-size: 12px;
}
body {
  overflow-x: hidden;
}
a {
  text-decoration: none;
  color: dodgerblue;
}
a:hover {
  color: royalblue;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(206, 202, 202, 0.5);
  border-radius: 5px;
  background-color: #f4f5fa;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background-color: #f5f5f5;
  cursor: pointer;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 6px rgba(219, 218, 218, 0.836);
  background-color: #cfd3e5;
}

a {
  color: var(--mainColor9);
}
a:hover {
  color: var(--color8);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

#app {
  min-height: 100vh;
  direction: rtl;
}
.gr {
  color: var(--mainColor6);
  background: linear-gradient(135deg, var(--color4), var(--color5));
}

.gr-1 {
  color: var(--mainColor6);
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
.text-color-1 {
  color: var(--mainColor1);
}
.text-color-2 {
  color: var(--mainColor2);
}
.text-color-3 {
  color: var(--mainColor3);
}
.text-color-4 {
  color: var(--mainColor4);
}

.pull-right {
  display: flex;
  justify-content: flex-end;
}

.h1 {
  margin-top: 10px !important;
  margin-bottom: 20px !important;
}
input,
select,
textarea,
button {
  border: 0 solid var(--color6);
  background: #eeeeee;
  padding: 12px;
  margin: 0;
  border-radius: 4px;
  outline: none;
  transition: 0.1s;
}
/* 
input:focus, */
select:focus,
/* textarea:focus, */
button:hover {
  border: 0 solid var(--color2);
  outline: none;
  opacity: 0.6;
  /* background: #f6f6f6; */
}

input[type="checkbox"] {
  display: inline-block;
}
/* input[type="checkbox"] + *::before {
  content: "";
  display: inline-block;
  vertical-align: bottom;
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0.5rem;
  margin-left: 0.3rem;
  border-radius: 10%;
  border: 0.1rem solid var(--color1);
  line-height: 0.8rem;
  flex-shrink: 0;
} */
input[type="checkbox"]:checked + * {
  color: var(--color2);
  user-select: none;
}
/* input[type="checkbox"]:checked + *::before {
  content: "✓";
  color: white;
  text-align: right;
  background: var(--color2);
  border-color: var(--color2);
} */

.color-1 {
  color: var(--color1);
}
.color-2 {
  color: var(--color2);
}
.color-3 {
  color: var(--color3);
}
.color-4 {
  color: var(--color4);
}
.color-5 {
  color: var(--color5);
}
.color-6 {
  color: var(--color6);
}

.background-1 {
  background: var(--color1);
}
.background-2 {
  background: var(--color2);
}
.background-3 {
  background: var(--color3);
}
.background-4 {
  background: var(--color4);
}
.background-5 {
  background: var(--color5);
}
.background-6 {
  background: var(--color6);
}

.border-color-1 {
  border-color: var(--color1);
}
.border-color-2 {
  border-color: var(--color2);
}
.border-color-3 {
  border-color: var(--color3);
}
.border-color-4 {
  border-color: var(--color4);
}
.border-color-5 {
  border-color: var(--color5);
}
.border-color-6 {
  border-color: var(--color6);
}

.br4 {
  border-radius: 4px;
}
.br8 {
  border-radius: 8px;
}
.br12 {
  border-radius: 12px;
}
.br16 {
  border-radius: 16px;
}
.br20 {
  border-radius: 20px;
}
.br50 {
  border-radius: 50%;
}

.rc-tooltip-inner {
  min-height: 20px !important;
}

.main-color1 {
  background-color: var(--mainColor1);
  color: var(--color0);
}
.main-color2 {
  background-color: var(--mainColor4);
  color: var(--mainColor2);
}

.tab-item-active svg {
  animation: deepanimation 0.3s 1 ease-in-out both;
}
.highcharts-container {
  margin: auto;
}
.highcharts-tooltip {
  z-index: 9998;
}
.highcharts-data-label {
  z-index: -1;
}

@keyframes deepanimation {
  0% {
    transform: rotate(10deg) scale(1.05, 1.05);
    filter: blur(1px);
  }
  20% {
    transform: rotate(-10deg) scale(0.95, 0.95);
    filter: blur(2px);
  }
  50% {
    transform: rotate(10deg) scale(0.95, 0.95);
    filter: blur(0px);
  }
  70% {
    transform: rotate(-10deg) scale(1.05, 1.05);
    filter: blur(2px);
  }
  100% {
    transform: rotate(0deg) scale(1, 1);
    filter: blur(0);
  }
}

@media only screen and (min-width: 1600px) {
  body {
    background-color: var(--color5);
    background-image: url(/3aab7a9ae264a6befcee.svg);
    background-size: auto 400px;
    background-position: bottom right;
    background-attachment: fixed;
    background-repeat: no-repeat;
  }
  .main {
    width: 1600px;
    margin: auto;
  }
}

.form-label {
  display: block;
  /* margin: 8px 8px 12px 8px; */
  text-align: right;
}
.form-label-text {
  display: block;
  margin: 0 4px;
}
.required {
  display: inline-block;
  color: red;
  margin: 0 4px;
}

.input-field {
  border: 1px solid var(--themInputBorderPrimary);
  color: var(--themInputTextPrimary);
  background: var(--mainColor6);
  border-radius: 8px;
  height: 22px;
}

.input-disabled {
  border: 1px solid #ccc;
  color: #aaa;
  -webkit-box-shadow: none !important;
  pointer-events: none;
  background: rgba(255, 255, 255, 0.7);
  width: 100%;
}

.input-error-true {
  border: 1px solid var(--themInputBorderFailed);
  color: var(--themInputTextFailed);
}
.input-error-false {
  border: 1px solid var(--themInputBorderSucces);
  color: var(--themInputTextSucces);
}

.input-primary:hover {
  border: 1px solid var(--color11);
  background: var(--mainColor6);
}

.input-md-size {
  font-size: 12px;
  height: 20px;
}

.input-lg-size {
  font-size: 14px;
  height: 40px;
}

.textArea-field {
  border: 1px solid var(--themInputBorderPrimary);
  color: var(--themInputTextPrimary);
  background: var(--mainColor6);
  border-radius: 8px;
  width: 100%;
}

.textArea-error-true {
  border: 1px solid var(--themInputBorderFailed);
  color: var(--themInputTextFailed);
}
.textArea-error-false {
  border: 1px solid var(--themInputBorderSucces);
  color: var(--themInputTextSucces);
}

.textArea-primary:hover {
  border: 1px solid var(--color11);
  background: var(--mainColor6);
}

.textArea-md-size {
  font-size: 12px;
  height: 200px;
  width: 100%;
}

.textArea-lg-size {
  font-size: 14px;
  height: 44px;
}

.hint-message {
  height: 20px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--themInputHintText);
  padding: 0 8px;
  font-size: 11px;
  margin: 0 10px 0 0;
}
.error-message-true {
  color: var(--themInputBorderFailed);
}
.error-message-false {
  color: var(--themInputBorderSucces);
}

@media only screen and (max-width: 640px) {
  .input-md-size {
    font-size: 1rem;
    height: 15px;
  }

  .input-lg-size {
    font-size: 1rem;
    height: 30px;
  }
}

#app {
  height: 100vh;
  overflow: auto;
  scroll-behavior: smooth;
}
.public-page {
  min-height: 100vh;
  background: #e1e1e1;
}
.public-page > div {
  padding: 12px 0;
}
.public-page > .ant-col {
  height: 40vh;
}
.login-logo {
  border-radius: 50%;
  padding: 20px;
  margin: 8px auto;
}
.login-logo img {
  width: 140px;
}
.login-logo-min h1,
.login-logo h1 {
  padding: 0;
  color: var(--color2);
  white-space: normal;
}
.login-logo-min {
  display: flex;
  margin: 16px 0;
}
.login-logo-min svg,
.login-logo-min img {
  width: 40px !important;
  margin: 0 4px;
}
.login-box {
  padding: 10px;
  height: 450px;
  margin: 10% 0;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}

.login-text {
  margin: 130px 30px 0 0;
  text-align: right;
  color: var(--mainColor6);
}

.login-form {
  background: var(--mainColor6);
  height: 100%;
  padding: 12px 16px;
  margin: 0 20px;
  text-align: center;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  font-size: 12px;
}

.login-logo-mask {
  height: 100%;
  /*background-image: url("../../../resource/assets/images/logo2-mask.svg");*/
  background-size: auto 100%;
  background-position: bottom right;
  background-repeat: no-repeat;
  margin: 10px -10px 0 0;
}
.password-forget,
.password-forget div {
  background: var(--mainColor6);
  border-radius: 3px;
  cursor: pointer;
}
/*.login-form input {*/
/*  width: calc(100% - 25px);*/
/*}*/

.login-form button {
  cursor: pointer;
  padding: 10px;
}

.login-form button {
  text-align: center;
  transition: all 0.5s;
  cursor: pointer;
}

.login-form button span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.login-form button span:after {
  content: "\00bb";
  position: absolute;
  opacity: 0;
  top: 0;
  left: -20px;
  transition: 0.5s;
}

.login-form button:hover span {
  padding-left: 25px;
}

.login-form button:hover span:after {
  opacity: 1;
  left: 0;
}

.login-more {
  font-size: 10px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.login-register {
  text-align: center;
  color: #444;
  font-size: 14px;
  margin: 16px 0;
}
.login-register > a {
  margin: 0 5px;
  text-decoration: underline;
  color: var(--color2);
}
.password-forget {
  color: #a0a4a8;
  font-size: 11px;
  float: left;
}

.input-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.button-wrapper-login {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 24px 0 0 0;
  padding: 0 0 12px 0;
}

.button-wrapper-sign-up {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 10px 0 0 0;
}

.login-button {
  width: 100%;
  height: 40px;
  /* margin: 0 12px; */
}

.version {
  color: #999;
  float: left;
  padding: 5px 20px;
}

.user-input {
  width: 336px;
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  .user-input {
    width: 300px;
  }
  .login-logo {
    padding: 0;
    margin: auto;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
}

@media print {
  @page {
    size: a4;
    margin: 0.5cm;
    padding: 1cm;
    width: 21cm;
    height: 29.7cm;
  }
  html,
  body,
  #content {
    background: #f2f2f2 !important;
  }

  #app .main {
    max-width: 21cm !important;
  }
  .card * {
    max-width: 19.7cm !important;
  }
  #ApproachWidget .chart-parent {
    max-width: 350px !important;
  }
  #ApproachWidget .chart-parent,
  #ApproachWidget .chart-parent .highcharts-container,
  #SubjectActivityWrapper .highcharts-container {
    height: 6cm !important;
  }
  body,
  #app,
  #content,
  .card,
  .col-24,
  .card-content {
    overflow: initial !important;
    max-height: initial !important;
    height: initial !important;
  }
  #header > div,
  #side,
  #wave-alert,
  .version-control span,
  .advance-search-wrapper,
  .card-extra-list,
  .post-list-sort-wrapper,
  .statistics-more,
  .checkbox-wrapper,
  .toolbar-wrapper .brandmi-icon,
  .version-control-name,
  #filter-box,
  #industry-card-items > .card-header,
  #industry-brand-list,
  .pagination {
    display: none !important;
  }
  #content {
    position: initial !important;
    left: 0;
    right: 0;
    overflow: initial;
    margin: 0;
    width: 100% !important;
    background: #f2f2f2 !important;
    background: url(/bf59734840a06140a421.jpg) !important;
    background-size: auto 29.7cm !important;
  }
  #header {
    position: relative !important;
    /*background: url("data:image/png;base64,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") !important;*/
    background: url(/8e1694f7069432fe4339.jpg) !important;
    background-size: auto 29.7cm !important;
    height: 29.5cm !important;
  }
  .toolbar-component {
    position: relative !important;
    margin-top: -29cm !important;
    left: 0 !important;
    right: 0 !important;
    max-width: 100% !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-shadow: 0 1px 1px #fff !important;
    height: 29.5cm !important;
  }
  .toolbar-component ul,
  .toolbar-component .toolbar-wrapper > span {
    display: none !important;
  }
  .toolbar-wrapper {
    border-radius: 8px !important;
    border: 0 !important;
    font-size: 48px !important;
    padding: 2rem !important;
    width: 100% !important;
    display: inline-block !important;
    height: auto !important;
    box-shadow: none !important;
    background: transparent !important;
  }
  .version-control {
    position: absolute !important;
    top: 19.5cm !important;
    left: 0;
    right: 0;
    text-align: center !important;
    z-index: 10000;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
  }
  .content-footer ul {
    position: absolute;
    top: 28cm;
    left: 0;
    right: 0;
  }
  .content-footer ul li a {
    color: #ccc;
    opacity: 0.5;
  }
  .lastitem-p > div,
  .toolbar-wrapper-open-false {
    height: auto !important;
    border: 0 !important;
    color: #fff !important;
    text-shadow: 0 0 #fff !important;
  }
  .lastitem-p > div {
    color: #fff !important;
  }
  .lastitem-p > div > div {
    background-color: #fff !important;
    width: 8cm !important;
    height: 8cm !important;
    max-width: 100% !important;
    max-height: 100% !important;
    outline: 1px dashed var(--themLinkTextColor);
    border-radius: 8px !important;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
    background-size: 80% !important;
  }
  .lastitem-p > div {
    text-align: center !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }
  .lastitem-p > div * {
    margin: 0.5cm !important;
  }
  .content-footer {
    height: 29.7cm !important;
    background: url(/8b56eb636a286b01037e.jpg) !important;
    background-size: auto 29.7cm !important;
    overflow: hidden !important;
    position: relative;
    page-break-inside: avoid !important;
    page-break-after: auto !important;
    page-break-before: auto !important;
  }
  .version-control span.version-control-app-date,
  .version-control span.version-control-app-name,
  /*.d-flex,*/
  .col-24 {
    display: block !important;
  }
  .card {
    background-color: transparent !important;
    display: block !important;
    page-break-inside: avoid !important;
    page-break-after: auto !important;
    page-break-before: auto !important;
    box-shadow: none !important;
  }
  .card-tabs {
    border: 0 !important;
    box-shadow: none !important;
  }
  #content > .d-flex > .col-24 > .card {
    padding: 1.25cm 1cm 0.5cm 1cm !important;
    margin: 0 !important;
  }
  .version-control-app-name,
  .version-control-app-details,
  .version-control-app-date {
    padding: 0.5rem !important;
    border-radius: 0.5rem !important;
  }
  .version-control-app-details {
    color: #ccc !important;
  }
  .card-content {
    background-color: #fff !important;
  }
  #content > .d-flex > .col-24 > .card > .card-content {
    border-radius: 10px !important;
    padding: 0.5cm !important;
    border: 5px solid #f5f6f8;
  }
  .card-header {
    margin: 0 !important;
  }
  .card-header .card-title {
    background-color: #fff !important;
    margin-bottom: -10px !important;
    margin-right: 20px !important;
    border: 5px solid #f5f5f5 !important;
    box-shadow: none !important;
    color: #a5acc6 !important;
    border-bottom: 0 !important;
    border-radius: 10px 10px 0 0 !important;
  }
  .word-cloud-item {
    margin: 0.51cm;
  }
  .chart-parent,
  .word-cloud-list {
    max-height: 8.2cm !important;
  }
  .chart-parent .highcharts-container {
    height: 8cm !important;
  }
  .chart-donat-data {
    max-height: 13cm !important;
  }
  .chart-donat-data .chart-parent,
  .chart-donat-data .chart-parent .highcharts-container {
    height: 8cm !important;
  }
  .chart-parent + ul,
  .card-tabs-list ul {
    background: transparent !important;
  }
  #PostListWrapper > .card > .card-content > .col-24 {
    overflow: hidden !important;
    max-height: 24cm !important;
  }
  #PostListWrapper > .card .card-footer {
    padding: 0.4cm 0;
  }
  .post-item .card-content {
    padding: 0.2cm;
  }
  .card-extra,
  .form-select,
  .tab-item,
  .tags,
  .checkbox-component,
  .radio-group-component,
  .chart-parent + ul + div,
  .tab-item-last,
  .btn,
  .help-and-support,
  .publisher-list-more {
    display: none !important;
  }
  .tab-item-active {
    display: flex !important;
    background-color: #fff !important;
    box-shadow: none !important;
    color: #a5acc6 !important;
    border: 0 !important;
  }
  .map {
    height: 8cm !important;
  }
  .map-list {
    max-height: 4cm !important;
    overflow: hidden !important;
  }
}

#nta-wa-gdpr {
  vertical-align: text-top !important;
  padding: 0 !important;
  margin: 0 !important;
}

.nta-wa-gdpr {
  font-size: 11px;
  padding: 5px;
  margin-left: -5px;
  margin-right: -5px;
  border-radius: 4px;
}

.nta-wa-gdpr a {
  text-decoration: underline;
  color: inherit;
}

.pointer-disable {
  pointer-events: none;
}

.nta-woo-products-button:before,
.nta-woo-products-button:after {
  content: "";
  display: block;
  clear: both;
}

.wa__button {
  border-bottom: none !important;
}

.wa__btn_w_img:hover {
  text-decoration: none;
}

.wa__button,
.wa__btn_popup,
.wa__button *,
.wa__btn_popup *,
.wa__btn_popup :before,
.wa__button :before,
.wa__button :after,
.wa__btn_popup :after,
.wa__popup_chat_box,
.wa__popup_chat_box *,
.wa__popup_chat_box :before,
.wa__popup_chat_box :after {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

/* VVV--button--VVV */
.wa__button {
  position: relative;
  width: 300px;
  min-height: 64px;
  display: block;
  text-decoration: none;
  color: var(--mainColor6);
  box-shadow: 0px 4px 8px 1px rgba(32, 32, 37, 0.09);
  -webkit-box-shadow: 0px 4px 8px 1px rgba(32, 32, 37, 0.09);
  -moz-box-shadow: 0px 4px 8px 1px rgba(32, 32, 37, 0.09);
}
.wa__btn_txt {
  display: inline-block;
  font-size: 12px;
  line-height: 1.33em;
}

.wa__btn_w_icon .wa__btn_txt {
  padding: 16px 20px 15px 71px;
}

.wa__button_text_only .wa__btn_txt,
.wa__r_button.wa__btn_w_img.wa__button_text_only .wa__btn_txt,
.wa__sq_button.wa__btn_w_img.wa__button_text_only .wa__btn_txt {
  padding-top: 25px;
  padding-bottom: 24px;
}

.wa__btn_w_icon .wa__btn_txt .wa__btn_title {
  font-weight: 600;
  padding-left: 2px;
  font-size: 14px;
}

.wa__cs_info {
  margin-bottom: 2px;
}

.wa__btn_status {
  color: #f5a623;
  font-size: 9px;
  padding: 2px 0 0;
  font-weight: 700;
}

.wa__cs_info .wa__cs_name,
.wa__cs_info .wa__cs_status {
  display: inline-block;
}

.wa__cs_info .wa__cs_name {
  font-weight: 400;
  font-size: 12px;
  line-height: 1.36em;
}

.wa__stt_online .wa__cs_info .wa__cs_name {
  color: #d5f0d9;
}

.wa__stt_offline .wa__cs_info .wa__cs_name {
  color: #76787d;
}

.wa__cs_info .wa__cs_status {
  width: 36px;
  height: 14px;
  margin-right: 3px;
  padding: 1px;
  font-size: 9px;
  line-height: 1.34em;
  border-radius: 5px;
  color: rgba(255, 255, 255, 0.98);
  position: relative;
  top: -1px;
  left: 0px;
  text-align: center;
}

.wa__stt_online .wa__cs_info .wa__cs_status {
  background: #62c971;
}

.wa__stt_offline .wa__cs_info .wa__cs_status {
  background: #b9bbbe;
}

.wa__stt_online {
  background: #2db742;
  cursor: pointer;
  transition: 0.4s ease all;
  -webkit-transition: 0.4s ease all;
  -moz-transition: 0.4s ease all;
  backface-visibility: hidden;
  will-change: transform;
}
.wa__stt_online .wa__btn_txt {
  position: relative;
  z-index: 4;
}
.wa__r_button.wa__stt_online:before {
  border-radius: 50vh;
}
.wa__sq_button.wa__stt_online:before {
  border-radius: 5px;
}
.wa__stt_online:before {
  content: "";
  transition: 0.4s ease all;
  -webkit-transition: 0.4s ease all;
  -moz-transition: 0.4s ease all;
  background: rgba(0, 0, 0, 0.2);
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  opacity: 0;
  will-change: opacity;
}
.wa__button.wa__stt_online:focus,
.wa__button.wa__stt_online:active,
.wa__button.wa__stt_online:hover {
  box-shadow: 0px 4px 8px 1px rgba(32, 32, 37, 0.19);
  transform: translate(0, -3px);
  -webkit-transform: translate(0, -3px);
  -moz-transform: translate(0, -3px);
  -ms-transform: translate(0, -3px);
}
.wa__button.wa__stt_online:focus:before,
.wa__button.wa__stt_online:active:before,
.wa__button.wa__stt_online:hover:before {
  opacity: 1;
}
.wa__stt_online.wa__btn_w_icon .wa__btn_icon img {
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
  -moz-transition: 0.2s ease all;
}

.wa__stt_offline {
  background: #ebedf0;
  color: #595b60;
  box-shadow: none;
  cursor: initial;
}

.wa__stt_offline.wa__btn_w_icon .wa__btn_txt {
  padding: 8px 20px 6px 71px;
}

.wa__stt_offline.wa__r_button.wa__btn_w_img .wa__btn_txt {
  padding: 8px 20px 8px 100px;
}

.wa__stt_offline.wa__sq_button.wa__btn_w_img .wa__btn_txt {
  padding: 8px 20px 8px 70px;
}

.wa__btn_w_icon .wa__btn_icon {
  position: absolute;
  top: 50%;
  left: 16px;
  transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}

.wa__btn_w_icon .wa__btn_icon img {
  width: 41px;
  height: 69px;
}

.wa__btn_w_img {
  position: relative;
  width: 300px;
  margin: 20px 0 20px;
}

.wa__btn_w_img .wa__cs_img {
  position: absolute;
  top: 50%;
  left: 0px;
  text-align: center;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
}
.wa__btn_w_img .wa__cs_img_wrap {
  width: 79px;
  height: 79px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border: 3px solid #ffffff;
  position: relative;
  overflow: hidden;
}
.wa__btn_w_img .wa__cs_img img {
  max-width: 100%;
  height: auto;
  transition: 0.2s ease transform;
  -webkit-transition: 0.2s ease transform;
  -moz-transition: 0.2s ease transform;
}
.wa__btn_w_img .wa__cs_img:after {
  content: "";
  background: var(--mainColor6) url(/22b0076cd166d1b5df19.svg) center center
    no-repeat;
  background-size: 21px;
  display: block;
  width: 27px;
  height: 27px;
  position: absolute;
  top: 20px;
  right: -14px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  box-shadow: 0px 4px 6px 0px rgba(39, 38, 38, 0.3);
  -webkit-box-shadow: 0px 4px 6px 0px rgba(39, 38, 38, 0.3);
  -moz-box-shadow: 0px 4px 6px 0px rgba(39, 38, 38, 0.3);
}

.wa__stt_offline.wa__btn_w_img .wa__cs_img:after {
  content: "";
  background: var(--mainColor6) url(/b89b3ebab56efb151c99.svg) center center
    no-repeat;
  background-size: 21px;
  display: block;
  width: 27px;
  height: 27px;
  position: absolute;
  top: 20px;
  right: -14px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  box-shadow: 0px 4px 6px 0px rgba(39, 38, 38, 0.3);
  -webkit-box-shadow: 0px 4px 6px 0px rgba(39, 38, 38, 0.3);
  -moz-box-shadow: 0px 4px 6px 0px rgba(39, 38, 38, 0.3);
}

.wa__btn_w_img .wa__btn_txt {
  padding: 14px 20px 12px 103px;
}

.wa__r_button {
  border-radius: 50vh;
}

.wa__sq_button {
  border-radius: 5px;
}

.wa__sq_button.wa__btn_w_img {
  width: 270px;
  margin-left: 30px;
}

.wa__r_button.wa__btn_w_img .wa__cs_img {
  left: -5px;
}

.wa__sq_button.wa__btn_w_img .wa__cs_img {
  left: -35px;
}

.wa__sq_button.wa__btn_w_img .wa__btn_txt {
  padding: 10px 20px 10px 70px;
  display: table-cell;
  vertical-align: middle;
  height: 66px;
}

.wa__btn_txt .wa__btn_title {
  font-weight: 600;
}

.wa__r_button.wa__btn_w_img .wa__btn_txt {
  padding: 8px 20px 8px 100px;
  display: table-cell;
  vertical-align: middle;
  height: 66px;
}

.wa__r_button.wa__btn_w_img .wa__cs_info .wa__cs_status {
  margin-left: 3px;
}
/* ^^^--button--^^^ */

/* VVV--popup--VVV */

.wa__popup_chat_box {
  width: 351px;
  border-radius: 5px 5px 8px 8px;
  -webkit-border-radius: 5px 5px 8px 8px;
  -moz-border-radius: 5px 5px 8px 8px;
  position: fixed;
  overflow: hidden;
  box-shadow: 0px 10px 10px 4px rgba(0, 0, 0, 0.04);
  -webkit-box-shadow: 0px 10px 10px 4px rgba(0, 0, 0, 0.04);
  -moz-box-shadow: 0px 10px 10px 4px rgba(0, 0, 0, 0.04);
  bottom: 102px;
  right: 25px;
  z-index: 1998;
  opacity: 0;
  visibility: hidden;
  -ms-transform: translate(0, 50px);
  transform: translate(0, 50px);
  -webkit-transform: translate(0, 50px);
  -moz-transform: translate(0, 50px);
  transition: 0.4s ease all;
  -webkit-transition: 0.4s ease all;
  -moz-transition: 0.4s ease all;
  will-change: transform, visibility, opacity;
  max-width: calc(100% - 50px);
}
.wa__popup_chat_box:hover,
.wa__popup_chat_box:focus,
.wa__popup_chat_box:active {
  box-shadow: 0px 10px 10px 4px rgba(32, 32, 37, 0.23);
  -webkit-box-shadow: 0px 10px 10px 4px rgba(32, 32, 37, 0.23);
  -moz-box-shadow: 0px 10px 10px 4px rgba(32, 32, 37, 0.23);
}
.wa__popup_chat_box.wa__active {
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  visibility: visible;
  opacity: 1;
}
.wa__popup_chat_box .wa__popup_heading {
  position: relative;
  padding: 15px 43px 17px 74px;
  color: #d9ebc6;
  background: #2db742;
}
.wa__popup_chat_box .wa__popup_heading_sm {
  padding: 12px 15px 17px 74px;
}
.wa__popup_chat_box .wa__popup_heading::before {
  content: "";
  background: url(/3e9824eab1bab3904765.svg) center top no-repeat;
  background-size: 33px;
  display: block;
  width: 55px;
  height: 33px;
  position: absolute;
  top: 20px;
  left: 12px;
  right: auto;
}
.wa__popup_chat_box .wa__popup_heading_rtl:before {
  left: 12px;
  right: auto;
}
.wa__popup_chat_box .wa__popup_heading_ltr:before {
  right: 12px;
  left: auto;
}
.wa__popup_chat_box .wa__popup_heading_sm:before {
  top: 19px;
  left: 11px;
}

.wa__popup_chat_box .wa__popup_heading .wa__popup_title {
  padding-top: 2px;
  padding-bottom: 3;
  color: var(--mainColor6);
  font-size: 18px;
  line-height: 24px;
}

.wa__popup_chat_box .wa__popup_heading .wa__popup_intro {
  padding-top: 4px;
  font-size: 12px;
  line-height: 20px;
}
.wa__popup_chat_box .wa__popup_heading_sm .wa__popup_intro {
  padding-top: 0px;
}

.wa__popup_chat_box .wa__popup_heading .wa__popup_intro a {
  display: inline-block;
  color: var(--mainColor6);
  text-decoration: none;
}
.wa__popup_chat_box .wa__popup_heading .wa__popup_intro a:hover,
.wa__popup_chat_box .wa__popup_heading .wa__popup_intro a:focus,
.wa__popup_chat_box .wa__popup_heading .wa__popup_intro a:active {
  text-decoration: underline;
}

.wa__popup_chat_box .wa__popup_notice {
  font-size: 11px;
  color: #a5abb7;
  font-weight: 500;
  padding: 0 3px;
}
.wa__popup_chat_box .wa__popup_content {
  background: var(--mainColor6);
  padding: 13px 20px 21px 19px;
  text-align: center;
}
.wa__popup_chat_box .wa__popup_content_left {
  text-align: right;
}
.wa__popup_chat_box .wa__popup_avatar {
  position: absolute;
  overflow: hidden;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  left: 12px;
  top: 12px;
}

.wa__popup_chat_box .wa__popup_avatar.nta-default-avt {
  border-radius: unset;
  -webkit-border-radius: unset;
  -moz-border-radius: unset;
  border-radius: 8px;
  overflow: hidden;
  width: 48px;
  height: 48px;
}
.wa__popup_chat_box .wa__popup_avatar.nta-default-avt > * {
  width: 48px;
  height: 48px;
}

.wa__popup_chat_box .wa__stt {
  padding: 13px 24px 12px 36px;
  position: relative;
  text-decoration: none;
  display: table;
  width: 100%;
  border-left: 2px solid #2db742;
  background: #f5f7f9;
  border-radius: 2px 4px 2px 4px;
  -webkit-border-radius: 2px 4px 2px 4px;
  -moz-border-radius: 2px 4px 2px 4px;
}
.wa__popup_chat_box .wa__stt:after {
  content: "";
  background: url(/22b0076cd166d1b5df19.svg) 0 0 no-repeat;
  position: absolute;
  top: 26px;
  width: 20px;
  height: 20px;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
}
.wa__popup_chat_box .wa__stt.wa__stt_offline:after {
  background-image: url(/2bb2be2560a9c429f9c2.svg);
}
.wa__popup_chat_box .wa__stt.wa__stt_online {
  transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
  -moz-transition: 0.2s ease all;
}
.wa__popup_chat_box .wa__stt.wa__stt_online:hover,
.wa__popup_chat_box .wa__stt.wa__stt_online:active,
.wa__popup_chat_box .wa__stt.wa__stt_online:focus {
  background: var(--mainColor6);
  box-shadow: 0px 7px 15px 1px rgba(55, 62, 70, 0.07);
  -webkit-box-shadow: 0px 7px 15px 1px rgba(55, 62, 70, 0.07);
  -moz-box-shadow: 0px 7px 15px 1px rgba(55, 62, 70, 0.07);
}
.wa__popup_content_list .wa__popup_content_item {
  margin: 14px 0 0;
  transform: translate(0, 20px);
  -webkit-transform: translate(0, 20px);
  -moz-transform: translate(0, 20px);
  will-change: opacity, transform;
  opacity: 0;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item {
  transition: 0.4s ease all;
  -webkit-transition: 0.4s ease all;
  -moz-transition: 0.4s ease all;
  transition-delay: 2.1s;
  -webkit-transition-delay: 2.1s;
  -moz-transition-delay: 2.1s;
  display: flex;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item:nth-child(1) {
  transition-delay: 0.3s;
  -webkit-transition-delay: 0.3s;
  -moz-transition-delay: 0.3s;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item:nth-child(2) {
  transition-delay: 0.5s;
  -webkit-transition-delay: 0.5s;
  -moz-transition-delay: 0.5s;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item:nth-child(3) {
  transition-delay: 0.7s;
  -webkit-transition-delay: 0.7s;
  -moz-transition-delay: 0.7s;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item:nth-child(4) {
  transition-delay: 0.9s;
  -webkit-transition-delay: 0.9s;
  -moz-transition-delay: 0.9s;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item:nth-child(5) {
  transition-delay: 1.1s;
  -webkit-transition-delay: 1.1s;
  -moz-transition-delay: 1.1s;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item:nth-child(6) {
  transition-delay: 1.3s;
  -webkit-transition-delay: 1.3s;
  -moz-transition-delay: 1.3s;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item:nth-child(7) {
  transition-delay: 1.5s;
  -webkit-transition-delay: 1.5s;
  -moz-transition-delay: 1.5s;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item:nth-child(8) {
  transition-delay: 1.7s;
  -webkit-transition-delay: 1.7s;
  -moz-transition-delay: 1.7s;
}
.wa__popup_chat_box.wa__pending
  .wa__popup_content_list
  .wa__popup_content_item:nth-child(9) {
  transition-delay: 1.9s;
  -webkit-transition-delay: 1.9s;
  -moz-transition-delay: 1.9s;
}
.wa__popup_chat_box.wa__lauch .wa__popup_content_list .wa__popup_content_item {
  opacity: 1;
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
}
.wa__popup_content_list .wa__popup_content_item .wa__member_name {
  font-size: 14px;
  color: #363c47;
  line-height: 1.188em !important;
}
.wa__popup_content_list .wa__popup_content_item .wa__member_duty {
  font-size: 11px;
  color: #989b9f;
  padding: 2px 0 0;
  line-height: 1.125em !important;
}
.wa__popup_content_list .wa__popup_content_item .wa__member_status {
  color: #f5a623;
  font-size: 10px;
  padding: 5px 0 0;
  line-height: 1.125em !important;
}
.wa__popup_content_list .wa__popup_content_item .wa__popup_txt {
  display: table-cell;
  vertical-align: middle;
  min-height: 48px;
  height: 48px;
}
.wa__popup_content_list .wa__popup_content_item .wa__stt_offline {
  border-left-color: #c0c5ca;
}
.wa__popup_avt_list {
  font-size: 0;
  margin: 7px 0 24px;
}
.wa__popup_avt_list .wa__popup_avt_item {
  display: inline-block;
  position: relative;
  width: 46px;
}
.wa__popup_avt_list .wa__popup_avt_img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  position: relative;
  overflow: hidden;
  border: 2px solid #ffffff;
  left: -7px;
}
.wa__popup_call_btn {
  background: #2db742;
  color: var(--mainColor6);
  text-decoration: none;
  display: inline-block;
  width: 275px;
  max-width: 100%;
  font-size: 16px;
  padding: 14px 10px;
  border-radius: 24px;
  -webkit-border-radius: 24px;
  -moz-border-radius: 24px;
  margin: 25px 0 15px;
  box-shadow: 0px 8px 17px 2px rgba(13, 15, 18, 0.2);
  -webkit-box-shadow: 0px 8px 17px 2px rgba(13, 15, 18, 0.2);
  -moz-box-shadow: 0px 8px 17px 2px rgba(13, 15, 18, 0.2);
}
.wa__popup_call_btn.wa__popup_call_btn_lg:before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  position: relative;
  background: url(/d4784e4435c7d2f6c1e2.svg) 0 0 no-repeat;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  vertical-align: top;
  top: 0px;
  margin-right: -19px;
  left: -31px;
  transition: 0.2s ease background-image;
  -webkit-transition: 0.2s ease background-image;
  -moz-transition: 0.2s ease background-image;
}
.wa__popup_call_btn.wa__popup_call_btn_lg:hover:before,
.wa__popup_call_btn.wa__popup_call_btn_lg:focus:before,
.wa__popup_call_btn.wa__popup_call_btn_lg:active:before {
  background-image: url(/3e9824eab1bab3904765.svg);
}

.wa__popup_chat_box_gray {
  border-radius: 2px 2px 8px 8px;
}

.wa__popup_chat_box_gray .wa__popup_heading_gray {
  background: #f8f8f8;
  border-top: 3px solid #2db742;
  color: #868c9a;
  font-weight: 500;
}
.wa__popup_chat_box_gray .wa__popup_heading_gray .wa__popup_title {
  color: #595b60;
}
.wa__popup_chat_box_gray .wa__popup_heading_gray:before {
  content: "";
  background: url(/22b0076cd166d1b5df19.svg) center top no-repeat;
  background-size: 33px;
  display: block;
  width: 55px;
  height: 33px;
  position: absolute;
  top: 20px;
  left: 12px;
}
.wa__popup_chat_box_gray .wa__popup_heading_gray .wa__popup_intro a {
  color: #595b60;
}

.wa__popup_chat_box_ct {
  width: 384px;
  text-align: center;
}

.wa__popup_chat_box_ct .wa__popup_heading_ct {
  text-align: center;
  padding: 18px 0 18px;
}

.wa__popup_chat_box_ct .wa__popup_heading_ct:before {
  content: "";
  background: url(/3e9824eab1bab3904765.svg) center top no-repeat;
  background-size: 30px;
  display: block;
  width: 30px;
  height: 31px;
  position: absolute;
  top: 15px;
  left: 72px;
}

.wa__popup_chat_box_ct .wa__popup_heading_ct .wa__popup_title {
  padding-left: 22px;
  padding-bottom: 14px;
}

.wa__popup_chat_box_ct .wa__popup_heading_ct .wa__popup_intro {
  margin-top: -5px;
  line-height: 12px;
}

.wa__popup_chat_box_ct .wa__popup_ct_avt_list:after {
  content: "";
  clear: both;
  display: block;
}

.wa__popup_chat_box_ct .wa__popup_ct_content {
  background: var(--mainColor6);
  padding: 0 0 14px;
}

.wa__popup_chat_box_ct .wa__popup_ct_content .wa__popup_notice {
  padding-top: 18px;
  padding-bottom: 15px;
}

.wa__popup_chat_box_ct .wa__popup_ct_content_item {
  width: 33%;
  float: left;
  font-size: 10px;
}

.wa__popup_chat_box_ct .wa__popup_ct_content_item a {
  text-decoration: none;
  color: #989b9f;
}

.wa__popup_chat_box_ct .wa__popup_ct_content_item .wa__popup_ct_txt {
  padding-top: 8px;
}

.wa__popup_chat_box_ct .wa__popup_ct_content_item .wa__member_name {
  color: #363c47;
  font-size: 13px;
}

.wa__popup_chat_box_ct .wa__popup_ct_content_item .wa__member_duty {
  color: #989b9f;
  padding: 3px 0 0;
}

.wa__popup_chat_box_ct .wa__popup_ct_content_item .wa__member_stt_online {
  color: #2db742;
  font-size: 9px;
  line-height: 12px;
  display: inline-block;
  padding: 3px 0 0 16px;
  background: url(/22b0076cd166d1b5df19.svg) 0 3px no-repeat;
  background-size: 12px auto;
  -webkit-background-size: 12px auto;
  -moz-background-size: 12px auto;
}

.wa__popup_chat_box_ct .wa__popup_ct_content_item .wa__member_stt_offline {
  color: #f5a623;
  font-size: 9px;
  line-height: 12px;
  padding: 2px 0 0;
}

.wa__popup_chat_box_ct .wa__popup_ct_avatar img {
  border-radius: 50%;
}

.wa__popup_chat_box_ct .wa__popup_ct_call_btn {
  width: 97px;
  font-size: 11px;
  padding: 9px 10px 11px;
  margin: 15px 0 15px;
}

/* ^^^--popup--^^^ */

/* VVV--popup button--VVV */
.wa__btn_popup {
  position: fixed;
  right: 30px;
  bottom: 30px;
  cursor: pointer;
  z-index: 10000;
}
.wa__btn_popup .wa__btn_popup_icon {
  width: 56px;
  height: 56px;
  background: #2db742;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  box-shadow: 0px 6px 8px 2px rgba(0, 0, 0, 0.14);
  -webkit-box-shadow: 0px 6px 8px 2px rgba(0, 0, 0, 0.14);
  -moz-box-shadow: 0px 6px 8px 2px rgba(0, 0, 0, 0.14);
}
.wa__btn_popup .wa__btn_popup_icon:before {
  content: "";
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: transparent url(/3e9824eab1bab3904765.svg) center center no-repeat;
  background-size: 30px auto;
  -webkit-background-size: 30px auto;
  -moz-background-size: 30px auto;
  transition: 0.4s ease all;
  -webkit-transition: 0.4s ease all;
  -moz-transition: 0.4s ease all;
}
.wa__btn_popup .wa__btn_popup_icon:after {
  content: "";
  opacity: 0;
  position: absolute;
  z-index: 2;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: transparent url(/5bf0a4f22d8f33ff3209.svg) center center no-repeat;
  background-size: 14px auto;
  -webkit-background-size: 14px auto;
  -moz-background-size: 14px auto;
  transition: 0.4s ease all;
  -webkit-transition: 0.4s ease all;
  -moz-transition: 0.4s ease all;
  -ms-transform: scale(0) rotate(-360deg);
  transform: scale(0) rotate(-360deg);
  -webkit-transform: scale(0) rotate(-360deg);
  -moz-transform: scale(0) rotate(-360deg);
}
.wa__btn_popup.wa__active .wa__btn_popup_icon:before {
  opacity: 0;
  -ms-transform: scale(0) rotate(360deg);
  transform: scale(0) rotate(360deg);
  -webkit-transform: scale(0) rotate(360deg);
  -moz-transform: scale(0) rotate(360deg);
}
.wa__btn_popup.wa__active .wa__btn_popup_icon:after {
  opacity: 1;
  -ms-transform: scale(1) rotate(0deg);
  transform: scale(1) rotate(0deg);
  -webkit-transform: scale(1) rotate(0deg);
  -moz-transform: scale(1) rotate(0deg);
}
.wa__btn_popup .wa__btn_popup_txt {
  position: absolute;
  width: 179px;
  right: 100%;
  background-color: #f5f7f9;
  font-size: 12px;
  color: #43474e;
  top: 15px;
  /* top: 50%;
    transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
    -webkit-transform: translate(0,-50%); */
  padding: 7px 0 7px 12px;
  margin-right: 7px;
  letter-spacing: -0.03em;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  transition: 0.4s ease all;
  -webkit-transition: 0.4s ease all;
  -moz-transition: 0.4s ease all;
}
.wa__btn_popup.wa__active .wa__btn_popup_txt {
  -ms-transform: translate(0, 15px);
  transform: translate(0, 15px);
  -webkit-transform: translate(0, 15px);
  -moz-transform: translate(0, 15px);
  opacity: 0;
  visibility: hidden;
}

@media only screen and (max-width: 768px) {
  .wa__btn_popup_txt {
    display: none;
  }
  .wa__btn_popup {
    bottom: 20px;
    transform: scale(0.7, 0.7);
  }
  .wa__popup_chat_box {
    bottom: 80px;
  }
  .wa__popup_chat_box {
    transform: scale(0.7, 0.7);
  }
  .wa__btn_popup .wa__btn_popup_txt {
    font-size: 1rem;
  }
  .wa__popup_content_list .wa__popup_content_item .wa__member_duty {
    font-size: 0.9rem;
  }
  .wa__popup_content_list .wa__popup_content_item .wa__member_status {
    font-size: 0.8rem;
  }
}

.expire-component {
  font-size: 15px;
  color: var(--mainColor5);
  font-weight: bold;
  padding: 0 8px;
}

.expire-title {
  padding: 24px 0 4px 0;
}

.expire-desc {
  padding: 4px 0;
}

.expire-number {
  padding: 12px 0;
}

.footer-mobile-nav {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  background: var(--themLinkTextColor);
  color: var(--mainColor6);
  position: fixed;
  z-index: 10000;
  bottom: 0;
  left: 0;
  right: 0;
  justify-content: space-around;
  align-items: center;
  padding-right: 90px;
}
.footer-mobile-nav li {
  width: 90%;
  cursor: pointer;
  padding: 5px;
  border-left: 1px solid #008781;
}
.footer-mobile-nav li:last-of-type {
  border-left: none;
}
.footer-mobile-nav li span {
  display: block;
  text-align: center;
  color: #ccc;
  font-size: 10px;
}
.footer-mobile-nav li span .brandmi-icon {
  color: var(--mainColor6);
  font-size: 20px;
}

.help-and-support {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 300px;
  height: 200px;
  z-index: 10000;
}
.help-and-support-user {
  position: relative;
  transform: rotate(0deg) translateX(-150px);
  animation: 0.5s linear 1s show-user 1 both;
}
.help-and-support-user-base {
  position: absolute;
  top: 0;
  left: 0;
  width: 150px;
  height: 300px;
  background-size: 150px auto !important;
}
.help-and-support-user-leaps {
  position: absolute;
  top: 0;
  left: 0;
  width: 150px;
  height: 300px;
  background-size: 150px auto !important;
}
.help-and-support-box {
  background-color: var(--mainColor6);
  border-radius: 1rem;
  padding: 1rem;
  box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.5);
  border: 5px solid #999;
  overflow: hidden;
  margin-right: 400px;
  animation: 0.5s linear 2s show-box 1 both;
}
.help-and-support-box-massage {
  white-space: pre;
  height: 100px;
}
.help-and-support-box-btn {
  padding-right: 400px;
  width: 750px;
  animation: 0.5s linear 6s show-btn 1 both;
}
.help-and-support-box-btn button {
  cursor: pointer;
}
@keyframes show-user {
  0% {
    transform: rotate(0deg) translateX(-150px);
  }
  90% {
    transform: rotate(45deg) translateX(-10px);
  }
  100% {
    transform: rotate(45deg) translateX(0);
  }
}

@keyframes show-box {
  0% {
    margin-right: 400px;
  }
  90% {
    margin-right: -10px;
  }
  100% {
    margin-right: 0;
  }
}

@keyframes show-btn {
  0% {
    padding-right: 400px;
  }
  90% {
    padding-right: 0;
  }
  100% {
    padding-right: 10px;
  }
}

.btn {
  padding: 0 12px;
}
.btn-primary {
  background-color: var(--themBtnBgPrimary);
  background-image: linear-gradient(
    270deg,
    rgba(100, 181, 239, 0) 48.44%,
    var(--mainColor7) 75.52%,
    rgba(100, 181, 239, 0) 100%
  );
  color: var(--themBtnTextPrimary);
  cursor: pointer;
  background-repeat: no-repeat;
  animation: bg-move linear 5s infinite;
}
.btn-warning {
  background: #ffeebf;
  color: var(--themBtnBgPrimary);
  cursor: pointer;
}

.btn-primary:hover {
  background: var(--mainColor2);
}

.btn-primary:disabled {
  background: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
  cursor: not-allowed;
}

.btn-xs-size {
  min-width: 88px;
  height: 28px;
  font-size: 10px;
  border-radius: 6px;
}

.btn-sm-size {
  min-width: 108px;
  height: 38px;
  font-size: 12px;
  border-radius: 7px;
}

.btn-md-size {
  min-width: 108px;
  height: 48px;
  font-size: 14px;
  border-radius: 8px;
}

.btn-lg-size {
  min-width: 148px;
  height: 58px;
  font-size: 16px;
  border-radius: 9px;
}

.btn-xl-size {
  min-width: 168px;
  height: 68px;
  font-size: 18px;
  border-radius: 10px;
}

.btn-cancel {
  border: 1px solid var(--themBtnBgPrimary);
  background: var(--mainColor6);
  color: var(--themBtnBgPrimary);
  cursor: pointer;
}

.btn-cancel:hover {
  border: 1px solid var(--color11);
  color: var(--color11);
  background-color: var(--mainColor6);
}

.btn-cancel:disabled {
  border: 1px solid var(--themDisableBgColor);
  color: var(--themIconDisableTextColor);
  cursor: not-allowed;
}
@keyframes bg-move {
  0% {
    background-position: -500px 0;
  }
  100% {
    background-position: 1000px 0;
  }
}

.card {
  position: relative;
  border-radius: 8px;
  background-color: var(--mainColor6);
  box-shadow: 0px 2px 20px rgba(180, 188, 188, 0.2);
  margin: 12px;
  display: flex;
  flex-direction: column;
  min-height: 70px;
  transition: 0.3s;
}
.link-card:hover .card {
  transition: 0.3s;
  box-shadow: 0px 2px 10px rgba(180, 188, 188, 0.6);
}
.card-header {
  display: flex;
  margin-bottom: 10px;
}
.card-space {
  flex: 1;
}
.card-icon {
  position: absolute;
  right: 8px;
  top: 16px;
  width: 20px;
  height: 20px;
  z-index: 1;
  overflow: hidden;
}
.card-extra {
  position: relative;
  margin-left: 8px;
  margin-top: 8px;
  display: flex;
}
.card-title {
  padding: 16px 28px;
  background-color: transparent;
  border-radius: 8px 8px 0 0;
  font-size: 13px;
  color: #a5acc6;
  font-weight: 700;
  cursor: pointer;
}
.card-footer {
  padding: 8px;
  background-color: transparent;
  border-radius: 0 0 8px 8px;
}
.card-content {
  padding: 12px 16px;
  flex: auto;
  align-items: center;
  height: 100%;
  white-space: break-spaces;
}
.card-extra-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.card-extra-list > li {
  margin: 0 2px 0 0;
  padding: 4px;
  text-align: center;
  border-radius: 4px;
  color: var(--themIconBgColor);
  justify-content: center;
  align-items: center;
  display: inline-flex;
  cursor: pointer;
}

.card-extra-mobile-more:hover + .card-extra-list,
.card-extra-mobile-more + .card-extra-list:hover,
.card-extra-list > li > ul {
  display: none;
  padding: 0;
  position: absolute;
  margin-top: 30px;
  margin-right: -260px;
  border: 1px solid #ccc;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  list-style: none;
  border-radius: 4px;
  background: var(--mainColor6);
  transform: translate(-50%, 50%);
  z-index: 3;
  width: 160px;
  overflow: hidden;
}
.card-extra-list > li > ul li {
  padding: 2px 5px;
  display: inline-flex;
  display: -webkit-box;
  font-size: 10px;
  min-width: 75px;
}
.card-extra-list > li > ul li span {
  padding: 3px;
  float: right;
}
.card-extra-list > li:hover > ul {
  display: grid;
}
.card-extra-list > li svg * {
  stroke: var(--themIconTextColor);
}
.card-extra-list li:hover {
  background-color: var(--themIconHoverBgColor);
  color: var(--themIconHoverTextColor);
}
.card-extra-list li:hover svg * {
  stroke: var(--themIconHoverTextColor);
}
.card-extra-list li.active {
  background-color: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
}
.card-extra-list li.active svg * {
  stroke: var(--themIconActiveTextColor);
}
.card-extra-list > li.disable {
  background-color: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
  cursor: not-allowed;
}
.card-extra-list li.disable svg * {
  stroke: var(--themIconDisableTextColor);
}

.card-extra-list > li {
  cursor: pointer;
  outline: none;
  background-color: transparent;
  color: var(--mainColor5);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
}
.card-extra-list > li .brandmi-icon {
}

.card-extra-list > li.extra-item-disabled,
.card-extra-list > li.extra-item-disabled:hover {
  background-color: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
  cursor: not-allowed;
}
.card-extra-mobile-more,
.extra-item-mobile {
  display: none !important;
}
.extra-item-desktop {
  display: inline-block;
}

.card-fullScreen {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: var(--mainColor6);
  z-index: 100000;
  margin: 0;
  overflow: auto;
  border-radius: 0;
}
.card-fullScreen #personal-dashboard {
  background: var(--mainColor6);
  border: 5px solid #fff;
  margin: auto;
  /*max-width: 1400px;*/
}
.card-fullScreen
  .card
  :not(.custom-text-wrapper *):not(.brandmi-icon):not(.brandmi-icon *) {
  font-size: 1rem;
}

.card-fullScreen .card,
.card-fullScreen .personal-user-info-brand-wrapper,
.card-fullScreen .card-tabs-list ul {
  background: transparent;
  box-shadow: none;
}
.card-normal .card {
  background: var(--mainColor6);
  box-shadow: 0 2px 20px rgba(180, 188, 188, 0.7);
  margin: 4px;
}
.card-fullScreen .card .card-extra,
.card-fullScreen > .card-header > .card-title,
.card-fullScreen .count-down-card-wrapper,
.card-fullScreen .personal-dashboard:hover .count-down-card-wrapper,
.card-fullScreen .tab-item {
  display: none;
}
.card-fullScreen > .card-header {
  position: sticky;
  top: 0;
  z-index: 100000000;
  background: var(--mainColor6);
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.3);
}
.card-fullScreen .tab-item.tab-item-active,
.card-fullScreen .card-title {
  display: inline-flex;
  background: transparent;
  border-right: 0;
  border-left: 0;
  color: #000;
  border-bottom: none;
  padding: 4px 8px;
}
.card-fullScreen .card-content {
  position: relative;
  padding: 2px 4px;
}

.card-fullScreen .col-24 {
  overflow: inherit !important;
  max-height: inherit !important;
}
.card-fullScreen .post-list-sort-wrapper,
.card-fullScreen .pagination,
.card-fullScreen .checkbox-wrapper {
  display: none;
}

.card-fullScreen .personal-dashboard > .card {
  /*border-width: 2px;*/
  /*border-style: solid;*/
  border-radius: 0.5rem;
  /*border-image: linear-gradient(#ccc, transparent) 1 1 0 1;*/
  padding: 0;
  margin: 0.5em;
  position: relative;
  background: #fbfbfb;
  border: 1px solid #dedede;
}
.card-fullScreen .personal-dashboard > .card .card-header {
  padding: 0.5em;
  background: #dedede;
}
.card-fullScreen .context-un−active .card-extra,
.card-fullScreen .context-active .card-extra {
  display: none !important;
}
.context-active .context-un−active .card-extra {
  display: none !important;
}
.card-fullScreen .form-select,
.card-fullScreen .statistics-more {
  display: none !important;
}
.card-fullScreen .word-cloud-list {
  display: block !important;
}

@media only screen and (max-width: 640px) {
  .card {
    max-width: 100%;
    margin: 4px;
    overflow: initial !important;
    max-height: initial !important;
    height: initial !important;
  }
  .card-header {
    margin-bottom: 5px;
  }
  .limit-chart {
    display: none;
  }
  .card-content {
    /* overflow-x: scroll; */
    padding: 4px;
    overflow: initial !important;
    max-height: initial !important;
    height: initial !important;
  }
  .card-footer {
    padding: 4px;
  }
  .card-title {
    padding: 8px 8px;
  }
  .card-extra-list > li {
    width: 16px;
    height: 16px;
  }
  .card-extra-list > li .brandmi-icon-size-md {
    font-size: 12px !important;
  }
}

.hidden-all {
  filter: blur(4px) grayscale(0.9);
}
.shadow-all {
  /*position: relative;*/
}
.shadow-all.card {
  filter: blur(0px) drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.3));
}

.card-analyzer {
  background-color: #333;
  color: var(--mainColor6);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10;
  padding: 15px;
  border-radius: 8px 8px 0 0;
}
.card.context-active .card-extra {
  position: fixed;
  z-index: 100;
  background: var(--mainColor6);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  display: block;
}
.card.context-unactive .card-extra {
  display: none;
}
.card.context-active .card-extra .card-extra-list .extra-item {
  display: block;
  width: 200px;
  text-align: right;
  position: relative;
}
.mobile-more-icon {
  display: none;
}
.card.context-active .card-extra .card-extra-list .extra-item ul {
  top: -25px;
  right: auto;
  transform: none;
  left: -125px;
}
.card.context-active .card-extra .card-extra-list .extra-item ul {
  top: -25px;
  right: auto;
  transform: none;
  left: -125px;
}
.card.context-active
  .card-extra
  .card-extra-list
  .extra-item
  .mobile-more-icon {
  display: inline-block;
  float: left;
  width: 20px;
  height: 20px;
  margin-top: -20px;
  color: var(--themLinkTextColor);
  font-family: sans-serif !important;
}
.card.context-active
  .card-extra
  .card-extra-list
  .extra-item
  .extra-item-desktop {
  display: none;
}
.card.context-active
  .card-extra
  .card-extra-list
  .extra-item
  .extra-item-mobile {
  display: flex !important;
}

@media only screen and (max-width: 990px) {
  .card-analyzer {
    display: none;
  }
  .hidden-all,
  .shadow-all.card {
    filter: none;
  }
  .card-extra-mobile-more,
  .extra-item-mobile {
    display: inline-flex !important;
  }
  .card-extra-mobile-more + .card-extra-list {
    display: none;
  }
  .card-extra-mobile-more:hover + .card-extra-list,
  .card-extra-mobile-more + .card-extra-list:hover,
  .card-extra-list > li > ul {
    transform: translate(0%, 0);
    display: inline-block !important;
    margin-right: -120px;
    width: 140px;
  }
  .card-extra-list > li > ul {
    position: relative !important;
    display: grid !important;
    margin: 0 !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
  }
  .card-extra-list > li > ul li:hover {
    background-color: rgba(0, 0, 0, 0.1);
  }
  .card-extra-mobile-more:hover + .card-extra-list li,
  .card-extra-mobile-more + .card-extra-list:hover li {
    width: 100%;
    display: inline-table !important;
    direction: rtl;
    text-align: inherit;
  }
  .card-extra-mobile-more + .card-extra-list:hover > li ul {
    position: relative;
    width: 100%;
    box-shadow: none;
    border: none;
    padding-right: 10px;
    background: transparent;
  }
  .extra-item-mobile span:last-child {
    display: none;
  }
  .extra-item-desktop {
    display: none;
  }
  .card-extra-mobile-more:hover + .card-extra-list li span,
  .card-extra-mobile-more + .card-extra-list:hover > li span {
    margin: 2px;
  }
  .card-extra-mobile-more:hover + .card-extra-list li.extra-item-disabled,
  .card-extra-mobile-more + .card-extra-list:hover > li.extra-item-disabled {
    display: none;
  }
  .card-extra-mobile-more:hover + .card-extra-list li,
  .card-extra-mobile-more + .card-extra-list:hover > li {
    padding: 2px 5px;
    display: inline-flex;
    display: -webkit-box;
    font-size: 10px;
    min-width: 75px;
  }
}
.extra-item-mobile span {
  margin: 2px;
}
@media only screen and (max-width: 768px) {
  .extra-item-mobile span:last-child {
    display: inline-flex;
  }
}

.form-wrapper {
  position: relative;
  width: 100%;
  padding-top: 12px;
  /* margin: 4px 0 0 0; */
  /* background-color: var(--mainColor6); */
  overflow: hidden;
}

.form-field {
  background: transparent;
  transition: border-color 0.2s;
  height: 44px;
  padding-right: 16px;
  width: calc(100% - 8px);
  margin: 0 4px;
}

.form-field:placeholder-shown ~ .form-label {
  cursor: text;
  top: 34px;
  display: inline-block;
  white-space: pre;
  word-break: break-word;
}

.form-label {
  user-select: none;
  line-height: 0;
  height: 3px;
  padding: 0 8px;
  margin: 0 4px;
  background-color: transparent;
}
.form-label,
.form-field:focus ~ .form-label {
  position: absolute;
  top: 11px;
  right: 16px;
  display: block;
  transition: 0.2s;
  font-size: 12px;
  color: #cbd1dc;
  background-color: var(--mainColor6);
}

.form-field:focus ~ .form-label {
  color: var(--mainColor2);
}

.form-field::placeholder {
  color: var(--mainColor6);
  opacity: 1;
  transition: 0.3s;
}
.form-field::-ms-input-placeholder {
  color: var(--mainColor6);
  transition: 0.3s;
}
.form-field::-ms-input-placeholder {
  color: var(--mainColor6);
  transition: 0.3s;
}
.form-field:focus::placeholder {
  color: #ccc;
  opacity: 1;
  transition: 0.3s;
}
.form-field:focus::-ms-input-placeholder {
  color: #ccc;
  transition: 0.3s;
}
.form-field:focus::-ms-input-placeholder {
  color: #ccc;
  transition: 0.3s;
}

.input-inner-icon {
  position: absolute;
  top: 20px;
  left: 20px;
  display: flex;
}

.input-icon-wrapper {
  /* display: flex; */
  align-items: center;
  /* justify-content: center; */
  width: 20px;
  height: 20px;
  margin: 2px 4px;
}
input:-internal-autofill-selected,
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
input:active:not([type="range"]) {
  background-color: transparent !important;
  -webkit-box-shadow: 0 0 0 30px var(--mainColor6) inset !important;
}
input[type="range"] {
  padding: 0;
}
.hint-message {
  direction: ltr;
  text-align: right;
}
.field-required {
  display: inline-block;
  margin: 0 5px;
}
.textArea-field:focus ~ .textArea-label .field-required,
.input-field:focus ~ .input-label .field-required,
.form-field:focus ~ .form-label .field-required {
  color: red !important;
}
input.input-field:disabled {
  background: #f2f2f2 !important;
  border: 1px solid #ccc;
  color: #aaa;
  -webkit-box-shadow: none !important;
}

input.form-field:disabled::placeholder {
  color: #aaa;
  opacity: 1;
  transition: 0.3s;
}

.form-field:disabled ~ .form-label {
  background-color: #f2f2f2;
}
.input-field.input-phone,
.input-field.input-phone {
}

@media only screen and (max-width: 640px) {
  .form-field:placeholder-shown ~ .form-label {
    font-size: 10px;
    padding: 0 2px;
    margin: 0 1px;
    top: 27px;
  }
  .form-field:focus ~ .form-label {
    top: 11px;
  }

  .form-field {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
  }

  .input-icon-wrapper {
    margin: 1px -12px;
  }

  .form-wrapper {
    height: 52px;
  }

  .input-inner-icon {
    top: 14px;
    left: 8px;
    min-width: 20px;
    margin: 2px;
  }
}

.card-tabs > .card-header > .card-title {
  padding: 0;
}
.card-tabs-list ul {
  padding: 0;
  margin: 0;
  list-style: none;
  border-radius: 8px 8px 0 0;
  overflow: hidden;
  display: flex;
  background-color: var(--mainColor6);
  flex-wrap: wrap;
}
.tab-item {
  padding: 12px 16px;
  border-left: 2px solid #f6f8fb;
  cursor: pointer;
  color: #a5acc6;
  white-space: nowrap;
  border-bottom: 2px solid #f6f8fb;
  display: flex;
  justify-content: center;
  align-items: center;
}
.tab-item svg * {
  stroke: #a5acc6;
}
.tab-item:hover {
  border-left: 2px solid var(--mainColor4);
  background-color: var(--mainColor4);
  opacity: 0.7;
}
.tab-item-last {
  display: inline-block;
  border-left: none;
  cursor: default;
  width: 100%;
  border-bottom: 2px solid #f6f8fb;
}
.tab-item-active,
.tab-item-active:hover {
  background-color: var(--mainColor4);
  color: var(--mainColor5);
  cursor: pointer;
  border-left: 2px solid var(--mainColor4);
  border-bottom: 2px solid var(--mainColor5);
}
.tab-item-active svg *,
.tab-item-active:hover svg * {
  stroke: var(--mainColor5);
}
.tab-item-disable,
.tab-item-disable:hover {
  background-color: var(--mainColor6);
  color: #d6dce4;
  border-left: 2px solid #f6f8fb;
  cursor: not-allowed;
}
.tab-item-disable svg *,
.tab-item-disable:hover svg * {
  stroke: #d6dce4;
}
.tab-item-icon {
  margin: 0 0 0 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media only screen and (max-width: 640px) {
  .tab-item {
    padding: 8px 4px;
  }
  .tab-item-active {
    max-width: 200px;
  }

  .tab-item-title {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}

.panel-main {
  border-radius: 10px;
  border: 1px solid var(--themSideBgColor);
  background: #f6f6f6;
  margin: 1rem;
}
.panel-header {
  min-height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--mainColor4);
  background: linear-gradient(0deg, var(--themSideBgColor), var(--mainColor5));
  border-radius: 10px;
}
.panel-dashboard {
  display: flex;
  justify-content: start;
  align-items: start;
}
.panel-tools {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  /*padding: 2rem;*/
}
.panel-tools a {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  font-size: 16px;
  min-width: 200px;
  height: 200px;
}
.panel-tools a .brandmi-icon {
  font-size: 60px;
}

.avatar {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 16px;
  min-height: 16px;
  max-width: 140px;
  max-height: 140px;
  color: #000;
  border-radius: 50%;
  background-size: cover !important;
  background-repeat: no-repeat;
  background-position: center center;
  transition: 0.3s;
}
.avatar:hover {
  border-radius: 10px;
  transition: 0.3s;
}
.avatar-xxs {
  width: 16px;
  height: 16px;
  font-size: 7px;
}
.avatar-xs {
  width: 24px;
  height: 24px;
  font-size: 10px;
}
.avatar-sm {
  width: 34px;
  height: 34px;
  font-size: 14px;
}
.avatar-md {
  width: 40px;
  height: 40px;
  font-size: 18px;
}
.avatar-lg {
  width: 50px;
  height: 50px;
  font-size: 22px;
}
.avatar-xl {
  width: 60px;
  height: 60px;
  font-size: 28px;
}
.avatar-xxl {
  width: 80px;
  height: 80px;
  font-size: 32px;
}

.avatar-xxxl {
  width: 100px;
  height: 100px;
  font-size: 34px;
}

@media only screen and (max-width: 680px) {
  .avatar-md {
    width: 34px;
    height: 34px;
    font-size: 14px;
  }
}

.form-chip {
  background-color: var(--mainColor4);
  border: 1px solid var(--mainColor4);
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  padding: 0;
  margin: 0;
  margin: 1px;
  height: 24px;
}
.form-chip-txt {
  padding: 2px 8px;
  flex: auto;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--mainColor5);
  overflow: hidden;
}
.form-chip-disable {
  background-color: #eee;
  border: 1px solid #ddd;
  cursor: default;
}
.form-chip-disable .form-chip-txt {
  color: #999;
}
.form-chip-active:hover {
  border: 1px solid var(--mainColor5);
}
.form-chip-close {
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.form-chip-close svg circle {
  fill: #f8ffff;
}
.form-chip-close svg path {
  stroke: var(--mainColor5);
}

.form-select {
  position: relative;
  border: 1px solid var(--themInputBorderPrimary);
  width: calc(100% - 40px);
  display: inline-flex;
  z-index: 1;
  align-items: center;
  padding-left: 40px;
  padding-right: 4px;
  flex-wrap: wrap;
}
.form-select-sm {
  min-height: 28px;
  min-width: 80px;
  margin: 8px 2px;
  font-size: 12px !important;
  border-radius: 6px !important;
}
.form-select-md {
  min-height: 38px;
  min-width: 100px;
  margin: 16px 4px;
}
.select-disabled {
  position: absolute;
  z-index: 3;
  background: linear-gradient(0deg, #ffffffdd 0%, #ffffff66 90%, transparent);
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  border-radius: 6px;
  cursor: not-allowed;
}
.select-label {
  margin: -10px 10px -10px auto;
  background-color: var(--mainColor6);
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 8px;
  color: var(--mainColor5);
  white-space: nowrap;
  position: absolute;
  top: 7px;
  line-height: 5px;
}
.form-select-restul {
  height: 40px;
  padding: 0 8px;
  line-height: 40px;
  color: var(--mainColor8);
}
.form-select-list {
  position: absolute;
  border: 1px solid #e4ecfa;
  background-color: var(--mainColor6);
  top: calc(100% + 2px);
  max-height: 160px;
  overflow: auto;
  z-index: 3;
  width: calc(100% - 8px);
  box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.1);
}
.form-select-list ul {
  list-style: none;
  padding: 2px;
  margin: 0;
}
.form-select-list ul li {
  border-radius: 2px;
  padding: 6px 8px;
  color: var(--mainColor8);
  cursor: pointer;
  display: flex;
  align-items: center;
  margin: 4px 1px;
  transition: 0.3s;
}
.form-select-list ul li:nth-child(2n) {
  background-color: var(--mainColor6);
  color: var(--mainColor5);
}
.form-select-list ul li:hover {
  background-color: rgba(0, 0, 0, 0.051);
  padding-right: 10px;
  transition: 0.3s;
}
.form-select-list ul li input,
.form-select-list ul li input:active {
  position: absolute;
  left: 8px;
}
.form-select-input {
  padding: 2px;
  background-color: transparent;
  max-width: 100%;
  overflow: hidden;
  white-space: pre-line;
  text-overflow: ellipsis;
  word-break: break-word;
}

.form-select-sm .form-select-input,
.form-select-sm .form-select-arrow-true,
.form-select-sm .form-select-arrow-false {
  height: 26px !important;
  font-size: 12px !important;
}
.form-select-md .form-select-input,
.form-select-md .form-select-arrow-true,
.form-select-md .form-select-arrow-false {
  height: 36px;
  font-size: 13px !important;
}
.form-select,
.form-select-input,
.form-select-list {
  border-radius: 8px;
  /* margin: 0; */
  color: var(--mainColor5);
  width: calc(100% - 8px);
}
.form-select-arrow-false svg *,
.form-select-arrow-true svg * {
  stroke: var(--mainColor5);
}
.form-select-arrow-true,
.form-select-arrow-false {
  transition: 0.3s;
  width: 34px;
  height: 34px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 2px;
  top: 2px;
  cursor: pointer;
  z-index: 2;
  border-radius: 50%;
}
.form-select-arrow-true {
  transform: rotate(180deg);
}
input.form-select-input:-internal-autofill-selected,
input.form-select-input:-webkit-autofill,
input.form-select-input:-webkit-autofill:hover,
input.form-select-input:-webkit-autofill:focus,
input.form-select-input:-webkit-autofill:active,
input.form-select-input:active {
  background-color: transparent !important;
  -webkit-box-shadow: 0 0 0 30px transparent inset !important;
}
.field-required {
  display: inline-block;
  margin: 0 5px;
}
.form-select .field-required {
  color: red;
}

@media only screen and (max-width: 600px) {
  .form-select {
    font-size: 11px;
    margin: 3px 0;
    border-radius: 6px;
  }
  .form-select-input,
  .form-select-list {
    font-size: 11px;
    margin: -5px 0;
    border-radius: 6px;
  }
  .form-select {
    min-height: 26px;
    padding-left: 6px;
    padding-right: 6px;
  }
  .form-select-arrow-true,
  .form-select-arrow-false {
    top: -3px;
  }
}
.form-select-list ul li.item-select {
  padding-right: 16px;
}
.form-select-list ul li.item-space {
  cursor: default;
  background: transparent;
  padding: 0 8px;
}
.form-select-list ul li.item-space > div {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
}
.form-select-list ul li.item-space > div > span {
  display: inline-block;
  width: fit-content;
  margin: 0 0 0 4px;
  white-space: pre;
  font-weight: bold;
}
.form-select-list ul li.item-space > div > hr {
  border: none;
  width: 100%;
  border-bottom: 1px dashed var(--mainColor5);
}
.form-select-list ul li.item-selected {
  background: var(--mainColor4);
  color: var(--mainColor5);
  border-radius: 5px;
}

.fieldset-field {
  border: 1px solid var(--mainColor5);
  border-radius: 5px;
  padding: 20px;
}
.fieldset-field legend {
  color: var(--mainColor5);
}

.pop-over-component {
  width: 240px;
  position: absolute;
  border-radius: 8px;
  background-color: var(--mainColor6);
  box-shadow: 0px 2px 20px rgba(180, 188, 188, 0.2);
  display: flex;
  flex-direction: column;
  min-height: 100px;
  overflow: hidden;
  left: 0;
}
.pop-over-data {
  position: relative;
}

.pop-over-title {
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pop-over-content-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 0 24px 0;
}

.pop-over-content {
  width: 224px;
}

.pop-over-footer {
  padding: 4px;
  font-size: 13px;
  color: #a5acc6;
}

.pop-over-show-shadow-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1050;
}

.bulletin-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  overflow: auto;
  background-color: #f6f8fb;
  border-radius: 8px;
  font-size: 12px;
  color: var(--mainColor5);
  padding: 10px;
}

.bulletin-details {
  display: flex;
  align-items: center;
  margin: 3px 0;
}

.bulletin-item {
  display: flex;
}

.bulletin-item-space {
  flex: 1;
}

.bulletin-text {
  text-align: center;
  align-items: center;
  padding: 0 12px;
}

.bulletin-button-wrapper {
  padding: 2px;
  display: flex;
  flex-direction: row;
}

.bulletin-button {
  margin: 3px;
}

.bulletin-details-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 0 12px 0;
  cursor: pointer;
}

.bulletin-details-text {
  font-size: 15px;
  color: var(--mainColor5);
  text-align: center;
  padding: 0 0 4px 0;
}

.bulletin-select {
  padding: 16px 0 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.user-info-component-wrapper {
  padding: 0 4px;
  display: flex;
  width: 100%;
  align-items: center;
  flex-direction: column;
  user-select: none;
}

.user-info-avatar-wrapper {
  justify-content: center;
  flex-direction: column;
  display: flex;
  align-items: center;
  padding: 0 24px;
}

.user-info-avatar {
  width: 96px;
  height: 96px;
  background-color: var(--mainColor4);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
}
.user-info-avatar:hover,
.user-info-avatar:hover .avatar {
  border-radius: 10px;
  transition: 0.3s;
}

.user-info-avatar-image {
  width: 92px;
  height: 92px;
  background-color: rgb(223, 223, 223);
  border-radius: 50%;
}

.user-info-title-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 24px 12px 12px 12px;
  position: relative;
}

.user-info-name {
  color: var(--mainColor8);
  font-size: 14px;
  padding: 0 0 8px 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  max-width: 240px;
  text-align: center;
}

.user-info-brand-icon-wrapper {
  background-color: var(--mainColor5) !important;
  text-align: center;
  align-items: center;
  border-radius: 10px;
  width: 34px;
  height: 34px;
  color: var(--mainColor6);
  box-shadow: 0px 0px 2px 1.5px #0acfda;
  cursor: pointer;
  /* animation: user-info-brand-icon-wrapper 1s ease infinite; */
}

/* @keyframes user-info-brand-icon-wrapper {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(0.9, 0.9);
  }
} */

.user-info-account {
  color: #b0b6cd;
  font-size: 14px;
  direction: ltr;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  max-width: 240px;
  font-family: Verdana, Geneva, Tahoma, sans-serif !important;
}

.user-info-brand-wrapper {
  width: 100%;
  height: 44px;
  background-color: #f6f8fb;
  border-radius: 10px;
  margin: 24px;
}

.user-info-brand {
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
}

.user-info-brand-image-wrapper {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 0px 32px 0 0;
}

.user-info-brand-name {
  color: var(--mainColor8);
  font-size: 14px;
  justify-content: center;
  text-align: center;
  width: 70%;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-info-credit-wrapper {
  /* border: 1px solid #00aab25c; */
  border-radius: 8px;
  width: 100%;
  height: 44px;
  margin: 0 0 36px 0;
}

.user-info-credit {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  padding: 0 24px;
}

.user-info-credit-text {
  color: #997070;
  font-size: 14px;
}

.user-info-credit-number {
  color: var(--mainColor8);
  font-size: 18px;
}

.package-form-button-pannel {
  position: relative;
  display: inline-block;
  float: left;
  color: var(--mainColor6);
  padding: 12px;
}

.package-form-my-brand {
  display: flex;
  height: 100%;
  width: 100%;
}

.package-form-my-brand-title {
  display: flex;
  min-width: 104px;
  font-size: 13px;
  color: var(--mainColor5);
  align-items: center;
  margin: 8px 16px 8px 4px;
}

.package-form-details-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.package-form-details {
  border: 1px solid #f6f8fb;
  border-radius: 8px;
  min-height: 320px;
  width: 90%;
  margin: 16px 24px;
  text-align: center;
  font-size: 12px;
  position: relative;
}

.package-form-item-wrapper {
  display: flex;
  justify-content: space-between;
  margin: 8px 28px;
}

.package-form-item-title {
  width: 80px;
  text-align: start;
  color: var(--mainColor5);
}

.package-form-item-price {
  font-size: 13px;
  font-weight: 700;
  text-align: start;
  color: #a5acc6;
  margin: 0 2px;
}
.package-form-item-price > span {
  position: relative;
  display: inline-block;
}

.package-price-ir {
  color: #a5acc6;
  font-size: 12px;
}

.package-form-drawer {
  border: 1px solid #f6f8fb;
  margin: 0 24px;
}

.package-wrapper {
  background: #fafafa;
  padding: 15px 0;
  margin-top: 30px;
}

.package-form-sum-month-wrapper {
  margin: 10px 2px 10px 2px;
}

.package-form-sum-item-wrapper {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 100%;
  /* margin: 0 30px; */
  flex-wrap: wrap;
}

.package-form-sum-title {
  font-size: 15px;
  text-align: start;
  width: 108px;
  color: var(--mainColor5);
}

.package-form-sum-price {
  font-size: 15px;
  font-weight: bold;
  /* color: #a5acc6; */
  width: 150px;
  background-color: var(--mainColor4);
  color: var(--mainColor5);
  border-radius: 5px;
  height: 32px;
  align-items: center;
  justify-content: center;
  display: flex;
}

.package-form-sum-year-wrapper {
  margin: 2px;
}

.package-form-year-discount {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: var(--mainColor4);
  width: 116px;
  height: 20px;
  border-radius: 0 20px 0 0;
  color: var(--mainColor5);
}

.package-form-sum-price {
  position: relative;
}
.package-form-item-price .percent {
  position: relative;
  margin: 0 10px 0 0;
  display: inline-block;
  width: 90px;
  text-align: left;
}
.package-form-item-price .percent,
.package-form-item-price .percent * {
  color: #ccc !important;
}
.package-form-sum-price.percent {
  background-color: #f2f2f2;
  color: #aaa;
}
.package-form-sum-price.finally {
  background-color: transparent;
  width: fit-content;
  padding: 0 10px;
  /* color: red; */
}
.package-form-item-price .percent::after,
.package-form-sum-price.percent::after {
  content: "";
  position: absolute;
  width: 70%;
  height: 1px;
  background-color: #333;
  -webkit-transform: translate(50%, -50%) rotate(-10deg);
  -moz-transform: translate(50%, -50%) rotate(-10deg);
  -ms-transform: translate(50%, -50%) rotate(-10deg);
  -o-transform: translate(50%, -50%) rotate(-10deg);
  transform: translate(50%, -50%) rotate(-10deg);
  right: 50%;
  top: 50%;
}

.date-range-list {
  display: inline-flex;
  list-style: none;
  padding: 0;
  margin: 8px 5px;
  border: 1px solid #ccc;
  border-radius: 3px;
  background: #f2f2f2;
  direction: rtl;
  text-align: right;
}
.date-range-list > li {
  display: inline;
  margin: 0;
  padding: 2px 5px;
  text-align: center;
  min-width: 50px;
  cursor: pointer;
  border-right: 1px solid #ccc;
}
.date-range-selected {
  background: var(--themLinkTextColor);
  color: var(--mainColor6);
}

.ColorInput {
  position: relative;
  height: 40px;
}
.ColorInput-color-list {
  display: flex;
  position: absolute;
  top: 34px;
  left: 0;
  right: 0;
  max-height: 100px;
  overflow: auto;
  flex-wrap: wrap;
  z-index: 1;
  background-color: var(--mainColor6);
  border: 1px solid var(--mainColor5);
  border-radius: 0 0 15px 15px;
  padding: 5px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}
.ColorInput-color-list > div {
  width: 35px;
  height: 35px;
  margin: 1px;
  display: inline-block;
  cursor: pointer;
  border-radius: 3px;
  transition: all 0.3s linear;
  border-width: 2px;
  border-style: solid;
}
.ColorInput-color-list > div:hover {
  transform: scale(0.8);
  transition: all 0.3s linear;
}
.ColorInput-color-select {
  position: relative;
  overflow: hidden;
}
.ColorInput-color-select:before {
  content: "✔️";
  position: absolute;
  left: 3px;
  top: 2px;
  z-index: 2;
  color: var(--mainColor6);
  font-size: 6px;
}
.ColorInput-color-select:after {
  content: "";
  position: absolute;
  left: -15px;
  top: -15px;
  width: 30px;
  height: 30px;
  background: var(--mainColor6);
  transform: rotate(45deg);
  z-index: 1;
}
.ColorInput-color-value {
  width: 20px;
  height: 20px;
  display: inline-block;
  box-shadow: 0 0 3px 2px #fff;
  position: absolute;
  top: 8px;
  border-radius: 3px;
}

@media only screen and (max-width: 600px) {
  .ColorInput {
    height: 26px;
  }
  .ColorInput-color-list {
    top: 26px;
  }
  .ColorInput-color-list > div {
    width: 30px;
    height: 30px;
  }

  .ColorInput-color-value {
    width: 20px;
    height: 12px;
  }
}

.mart-info {
  display: flex;
  justify-content: center;
  align-items: center;
}
.mart-info > div {
  height: 46px;
  margin: 10px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
  user-select: none;
  flex-flow: column;
  color: var(--mainColor5);
  background: var(--mainColor7);
  border: 1px solid var(--mainColor2);
}
.mart-info > div > div {
  font-weight: bold;
}

.section {
  padding: 20px 0;
  text-align: center;
  width: min(1024px, 90%);
  margin: 0 auto;
  line-height: 1.8rem;
}
.section-title {
  text-align: center;
  font-size: 16px;
  margin: 50px auto 20px auto;
  color: #333333;
  position: relative;
}
.section-title span {
  background: var(--mainColor6);
  display: inline-block;
  padding: 10px 30px;
  color: var(--mainColor2);
  position: inherit;
  font-weight: bold;
}

.section-title::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 5%;
  right: 5%;
  height: 1px;
  background: #eee;
}

.step-register {
  position: absolute;
  top: 8px;
  width: 36px;
  height: 36px;
  background-color: var(--mainColor5);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 44px;
  color: var(--mainColor6);
  font-size: 13px;
  font-weight: bold;
}

.register-wrapper {
  margin: 0 0 28px 0;
}

.back-button-wrapper {
  display: flex;
  position: absolute;
  top: -282px;
  left: -6px;
}

.back-button-text {
  margin: 6px 4px;
  color: var(--mainColor5);
  font-size: 13px;
}

.back-button-icon {
  margin: 2px 0;
  color: var(--mainColor5);
}

.register-phone-title {
  float: right;
  margin: 4px 2px 16px 16px;
  color: var(--mainColor5);
  font-size: 13px;
}

.input-register-details {
  text-align: center;
  letter-spacing: 20px;
  direction: ltr;
}

.verify-code-button {
  display: flex;
  padding: 0 8px;
  font-size: 14px;
  color: #a0a4a8;
  justify-content: center;
}

.next-register-button {
  display: flex;
  flex-direction: column;
  padding: 0 12px 8px 12px;
}

.send-again-code {
  margin: 24px 0;
}

.timer-component {
}

.timer-again-btn {
  cursor: pointer;
  padding: 0 4px;
  color: var(--mainColor5);
  text-decoration: underline;
}

.timer-wrapper {
  font-size: 14px;
  color: #a0a4a8;
}

.minute {
  color: var(--mainColor5);
}

.second {
  margin: 0 8px 0 0;
  color: var(--mainColor5);
}

.btn-toggle {
}

.discount-code-component {
  margin: 24px 0 0 0;
  padding: 16px 16px 28px 16px;
  border: 1px solid #eee;
  width: 80%;
  height: auto;
  border-radius: 8px;
  position: relative;
}

.discount-code-wrapper {
  position: absolute;
  top: -10px;
  right: 16px;
  z-index: 12;
  background-color: var(--mainColor6);
  padding: 0 8px;
  color: var(--mainColor5);
}

.discount-code-btn {
  width: 180px;
  height: 44px;
  margin: 12px 8px 0 0;
}

.pay-btn {
  width: 140px;
  height: 44px;
  margin: 12px 0 0 0;
}

.discount-code-btn-wrapper {
  display: flex;
  justify-content: flex-end;
  float: left;
}

.domain-list{
    text-align: center;
}
.domain-list-larg{
    --space: 5px;
    --textR: 10px; 
    --radius: 15px;
}
.domain-list-small{
    --space: 1px;
    --radius: 3px;
    --textR: 2px; 
}


.app-item {
    margin: var(--space);
    padding: var(--space);
    border: var(--space) solid #999;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: #333;
    border-radius: var(--radius);
    transition: 0.5s;
    filter: grayscale(0.75) opacity(0.75);    
    box-shadow: 0 0px 3px rgba(0,0,0,0.7);

}
.app-item a{
    border-radius: var(--radius);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.app-item:hover{
    border: var(--space) solid #fff;
    box-shadow: 0 var(--textR) var(--textR) rgba(0,0,0,0.7);
    filter: grayscale(0) opacity(1) blur(0);
    transform: scale(1.1) rotate(3deg) translateY(calc(var(--textR) * -2));
    transition: 0.3s;
}
.app-item a span{
    display: block;
    color: #000;
    background-color: #fff;
    padding: var(--space);
    position: absolute;
    bottom: 0;
    right: 0;
    border-radius: var(--textR) 0;
    transition: 0.3s;
}

.app-item:hover a span{
    background: #000;
    color: #fff;
    transition: 0.3s;
}
.domain-list-small > .app-item,
.domain-list-small > .app-item > a,
.domain-list-small > .app-item > a > span{
    width: fit-content !important;
    display: inline-block !important;
    overflow: hidden;
}
.domain-list-small > .app-item > a > span{
    white-space: pre;
    position: relative;
    height: 100%;
    vertical-align: middle;
    text-align: center;
    padding: var(--space) calc(var(--space) * 5);
    margin-right: 100%;
}
.domain-list-small > .app-item:hover > a > span{
    margin-right: 0
}
.app-list{
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items:center;
    align-content: center;
}
.app-list-header{
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 2;
    background: rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(8px);
}
.app-list-header h1{
    color: var(--mainColor1);
    margin: 0;
    padding: 10px;
}

.app-list-header a{
    margin: 5px;
    padding: 5px;
    color: var(--mainColor1);
    border:1px solid var(--mainColor1);
    border-radius: 5px;
    float: left;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 20px;
    height: 20px;
}
.no-app-list-item{
    background: #fff;
    border-radius: 10px;
    color:#000;
    padding:20px;
    font-size: 18px;
}
.reaction-component {
  width: 100%;
  margin-right: 40px;
}

.reaction-component-grid {
  width: 100%;
  margin-right: 0px;
}

.reaction-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.reaction-icon {
  margin: 0 8px;
  display: flex;
  align-items: center;
  color: #a0a4a8;
}

.reaction-icon:hover {
  color: var(--mainColor5);
}

.text-reaction {
  margin: 0 8px;
  color: #a0a4a8;
  font-size: 12px;
}

.text-reaction:hover {
  color: var(--mainColor5);
}

@media only screen and (max-width: 992px) {
  .reaction-component {
    margin-right: 0px;
  }

  .reaction-icon {
    margin: 4px 5px;
    display: flex;
    align-items: center;
    color: #a0a4a8;
  }
}

.pop-over-details-component {
  width: 328px;
  position: absolute;
  border-radius: 8px;
  background-color: var(--mainColor6);
  box-shadow: 0px 2px 20px rgba(180, 188, 188, 0.2);
  flex-direction: column;
  min-height: 100px;
  background-color: #cfcfce;
  padding: 0px 10px;
  border-radius: 16px;
  right: 40px;
  top: 55px;
}

.pop-over-details-component::before {
  content: "";
  background-color: #cfcfce;
  width: 14px;
  height: 14px;
  transform: rotate(57deg) skew(23deg);
  position: absolute;
  z-index: 100;
  top: -4px;
  right: 30px;
  border-radius: 2px;
}

.pop-over-details-data {
  position: relative;
  max-height: 300px;
  overflow-y: auto;
  padding: 0px;
  margin: 5px;
}

.pop-over-details-title {
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pop-over-details-content-wrapper {
  align-items: center;
  justify-content: center;
  padding: 8px 0;
  z-index: 101;
  position: relative;
}

.pop-over-details-content {
  width: 290px;
  padding: 5px;
}

.pop-over-details-footer {
  padding: 4px;
  font-size: 13px;
  color: #a5acc6;
}

.pop-over-details-show-shadow-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1050;
}

@media only screen and (max-width: 680px) {
  .pop-over-details-component {
    width: 100%;
    right: 0;
  }
  .pop-over-details-component::before {
    right: 36%;
  }
  .pop-over-details-content {
    width: 100%;
  }
}

.pop-over-reaction-title {
  background-color: var(--mainColor6);
  border-radius: 6px;
  margin: 6px 0;
  height: 36px;
  color: var(--mainColor5);
  font-weight: 700;
  display: flex;
  align-items: center;
  padding: 0 12px;
  justify-content: space-between;
  width: calc(100% - 5px);
  max-width: 300px;
}
.pop-over-reaction-title div {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 50%;
  transition: 0.3s;
}
.pop-over-reaction-title div:last-of-type {
  direction: ltr;
  margin-left: 2px;
}
.pop-over-reaction-title span {
  font-size: 15px;
  font-family: Verdana, Geneva, Tahoma, sans-serif !important;
  cursor: pointer;
  transition: 0.3s;
  overflow: hidden;
  width: 0;
  text-align: center;
  color: #ff0000;
}
.pop-over-reaction-title:hover span {
  display: inline-block;
  width: 20px;
}

@media only screen and (max-width: 680px) {
  .pop-over-reaction-title {
    width: 100%;
    font-weight: 100;
    font-size: 11px;
  }
}

:root {
  --toastify-color-light: #fff;
  --toastify-color-dark: #121212;
  --toastify-color-info: #3498db;
  --toastify-color-success: #07bc0c;
  --toastify-color-warning: #f1c40f;
  --toastify-color-error: #e74c3c;
  --toastify-color-transparent: rgba(255, 255, 255, 0.7);
  --toastify-icon-color-info: var(--toastify-color-info);
  --toastify-icon-color-success: var(--toastify-color-success);
  --toastify-icon-color-warning: var(--toastify-color-warning);
  --toastify-icon-color-error: var(--toastify-color-error);
  --toastify-toast-width: 320px;
  --toastify-toast-background: #fff;
  --toastify-toast-min-height: 64px;
  --toastify-toast-max-height: 800px;
  --toastify-font-family: sans-serif;
  --toastify-z-index: 9999;
  --toastify-text-color-light: #757575;
  --toastify-text-color-dark: #fff;
  --toastify-text-color-info: #fff;
  --toastify-text-color-success: #fff;
  --toastify-text-color-warning: #fff;
  --toastify-text-color-error: #fff;
  --toastify-spinner-color: #616161;
  --toastify-spinner-color-empty-area: #e0e0e0;
  --toastify-color-progress-light: linear-gradient(
    to right,
    #4cd964,
    #5ac8fa,
    #007aff,
    #34aadc,
    #5856d6,
    #ff2d55
  );
  --toastify-color-progress-dark: #bb86fc;
  --toastify-color-progress-info: var(--toastify-color-info);
  --toastify-color-progress-success: var(--toastify-color-success);
  --toastify-color-progress-warning: var(--toastify-color-warning);
  --toastify-color-progress-error: var(--toastify-color-error);
}

.Toastify__toast-container {
  z-index: var(--toastify-z-index);
  -webkit-transform: translate3d(0, 0, var(--toastify-z-index));
  position: fixed;
  padding: 4px;
  width: var(--toastify-toast-width);
  box-sizing: border-box;
  color: #fff;
}
.Toastify__toast-container--top-left {
  top: 1em;
  left: 1em;
}
.Toastify__toast-container--top-center {
  top: 1em;
  left: 50%;
  transform: translateX(-50%);
}
.Toastify__toast-container--top-right {
  top: 1em;
  right: 1em;
}
.Toastify__toast-container--bottom-left {
  bottom: 1em;
  left: 1em;
}
.Toastify__toast-container--bottom-center {
  bottom: 1em;
  left: 50%;
  transform: translateX(-50%);
}
.Toastify__toast-container--bottom-right {
  bottom: 1em;
  right: 1em;
}

@media only screen and (max-width : 480px) {
  .Toastify__toast-container {
    width: 100vw;
    padding: 0;
    left: 0;
    margin: 0;
  }
  .Toastify__toast-container--top-left, .Toastify__toast-container--top-center, .Toastify__toast-container--top-right {
    top: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--bottom-left, .Toastify__toast-container--bottom-center, .Toastify__toast-container--bottom-right {
    bottom: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--rtl {
    right: 0;
    left: initial;
  }
}
.Toastify__toast {
  position: relative;
  min-height: var(--toastify-toast-min-height);
  box-sizing: border-box;
  margin-bottom: 1rem;
  padding: 8px;
  border-radius: 4px;
  box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 15px 0 rgba(0, 0, 0, 0.05);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between;
  max-height: var(--toastify-toast-max-height);
  overflow: hidden;
  font-family: var(--toastify-font-family);
  cursor: default;
  direction: ltr;
  /* webkit only issue #791 */
  z-index: 0;
}
.Toastify__toast--rtl {
  direction: rtl;
}
.Toastify__toast--close-on-click {
  cursor: pointer;
}
.Toastify__toast-body {
  margin: auto 0;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  padding: 6px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
}
.Toastify__toast-body > div:last-child {
  word-break: break-word;
  -ms-flex: 1;
      flex: 1;
}
.Toastify__toast-icon {
  -webkit-margin-end: 10px;
          margin-inline-end: 10px;
  width: 20px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: -ms-flexbox;
  display: flex;
}

.Toastify--animate {
  animation-fill-mode: both;
  animation-duration: 0.7s;
}

.Toastify--animate-icon {
  animation-fill-mode: both;
  animation-duration: 0.3s;
}

@media only screen and (max-width : 480px) {
  .Toastify__toast {
    margin-bottom: 0;
    border-radius: 0;
  }
}
.Toastify__toast-theme--dark {
  background: var(--toastify-color-dark);
  color: var(--toastify-text-color-dark);
}
.Toastify__toast-theme--light {
  background: var(--toastify-color-light);
  color: var(--toastify-text-color-light);
}
.Toastify__toast-theme--colored.Toastify__toast--default {
  background: var(--toastify-color-light);
  color: var(--toastify-text-color-light);
}
.Toastify__toast-theme--colored.Toastify__toast--info {
  color: var(--toastify-text-color-info);
  background: var(--toastify-color-info);
}
.Toastify__toast-theme--colored.Toastify__toast--success {
  color: var(--toastify-text-color-success);
  background: var(--toastify-color-success);
}
.Toastify__toast-theme--colored.Toastify__toast--warning {
  color: var(--toastify-text-color-warning);
  background: var(--toastify-color-warning);
}
.Toastify__toast-theme--colored.Toastify__toast--error {
  color: var(--toastify-text-color-error);
  background: var(--toastify-color-error);
}

.Toastify__progress-bar-theme--light {
  background: var(--toastify-color-progress-light);
}
.Toastify__progress-bar-theme--dark {
  background: var(--toastify-color-progress-dark);
}
.Toastify__progress-bar--info {
  background: var(--toastify-color-progress-info);
}
.Toastify__progress-bar--success {
  background: var(--toastify-color-progress-success);
}
.Toastify__progress-bar--warning {
  background: var(--toastify-color-progress-warning);
}
.Toastify__progress-bar--error {
  background: var(--toastify-color-progress-error);
}
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--success, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--error {
  background: var(--toastify-color-transparent);
}

.Toastify__close-button {
  color: #fff;
  background: transparent;
  outline: none;
  border: none;
  padding: 0;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.3s ease;
  -ms-flex-item-align: start;
      align-self: flex-start;
}
.Toastify__close-button--light {
  color: #000;
  opacity: 0.3;
}
.Toastify__close-button > svg {
  fill: currentColor;
  height: 16px;
  width: 14px;
}
.Toastify__close-button:hover, .Toastify__close-button:focus {
  opacity: 1;
}

@keyframes Toastify__trackProgress {
  0% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(0);
  }
}
.Toastify__progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  z-index: var(--toastify-z-index);
  opacity: 0.7;
  transform-origin: left;
}
.Toastify__progress-bar--animated {
  animation: Toastify__trackProgress linear 1 forwards;
}
.Toastify__progress-bar--controlled {
  transition: transform 0.2s;
}
.Toastify__progress-bar--rtl {
  right: 0;
  left: initial;
  transform-origin: right;
}

.Toastify__spinner {
  width: 20px;
  height: 20px;
  box-sizing: border-box;
  border: 2px solid;
  border-radius: 100%;
  border-color: var(--toastify-spinner-color-empty-area);
  border-right-color: var(--toastify-spinner-color);
  animation: Toastify__spin 0.65s linear infinite;
}

@keyframes Toastify__bounceInRight {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    transform: translate3d(10px, 0, 0);
  }
  90% {
    transform: translate3d(-5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInLeft {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
  75% {
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    transform: translate3d(5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInUp {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__bounceOutUp {
  20% {
    transform: translate3d(0, -10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}
@keyframes Toastify__bounceInDown {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }
  75% {
    transform: translate3d(0, -10px, 0);
  }
  90% {
    transform: translate3d(0, 5px, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutDown {
  20% {
    transform: translate3d(0, 10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}
.Toastify__bounce-enter--top-left, .Toastify__bounce-enter--bottom-left {
  animation-name: Toastify__bounceInLeft;
}
.Toastify__bounce-enter--top-right, .Toastify__bounce-enter--bottom-right {
  animation-name: Toastify__bounceInRight;
}
.Toastify__bounce-enter--top-center {
  animation-name: Toastify__bounceInDown;
}
.Toastify__bounce-enter--bottom-center {
  animation-name: Toastify__bounceInUp;
}

.Toastify__bounce-exit--top-left, .Toastify__bounce-exit--bottom-left {
  animation-name: Toastify__bounceOutLeft;
}
.Toastify__bounce-exit--top-right, .Toastify__bounce-exit--bottom-right {
  animation-name: Toastify__bounceOutRight;
}
.Toastify__bounce-exit--top-center {
  animation-name: Toastify__bounceOutUp;
}
.Toastify__bounce-exit--bottom-center {
  animation-name: Toastify__bounceOutDown;
}

@keyframes Toastify__zoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
@keyframes Toastify__zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
.Toastify__zoom-enter {
  animation-name: Toastify__zoomIn;
}

.Toastify__zoom-exit {
  animation-name: Toastify__zoomOut;
}

@keyframes Toastify__flipIn {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}
@keyframes Toastify__flipOut {
  from {
    transform: perspective(400px);
  }
  30% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
.Toastify__flip-enter {
  animation-name: Toastify__flipIn;
}

.Toastify__flip-exit {
  animation-name: Toastify__flipOut;
}

@keyframes Toastify__slideInRight {
  from {
    transform: translate3d(110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInLeft {
  from {
    transform: translate3d(-110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInUp {
  from {
    transform: translate3d(0, 110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInDown {
  from {
    transform: translate3d(0, -110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideOutRight {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(110%, 0, 0);
  }
}
@keyframes Toastify__slideOutLeft {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(-110%, 0, 0);
  }
}
@keyframes Toastify__slideOutDown {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, 500px, 0);
  }
}
@keyframes Toastify__slideOutUp {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, -500px, 0);
  }
}
.Toastify__slide-enter--top-left, .Toastify__slide-enter--bottom-left {
  animation-name: Toastify__slideInLeft;
}
.Toastify__slide-enter--top-right, .Toastify__slide-enter--bottom-right {
  animation-name: Toastify__slideInRight;
}
.Toastify__slide-enter--top-center {
  animation-name: Toastify__slideInDown;
}
.Toastify__slide-enter--bottom-center {
  animation-name: Toastify__slideInUp;
}

.Toastify__slide-exit--top-left, .Toastify__slide-exit--bottom-left {
  animation-name: Toastify__slideOutLeft;
}
.Toastify__slide-exit--top-right, .Toastify__slide-exit--bottom-right {
  animation-name: Toastify__slideOutRight;
}
.Toastify__slide-exit--top-center {
  animation-name: Toastify__slideOutUp;
}
.Toastify__slide-exit--bottom-center {
  animation-name: Toastify__slideOutDown;
}

@keyframes Toastify__spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.checkbox-component {
}

.checkboxs-wrapper {
  display: flex;
}

.checkbox-title {
  cursor: default;
  font-size: 12px;
  margin: 0 6px;
  user-select: none;
  color: var(--mainColor8);
}

.checkboxs-wrapper .brandmi-icon {
  color: var(--mainColor5);
}

.chart-parent {
  background-size: 45% auto;
  background-repeat: no-repeat;
  background-position: center 49.2%;
  padding: 0;
  margin: auto;
  height: 100% !important;
  width: 100% !important;
  transition: 0.3s;
}
.chart-parent:hover {
  background-size: 30% auto;
  transition: 0.3s;
}
/*.word-cloud-item .chart-parent {*/
/*  width: calc(100% - 120px) !important;*/
/*}*/
.monitoring-board .chart-parent > div {
  height: 100% !important;
  width: 100% !important;
}
.monitoring-board .highcharts-container {
  height: 100% !important;
  width: 100% !important;
}
.highcharts-label b {
  display: inline-block;
  direction: ltr;
  text-align: right;
  word-spacing: -3px;
}

.min-chart {
  overflow: hidden;
  width: 100%;
  text-align: center;
  display: inline-block;
  margin: 1px;
  padding: 1px;
}

.min-chart > span {
  display: inline-block;
  position: relative;
  border-radius: 50%;
  overflow: hidden;
}

.min-chart > span:before {
  position: absolute;
  left: -1px;
  right: -1px;
  top: -1px;
  bottom: 50%;
  content: "";
  background: var(--mainColor6);
  z-index: 2;
}

.personal-dashboard-component {
  display: flex;
  flex-direction: column;
}

.personal-dashboard-header {
  position: sticky;
  top: 46px;
  z-index: 10;
  background-color: rgb(248 255 255);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  border-radius: 4px;
  margin: 8px 12px 0px 12px;
}

.personal-dashboard-btn {
  float: left;
  margin: 16px;
}

.personal-wrapper {
  background: var(--mainColor6);
  padding: 20px 0;
}

.personal-wrapper-card {
  margin: 10px 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
}

.personal-wrapper-card-item {
  text-align: center;
}

.personal-add-card-wrapper {
  padding: 20px;
}

.personal-card-null {
  position: absolute;
  bottom: 32px;
  color: #ccd4df;
  font-size: 14px;
}

.personal-dashboard {
  position: relative;
}

.count-down-card-wrapper {
  display: none;
  text-align: center;
  position: absolute;
  top: 0px;
  right: 11px;
  z-index: 2;
  cursor: pointer;
  user-select: none;
}

.count-down-card {
  background-color: var(--mainColor5);
  width: 126px;
  height: 50px;
  border-radius: 0 10px 0 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: var(--mainColor6);
  font-weight: bold;
}

.personal-dashboard:hover .count-down-card-wrapper {
  display: block;
}

.personal-version {
  text-align: center;
  color: #ccc;
}

.personal-add-btn-wrapper {
  text-align: center;
  padding: 8px;
}

.personal-add-btn {
  width: 100%;
  height: 100%;
  min-height: 80px;
  background-color: rgb(252, 253, 253);
  cursor: pointer;
  justify-content: space-between;
  align-items: center;
  display: flex;
  color: var(--mainColor5);
  box-shadow: 0 1px 4px rgba(88, 88, 88, 0.2) inset;
}

.personal-add-btn:hover {
  box-shadow: 0 1px 4px rgba(201, 201, 201, 0.2) set;
}

.personal-add-btn-title {
  position: relative;
  font-size: 12px;
  text-align: right;
  margin: 4px;
  text-align: justify;
}
.personal-add-btn-title input {
  position: absolute;
  top: -30px;
  right: -20px;
  padding: 2px;
  text-align: center;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  background-color: var(--mainColor6);
  border: 1px solid var(--mainColor5);
}

.personal-btn-title-wrapper {
  display: flex;
  flex-direction: column;
}

.personal-btn-title {
  color: #a4bdbc;
}

.pesonal-upload-title {
  color: var(--mainColor5);
}

.personal-add-btn-plus {
  align-items: center;
  justify-content: center;
  display: flex;
  height: 100%;
  margin-top: 2px;
}

.personal-btn-wrapper {
  margin: 0 8px;
}

.personal-edit-btn {
  position: absolute;
  top: 56px;
  left: 26px;
  z-index: 4;
  background: var(--mainColor4);
  width: 50px;
  height: 45px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 6px;
}

@media only screen and (max-width: 1200px) {
  .personal-card-null {
    bottom: 24px;
    font-size: 12px;
  }
}

@media only screen and (max-width: 880px) {
  .personal-card-null {
    bottom: 6px;
    font-size: 10px;
  }
}

.all-subject-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.all-subject-list > div {
  display: inline-block;
  margin: 5px;
}
.all-subject-list > div > a {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 5px;
  width: 220px;
  height: 220px;
  overflow: hidden;
  transition: 0.3s;
}

.all-subject-list > div > a > div:first-of-type {
  border-radius: 50%;
  width: 150px;
  height: 150px;
  border: 8px solid var(--color9);
  color: var(--mainColor5);
  /*box-shadow: 0 0 5px rgba(0, 0, 0, 0.7);*/
}

.all-subject-list > div > a > div:last-of-type {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  /*width: 100%;*/
  text-align: center;
  background: var(--color9);
  color: var(--mainColor5);
  border-radius: 5px;
  padding: 5px 10px;
  display: inline-block;
  margin-top: -25px;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.7);
}
.all-subject-list > div > a * {
  animation-name: all-subject-list-item;
  animation-duration: 1s;
}

.all-subject-list > div > a:hover {
  transform: scale(1.2, 1.2);
  transition: 0.3s;
}

@keyframes all-subject-list-item {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}

.footer-date-reaction {
  /* display: flex;
  flex-direction: column; */
}

.footer-date-reaction-grid {
  display: flex;
  flex-direction: column;
}

@media only screen and (max-width: 640px) {
  .footer-date-reaction {
    display: flex;
    flex-direction: column;
  }
}

.publisher-component {
  width: 100%;
  height: 76px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
}

.publisher-wrapper {
  width: 100%;
  display: flex;
  flex-direction: row;
}
.publisher-img {
  width: 46px;
  height: 46px;
  position: relative;
  display: flex;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
}
.publisher-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  /* background: linear-gradient(180deg, #3a3357, #150f2c); */
  overflow: hidden;
}

.publisher-status {
  position: absolute;
  bottom: -10px;
  right: -8px;
  display: flex;
  background-color: rgba(250, 250, 250, 0.9);
  /* color: #000; */
  width: 30px;
  height: 30px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
}

.publisher-data {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 0 4px;
  width: 50%;
}
.publisher-data + div {
  width: 60px;
}

.publisher-first {
  color: var(--mainColor8);
  font-size: 14px;
  font-weight: bold;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 90%;
}

.publisher-secondary {
  color: #7b9192;
  font-size: 11px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 90%;
  direction: ltr;
  text-align: right;
  cursor: pointer;
}

.publisher-more {
  text-align: center;
  height: 40px;
  color: #a0a4a8;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.publisher-list-more {
  color: #a0a4a8;
  font-size: 14px;
  display: flex;
  justify-content: center;
  cursor: pointer;
}

.publisher-secondary span {
  direction: ltr;
}
.extra-link {
  direction: rtl;
  display: flex;
  float: right;
}
.extra-link .brandmi-icon {
  float: right;
}

@media only screen and (max-width: 480px) {
  .publisher-img {
    width: 40px;
    height: 40px;
    display: none;
  }
  .publisher-data {
    width: calc(100% - 30px);
  }
  .publisher-data + div {
    width: 30px;
  }
}

@media only screen and (max-width: 640px) {
  .publisher-component {
    height: 60px;
  }
  .publisher-first,
  .publisher-more {
    height: 20px;
    font-size: 1rem;
  }
  .publisher-secondary {
    font-size: 0.8rem;
  }
}

/* ZoomCharts SDK version 1.20.1-dev (3c04aa9ae447ad7e01807ee8e98eb746ebc023e2) */
.DVSL-font-height,
.DVSL-resize-triggers {
  visibility: hidden;
}
.DVSL-menu-narrow ul li a p {
  font-size: 0;
}
.DVSL-bar-left,
.DVSL-bar-right {
  position: absolute;
  list-style: none;
  padding: 0;
  margin: 0;
}
.DVSL-bar-left > li,
.DVSL-bar-right > li {
  position: relative;
  list-style: none !important;
  min-height: 32px;
  display: inline-block;
}
.DVSL-bar-left.DVSL-bar-vertical > li {
  clear: left;
}
.DVSL-bar-right.DVSL-bar-vertical > li {
  float: right;
  clear: right;
}
.DVSL-bar-left > li a,
.DVSL-bar-right > li a {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  height: 32px;
  line-height: 32px;
  text-decoration: none;
}
.DVSL-bar-left li a p,
.DVSL-bar-right li a p {
  background-image: url(/6182e9c3833cfe584196.png);
  background-repeat: no-repeat;
  padding: 0 0 0 18px;
  margin: 0;
  float: left;
  height: 37px;
  line-height: 37px;
  text-indent: 4px;
}
.DVSL-bar-bottom > li a span,
.DVSL-bar-top > li a span {
  padding: 0 12px 0 0;
  margin: 0;
  float: right;
  height: 37px;
}
.DVSL-bar-top > li a span {
  background: url(/6182e9c3833cfe584196.png) right 2px no-repeat;
}
.DVSL-bar-bottom > li a span {
  background: url(/6182e9c3833cfe584196.png) 3px 2px no-repeat;
}
.DVSL-bar-dropdown {
  z-index: 2;
  position: absolute;
  background: var(--mainColor6);
  display: none;
  text-align: left;
  border: 1px solid #ccc;
}
.DVSL-bar-top.DVSL-bar-horizontal .DVSL-bar-dropdown {
  top: 32px;
}
.DVSL-bar-bottom.DVSL-bar-horizontal .DVSL-bar-dropdown {
  bottom: 32px;
}
.DVSL-bar-right.DVSL-bar-horizontal .DVSL-bar-dropdown {
  right: 0;
}
.DVSL-bar-left.DVSL-bar-horizontal .DVSL-bar-dropdown {
  left: 0;
}
.DVSL-bar-left.DVSL-bar-vertical .DVSL-bar-dropdown {
  left: 100%;
}
.DVSL-bar-right.DVSL-bar-vertical .DVSL-bar-dropdown {
  right: 100%;
}
.DVSL-bar-top.DVSL-bar-vertical .DVSL-bar-dropdown {
  top: 0;
}
.DVSL-bar-bottom.DVSL-bar-vertical .DVSL-bar-dropdown {
  bottom: 0;
}
.DVSL-bar-dropdown:after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
.DVSL-bar-top.DVSL-bar-horizontal .DVSL-bar-dropdown:after {
  top: -7px;
  border-bottom: 7px solid #ddd;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
}
.DVSL-bar-bottom.DVSL-bar-horizontal .DVSL-bar-dropdown:after {
  bottom: -7px;
  border-top: 7px solid #ddd;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
}
.DVSL-bar-right.DVSL-bar-horizontal .DVSL-bar-dropdown:after {
  right: 4px;
}
.DVSL-bar-left.DVSL-bar-horizontal .DVSL-bar-dropdown:after {
  left: 6px;
}
.DVSL-bar-left.DVSL-bar-vertical .DVSL-bar-dropdown:after {
  left: -7px;
  border-right: 7px solid #ddd;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
}
.DVSL-bar-right.DVSL-bar-vertical .DVSL-bar-dropdown:after {
  right: -7px;
  border-left: 7px solid #ddd;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
}
.DVSL-bar-top.DVSL-bar-vertical .DVSL-bar-dropdown:after {
  top: 10px;
}
.DVSL-bar-bottom.DVSL-bar-vertical .DVSL-bar-dropdown:after {
  bottom: 5px;
}
.DVSL-bar-dropdown.DVSL-no-triangle:after {
  display: none;
}
.DVSL-bar-dropdown ul {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
  min-width: 120px;
}
.DVSL-bar-dropdown li a {
  float: none !important;
  display: block;
  border-bottom: none;
  border-top: none;
  padding: 4px 10px;
  color: #666;
  filter: none;
  background: #fff;
  white-space: nowrap;
  cursor: pointer;
  opacity: 1;
}
div .DVSL-bar-dropdown li a.DVSL-bar-dropdown-active {
  background: #ddd;
}
div .DVSL-bar-dropdown li a.DVSL-bar-dropdown-disabled {
  color: #aaa !important;
  cursor: default;
}
div .DVSL-bar-dropdown li a.DVSL-bar-dropdown-disabled:hover {
  color: #aaa;
  background: #fff;
}
div .DVSL-bar-dropdown li a:hover {
  color: var(--mainColor6);
  background: #09c;
}
.DVSL-bar-btn {
  white-space: nowrap;
  color: #333;
  float: left;
  padding: 0 7px;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.6;
}
.DVSL-bar-btn:hover {
  opacity: 1;
}
.DVSL-bar-disabled {
  cursor: default;
  opacity: 0.3;
}
.DVSL-bar-disabled:hover {
  opacity: 0.3;
}
a.DVSL-bar-btn-none p {
  padding: 0 !important;
  background-image: none !important;
  display: inline;
}
a.DVSL-bar-btn-image p {
  background-position: 0 center;
  min-width: 7px;
}
a.DVSL-bar-btn-back p {
  background-position: -4px -704px;
}
a.DVSL-bar-btn-zoomout p {
  background-position: -4px -665px;
}
a.DVSL-bar-btn-fullscreen p {
  background-position: -4px -994px;
}
a.DVSL-bar-btn-fullscreen-active p {
  background-position: -4px -1058px;
}
a.DVSL-bar-btn-lasso p {
  background-position: -4px -1578px;
}
a.DVSL-bar-btn-lasso-active p {
  background-position: -4px -1611px;
}
a.DVSL-bar-btn-lin p {
  background-position: -4px -66px;
}
a.DVSL-bar-btn-log p {
  background-position: -4px -141px;
}
a.DVSL-bar-btn-day p {
  background-position: -4px -217px;
}
a.DVSL-bar-btn-week p {
  background-position: -4px -292px;
}
a.DVSL-bar-btn-month p {
  background-position: -4px -368px;
}
a.DVSL-bar-btn-bars p {
  background-position: -4px -445px;
}
a.DVSL-bar-btn-children p {
  background-position: -4px -860px;
}
a.DVSL-bar-btn-collapse-children p {
  background-position: -4px -1515px;
}
a.DVSL-bar-btn-export p {
  background-position: -4px -928px;
}
a.DVSL-bar-btn-fit-active p {
  background-position: -4px -1123px;
}
a.DVSL-bar-btn-fit p {
  background-position: -4px -1427px;
}
a.DVSL-bar-btn-rearrange p {
  background-position: -2px -1351px;
}
a.DVSL-bar-btn-lock-all p {
  background-position: -2px -1272px;
}
a.DVSL-bar-btn-lock-all-active p {
  background-position: -2px -1194px;
}
.DVSL-suppress-default-styles {
  color: rgba(251, 64, 167, 0.2) !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -webkit-transition: none !important;
  transition: none !important;
}
.DVSL-container {
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.DVSL-interaction {
  outline: 0;
  -webkit-tap-highlight-color: transparent;
}
.DVSL-canvas {
  image-rendering: optimizeSpeed;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: -o-crisp-edges;
  image-rendering: pixelated;
}
.DVSL-menu-container {
  pointer-events: none;
}
.DVSL-menu-container.DVSL-menu-workaround {
  box-shadow: none;
}
.DVSL-menu-container > * {
  pointer-events: auto;
}
.DVSL-menu-container .DVSL-empty {
  pointer-events: none;
  font-size: 1px;
}
.DVSL-font-height {
  position: absolute !important;
  top: -999px !important;
  clear: both;
}
.DVSL-font-height div {
  padding: 0 !important;
  line-height: 1em !important;
}
.DVSL-container .DVSL-background-image {
  background: center center no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  position: absolute;
  overflow: hidden;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.DVSL-PC-background-image {
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  border-radius: 9999px;
  background-position: center center;
  position: absolute;
  overflow: hidden;
}
.DVSL-container.DVSL-gradient .DVSL-background-image,
.DVSL-container.DVSL-round .DVSL-background-image {
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.DVSL-container.DVSL-gradient .DVSL-background {
  background: #fafafa;
  background: -moz-linear-gradient(top, #fafafa 0, #bababa 100%);
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #fafafa),
    color-stop(100, #bababa)
  );
  background: -webkit-linear-gradient(top, #fafafa 0, #bababa 100%);
  background: -o-linear-gradient(top, #fafafa 0, #bababa 100%);
  background: -ms-linear-gradient(top, #fafafa 0, #bababa 100%);
  background: linear-gradient(to bottom, #fafafa 0, #bababa 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#bababa', GradientType=0 );
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.DVSL-container.DVSL-round .DVSL-background {
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.DVSL-valueAxisInside .DVSL-valueAxis {
  background-color: rgba(255, 255, 255, 0.7);
}
.DVSL-valueAxisInside .DVSL-valueAxis.DVSL-gradient {
  -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
.DVSL-container.DVSL-gradient .DVSL-border {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.8);
  -moz-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.8);
  box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.8);
}
.DVSL-container.DVSL-flat .DVSL-border {
  box-shadow: none;
}
.DVSL-hover-right {
  left: 30px;
  top: 10px;
}
.DVSL-hover-left {
  left: 550px;
  top: 10px;
}
.DVSL-hover-center,
.DVSL-hover-left,
.DVSL-hover-right {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  color: #333;
  background: rgba(255, 255, 255, 0.95);
  position: absolute;
  padding: 5px 0;
}
.DVSL-gradient .DVSL-hover-center,
.DVSL-gradient .DVSL-hover-left,
.DVSL-gradient .DVSL-hover-right {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.DVSL-gradient .DVSL-hover-left,
.DVSL-gradient .DVSL-hover-right {
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
.DVSL-flat .DVSL-hover-left,
.DVSL-flat .DVSL-hover-right {
  border: 1px solid #ddd;
}
.DVSL-hover-center {
  left: 300px;
  top: 10px;
  background: rgba(45, 136, 181, 0.5);
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.DVSL-hover-left em,
.DVSL-hover-right em {
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  top: 50%;
  margin-top: -6px;
  content: "";
  width: 0;
  height: 0;
  position: absolute;
}
.DVSL-hover-right em {
  border-right: 6px solid #fff;
  left: -6px;
}
.DVSL-hover-left em {
  border-left: 6px solid #fff;
  right: -6px;
}
.DVSL-flat .DVSL-hover-right em {
  border-right: 6px solid #ddd;
}
.DVSL-flat .DVSL-hover-left em {
  border-left: 6px solid #ddd;
}
.DVSL-hover-left div,
.DVSL-hover-right div {
  float: left;
  padding: 5px 8px;
  border-right: 1px solid #efefef;
  border-left: 1px solid #efefef;
  margin-left: -1px;
}
.DVSL-hover-center div {
  padding: 0 6px;
}
.DVSL-hover-center div:first-child,
.DVSL-hover-left div:first-child,
.DVSL-hover-right div:first-child {
  border-left: none;
}
.DVSL-hover-center div:last-child,
.DVSL-hover-left div:last-child,
.DVSL-hover-right div:last-child {
  border-right: none;
}
.DVSL-hover-center p,
.DVSL-hover-left p,
.DVSL-hover-right p {
  padding: 0;
  margin: 0;
  font-size: 13px;
}
.DVSL-hover-center p {
  display: none;
}
.DVSL-hover-center strong,
.DVSL-hover-left strong,
.DVSL-hover-right strong {
  display: block;
  font-weight: 700;
  color: #39c;
  font-size: 28px;
  line-height: 28px;
}
.DVSL-hover-center strong {
  color: #333;
}
.DVSL-gradient .DVSL-hover-center strong {
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
.DVSL-hover-center small,
.DVSL-hover-left small,
.DVSL-hover-right small {
  font-size: 12px;
  color: #666;
}
.DVSL-hover-center small {
  color: var(--mainColor6);
}
.DVSL-resizer {
  position: absolute;
  display: none;
  height: 1px;
  width: 100%;
  bottom: 0;
  left: 0;
  background: #fff;
  border-bottom: 1px dotted #ccc;
  border-top: 1px dotted #ccc;
}
.DVSL-gradient .DVSL-resizer {
  height: 8px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAADC0AAAAICAMAAABQvxTqAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAwUExURUxpcQQEBAQEBAQEBBEREdzc3O7u7gQEBO7u7tvb29LS0vz8/OXl5fHx8aGhoebm5skxTVUAAAAIdFJOUwARMQohpfE1b/FKfQAAAIZJREFUeNrt2UEOgjAURdFfWqCKhf3v1sSZUQdMmlTOuQt4C3gBwCXl1EUOAABgLKlMXZQUAADASHKZ29ZBm4t3AcAXDcBQyrx1MpcEwKByRC4TAFezLq3W2r5W236i+rvXxLJOAAyq5EgVgOs5Hp0cFYBhpcg3AHiznwiAP5Yj7gAAAJ/iCZp5fSq+kErxAAAAAElFTkSuQmCC)
    top center;
  border-bottom: none;
  border-top: none;
}
.DVSL-Menu,
.DVSL-info-center,
.DVSL-info-left,
.DVSL-info-right {
  background: #efefef;
  font-size: 13px;
  font-family: Arial, Helvetica, sans-serif;
}
.DVSL-info-center b,
.DVSL-info-left b,
.DVSL-info-right b {
  display: block;
  padding: 4px 9px 0;
  font-weight: 400;
}
.DVSL-info-center,
.DVSL-info-left,
.DVSL-info-right {
  position: absolute;
  -webkit-box-shadow: 0 1px 7px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 0 1px 7px rgba(0, 0, 0, 0.6);
  box-shadow: 0 1px 7px rgba(0, 0, 0, 0.6);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  border-bottom: 1px solid #fff;
  color: #333;
  padding-bottom: 2px;
  z-index: 1;
  pointer-events: none;
}
.DVSL-info-center .allow-pointer-events,
.DVSL-info-center a,
.DVSL-info-center button,
.DVSL-info-left .allow-pointer-events,
.DVSL-info-left a,
.DVSL-info-left button,
.DVSL-info-right .allow-pointer-events,
.DVSL-info-right a,
.DVSL-info-right button {
  pointer-events: auto;
}
.DVSL-info-center strong,
.DVSL-info-left strong,
.DVSL-info-right strong {
  padding: 7px 10px;
  background: #fff;
  display: block;
  border-bottom: 1px solid #ddd;
  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -moz-border-radius-topleft: 6px;
  -moz-border-radius-topright: 6px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  font-size: 15px;
  color: #000;
  font-weight: 400;
}
.DVSL-info-center strong small,
.DVSL-info-left strong small,
.DVSL-info-right strong small {
  display: inline-block;
  padding-left: 5px;
  font-size: 12px;
  color: #666;
}
.DVSL-info-center h3,
.DVSL-info-left h3,
.DVSL-info-right h3 {
  padding: 6px 7px 5px;
  margin: 0;
  font-size: 12px;
  font-weight: 400;
  background-color: rgba(0, 0, 0, 0.05);
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.DVSL-info-center table,
.DVSL-info-left table,
.DVSL-info-right table {
  padding: 0;
  margin: 0;
  font-size: 12px;
  width: 100%;
}
.DVSL-info-center tr,
.DVSL-info-left tr,
.DVSL-info-right tr {
  padding: 0;
  margin: 0;
}
.DVSL-info-center tr:nth-child(even),
.DVSL-info-left tr:nth-child(even),
.DVSL-info-right tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.5);
}
.DVSL-info-center td,
.DVSL-info-left td,
.DVSL-info-right td {
  border: 0 solid transparent;
  position: relative;
  padding: 3px 5px;
  color: #666;
  text-align: right;
  border-left-width: 3px;
}
.DVSL-info-left em,
.DVSL-info-right em {
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  top: 16px;
  margin-top: -6px;
}
.DVSL-info-center td:nth-child(even),
.DVSL-info-left td:nth-child(even),
.DVSL-info-right td:nth-child(even) {
  padding-right: 1px;
}
.DVSL-info-center td:nth-child(odd),
.DVSL-info-left td:nth-child(odd),
.DVSL-info-right td:nth-child(odd) {
  padding-left: 1px;
}
.DVSL-info-center td:first-child,
.DVSL-info-left td:first-child,
.DVSL-info-right td:first-child {
  padding-left: 5px;
  text-align: left;
}
.DVSL-info-center td:last-child,
.DVSL-info-left td:last-child,
.DVSL-info-right td:last-child {
  padding-right: 5px;
  white-space: nowrap;
}
.DVSL-info-left em,
.DVSL-info-right em {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
}
.DVSL-info-right em {
  border-right: 6px solid #fff;
  left: -6px;
}
.DVSL-info-left em {
  border-left: 6px solid #fff;
  right: -6px;
}
.DVSL-Menu {
  line-height: 140%;
  -webkit-box-shadow: 0 1px 7px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 0 1px 7px rgba(0, 0, 0, 0.6);
  box-shadow: 0 1px 7px rgba(0, 0, 0, 0.6);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  border-bottom: 1px solid #fff;
  color: #333;
  max-width: 600px;
  z-index: 10000;
}
.DVSL-Menu strong {
  padding: 15px 35px 14px 16px;
  margin: -6px -32px -6px -6px;
  background: #fff;
  display: block;
  border-bottom: 1px solid #ddd;
  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -moz-border-radius-topleft: 6px;
  -moz-border-radius-topright: 6px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  font-size: 16px;
  color: #000;
  font-weight: 400;
}
.DVSL-Menu ul {
  float: left;
  padding: 16px;
  margin: 0;
  max-width: 300px;
}
.DVSL-Menu.NC-with-logo ul {
  width: 270px;
}
.DVSL-Menu li {
  list-style: none;
  padding: 1px 0 0 80px;
  clear: both;
  font-size: 12px;
  color: #333;
}
.DVSL-Menu li span {
  float: left;
  margin-left: -80px;
  color: #666;
}
.DVSL-Menu img {
  width: 180px;
  height: auto;
  float: right;
  padding: 16px 16px 12px 0;
}
.DVSL-Menu .clear {
  clear: both;
}
.DVSL-Menu-details {
  position: relative;
  padding: 16px 16px 0;
  min-width: 100px;
}
.DVSL-Menu-details small {
  position: absolute;
  right: 16px;
  top: -8px;
  font-size: 11px;
  color: #999;
  outline: 0;
}
.DVSL-Menu-details small:hover {
  color: #333;
  cursor: pointer;
}
.DVSL-Menu-details pre {
  padding: 12px;
  background: #fff;
  margin-top: -9px;
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.7);
  -moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.7);
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.7);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-size: 12px;
  white-space: pre-wrap;
  display: none;
}
.DVSL-Menu nav {
  background: #e2e2e2;
  display: block;
  padding: 8px 8px 3px;
  -webkit-box-shadow: inset 0 2px 2px -1px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset 0 2px 2px -1px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 2px 2px -1px rgba(0, 0, 0, 0.3);
  border-top: 1px solid #fff;
  -webkit-border-bottom-left-radius: 6px;
  -webkit-border-bottom-right-radius: 6px;
  -moz-border-radius-bottomleft: 6px;
  -moz-border-radius-bottomright: 6px;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}
.DVSL-Menu nav:empty {
  display: none;
}
.DVSL-Menu nav a {
  text-decoration: none;
  text-transform: uppercase;
  font-size: 10px;
  color: #333;
  display: inline-block;
  padding: 3px 2px 2px 22px;
  background-repeat: no-repeat;
  opacity: 0.7;
  position: relative;
}
.DVSL-Menu nav a:hover {
  color: #000;
  opacity: 1;
}
.DVSL-Menu nav a:hover:after {
  content: "";
  position: absolute;
  top: -8px;
  left: 0;
  right: 0;
  height: 2px;
  background: #09c;
}
.DVSL-Menu b {
  position: absolute;
  left: 16px;
  top: -8px;
  font-size: 11px;
  color: var(--mainColor6);
  background: #c00;
  padding: 0 4px;
  font-weight: 400;
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.4);
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.4);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  z-index: 1000;
}
.DVSL-Menu-title {
  padding: 6px 32px 4px 6px;
  min-height: 20px;
}
.DVSL-Menu-close {
  position: absolute;
  top: 5px;
  right: 5px;
  text-decoration: none;
  color: #ccc;
  border: 1px solid #ccc;
  width: 19px;
  height: 19px;
  text-align: center;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  font-family: Verdana, Geneva, sans-serif;
  cursor: pointer;
}
.DVSL-Menu-close::after {
  font-family: sans-serif;
  font-size: 14px;
  content: "X";
  vertical-align: middle;
}
.DVSL-Menu-close:hover {
  color: #333;
  border-color: #666;
}
.DVSL-contract-trigger:before,
.DVSL-resize-triggers,
.DVSL-resize-triggers > div {
  content: " ";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  overflow: hidden;
}
.DVSL-resize-triggers > div {
  background: #eee;
  overflow: hidden;
}
.DVSL-contract-trigger:before {
  width: 200%;
  height: 200%;
}
.DVSL-fullscreen {
  position: fixed !important;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 99999;
  background: #fff;
  width: auto !important;
  height: auto !important;
}
.DVSL-dark .DVSL-bar-dropdown {
  box-shadow: 0 1px 7px rgba(0, 0, 0, 0.6);
  background-color: rgba(22, 22, 22, 0.5);
  border: none;
}
.DVSL-dark .DVSL-bar-dropdown a {
  background-color: rgba(22, 22, 22, 1);
}
.DVSL-dark .DVSL-bar-dropdown ul li {
  display: block;
  width: 100%;
}
div .DVSL-dark .DVSL-bar-dropdown li a.DVSL-bar-dropdown-active {
  background: #444;
}
.DVSL-dark .DVSL-info-center,
.DVSL-dark .DVSL-info-left,
.DVSL-dark .DVSL-info-right {
  border-radius: 0;
  background-color: #000;
  border-bottom: 0;
}
.DVSL-PieChart.DVSL-dark .DVSL-info-center,
.DVSL-PieChart.DVSL-dark .DVSL-info-left,
.DVSL-PieChart.DVSL-dark .DVSL-info-right {
  border-radius: 6px;
  background-color: #efefef;
  border-bottom: 1px solid #fff;
}
.DVSL-dark .DVSL-bar-left > li a,
.DVSL-dark .DVSL-bar-right > li a {
  color: #ccc;
}
.DVSL-dark .DVSL-bar-left > li a:hover,
.DVSL-dark .DVSL-bar-right > li a:hover {
  opacity: 0.8;
}
.DVSL-dark .DVSL-info-center strong,
.DVSL-dark .DVSL-info-left strong,
.DVSL-dark .DVSL-info-right strong {
  background-color: #333;
  color: rgba(255, 255, 255, 0.9);
  border-bottom: 1px solid #636363;
}
.DVSL-dark .DVSL-info-right em {
  border-right: 6px solid #333;
}
.DVSL-dark .DVSL-info-left em {
  border-left: 6px solid #333;
}
.DVSL-dark .DVSL-info-center small,
.DVSL-dark .DVSL-info-left small,
.DVSL-dark .DVSL-info-right small {
  background-color: #333;
  color: #a8a7a8;
}
.DVSL-dark .DVSL-info-center tr:nth-child(even),
.DVSL-dark .DVSL-info-left tr:nth-child(even),
.DVSL-dark .DVSL-info-right tr:nth-child(even) {
  background-color: #333;
}
.DVSL-dark .DVSL-info-center tr:nth-child(odd),
.DVSL-dark .DVSL-info-left tr:nth-child(odd),
.DVSL-dark .DVSL-info-right tr:nth-child(odd) {
  background-color: #000;
}
.DVSL-dark .DVSL-info-center td:nth-child(2),
.DVSL-dark .DVSL-info-left td:nth-child(2),
.DVSL-dark .DVSL-info-right td:nth-child(2) {
  color: #a8a7a8;
}
.DVSL-dark .DVSL-NC-zoom {
  background: #525252;
}
a.DVSL-NC-button-collapse,
a.DVSL-NC-button-expand,
a.DVSL-NC-button-focus,
a.DVSL-NC-button-hide,
a.DVSL-NC-button-lock,
a.DVSL-NC-button-unfocus,
a.DVSL-NC-button-unlock {
  background-image: url(/3743de2f831180829aec.png);
}
.DVSL-dark .DVSL-bar-top > li a span {
  background-position: -12px -34px;
}
.DVSL-dark a.DVSL-bar-btn-lasso p {
  background-position: -4px -1645px;
}
.DVSL-dark a.DVSL-bar-btn-lin p {
  background-position: -4px -103px;
}
.DVSL-dark a.DVSL-bar-btn-log p {
  background-position: -4px -178px;
}
.DVSL-dark a.DVSL-bar-btn-month p {
  background-position: -4px -406px;
}
.DVSL-dark a.DVSL-bar-btn-bars p {
  background-position: -4px -483px;
}
.DVSL-dark a.DVSL-bar-btn-zoomout p {
  background-position: -4px -740px;
}
.DVSL-dark a.DVSL-bar-btn-back p {
  background-position: -4px -781px;
}
.DVSL-dark a.DVSL-bar-btn-export p {
  background-position: -4px -963px;
}
.DVSL-dark a.DVSL-bar-btn-lock-all p {
  background-position: -4px -1311.5px;
}
.DVSL-dark a.DVSL-bar-btn-lock-all-active p {
  background-position: -4px -1233px;
}
.DVSL-dark a.DVSL-bar-btn-fit-active p {
  background-position: -4px -1158px;
}
.DVSL-dark a.DVSL-bar-btn-fit p {
  background-position: -4px -1463px;
}
.DVSL-dark a.DVSL-bar-btn-rearrange p {
  background-position: -4px -1392px;
}
.DVSL-dark a.DVSL-bar-btn-fullscreen p {
  background-position: -4px -1026px;
}
.DVSL-dark a.DVSL-bar-btn-fullscreen-active p {
  background-position: -4px -1090px;
}
.DVSL-dark a.DVSL-bar-btn-children p {
  background-position: -4px -893px;
}
.DVSL-dark a.DVSL-bar-btn-collapse-children p {
  background-position: -4px -1548px;
}
.DVSL-leaflet .leaflet-overlay-pane > div:focus {
  outline: 0;
}
.DVSL-leaflet .leaflet-pane {
  z-index: 1 !important;
}
.DVSL-GeoChart .DVSL-menu-container {
  z-index: 2;
}
.DVSL-leaflet.leaflet-container {
  background-color: transparent !important;
}
a.DVSL-NC-button-expand {
  background-position: 0 0;
}
a.DVSL-NC-button-collapse {
  background-position: 0 -35px;
}
a.DVSL-NC-button-focus {
  background-position: 0 -135px;
}
a.DVSL-NC-button-unfocus {
  background-position: 0 -169px;
}
a.DVSL-NC-button-lock {
  background-position: 2px -103px;
}
a.DVSL-NC-button-unlock {
  background-position: 0 -69px;
}
a.DVSL-NC-button-hide {
  background-position: 1px -202px;
}
.DVSL-NC-zoom {
  position: relative;
  display: block;
  left: 15px;
  width: 4px;
  height: 100px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  background: #ddd;
}
.DVSL-NC-zoom em {
  position: absolute;
  left: -9px;
  width: 22px;
  height: 20px;
  -webkit-border-radius: 99px;
  -moz-border-radius: 99px;
  border-radius: 99px;
  background: -moz-linear-gradient(
    top,
    rgba(0, 0, 0, 0.01) 0,
    rgba(0, 0, 0, 0.01) 1%,
    rgba(0, 0, 0, 0.2) 100%
  );
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, rgba(0, 0, 0, 0.01)),
    color-stop(1%, rgba(0, 0, 0, 0.01)),
    color-stop(100%, rgba(0, 0, 0, 0.2))
  );
  background: -webkit-linear-gradient(
    top,
    rgba(0, 0, 0, 0.01) 0,
    rgba(0, 0, 0, 0.01) 1%,
    rgba(0, 0, 0, 0.2) 100%
  );
  background: -o-linear-gradient(
    top,
    rgba(0, 0, 0, 0.01) 0,
    rgba(0, 0, 0, 0.01) 1%,
    rgba(0, 0, 0, 0.2) 100%
  );
  background: -ms-linear-gradient(
    top,
    rgba(0, 0, 0, 0.01) 0,
    rgba(0, 0, 0, 0.01) 1%,
    rgba(0, 0, 0, 0.2) 100%
  );
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.01) 0,
    rgba(0, 0, 0, 0.01) 1%,
    rgba(0, 0, 0, 0.2) 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#03000000', endColorstr='#33000000', GradientType=0 );
  background-color: var(--mainColor6);
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
  cursor: pointer;
}
.DVSL-NC-zoom em:active,
.DVSL-NC-zoom em:hover {
  background-color: #ddd;
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
  border-bottom: 1px solid transparent;
}
.DVSL-container.DVSL-gradient .DVSL-TC-timeAxis {
  background: #cacaca;
  background: -moz-linear-gradient(top, #cacaca 0, #989898 100%);
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #cacaca),
    color-stop(100%, #989898)
  );
  background: -webkit-linear-gradient(top, #cacaca 0, #989898 100%);
  background: -o-linear-gradient(top, #cacaca 0, #989898 100%);
  background: -ms-linear-gradient(top, #cacaca 0, #989898 100%);
  background: linear-gradient(to bottom, #cacaca 0, #989898 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cacaca', endColorstr='#989898', GradientType=0 );
  border-top: 1px solid #c9c9c9;
  -webkit-box-shadow: 0 -2px 4px -1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 -2px 4px -1px rgba(0, 0, 0, 0.5);
  box-shadow: 0 -2px 4px -1px rgba(0, 0, 0, 0.5);
  -webkit-border-bottom-right-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -moz-border-radius-bottomleft: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}
.DVSL-valueAxisInside .DVSL-TC-timeAxis.DVSL-gradient {
  -webkit-box-shadow: 0 -2px 4px -1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 -2px 4px -1px rgba(0, 0, 0, 0.5);
  box-shadow: 0 -2px 4px -1px rgba(0, 0, 0, 0.5);
}

.version-control {
  letter-spacing: 0;
}
.version-control span {
  display: inline-block;
  margin: 1px;
}
.version-control-app-date {
  display: none !important;
}

@media only screen and (max-width: 600px) {
  .version-control {
    display: none;
  }
}

.navigation {
  display: block;
  position: sticky;
  top: 0;
  padding: 0 20px;
  background: #eaeaea;
  /*background: linear-gradient(0deg, #f6f6f6, #e1e1e1);*/
  z-index: 1;
}

.navigation ul {
  list-style: none;
  margin-top: 25px;
  margin-bottom: 0;
}
.navigation ul li {
  display: inline-block;
  margin: 1px;
  border-left: 1px solid #eee;
}
.navigation ul li:last-child {
  border-left: none;
}

.navigation ul li a {
  padding: 15px;
  display: block;
  min-width: 100px;
  text-align: center;
  font-size: 14px !important;
  border-radius: 8px;
  position: relative;
}
.navigation ul.navigation-menu li a {
  color: #999;
}
.navigation ul.navigation-menu li a:after {
  content: "";
  bottom: 0;
  height: 0;
  border-radius: 5px 5px 0 0;
  left: 0;
  right: 0;
  position: absolute;
  transition: 0.3s;
}
.navigation ul li a.navigation-active {
  color: var(--themBtnBgPrimary);
}
.navigation ul li a.navigation-active:after {
  background: var(--themBtnBgPrimary);
  height: 10px;
  transition: 0.3s;
}
.navigation ul li a:hover {
  color: var(--themBtnBgPrimary);
}
.navigation ul li a:hover::after {
  background: var(--themBtnBgPrimary);
  height: 10px;
  transition: 0.3s;
}

.register-btn a {
  background: var(--themBtnBgPrimary);
  color: var(--themBtnTextPrimary);
  margin: 5px 0;
  padding: 8px 15px !important;
  font-size: 12px !important;
  min-width: fit-content !important;
}
.register-btn a:hover {
  color: var(--themBtnTextPrimary) !important;
}

.login-btn a {
  font-size: 12px !important;
  min-width: fit-content !important;
  border: 1px solid var(--themBtnBgPrimary);
  color: var(--themBtnBgPrimary);
  margin: 5px 0;
  padding: 8px 15px !important;
}

.public-footer {
  background: #253044;
  /*background: #333333;*/
  color: var(--mainColor6);
}
.public-footer > div > div {
  padding: 5px;
}

.public-footer a,
.public-footer a:hover {
  color: var(--mainColor6);
  margin: 0 5px;
}
.public-footer-more {
  background: #9ba0ab;
  min-height: 100px;
  text-align: center;
}
.public-footer-more .main ul {
  margin: -30px 0 0 0;
  padding: 0;
  list-style: none;
}
.public-footer-more .main .modal-content ul {
  margin: 0;
}
.public-footer-more .main ul li {
  margin: 0 10px;
  padding: 0;
  display: inline-block;
}
.public-footer-more .main ul li a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: var(--mainColor6);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
  padding: 15px;
  color: var(--mainColor5);
}

.public-footer-more > div > div {
  margin: 20px 5px;
}
.public-footer-more-creator {
  color: #333333;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  margin: 5px;
}

.public-footer-more-creator span {
  color: var(--mainColor5);
  font-size: 30px;
}
.public-footer svg {
  width: 64px !important;
}
.public-footer .login-logo-min h1,
.public-footer .login-logo h1 {
  margin: 0;
  padding: 0;
  font-size: 18px;
  white-space: pre;
}

.home-public-page {
  margin: 10px auto;
}
.home-public-page strong {
  display: inline-block;
  margin: 0 2px;
  color: var(--mainColor5);
}
.home-public-page hr {
  border: none;
  margin: 16px;
  height: 0;
  line-height: 0;
  border-bottom: 1px solid #ccc;
  box-shadow: 0 1px 0 0 #eee;
}
.home-public-page-links {
  text-align: center;
}
.home-public-page-links a {
  background: var(--themBtnBgPrimary);
  color: var(--themBtnTextPrimary);
  margin: 5px 0;
  padding: 8px 15px !important;
  font-size: 12px !important;
  min-width: fit-content !important;
  border-radius: 8px;
}
.home-public-page-links1 a {
  align-items: center;
  appearance: none;
  background-image: radial-gradient(
    100% 100% at 100% 0,
    #a4f4f8 0,
    var(--mainColor5) 100%
  );
  border: 0;
  border-radius: 6px;
  box-shadow: rgb(45 35 66 / 40%) 0 2px 4px, rgb(45 35 66 / 30%) 0 7px 13px -3px,
    rgb(58 65 111 / 50%) 0 -3px 0 inset;
  box-sizing: border-box;
  color: var(--mainColor6);
  cursor: pointer;
  display: inline-flex;
  height: 48px;
  justify-content: center;
  line-height: 1;
  list-style: none;
  overflow: hidden;
  padding-left: 16px;
  padding-right: 16px;
  position: relative;
  text-align: left;
  text-decoration: none;
  transition: box-shadow 0.15s, transform 0.15s;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  white-space: nowrap;
  will-change: box-shadow, transform;
  font-size: 18px;
}
.home-public-page .contact {
  list-style: none;
  display: flex;
  padding: 0;
  margin: 0;
  justify-content: center;
}

.home-public-page .contact li {
  margin: 1px;
}

.home-public-page .contact li a {
  display: inline-block;
  padding: 10px;
  color: #253044;
}

.home-public-page .contact li a:hover {
  transition: 0.3s;
  color: var(--mainColor5);
}
.services-list {
  padding: 0;
  margin: 0;
  list-style: none;
  color: #253044;
}
.services-list li {
  margin: 10px;
  display: inline-block;
  border: 1px solid #eee;
  border-radius: 15px;
  cursor: default;
  min-width: 250px;
}
.services-list li span {
  display: block;
  margin: 15px 0;
  padding: 10px 20px;
}
.services-list li span.brandmi-icon i {
  color: var(--mainColor5);
  font-size: 30px !important;
}

.services-list-node {
  padding: 0;
  margin: 0;
  list-style: none;
  color: #253044;
  display: flex;
}
.services-list-node > li {
  margin: 10px;
  display: inline-block;
  border: 1px solid #eee;
  border-radius: 15px;
  cursor: default;
  min-width: 250px;
  background: var(--mainColor6);
}
.services-list-node > li:last-of-type {
  width: 100%;
  padding: 20px;
  text-align: right;
}
.services-list-node > li span {
  display: block;
  margin: 15px 0;
  padding: 10px 20px;
}
.services-list-node > li span.brandmi-icon i {
  color: var(--mainColor5);
  font-size: 30px !important;
}

.personal-details-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.personal-user-info-brand-wrapper {
  width: 30%;
  height: 50px;
  background-color: #f6f8fb;
  border-radius: 10px;
  margin: 4px 16px;
}

.personal-user-info-brand {
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
}

.personal-user-info-brand-image-wrapper {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 0px 32px 0 0;
}

.personal-user-info-brand-name {
  color: var(--mainColor8);
  font-size: 18px !important;
  justify-content: center;
  text-align: center;
  width: 70%;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.personal-header-date {
  float: left;
  background-color: var(--mainColor4);
  width: 16%;
  height: 50px;
  border-radius: 10px;
  align-items: center;
  display: flex;
  justify-content: center;
  color: var(--mainColor5);
  font-size: 14px;
  direction: ltr;
  padding: 0 8px;
}

@media only screen and (max-width: 640px) {
  .personal-header-date {
    font-size: 10px;
  }
}

.card-fullScreen .personal-details-wrapper {
  background: #eee;
  border-bottom: 5px solid #c1c1c1;
  font-size: 6em;
}
.card-fullScreen .personal-header-date {
  background-color: transparent;
}

.add-personal-card-wrapper {
  display: flex;
  align-items: center;
  padding: 0 24px;
  width: 100%;
}

.add-personal-wrapper-show-null {
  border-radius: 15px;
  padding: 20px;
  border: 2px dashed #999;
  line-height: 27px;
  color: var(--mainColor8);
  margin: 0 24px;
}

.add-item-personal {
  height: 70px;
  width: 48px;
  background-color: var(--mainColor6);
  color: var(--mainColor5);
  cursor: pointer;
}

.user-component {
  display: flex;
  height: 100%;
  align-items: center;
}

.user-wrapper {
  width: 100%;
  display: flex;
  flex-direction: row;
}
/* 
.profile-wrapper {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(180deg, #1b1534, #150f2c);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.profile-wrapper img {
  width: 100%;
} 
*/

.title-component-wrapper {
  display: inline-flex;
  overflow: hidden;
  width: fit-content;
  max-width: 75%;
}

.user-category {
  display: flex;
  align-items: center;
  margin: 0 10px 0 2px;
  color: #ccd4df;
  cursor: pointer;
}

.user-category svg * {
  stroke: #ccd4df;
}

.user-category:hover {
  color: var(--mainColor5);
}

.user-name {
  display: flex;
  align-items: center;
  margin: 0 10px;
  width: calc(100% - 40px);
}

.user-text {
  color: #a5acc6;
  font-size: 13px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
}

.user-text:hover {
  color: var(--mainColor5);
}

@media only screen and (max-width: 992px) {
  .user-text {
    font-size: 12px;
  }
}

.date-time-component {
}

.date-component {
  /* display: flex; */
  float: left;
}

.date-time-wrapper {
  direction: ltr;
  width: 100%;
  z-index: 2;
}

.date-time {
  color: #a0a4a8;
  font-size: 12px;
  display: inline-flex;
}

.date-time:hover {
  color: var(--mainColor5);
}

.date-time * {
  margin: -1px 2px;
}

@media only screen and (max-width: 480px) {
  .date-time-component {
    display: flex;
    flex-direction: column;
    float: left;
  }
}

@media only screen and (max-width: 640px) {
  .date-time {
    font-size: 0.9rem;
  }
}

.read-more-component {
  /* position: relative; */
  white-space: pre-line;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.read-more-wrapper {
  transition: 0.1s;
  padding: 8px;
}
.read-more-wrapper-true {
  padding-bottom: 20px;
}

.read-more-height {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  z-index: 2;
  background: linear-gradient(0deg, #ffffff 0, #ffffff 10%, transparent);
}

.read-more-button {
  background-color: var(--mainColor7);
  border-radius: 13px 13px 0 0;
  position: absolute;
  z-index: 3;
  right: 50%;
  transform: translateX(50%);
  bottom: 0;
  display: inline-flex;
  text-align: center;
  justify-content: center;
  cursor: pointer;
  display: flex;
}

.read-more-button:hover {
  background-color: var(--mainColor4);
}

.read-more-detail {
  color: var(--mainColor5);
  line-height: 0;
  display: contents;
}
.read-more-button-xs {
  width: 40px;
  height: 8px;
  font-size: 12px;
}
.read-more-button-sm {
  width: 60px;
  height: 12px;
  font-size: 18px;
}
.read-more-button-md {
  width: 80px;
  height: 18px;
  font-size: 24px;
}
.read-more-button-lg {
  width: 100px;
  height: 24px;
  font-size: 30px;
}
.read-more-button-xl {
  width: 120px;
  height: 28px;
  font-size: 38px;
}

.status-approach-wrapper {
  position: relative;
  width: 48px;
  direction: ltr;
}
.status-approach-wrapper div div {
  opacity: 0.5;
  filter: grayscale(0.5);
  transition: 0.3s;
}
.status-approach-wrapper div div.status-approach-tags,
.status-approach-wrapper:hover div div {
  opacity: 1;
  filter: grayscale(0);
  transition: 0.3s;
}
.status-approach-tags {
  width: 48px;
}

@media only screen and (max-width: 640px) {
  .status-approach-wrapper {
    position: relative;
    width: 35px;
    direction: ltr;
  }
  .status-approach-tags {
    width: 28px;
  }
}

.publisher-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.line-item {
  border-bottom: 1px solid #f6f8fb;
  width: 300px;
  margin: 24px 0;
}

.lazy-load-image-background.blur {
  filter: blur(15px);
}

.lazy-load-image-background.blur.lazy-load-image-loaded {
  filter: blur(0);
  transition: filter .3s;
}

.lazy-load-image-background.blur > img {
  opacity: 0;
}

.lazy-load-image-background.blur.lazy-load-image-loaded > img {
  opacity: 1;
  transition: opacity .3s;
}

.images-slide {
  background-color: #000;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  min-width: 50px;
  min-height: 50px;
}
.images-slide span.lazy-load-image-background {
  position: absolute;
  top: 1px;
  left: 1px;
  right: 1px;
  bottom: 1px;
  max-width: 100%;
  max-height: 100%;
  display: inline-flex !important;
  justify-content: center;
  align-items: center;
}
.images-slide img {
  width: fit-content;
  max-width: 100%;
  max-height: 100%;

  /*width: 400px;*/
  /*height: 100%;*/
  /*min-width: fit-content;*/
  /*min-height: fit-content;*/
  /*max-width: 100%;*/
  /*max-height: 100%;*/
}
.images-slide-control {
  color: var(--mainColor6);
  position: absolute;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  z-index: 2;
  transition: 0.3s;
  opacity: 0;
}
.images-slide-control-info {
  position: absolute;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.3);
  color: var(--mainColor6);
  padding: 2px 4px;
  border-radius: 4px;
  opacity: 0;
  transition: 0.3s;
}
.images-slide:hover .images-slide-control,
.images-slide:hover .images-slide-control-info {
  opacity: 1;
  transition: 0.3s;
}
.images-slide-control span {
  cursor: pointer;
  opacity: 0.5;
  transition: 0.3s;
  background: rgba(0, 0, 0, 0.8);
  padding: 20px;
}
.images-slide-control span:hover {
  opacity: 1;
  transition: 0.3s;
}

.content-component {
  width: 100%;
  margin: 12px 0 0 0;
  display: flex;
  flex-direction: column;
}

.content-wrapper {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  /*padding: 0 0 0 16px;*/
}

.link-icon {
  margin: 4px 12px;
  display: flex;
  flex-direction: column;
  height: 100%;
  align-items: flex-start;
  justify-content: flex-start;
  width: 32px;
  color: #ccd4df;
  cursor: pointer;
}

.link-icon:hover * {
  color: var(--mainColor5);
}

.title-text {
  color: var(--mainColor5);
  margin: 0 0px 2px 8px;
  font-weight: bold;
}

.text-wrapper {
  width: auto;
  /* height: 70px; */
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: 1 1 1%;
  transition: 0.3s;
  /* position: relative; */
  /* padding: 0 44px 0 0; */
}

.clamp-3 {
  display: -webkit-box !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.text-content {
  font-size: 1.04rem;
  color: var(--mainColor8);
  text-align: justify;
  width: auto;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 0 0 16px;
}

.checkbox-wrapper {
  display: flex;
  margin: 0;
  width: 32px;
  position: absolute;
  left: 18px;
  top: 20px;
}
.checkbox-input {
  width: 18px;
  height: 18px;
  outline: 1px solid #a5acc6;
}

.content-wrapper-link {
  height: 140px;
}
.content-wrapper-link a * {
  color: var(--themLinkTextColor);
}
.content-wrapper-link a:hover * {
  color: #1b1534;
}
/* .text-wrapper:after {
  content: "";
  display: block;
  background: linear-gradient(0deg, #fff, transparent);
  height: 30px;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
} */

@media only screen and (max-width: 640px) {
  .text-wrapper {
    position: relative;
  }
  .content-wrapper-link {
    width: 30px !important;
  }

  .text-wrapper:after {
    content: "";
    display: block;
    background: linear-gradient(0deg, #fff, transparent);
    height: 30px;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
  }

  .checkbox-wrapper {
    left: 18px;
    margin: 0;
    align-items: flex-end;
    justify-content: flex-end;
    width: 12px;
  }

  .content-wrapper {
    padding: 0;
    margin: 0;
  }

  .text-content {
    font-size: 0.9rem;
    padding: 0;
  }

  .link-icon {
    margin: 0;
    width: 24px;
  }
}

.resource-details-wrapper {
  width: 80%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  margin: 0 auto;
  border-bottom: 1px solid var(--mainColor4);
  min-height: 80px;
}

.title-resource {
  color: #4d567e;
  font-size: 14px;
  margin: 0 8px;
  width: calc(100% - 180px);
}

.resource-wrapper {
  display: flex;
  width: 180px;
  height: 40px;
  background-color: var(--mainColor4);
  align-items: center;
  /* justify-content: center; */
  border-radius: 4px;
}

.count-resource-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(100% - 40px);
}

.count-resource {
  color: var(--mainColor5);
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.icon-resource-wrapper {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 20px;
}

.icon-resource {
  color: var(--mainColor5);
  padding: 0 12px 0 0;
  align-items: center;
  height: 100%;
  display: flex;
}

.count-resource-wrapper a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
  transition: 0.3s;
  direction: ltr;
  text-align: center;
}
.count-resource-wrapper > span {
  font-size: 15px;
  font-family: Verdana, Geneva, Tahoma, sans-serif !important;
  cursor: pointer;
  transition: 0.3s;
  overflow: hidden;
  width: 0;
  text-align: center;
  color: #ff0000;
}
.count-resource-wrapper:hover > span {
  display: inline-block;
  width: 20px;
}

.post-details-component {
  display: flex;
  flex-direction: column;
}
.title-post-user {
  display: flex;
  align-items: center;
  margin: -36px 0 0 0;
}

.title-post-wrapper {
  font-size: 17px;
  display: flex;
}

.title-post {
  font-size: 17px;
  width: 100%;
  text-align: justify;
}

.title-post-shape {
  width: 42px;
  height: 20px;
  background-color: var(--mainColor5);
  border-radius: 10px 0 0 10px;
  padding: 0;
  margin: -16px -16px 0 0;
}

.post-image {
  display: flex;
  align-items: center;
  margin: 0 20px 0 0;
}

.image-post-details {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(180deg, #1b1534, #150f2c);
}
.post-details-wrapper {
  display: flex;
  flex-direction: column;
  padding: 0 16px;
}

.post-details-user {
  color: var(--mainColor5);
  font-size: 13px;
  display: flex;
  margin: 2px 0 0 0;
}

.post-date-time {
  display: flex;
  align-items: center;
}

.post-date {
  color: #a0a4a8;
  font-size: 13px;
}

.post-content {
  padding: 4px 48px;
  text-align: justify;
  color: #4d567e;
  font-size: 14px;
  min-height: 150px;
}

.post-detail-id-component {
  display: flex;
  flex-direction: column;
  margin: -40px 2px 0 2px;
  height: 100%;
}

.title-post-detail-id-user {
  display: flex;
  flex-direction: column;
  height: auto;
}

.post-detail-id-wrapper {
  display: flex;
  align-items: center;
}

.post-detail-id-user {
  color: #a0a4a8;
  font-size: 18px;
  padding: 2px 12px;
  display: flex;
  align-items: center;
}

.post-detail-id-img {
  display: flex;
  align-items: center;
}

.img-post-detail-id {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(180deg, #1b1534, #150f2c);
}

.post-detail-link-wrapper {
  font-size: 15px;
  overflow: hidden;
  white-space: pre;
  word-break: break-word;
  text-overflow: ellipsis;
}

.post-detail-link a {
  margin: 0 10px;
  color: #042de2;
  text-decoration: underline;
}

/* .filter-section {
  position: absolute;
  left: 8px;
  top: 8px;
  z-index: 1;
  margin: 0 20px;
  align-items: center;
} */
.filter-section-list {
  list-style: none;
  padding: 0;
  margin: 14px auto 0 auto;
  color: var(--themIconTextColor);
  display: flex;

  justify-content: space-between;
}
.filter-section-list .filter-section-list-platforms-item {
  margin: 0 3px 0 3px;
  padding: 4px;
  text-align: center;
  border-radius: 4px;
  background-color: var(--themIconBgColor);
  justify-content: center;
  align-items: center;
  display: inline-flex;
  cursor: pointer;
}
.filter-section-list .filter-section-list-platforms-item-min {
  margin: 2px;
  padding: 2px;
  text-align: center;
  border-radius: 2px;
  background-color: var(--themIconBgColor);
  justify-content: center;
  align-items: center;
  display: inline-flex;
  cursor: pointer;
}
.filter-section-list div.filter-section-list-platforms-more {
  border-radius: 8px 8px 0 0;
  background-color: #eee;
  justify-content: start;
  align-items: center;
  margin: 1px;
  padding: 2px;
  position: absolute;
  z-index: 1;
}
.filter-section-list .filter-section-list-platforms-item {
  padding: 4px;
  box-shadow: inset 0px 0 2px rgba(0, 0, 0, 0.3);
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: inline-flex;
}

.filter-section-list .filter-section-list-platforms-item:hover,
.filter-section-list .filter-section-list-platforms-item-min:hover {
  background-color: var(--themIconHoverBgColor);
  color: var(--themIconHoverTextColor);
}
.filter-section-list .filter-section-list-platforms-item.active,
.filter-section-list .filter-section-list-platforms-item-min.active {
  background-color: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
}
.filter-section-list .filter-section-list-platforms-item.disable,
.filter-section-list .filter-section-list-platforms-item-min.disable {
  background-color: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
  cursor: not-allowed;
}

.filter-section-list-platforms {
  overflow: hidden;
  direction: rtl;
  justify-content: start !important;
  padding: 0;
}

.filter-section-list-platforms > div {
  display: flex;
  transition: 0.3s;
  justify-content: start;
}

@media only screen and (max-width: 600px) {
  .filter-section-list li {
    margin: 4px;
    padding: 0;
    width: 30px;
    height: 30px;
  }
}

@media only screen and (max-width: 640px) {
  .filter-section-list .filter-section-list-platforms-item {
    padding: 2px;
    width: 30px !important;
    height: 30px;
  }
  .filter-section-list .filter-section-list-platforms-item * {
    font-size: 1rem !important;
  }
}

.advance-search-component {
  background-color: var(--mainColor6);
  width: 100%;
  height: 530px;
  max-height: 60vh;
  box-shadow: 0 5px 8px rgb(0 0 0 / 30%);
  border-radius: 8px;
  overflow: auto;
}

.advance-search-wrapper {
  width: 97%;
  max-height: 100%;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 70px;
}

.advance-search-show {
  opacity: 1;
}

.advance-search-hide {
  opacity: 0 !important;
  height: 0;
  overflow: hidden !important;
}

.advance-search-title-wrapper {
  display: flex;
  width: 100%;
  padding: 8px 8px;
  align-items: center;
}

.advance-search-title {
  padding: 0 32px 0 0;
  color: var(--mainColor8);
  font-size: 14px;
  width: 180px;
  margin: 10px 0 0 0;
}

.advance-checkbox-wrapper {
  margin: 32px 154px 0 0;
  width: 120px;
}

.advance-social-wrapper {
  display: flex;
  padding: 16px 8px;
  align-items: center;
}

.advance-social {
  padding: 0 0 0 44px;
  color: var(--mainColor8);
  font-size: 14px;
  margin: 10px 0 0 0;
  width: 90px;
}

.advance-extra {
  margin: 6px 12px;
  padding-top: 12px;
}

.social-input {
  width: 80px;
}

.advance-checkbox-bottom-wrapper {
}

.advance-checkbox-bottom {
  margin: 32px 100px 0 0;
  width: 130px;
}

.advance-button-wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: flex-end;
  align-items: flex-end;
  padding: 32px 0 8px 16px;
}

.advance-button-confirm {
  margin: 0 12px;
}

@media only screen and (max-width: 640px) {
  .advance-search-wrapper {
    top: 70px;
    bottom: 85px;
    box-shadow: 0 0 1px 1000px rgba(0, 0, 0, 0.3);
    position: fixed;
    z-index: 100001;
    border-radius: 5px;
    left: 15px;
    right: 15px;
    width: auto;
  }
  .advance-search-component {
    height: 100%;
    max-height: 90vh;
    display: flex;
    align-items: stretch;
  }
}

@media only screen and (max-width: 480px) {
  .advance-search-title-wrapper {
    padding: 2px 8px;
  }
  .advance-search-title {
    padding: 0;
    font-size: 12px;
    width: 124px;
    margin: 0;
  }
  .advance-checkbox-wrapper {
    margin: 8px 16px 0 0;
    width: 120px;
  }

  .advance-button-wrapper {
    flex-direction: column;
    width: 100%;
    justify-content: center;
    align-items: center;
    padding: 16px 8px;
  }
  .advance-button-confirm {
    margin: 4px 12px;
    width: 100%;
  }
  .advance-checkbox-bottom-wrapper {
    margin: 24px 0 0 0;
  }
  .advance-checkbox-bottom {
    margin: 6px 16px 0 0;
    width: 130px;
  }
}

.filter-preview-component {
  padding: 16px 0 4px 0;
}

.filter-preview-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  /* background-color: #ebfcfb; */
}

.title-all-wrapper {
  display: flex;
  padding: 0 16px;
}

.title-all {
  color: #a5acc6;
  font-size: 14px;
  display: flex;
  align-items: center;
  padding: 0 8px;
}

.title-all-details {
  width: auto;
  min-width: 160px;
  max-width: 200px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  background-color: var(--mainColor4);
  border-radius: 4px;
  margin: 0 8px;
}

.title-all-date {
  width: auto;
  min-width: 110px;
  max-width: 200px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  background-color: var(--mainColor4);
  border-radius: 4px;
  margin: 0 8px;
}

.title-details {
  color: var(--mainColor5);
  font-size: 14px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.title-details-icon {
  color: var(--mainColor5);
  background-color: #f8ffff;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
@media only screen and (max-width: 640px) {
  .filter-preview-wrapper * {
    font-size: 0.9rem;
  }
  .rmdp-container input {
    width: 120px !important;
    text-align: center;
  }
  .filter-preview-component {
    padding: 4px 0 4px 0;
  }
}

.rmdp-calendar-container-mobile {
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.6);
}

.rmdp-calendar-container-mobile .rmdp-mobile.rmdp-wrapper {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.rmdp-mobile.rmdp-wrapper {
  box-shadow: unset;
  border: 1px solid #cfd8e2;
}

.rmdp-mobile .rmdp-header,
.rmdp-mobile .rmdp-panel-header {
  height: 30px;
  font-size: 16px;
  padding-bottom: 15px;
}

.rmdp-mobile .rmdp-arrow-container {
  height: 26px;
  width: 26px;
}

.rmdp-mobile .rmdp-arrow {
  padding: 3px;
  height: 3px;
  width: 3px;
  margin-top: 6px;
}

.rmdp-mobile .rmdp-up i {
  margin-top: 10px;
}

.rmdp-mobile .rmdp-left i {
  margin-left: 4px;
  margin-top: 7px;
}

.rmdp-mobile .rmdp-right i {
  margin-left: -2px;
  margin-top: 7px;
}

.rmdp-rtl.rmdp-mobile .rmdp-right i {
  margin-left: 5px;
}

.rmdp-rtl.rmdp-mobile .rmdp-left i {
  margin-left: -1px;
}

.rmdp-mobile .rmdp-day,
.rmdp-mobile .rmdp-week-day {
  height: 38px;
  width: 38px;
}

.rmdp-mobile .rmdp-day span {
  font-size: 15px;
}

.rmdp-mobile .dvdr {
  margin: 0 10px;
}

.rmdp-mobile .ok {
  position: absolute;
  bottom: 0;
}

.rmdp-mobile .rmdp-week-day {
  margin-top: 10px;
  margin-bottom: 3px;
}

.rmdp-mobile .only.rmdp-month-picker,
.rmdp-mobile .only.rmdp-year-picker {
  margin: 15px 0;
}

.rmdp-mobile .rmdp-action-button {
  margin: 0 3px;
  margin-top: 15px;
  font-size: 13px;
}

.rmdp-mobile .rmdp-action-buttons {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 0 10px;
}

.rmdp-mobile .rmdp-rtl .rmdp-action-button {
  float: left;
  margin-right: unset;
  margin-left: 10px;
}

.rmdp-mobile .rmdp-action-button:focus {
  outline: none;
}

.rmdp-mobile .rmdp-header {
  margin-top: 15px;
  margin-left: 10px;
  margin-right: 10px;
}

.rmdp-mobile .rmdp-panel-header {
  margin-top: 20px;
}

.rmdp-mobile .rmdp-day-picker {
  margin-left: 5px;
  margin-right: 5px;
}

.rmdp-mobile .rmdp-action-button {
  margin-bottom: 15px;
}

@media (max-width: 420px) {
  .rmdp-mobile .rmdp-day,
  .rmdp-mobile .rmdp-week-day {
    height: 32px;
    width: 32px;
  }

  .rmdp-mobile .only.rmdp-month-picker,
  .rmdp-mobile .only.rmdp-year-picker {
    width: 250px;
  }

  .rmdp-mobile .rmdp-header,
  .rmdp-mobile .rmdp-panel-header {
    height: 20px;
  }

  .rmdp-mobile .rmdp-day span {
    font-size: 14px;
  }

  .rmdp-mobile .rmdp-day-picker {
    padding: 10px 5px;
  }

  .rmdp-mobile.rmdp-single .rmdp-day-picker {
    padding: 10px;
  }

  .rmdp-mobile .rmdp-arrow-container {
    height: 20px;
    width: 20px;
    margin: 0 12px;
  }

  .rmdp-mobile .rmdp-arrow {
    padding: 2px;
    height: 3px;
    width: 3px;
    margin-top: 6px;
  }

  .rmdp-mobile .rmdp-action-button {
    font-size: 13px;
    padding: 5px 5px;
  }

  .rmdp-mobile .rmdp-action-button:first-child {
    padding-right: 10px;
  }

  .rmdp-mobile .rmdp-panel-header {
    padding-bottom: 20px;
  }

  .rmdp-mobile .rmdp-left i,
  .rmdp-mobile .rmdp-right i {
    margin-top: 6px;
  }

  .rmdp-mobile .rmdp-up i {
    margin-top: 8px;
  }

  .rmdp-mobile .rmdp-down i {
    margin-top: 4px;
  }

  .rmdp-mobile .rmdp-header {
    margin-top: 10px;
    margin-left: 5px;
    margin-right: 5px;
  }

  .rmdp-mobile .rmdp-panel-header {
    margin-top: 15px;
  }

  .rmdp-mobile .rmdp-header,
  .rmdp-mobile .rmdp-panel-header {
    font-size: 14px;
  }

  .rmdp-mobile .rmdp-day-picker {
    margin-left: 5px;
    margin-right: 5px;
  }

  .rmdp-mobile .rmdp-action-button {
    margin-bottom: 10px;
    font-size: 12px;
  }
}

@media (max-height: 450px) {
  .rmdp-mobile .rmdp-header,
  .rmdp-mobile .rmdp-panel-header {
    height: 9px;
    font-size: 12px;
    line-height: 15px;
  }

  .rmdp-mobile .rmdp-day,
  .rmdp-mobile .rmdp-week-day {
    height: 22px;
    width: 22px;
  }

  .rmdp-mobile .rmdp-time-picker {
    padding: 0;
    min-width: 130px !important;
  }

  .rmdp-mobile .rmdp-time-picker div input {
    font-size: 12px;
    padding: 2px;
  }

  .rmdp-mobile .rmdp-day span {
    font-size: 12px;
  }

  .rmdp-mobile .rmdp-month-picker .rmdp-day span,
  .rmdp-mobile .rmdp-week-day {
    font-size: 10px;
  }

  .rmdp-mobile .rmdp-day-picker {
    padding: 0 7px;
  }

  .rmdp-mobile .rmdp-panel-body {
    padding: 0px;
    margin: 5px 0px;
  }

  .rmdp-mobile .rmdp-panel-body li {
    font-size: 11px;
    margin: 5px;
  }

  .rmdp-mobile .rmdp-action-button {
    font-size: 9px;
    padding: 0 5px;
    margin: 10px 5px;
  }

  .rmdp-mobile .rmdp-action-button:first-child {
    margin-right: 10px;
  }

  .rmdp-mobile .rmdp-arrow-container {
    margin: 0 3px;
    height: 16px;
    width: 16px;
  }

  .rmdp-mobile .rmdp-arrow {
    padding: 2px;
    height: 2px;
    width: 2px;
    margin-top: 3px;
  }

  .rmdp-mobile .only.rmdp-month-picker,
  .rmdp-mobile .only.rmdp-year-picker {
    height: 160px;
  }

  .rmdp-mobile .rmdp-time-picker div input,
  .rmdp-mobile .dvdr {
    margin: 0;
  }

  .rmdp-mobile .rmdp-week-day {
    margin-top: 0;
  }

  .rmdp-mobile .rmdp-left i {
    margin-top: 4px;
    margin-left: 4px;
  }

  .rmdp-mobile .rmdp-right i {
    margin-top: 4px;
    margin-left: 0px;
  }

  .rmdp-mobile .rmdp-up i {
    margin-top: 5px;
  }

  .rmdp-mobile .rmdp-header {
    margin-top: 10px;
    margin-left: 5px;
    margin-right: 5px;
  }

  .rmdp-mobile .rmdp-panel-header {
    margin-top: 13px;
  }

  .rmdp-mobile .rmdp-day-picker {
    margin-left: 0px;
    margin-right: 0px;
  }

  .rmdp-mobile .rmdp-action-button {
    margin-bottom: 10px;
  }
}

.rmdp-prime.rmdp-wrapper {
  border: 1px solid #8798ad;
}

.rmdp-prime .rmdp-calendar {
  padding: 0 !important;
}

.rmdp-prime .rmdp-header,
.rmdp-prime .rmdp-panel-header {
  border-bottom: 1px solid #8798ad;
  margin-top: 0 !important;
}

.rmdp-prime .rmdp-time-picker {
  border-top: 1px solid #8798ad;
  margin-bottom: 0 !important;
}

.rmdp-prime .rmdp-panel-body li {
  border-radius: 5px;
}

.rmdp-prime .rmdp-border-top {
  border-top: 1px solid #8798ad !important;
}

.rmdp-prime .rmdp-border-bottom {
  border-bottom: 1px solid #8798ad !important;
}

.rmdp-prime .rmdp-border-left {
  border-left: 1px solid #8798ad !important;
}

.rmdp-prime .rmdp-border-right {
  border-right: 1px solid #8798ad !important;
}

.rmdp-prime.ep-arrow::after {
  box-shadow: 0 0 6px #404050 !important;
}

:root {
  --rmdp-primary-teal: #009688;
  --rmdp-secondary-teal: #00796b;
  --rmdp-shadow-teal: #26a69a;
  --rmdp-today-teal: #1de9b6;
  --rmdp-hover-teal: #4db6ac;
  --rmdp-deselect-teal: #00695c;
}

.teal .rmdp-wrapper {
  border: 1px solid var(--rmdp-secondary-teal);
  box-shadow: 0 0 5px var(--rmdp-secondary-teal);
}

.teal .rmdp-panel-body li {
  background-color: var(--rmdp-primary-teal);
  box-shadow: 0 0 2px var(--rmdp-secondary-teal);
}

.teal .rmdp-week-day {
  color: var(--rmdp-primary-teal);
}

.teal .rmdp-day.rmdp-deactive {
  color: var(--rmdp-secondary-teal);
}

.teal .rmdp-range {
  background-color: var(--rmdp-primary-teal);
  box-shadow: 0 0 3px var(--rmdp-shadow-teal);
}

.teal .rmdp-arrow {
  border: solid var(--rmdp-primary-teal);
  border-width: 0 2px 2px 0;
}

.teal .rmdp-arrow-container:hover {
  background-color: var(--rmdp-primary-teal);
  box-shadow: 0 0 3px var(--rmdp-secondary-teal);
}

.teal .rmdp-panel-body::-webkit-scrollbar-thumb {
  background: var(--rmdp-primary-teal);
}

.teal .rmdp-day.rmdp-today span {
  background-color: var(--rmdp-today-teal);
}

.teal .rmdp-rtl .rmdp-panel {
  border-left: unset;
  border-right: 1px solid var(--rmdp-secondary-teal);
}

.teal .rmdp-day.rmdp-selected span:not(.highlight) {
  background-color: var(--rmdp-primary-teal);
  box-shadow: 0 0 3px var(--rmdp-shadow-teal);
}

.teal .rmdp-day:not(.rmdp-day-hidden) span:hover {
  background-color: var(--rmdp-hover-teal) !important;
}

.teal .b-deselect {
  color: var(--rmdp-deselect-teal);
  background-color: white;
}

.teal .rmdp-action-button {
  color: var(--rmdp-primary-teal);
}

.teal .rmdp-button:not(.rmdp-action-button) {
  background-color: var(--rmdp-primary-teal);
}

.teal .rmdp-button:not(.rmdp-action-button):hover {
  background-color: var(--rmdp-deselect-teal);
}

:root {
  --rmdp-primary-teal: var(--themLinkTextColor);
}
.rmdp-input:active {
  width: 150px;
  height: 26px;
  border-radius: 4px;
  border: none;
  background-color: var(--mainColor4) !important;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  color: var(--mainColor5);
  -webkit-box-shadow: none !important;
}
.rmdp-container *,
.rmdp-prime .rmdp-border-bottom {
  border-color: #ccc !important;
}
.rmdp-prime .rmdp-calendar {
  margin: auto;
}

.teal .rmdp-toolbar div {
  background-color: var(--rmdp-primary-teal);
}
.teal .rmdp-day.rmdp-today span {
  background-color: var(--mainColor4);
  color: var(--rmdp-primary-teal);
  box-shadow: 0 0 2px var(--rmdp-primary-teal);
}
.teal .rmdp-day.rmdp-selected span {
  color: #fff !important;
}
.teal .rmdp-day:not(.rmdp-day-hidden) span:hover {
  background-color: var(--themSideBgColor) !important;
}
.teal .rmdp-day.rmdp-disabled:not(.rmdp-day-hidden) span:hover {
  background-color: #f2f2f2 !important;
}
.DatePickerToolbar-box {
  width: 500px;
  margin: auto;
}
.DatePickerToolbar-box .DatePickerToolbar {
  display: inline-flex;
  justify-content: center;
}
.DatePickerToolbar-box .DatePickerToolbar button {
  width: 118px;
}
.rmdp-header-values {
  color: var(--mainColor8);
  overflow: hidden;
}

.DatePickerToolbar-box-xs,
.DatePickerToolbar-box-sm {
  width: 240px;
}
.DatePickerToolbar-box-xs .rmdp-week-day {
  display: none;
}
.DatePickerToolbar-box-xs .rmdp-header-values > span,
.DatePickerToolbar-box-sm .rmdp-header-values > span {
  display: none;
}
.DatePickerToolbar-box-xs .DatePickerToolbar,
.DatePickerToolbar-box-sm .DatePickerToolbar {
  width: 240px;
}
.DatePickerToolbar {
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 5px auto;
  align-items: center;
  direction: rtl;
  overflow-x: auto;
}
.rmdp-range-picker-footer {
  font-size: 12px;
  display: flex !important;
  align-items: center;
  padding: 8px 8px 0 8px !important;
}
.rmdp-range-picker-footer .rmdp-button {
  display: none;
}

.rmdp-range-picker-footer .rmdp-week-day {
  margin: 0 0 0 20px;
}
.rmdp-range-picker-footer .rmdp-header-values > div {
  display: inline-flex !important;
  align-items: center;
}
.rmdp-range-picker-footer .rmdp-header-values > div span {
  display: inline-block;
  font-size: 12px;
}

.filter-component {
  width: 100%;
  height: 60px;
  /* height: 100%; */
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  padding: 0 12px;
}
.filter-wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  align-items: center;
}

.filter-input-wrapper {
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  padding: 0 16px 0 4px;
}

.filter-wrapper li:hover {
  background-color: var(--themIconHoverBgColor);
  color: var(--themIconHoverTextColor);
}

.icon-filter-active {
  background-color: var(--themIconActiveBgColor);
  position: absolute;
  top: 12px;
}

.icon-filter-active-color {
  color: var(--mainColor6);
}

.icon-filter {
  color: var(--themIconTextColor);
  cursor: pointer;
  list-style: none;
  padding: 12px;
  border-radius: 6px;
  align-items: center;
  justify-content: center;
  display: flex;
  margin-top: 10px;
}

.input-title-search {
  width: calc(100% - 8px);
  list-style: none;
  color: var(--mainColor5);
}

.filter-wrapper div.input-title-search-active {
  display: none;
}

@media only screen and (max-width: 992px) {
  .icon-filter {
    margin-top: 20px;
    margin-left: 12px;
    position: relative;
    top: 4px;
    padding: 0;
  }
  .icon-filter-active {
    background-color: transparent;
  }
  .icon-filter-active-color {
    color: var(--mainColor5);
  }
}

@media only screen and (max-width: 640px) {
  .icon-filter {
    margin-top: 10px;
  }
}

@media only screen and (max-width: 480px) {
  .filter-input-wrapper {
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    display: flex;
    padding: 0;
  }
  .input-title-search {
    width: calc(100% - 16px);
  }
}

.statistics-wrapper {
  list-style: none;
  margin-right: 0;
  padding-right: 0;
  border-top: 2px solid #f6f8fb;
  margin: 0 32px;
  min-height: 226px;
}

.wrapper-lists {
  margin: 26px 12px;
  color: #a0a4a8;
  font-size: 14px;
  font-weight: bold;
  display: flex;
  justify-content: space-between;
}

.count-list {
  color: #4d567e;
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (max-width: 600px) {
  .statistics-wrapper {
    margin: 0 8px;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .statistics-wrapper {
    margin: 0 4px;
  }

  .wrapper-lists {
    font-size: 12px;
    display: flex;
    flex-direction: column;
    width: 100px;
    margin: 16px 10px;
    justify-content: center;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1355px) {
  .statistics-wrapper {
    list-style: none;
    margin-right: 0;
    padding-right: 0;
    border-top: 2px solid #f6f8fb;
    margin: 0 32px;
    min-height: 226px;
  }

  .wrapper-lists {
    margin: 26px 0px;
    color: #a0a4a8;
    font-size: 14px;
    font-weight: bold;
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
  }
}

.data-not-found {
  display: flex;
  align-items: center;
  justify-content: center;
  /* height: 100%; */
  opacity: 0.7;
  text-align: center;
  position: relative;
  top: 0;
}
.data-not-found-content {
  display: inline-block;
  width: -moz-fit-content;
  width: fit-content;
}

.data-not-found-text {
  font-size: 16px;
  color: rgb(148 135 243);
  text-shadow: rgb(236 236 245) 0px 0px 2px;
  z-index: 5;
  text-align: center;
  color: #a5acc6;
  position: absolute;
  bottom: 13%;
  right: 42%;
  /* left: 44%; */
}

.data-not-found-text {
  font-size: 16px;
  color: rgb(148 135 243);
  text-shadow: rgb(236 236 245) 0px 0px 2px;
  z-index: 5;
  text-align: center;
  color: #a5acc6;
  position: absolute;
  bottom: 13%;
  right: 50%;
  transform: translate(calc(50% - 20px));
}

.invoice-package-component {
}

.invoice-package-wrapper {
  display: flex;
  color: var(--mainColor5);
  font-weight: bold;
  margin: 4px 0 10px 0;
  font-size: 14px;
  border-bottom: 1px solid #eee;
  padding: 4px 0 8px 0;
}

.invoice-item-title {
  display: flex;
  justify-content: center;
  width: 100%;
}

.invoice-item-count {
  display: flex;
  justify-content: flex-end;
  padding: 0 0 0 16px;
}

.invoice-package {
  height: calc(70vh - 50px);
  border: 1px solid #eee;
  box-shadow: 0 2px 8px 2px rgba(211, 211, 211, 0.3);
  border-radius: 8px;
  text-align: center;
  margin: 1rem;
  padding: 0 4px 10px;
  position: relative;
  overflow: auto;
}

.invoice-package-title {
  font-size: 16px;
  color: #aaa;
  font-weight: bold;
  border-bottom: 1px solid #eee;
  padding: 8px;
  position: sticky;
  top: 0;
  background-color: #f6f6f6;
}

.invoice-package-item {
  font-size: 14px;
  color: rgb(107, 107, 107);
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 8px 0;
}

.invoice-package-item-details-wrapper {
  margin: 0 8px;
  display: flex;
}
.invoice-package-item-buy {
  text-align: center;
}

.invoice-details-title {
  display: flex;
  width: 100%;
}

.invoice-package-footer {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  width: 100%;
  border-radius: 4px;
  font-size: 15px;
  color: var(--mainColor5);
  border-bottom: 1px solid #eee;
  padding: 8px;
  background-color: #f6f6f6;
  font-weight: bold;
}

.invoice-package-footer-price-item {
  display: flex;
  justify-content: space-around;
  padding: 0 16px;
  margin: 0 16px;
  height: auto;
  min-height: 36px;
  align-items: center;
  background-color: var(--mainColor6);
  border-radius: 4px;
}



.redirect-to-paypal-component {
  /* background-color: var(--mainColor6); */
  text-align: center;
}

.redirect-to-paypal-wrapper {
  opacity: 0.6;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: calc(100vh - 150px);
}

.redirect-to-paypal-image {
  max-width: 500px;
}

@media only screen and (max-width: 680px) {
  .redirect-to-paypal-image {
    max-width: 320px;
  }
}

.invoice-preview-component {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--mainColor6);
  overflow: auto;
}

.invoice-preview-discount {
  width: 100%;
  padding: 24px 0;
  background-color: var(--mainColor6);
}

.invoice-preview-pay {
  position: absolute;
  left: 100px;
  top: 40px;
}

.invoice-failed-img {
  position: absolute;
  right: 46%;
  top: 200px;
  z-index: 2;
}

.invoice-preview-wrapper {
  position: relative;
  margin: 8px auto;
  width: 790px;
  max-width: 100%;
  min-width: 790px;
  display: grid;
}

.invoice-preview-wrapper img {
  width: 100%;
}

.invoice-preview-back {
  text-align: center;
  margin: 50px auto;
}
.invoice-preview-back a {
  color: var(--mainColor5);
  background-color: var(--mainColor6);
  padding: 10px 30px;
  border-radius: 5px;
  border: 1px solid var(--mainColor5);
  font-size: 14px;
}
.invoice-preview-back a:hover {
  background-color: var(--mainColor5);
  color: var(--mainColor6);
}

@page {
  size: A4;
  margin: 0;
}

@media print {
  body {
    margin: 0;
  }
  .invoice-preview-wrapper {
    margin: 0;
  }

  .invoice-failed-img {
    right: 43%;
    top: 4%;
  }

  .wa__btn_popup,
  .invoice-preview-discount,
  .invoice-preview-back,
  .discount-code {
    display: none;
  }
}

@media only screen and (max-width: 600px) {
  .invoice-preview-pay {
    top: 100px;
    right: 20px;
  }
}

.brandmin-table {
  white-space: nowrap;
  margin: 0;
  border: none;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  width: 100%;
  max-width: 100%;
  /* display: table-caption; */
  display: table;
}
.brandmin-table th,
.brandmin-table td {
  max-width: calc(100% - 35px);
  min-height: 30px;
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.brandmin-table tbody td,
.brandmin-table tbody th {
  text-align: right;
}
.brandmin-table thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  height: 30px;
}
.brandmin-table tbody th {
  position: relative;
}
.brandmin-table tbody th {
  position: sticky;
  z-index: 10;
}

.brandmin-table th,
.brandmin-table td {
  border: 0px solid #fff;
}
.brandmin-table-td-null:first-of-type > div {
  border-radius: 0 8px 8px 0;
}
.brandmin-table-td-null:last-of-type > div {
  border-radius: 8px 0 0 8px;
}

.brandmin-table-th-null:first-of-type > div,
.brandmin-table-th-null:last-of-type > div,
.brandmin-table-td-null:first-of-type > div,
.brandmin-table-td-null:last-of-type > div {
  height: 100%;
  padding: 6px;
  position: absolute;
  top: 0;
}
.brandmin-table-th-check > div,
.brandmin-table-td-check > div,
.brandmin-table-th-number > div,
.brandmin-table-td-number > div {
  text-align: center;
}

.brandmin-table td,
.brandmin-table th {
  border: none;
  padding: 0;
}
.brandmin-table td > div,
.brandmin-table th > div,
.brandmin-table td > span,
.brandmin-table th > span {
  display: inline-block;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.brandmin-table th > div.brandmin-table-th-title {
  display: inline-flex;
  align-items: center;
}
.brandmin-table th > span.table-sort {
  cursor: pointer;
  margin: 0 4px;
}
.brandmin-table th > span.table-sort:hover {
  color: var(--mainColor5);
  background-color: var(−−mainColor11);
  border-radius: 4px;
}
.datatable-options {
  list-style: none;
  padding: 0;
  margin: 0;
}

.datatable-options li,
.datatable-options li a {
  font-size: 12px;
  color: var(--mainColor5);
  margin: 2px 4px;
  display: inline-block;
  cursor: pointer;
}

.brandmin-table tbody:hover tr th:first-of-type ~ th {
  box-shadow: -3px 0 3px rgb(0 0 0 / 10%);
  transition: 0.3s;
}

.brandmin-table tbody:hover tr td:last-of-type + th {
  box-shadow: 3px 0 3px rgb(0 0 0 / 10%);
  transition: 0.3s;
}

.brandmin-table tbody:hover tr th:first-of-type,
.brandmin-table tbody:hover tr th:last-of-type {
  box-shadow: none !important;
}

td.brandmin-table-td div {
  padding: 0 5px;
}

.word-cloud-list {
  width: 200px !important;
  padding: 0 !important;
  margin: 0 !important;
  max-height: 400px;
  overflow: hidden;
  color: #333;
  display: none;
}
.word-cloud-list li {
  list-style: numeric;
  display: flex;
  justify-content: space-between;
  position: relative;
}
.word-cloud-list li:before {
  content: " ";
  position: absolute;
  width: 100%;
  border-top: 1px dotted #ccc;
  top: 50%;
  left: 0;
  right: 0;
}
.word-cloud-list li span {
  overflow: hidden;
  display: block;
  white-space: pre;
  text-overflow: ellipsis;
  background: var(--mainColor6);
  z-index: 1;
  padding: 0 2px;
}
.word-cloud-list li span:last-of-type {
  direction: ltr;
  text-align: left;
  max-width: 50px;
}

@media only screen and (max-width: 640px) {
  .word-cloud-list {
    display: none !important;
  }
}

@media print {
  .word-cloud-list {
    display: block !important;
  }
}

/* theme 1 */
.table-theme-1 table,
.table-theme-1 table th {
  font-weight: normal;
}
.table-theme-1 table thead th {
  color: #ccc;
  text-align: center;
}
.table-theme-1 tbody td,
.table-theme-1 tbody th {
  border-top: 2px solid var(--mainColor6);
  border-bottom: 2px solid var(--mainColor6);
}
.table-theme-1 table,
.table-theme-1 thead th,
.table-theme-1 thead th > div,
.table-theme-1 tbody th:first-of-type,
.table-theme-1 tbody th:last-of-type,
.table-theme-1 thead th:first-of-type > div,
.table-theme-1 thead th:last-of-type > div {
  background-color: var(--mainColor6);
}
.table-theme-1 tbody td,
.table-theme-1 tbody th,
.table-theme-1 tbody th:first-of-type > div,
.table-theme-1 tbody th:last-of-type > div {
  background-color: #eee;
}

/* theme 2 */
.table-theme-2 table,
.table-theme-2 table th {
  font-weight: normal;
}
.table-theme-2 table thead th {
  color: #ccc;
  text-align: center;
}
.table-theme-2 tbody td,
.table-theme-2 tbody th {
  border-top: 2px solid var(--mainColor6);
  border-bottom: 2px solid var(--mainColor6);
}
.table-theme-2 table,
.table-theme-2 thead th,
.table-theme-2 thead th > div,
.table-theme-2 tbody th:first-of-type,
.table-theme-2 tbody th:last-of-type,
.table-theme-2 thead th:first-of-type > div,
.table-theme-2 thead th:last-of-type > div {
  background-color: var(--mainColor6);
}

.table-theme-2 tbody td,
.table-theme-2 tbody th,
.table-theme-2 tbody th:first-of-type > div,
.table-theme-2 tbody th:last-of-type > div {
  background-color: #f6f9fd;
}

/* theme 3 */
.table-theme-3 table,
.table-theme-3 table th {
  font-weight: normal;
}
.table-theme-3 table thead th {
  color: #ccc;
  text-align: start;
}
.table-theme-3 tbody td,
.table-theme-3 tbody th {
  border-top: 2px solid var(--mainColor6);
  border-bottom: 2px solid var(--mainColor6);
  height: 46px;
}
.table-theme-3 table,
.table-theme-3 thead th,
.table-theme-3 thead th > div,
.table-theme-3 tbody th:first-of-type,
.table-theme-3 tbody th:last-of-type,
.table-theme-3 thead th:first-of-type > div,
.table-theme-3 thead th:last-of-type > div {
  background-color: var(--mainColor6);
}

.table-theme-3 tbody td,
.table-theme-3 tbody th,
.table-theme-3 tbody th:first-of-type > div,
.table-theme-3 tbody th:last-of-type > div {
  background-color: var(--mainColor4);
  color: var(--mainColor5);
  font-size: 13px;
}
.brandmin-table-th-fiexd-left {
  background-color: red !important;
}
.table-theme-3 .brandmin-table-th-fiexd-right:last-of-type,
.table-theme-3 .brandmin-table-th-fiexd-left:first-of-type {
  border-left: 1px solid #ccc;
}
.table-theme-3 .brandmin-table-td-fiexd-right:last-of-type,
.table-theme-3 .brandmin-table-td-fiexd-left:first-of-type {
  border-right: 1px solid #ccc;
}

/* theme 4 */
.table-theme-4 table,
.table-theme-4 table th {
  font-weight: normal;
}
.table-theme-4 table thead th {
  color: #ccc;
  text-align: start;
}
.table-theme-4 tbody td,
.table-theme-4 tbody th {
  border-top: 1px solid var(--mainColor5);
  border-bottom: 1px solid var(--mainColor5);
  height: 46px;
}
.table-theme-4 table,
.table-theme-4 thead th,
.table-theme-4 thead th > div,
.table-theme-4 tbody th:first-of-type,
.table-theme-4 tbody th:last-of-type,
.table-theme-4 thead th:first-of-type > div,
.table-theme-4 thead th:last-of-type > div {
  background-color: var(--mainColor6);
}

.table-theme-4 tbody td,
.table-theme-4 tbody th,
.table-theme-4 tbody th:first-of-type > div,
.table-theme-4 tbody th:last-of-type > div {
  background-color: var(--mainColor6);
  color: var(--mainColor5);
  font-size: 13px;
}

.table-theme-4 tbody td {
  border-top: 1px solid var(--mainColor5);
  border-bottom: 1px solid var(--mainColor5);
}
.table-theme-4 .brandmin-table-td-null {
  border: none;
}
.table-theme-4 .brandmin-table-td-null > div {
  border-top: 1px solid var(--mainColor5);
  border-bottom: 1px solid var(--mainColor5);
}
.table-theme-4 .brandmin-table-td-null:first-of-type > div {
  border-right: 1px solid var(--mainColor5);
}
.table-theme-4 .brandmin-table-td-null:last-of-type > div {
  border-left: 1px solid var(--mainColor5);
}

.table-theme-4 .brandmin-table-th-fiexd-right:last-of-type,
.table-theme-4 .brandmin-table-th-fiexd-left:first-of-type {
  border-left: 1px solid #ccc;
}
.table-theme-4 .brandmin-table-td-fiexd-right:last-of-type,
.table-theme-4 .brandmin-table-td-fiexd-left:first-of-type {
  border-right: 1px solid #ccc;
  background-color: "red";
}

/* theme 5 */
.table-theme-5 table,
.table-theme-5 table th {
  font-weight: normal;
  margin: 4px 0;
}
.table-theme-5 table thead th {
  color: #ccc;
  text-align: start;
}
.table-theme-5 tbody td,
.table-theme-5 tbody th {
  height: 46px;
}
.table-theme-5 table,
.table-theme-5 thead th,
.table-theme-5 thead th > div,
.table-theme-5 tbody th:first-of-type,
.table-theme-5 tbody th:last-of-type,
.table-theme-5 thead th:first-of-type > div,
.table-theme-5 thead th:last-of-type > div {
  background-color: var(--mainColor6);
}

.table-theme-5 tbody td,
.table-theme-5 tbody th,
.table-theme-5 tbody th:first-of-type > div,
.table-theme-5 tbody th:last-of-type > div {
  background-color: var(--mainColor6);
  color: #4d567e;
  font-size: 14px;
}

.table-theme-5 tbody td {
}
.table-theme-5 .brandmin-table-td-null {
  border: none;
  height: 75px;
}
.table-theme-5 .brandmin-table-td-null > div {
  background-color: #f6f9fd !important;
  height: 74px;
  border-radius: 0 18px 18px 0;
}

.table-theme-5 .brandmin-table-th-fiexd-right:last-of-type,
.table-theme-5 .brandmin-table-th-fiexd-left:first-of-type {
  border-left: 1px solid #ccc;
}
.table-theme-5 .brandmin-table-td-fiexd-right:last-of-type,
.table-theme-5 .brandmin-table-td-fiexd-left:first-of-type {
  border-right: 1px solid #ccc;
  background-color: "red";
}
.table-theme-5 .brandmin-table-td-fiexd-left {
  background-color: #f6f9fd;
  height: 74px !important;
}

.table-theme-5 .brandmin-table-td {
  background-color: #f6f9fd;
  margin: 1px 0 2px 0;
  height: 74px !important;
}

.table-theme-5 .brandmin-table-td-null:last-of-type > div {
  border-radius: 18px 0 0 18px;
}

.custom-chart {
  display: flex;
  justify-content: space-evenly;
  background-color: var(--mainColor6);
  padding: 16px;
  overflow: hidden;
  flex-wrap: wrap;
}
.custom-data-graph-wrapper {
  background-color: #f5f5f5;
  width: 70px;
  height: 380px;
  border-radius: 5px 5px 0 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  position: relative;
}
.custom-chart .custom-data-graph-item {
  position: relative;
}
.custom-chart .custom-data-graph-item .custom-data-graph-wrapper > span {
  opacity: 0.8;
  transition: 0.3s;
  color: #a5acc6;
  position: absolute;
  top: 15px;
  direction: ltr;
}
.custom-chart .custom-data-graph-item .custom-data-graph-wrapper > div {
  height: 0;
}
.custom-chart:hover .custom-data-graph-item .custom-data-graph-wrapper > span {
  opacity: 0.5;
}

.custom-chart:hover
  .custom-data-graph-item:hover
  .custom-data-graph-wrapper
  > span {
  opacity: 1;
  color: var(--mainColor5);
  transition: 0.3s;
}
.custom-data-logo {
  margin: 12px 0 4px 0;
  max-width: 70px;
  max-height: 67px;
  height: 66px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.custom-data-title {
  color: #4d567e;
  font-size: 14px;
  margin: 0 0 16px 0;
  max-width: 90px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.custom-data-number {
  color: var(--mainColor5);
  font-size: 18px;
  background-color: var(--mainColor4);
  width: 54px;
  height: 54px;
  border-radius: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.custom-data-graph-item {
  width: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: auto;
  margin: 5px;
}

.custom-data-graph-item-line {
  height: auto;
  padding: 0 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-left: 1px solid #f6f8fb;
}

.item-chart-options {
  position: relative;
  top: 0;
  right: 0;
  left: 0;
  background: var(--mainColor6);
  opacity: 0;
  z-index: 1;
  transition: all 0.3s linear;
}
.card-content:hover > .item-chart-options {
  opacity: 1;
}
.item-chart-option {
  display: inline-block;
  padding: 2px 5px;
  cursor: pointer;
  color: #333;
}
.item-chart-option::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #0096d3;
  margin: 0 20px 0 5px;
}
.item-chart-option-unselect {
  color: #ccc;
}
.item-chart-option-unselect::before {
  background-color: #ddd;
}
.item-chart-option:hover {
  color: #0096d3 !important;
}

.no-search-result {
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.7;
  text-align: center;
}
.no-search-result-content {
  display: inline-block;
  width: -moz-fit-content;
  width: fit-content;
  padding: 20px;
  margin: 10px;
}

.radio-component {
}

.radio-wrapper {
  cursor: pointer;
}

.radio-button-item-wrapper {
  width: 100%;
  display: flex;
  user-select: none;
}

.radio-button-item-icon {
  display: flex;
  align-items: center;
}

.radio-button-item-label {
  margin: 2px 8px;
}

.radio-group-component {
}

.radio-group-list {
  padding: 0;
  margin: 4px 0 0 0;
}

.radio-group-list-item {
  list-style: none;
}
.radio-group-label {
  font-size: 12px;
}

.pagination {
  width: 100%;
  display: inline-flex;
  justify-content: center;
  line-height: 30px;
  color: #666;
  height: 40px;
  align-items: center;
}
.pagination .pagination-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.pagination .pagination-list .page-item {
  border: 1px solid var(--mainColor5);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 2px;
  width: 24px;
  height: 24px;
  cursor: pointer;
  border-radius: 4px;
  color: var(--mainColor5);
  background-color: var(--mainColor6);
  transition: 0.3s;
}
.pagination .pagination-list .page-item:hover {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  transition: 0.3s;
}
.pagination .pagination-list .page-active,
.pagination .pagination-list .page-active:hover {
  color: var(--mainColor6);
  background-color: var(--mainColor5);
  cursor: default;
  box-shadow: none;
}
.pagination .pagination-list .page-more,
.pagination .pagination-list .page-more:hover {
  border: 1px solid #f2f2f2;
  color: #ccc;
  background-color: var(--mainColor6);
  cursor: default;
  box-shadow: none;
}
.pagination .pagination-min {
  border-radius: 4px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  color: var(--mainColor5);
}
.pagination .pagination-min .pagination-min-data input {
  display: inline-block;
  border: 1px solid var(--mainColor5);
  border-radius: 4px;
  width: 60px;
  padding: 0;
  margin: 2px;
  direction: ltr;
  text-align: center;
  font-size: 12px;
  background-color: var(--mainColor5) !important;
  color: var(--mainColor6) !important;
  -webkit-box-shadow: none !important;
}
.pagination .pagination-min .pagination-min-data span {
  margin: 2px 4px;
  display: inline-block;
}
.pagination .pagination-min .pagination-min-data div {
  width: 36px;
  padding: 0px;
  margin: 2px 4px;
  display: inline-block;
}
.pagination-min-data {
  border-radius: 4px;
  display: inline-flex;
}
.pagination-min-arrow {
  border-radius: 4px;
  padding: 0px;
  margin: 2px;
  width: 28px;
  height: 28px;
  font-size: 16px;
  cursor: pointer;
}

.pagination .pagination-limit {
  display: inline-block;
  border: 1px solid var(--mainColor5);
  background-color: var(--mainColor6);
  border-radius: 4px;
  width: 60px;
  padding: 0;
  margin: 0 2px;
  color: var(--mainColor5);
  direction: rtl;
  font-size: 12px;
  text-align: center;
  margin-left: 50px !important;
}
.pagination .pagination-limit-lg {
  height: 24px !important;
}

.pagination.pagination-theme-1 .pagination-min {
  border: 1px solid var(--mainColor5);
}
.pagination.pagination-theme-1 .pagination-limit {
  height: 34px;
}

.pagination.pagination-theme-2 .pagination-min-data,
.pagination.pagination-theme-2 .pagination-min-arrow {
  border: 1px solid var(--mainColor5);
  height: 28px;
}
.pagination.pagination-theme-2 .pagination-min-arrow:hover {
  background-color: var(--mainColor5);
  color: var(--mainColor6);
}
.pagination.pagination-theme-2 .pagination-min-arrow.disable {
  border: 1px solid #cccccc;
}
.pagination.pagination-theme-2 .pagination-limit {
  height: 28px;
  margin: 2px;
}

.pagination.pagination-theme-3 .pagination-min-arrow {
  border: 1px solid var(--mainColor5);
  height: 28px;
}
.pagination.pagination-theme-3 .pagination-min input {
  border: 1px solid var(--mainColor5);
  height: 28px;
}
.pagination.pagination-theme-3 .pagination-min-arrow:hover {
  background-color: var(--mainColor5);
  color: var(--mainColor6);
}
.pagination.pagination-theme-3 .pagination-min-arrow.disable {
  border: 1px solid #cccccc;
}
.pagination.pagination-theme-3 .pagination-limit {
  height: 28px;
  margin: 2px;
}

.pagination.pagination-theme-4 .pagination-min-arrow {
  border: 1px solid var(--mainColor5);
  background-color: var(--mainColor5);
  color: var(--mainColor6);
  height: 28px;
}
.pagination.pagination-theme-4 .pagination-min input {
  border: 1px solid #cccccc;
  background-color: var(--mainColor6) !important;
  color: var(--mainColor5) !important;
  height: 28px;
}
.pagination.pagination-theme-4 select {
  background-color: #f6f6f6 !important;
}
.pagination.pagination-theme-4 .pagination-min-arrow:hover {
  opacity: 0.6;
}
.pagination.pagination-theme-4 .pagination-min-arrow.disable,
.pagination.pagination-theme-4 .pagination-min-arrow.disable:hover {
  border: 1px solid #cccccc;
  color: #cccccc;
  background-color: #eeeeee;
}
.pagination.pagination-theme-4 .pagination-limit {
  height: 28px;
  margin: 2px;
}

.pagination .pagination-min-arrow.disable,
.pagination .pagination-min-arrow.disable:hover {
  color: #cccccc;
  background-color: var(--mainColor6);
  cursor: default;
}

@media only screen and (max-width: 600px) {
  .pagination {
    height: 70px;
  }
  .pagination-min-arrow {
    width: 20px;
    font-size: 12px;
  }
  .pagination .pagination-limit {
    margin-left: 0 !important;
  }
  .pagination.pagination-theme-4 .pagination-limit,
  .pagination .pagination-min .pagination-min-data input {
    width: 36px;
  }
  .pagination .pagination-min .pagination-min-data div {
    width: fit-content;
  }
}

.smart-secretary-form-input {
  width: 400px;
}

.smart-secretary-form-text-area {
  width: 600px;
  height: 200px;
}

@media only screen and (max-width: 600px) {
  .smart-secretary-form-input {
    width: 310px;
  }

  .smart-secretary-form-text-area {
    width: 310px;
    height: 200px;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .smart-secretary-form-input {
    width: 300px;
  }

  .smart-secretary-form-text-area {
    width: 400px;
    height: 200px;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .smart-secretary-form-input {
    width: 300px;
  }

  .smart-secretary-form-text-area {
    width: 310px;
    height: 200px;
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .smart-secretary-form-text-area {
    width: 300px;
    height: 200px;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .smart-secretary-form-text-area {
    width: 600px;
    height: 200px;
  }
}

.status-open {
  background-color: #d1fcdd;
  width: 70px;
  height: 25px;
  border-radius: 5px;
  color: #1cde52;
  align-items: center;
  justify-content: center;
  display: flex;
  font-size: 14px;
}

.status-close {
  background-color: #ffcfcf;
  width: 70px;
  height: 25px;
  border-radius: 5px;
  color: #f60f0f;
  align-items: center;
  justify-content: center;
  display: flex;
  font-size: 14px;
}

:root {
  --color0: #fff;
  --color1: #72dee3;
  --color2: #009299;
  --color3: #3f2c77;
  --color4: #404e67;
  --color5: #253044;
  --color6: #999999;
  --color7: #1b1534;
  --color8: #1b1534aa;
  --color9: #e5e5e5;
  --color10: #1b153433;
  --color11: #00aab2;
  --color12: #009299;

  --mainColor1: #1b1534;
  --mainColor2: #00b2bb;
  --mainColor3: #95c122;
  --mainColor4: #d6fbf9;
  --mainColor5: #009299;
  --mainColor6: #ffffff;
  --mainColor7: #c8ebee;
  --mainColor8: #376466;
  --mainColor9: #1b1534;
  --mainColor10: #019da5;
  --mainColor11: #ebfcfb;

  --themSideTextColor: #ffffff;
  --themSideBgColor: #1b1534;
  --themSideHoverTextColor: #ffffff;
  --themSideHoverBgColor: #00747a;
  --themMainTextColor: #000000;
  --themLinkTextColor: #009299;
  --themDisableTextColor: #ccd4df;
  --themDisableBgColor: #f7f8fc;
  --themIconDisableTextColor: #ccd4df;
  --themIconDisableBgColor: #f7f8fc;
  --themIconTextColor: #009299;
  --themIconBgColor: #ffffff;
  --themIconHoverTextColor: #009299;
  --themIconHoverBgColor: #d6fbf9;
  --themIconActiveTextColor: #ffffff;
  --themIconActiveBgColor: #009299;
  --themBtnBgPrimary: #009299;
  --themBtnTextPrimary: #ffffff;
  --themInputBorderPrimary: #009299;
  --themInputTextPrimary: #376466;
  --themInputBorderFailed: #d04863;
  --themInputTextFailed: #99a3ba;
  --themInputBorderSucces: #57ca81;
  --themInputTextSucces: #376466;
  --themInputHintText: #99a3ba;
}

:root {
  --color0: #fff;
  --color1: #67d0d5;
  --color2: #009299;
  --color3: #3f2c77;
  --color4: #404e67;
  --color5: #253044;
  --color6: #999999;
  --color7: #1b1534;
  --color8: #1b1534aa;
  --color9: #e5e5e5;
  --color10: #1b153433;
  --color11: #00aab2;
  --color12: #009299;

  --mainColor1: #1b1534;
  --mainColor2: #00b2bb;
  --mainColor3: #95c122;
  --mainColor4: #d6fbf9;
  --mainColor5: #009299;
  --mainColor6: #ffffff;
  --mainColor7: #c8ebee;
  --mainColor8: #376466;
  --mainColor9: #1b1534;
  --mainColor10: #019da5;
  --mainColor11: #ebfcfb;

  --themSideTextColor: #ffffff;
  --themSideBgColor: #1b1534;
  --themSideHoverTextColor: #ffffff;
  --themSideHoverBgColor: #00747a;
  --themMainTextColor: #000000;
  --themLinkTextColor: #009299;
  --themDisableTextColor: #ccd4df;
  --themDisableBgColor: #f7f8fc;
  --themIconDisableTextColor: #ccd4df;
  --themIconDisableBgColor: #f7f8fc;
  --themIconTextColor: #009299;
  --themIconBgColor: #ffffff;
  --themIconHoverTextColor: #009299;
  --themIconHoverBgColor: #d6fbf9;
  --themIconActiveTextColor: #ffffff;
  --themIconActiveBgColor: #009299;
  --themBtnBgPrimary: #009299;
  --themBtnTextPrimary: #ffffff;
  --themInputBorderPrimary: #009299;
  --themInputTextPrimary: #376466;
  --themInputBorderFailed: #d04863;
  --themInputTextFailed: #99a3ba;
  --themInputBorderSucces: #57ca81;
  --themInputTextSucces: #376466;
  --themInputHintText: #99a3ba;
}
body {
}
.login-logo-mask,
.public-page {
  background-color: transparent;
}

.login-logo-mask:before {
}

.smart-secretary-form-input {
  width: 400px;
}

.smart-secretary-form-text-area {
  width: 600px;
  height: 200px;
}

@media only screen and (max-width: 600px) {
  .smart-secretary-form-input {
    width: 310px;
  }

  .smart-secretary-form-text-area {
    width: 310px;
    height: 200px;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .smart-secretary-form-input {
    width: 300px;
  }

  .smart-secretary-form-text-area {
    width: 400px;
    height: 200px;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .smart-secretary-form-input {
    width: 300px;
  }

  .smart-secretary-form-text-area {
    width: 310px;
    height: 200px;
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .smart-secretary-form-text-area {
    width: 300px;
    height: 200px;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .smart-secretary-form-text-area {
    width: 600px;
    height: 200px;
  }
}

.search-filter-component {
  justify-content: center;
  width: 100%;
  display: flex;
}
.toolbar-component .search-filter-component {
  position: sticky;
  top: 0;
  background: #f5f6f9;
}

.search-filter-wrapper {
  /* justify-content: center; */

  display: inline-flex;
  margin: auto;
}

.search-filter-wrapper .form-wrapper {
  width: 300px;
  max-width: 100%;
}

.search-filter-inner-icon {
  cursor: pointer;
  color: var(--mainColor5);
  margin: 3px 0 0 -8px;
}

.search-filter-button {
  height: 44px;
  margin: 0 4px;
}
.search-filter-btn {
  margin: 12px 0;
}

@media only screen and (max-width: 768px) {
  .search-filter-input {
    width: calc(100% - 2px);
  }

  .search-filter-inner-icon {
    top: 2px;
    left: 1px;
  }

  .search-filter-wrapper {
    display: flex;
    flex-direction: column;
  }

  .search-filter-component {
    justify-content: space-between;
    width: 100%;
    display: flex;
    flex-direction: column;
  }
  .search-filter-button {
    margin: 0 0 12px 0;
    align-items: center;
    justify-content: center;
    width: calc(100% - 4px);
  }
}

.add-companies {
  width: 148px;
  display: inline-flex;
  position: relative;
  margin: 0.5rem;
  border-radius: 15px;
  padding: 0.1rem;
  overflow: hidden;
  text-align: center;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  border: none;
  float: right;
  transition: 0.3s;
}

.add-company-component {
  width: 128px;
  height: 128px;
  /* border: 1px solid #e5e5e5; */
  border-radius: 50%;
  background-color: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 8px 44px;
  cursor: pointer;
  filter: grayscale(90) blur(1px);
  background: linear-gradient(180deg, #ccc, #eee);
  transition: 0.3s;
  opacity: 0.7;
  overflow: hidden;
  border: 8px solid #ddd;
}

.select,
.selected,
.add-company-component:hover {
  transition: 0.3s;
  filter: grayscale(0) blur(0px);
  background: linear-gradient(180deg, var(--mainColor5), var(--mainColor5) 33);
  opacity: 1;
}

.select {
  border: 4px solid var(--mainColor5);
  border-radius: 10px;
}
.select + div {
  background: var(--mainColor5);
  color: var(--mainColor4) !important;
}
.select + div .add-company-title {
  background: var(--mainColor5);
  color: var(--mainColor4) !important;
}

/* .add-company-component:hover {
  border: 1px solid #8ce2de;
} */

.add-company-img {
  width: 100%;
  margin: auto;
  display: block;
  transition: 0.3s;
}

.add-company-component:hover .add-company-img {
  transition: 0.3s;
  transform: scale(1.1) rotate(-1deg);
}
.add-company-title-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  /* width: 170px; */
  position: relative;
  height: 25px;
  min-width: 148px;
  overflow: hidden;
  margin-top: -20px;
  border-radius: 10px;
  background: #eee;
}

.add-company-title {
  text-align: center;
  font-size: 13px;
  color: var(--mainColor5);
  font-weight: bold;
  cursor: pointer;
  position: absolute;
  min-width: 148px;
  /*width: fit-content;*/
  white-space: nowrap;
  padding: 0 10px;
  right: 50%;
  transition: 0.3s;
  transform: translateX(50%);
  width: 91px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.add-companies:hover .add-company-title {
  transition: 0.3s;
  transform: translateX(-100%);
  animation: 4000ms pulsate infinite;
  overflow: hidden;
  width: fit-content;
  overflow: initial;
}

@keyframes pulsate {
  0% {
    right: 0;
    left: 0;
    transform: translateX(0);
    transition: 0.3s;
  }
  50% {
    transform: translateX(calc(100% - 148px));
    transition: 0.3s;
  }
  100% {
    right: 0;
    left: 0;
    transform: translateX(0);
    transition: 0.3s;
  }
}

.add-company-title:hover {
  color: #a5acc6;
}

.add-company-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.add-company-wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}

.add-company-wrapper-show {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.add-company-btn {
  margin: 0 16px;
  justify-content: flex-start;
  display: flex;
}

.add-company-wrapper-show-null {
  border-radius: 15px;
  padding: 20px;
  border: 2px dashed #999;
  line-height: 27px;
  color: var(--mainColor8);
}

.check-icon-close {
  position: absolute;
  left: 46px;
  top: 10px;
  z-index: 10;
  background-color: #900;
  color: var(--mainColor6);
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
  cursor: pointer;
}

@media only screen and (max-width: 640px) {
  .company-cpmpare-wrapper {
    overflow-x: scroll;
  }
  .add-company-wrapper-show {
    display: block;
  }
  .company-cpmpare-wrapper > .add-company-wrapper-show > div:first-of-type {
    display: none;
  }
  .company-cpmpare-wrapper > .add-company-wrapper-show > div {
    margin: 4px;
    justify-content: center;
  }
  .add-companies {
    width: 78px;
    display: inline-flex;
  }
  .add-company-component {
    width: 70px;
    height: 70px;
  }
  .add-company-wrapper {
    height: calc(72vh - 130px) !important;
  }
  .search-filter-component + div > span {
    display: none !important;
  }
}

/* @media only screen and (min-width: 1182px) {
  .company-cpmpare-wrapper {
    overflow-x: scroll;
  }
} */

.vods {
  display: flex;
  flex-wrap: wrap;
}
.vod-items {
  display: flex;
  flex-wrap: wrap;
  overflow-wrap: break-word;
}
.vod-item {
  position: relative;
  display: inline-block;
  max-width: 90%;
  width: 250px;
  margin: 8px;
  padding: 10px;
  background: var(--mainColor6);
  border-radius: 5px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}
.vod-item img {
  width: 100%;
  border-radius: 5px 5px 0 0;
}
.vod-item h4,
.vod-item h3 {
  margin: 0;
  padding: 0;
}
.vod-item a {
  display: block;
}
.vod-item em {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 2px 5px;
  background: rgba(0, 0, 0, 0.5);
  color: var(--mainColor6);
  border-radius: 5px 0;
  direction: ltr;
}
.vod-item-info {
  background: rgba(0, 0, 0, 0.7);
  padding: 8px;
  margin: -10px 0 5px 0;
  display: block;
  height: 28px;
  color: var(--mainColor6);
  border-radius: 0 0 5px 5px;
}
.vod-item-info span {
  margin: 0 2px;
}
.vod-item-info > span {
  display: inline-flex;
  align-items: center;
}
.vod-item-info > .view_count {
  float: left;
}

.share-link {
  position: relative;
}
.share-link ul {
  background-color: rgba(0, 0, 0, 0.05);
  padding: 1px;
  margin: 0;
  border-radius: 5px;
  line-height: 0;
  display: inline-block;
}
.share-link ul li {
  padding: 8px 3px;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  display: inline-flex;
  justify-content: center;
  margin: 0;
}
.share-link ul li:last-of-type {
  border-left: none;
}
.share-link ul li a {
  margin: 0;
}

.share-link ul li .brandmi-icon {
  font-size: 12px;
}

.toolbar-component {
  position: fixed;
  bottom: calc(100% - 40px);
  right: 50%;
  z-index: 1050;
  /* position: relative; */
  /* margin: 0 200px 0 0; */
  transform: translateX(50%);
  max-width: calc(100% - 170px);
  top: 0;
}

.lastitem {
  display: flex;
  justify-content: space-between;
  width: 100%;
  border-top: 1px solid #ccc;
}

.toolbar-wrapper {
  width: 300px;
  max-width: 100%;
  background: linear-gradient(14deg, #f2f2f2, #f7f8fc);
  border-radius: 0 0 8px 8px;
  box-shadow: 0px 2px 5px 3px rgb(206 206 206 / 70%);
  padding: 0 0 2px;
  overflow: hidden;
  position: relative;
  max-width: 100%;
  border: 5px solid var(--mainColor5);
  border-top: 0;
}
.toolbar-wrapper-open-true {
  overflow: auto;
  height: auto;
}
.toolbar-wrapper-open-false {
  height: 40px;
}

.toolbar-wrapper > div > ul {
  list-style: none;
  padding: 0;
  margin: 0;
  overflow: auto;
}

.toolbar-wrapper > div > ul > li,
.lastitem-p > div,
.lastitem {
  height: 36px;
  margin: 0 0 4px 0;
  display: flex;
  align-items: center;
  padding: 0 6px 0 24px;
  cursor: pointer;
}
.toolbar-wrapper > div > ul > li a {
  white-space: pre;
  display: inline-flex;
  word-break: break-word;
  align-items: center;
}
.toolbar-wrapper > div > ul > li a span {
  margin: 0 5px;
  display: inline-block;
  color: var(--mainColor5);
}
.lastitem > div {
  justify-content: space-between;
}
.lastitem-p > div,
.toolbar-wrapper > div > ul > li {
  border-bottom: 1px solid #eee;
}
.lastitem-p > div > span,
.toolbar-wrapper > div > ul > li > span {
  display: inline-block;
  margin: 0 5px;
}
.toolbar-wrapper .brandmi-icon,
.toolbar-wrapper > div > ul > li > span {
  cursor: pointer;
}
.toolbar-wrapper > div > ul > li .brandmi-icon {
  color: #999;
}
.toolbar-wrapper > div > ul > li .brandmi-icon:hover {
  color: var(--themLinkTextColor);
}

.lastitem-p > div,
.toolbar-wrapper > div > ul > li.toolbal-selected {
  color: var(--mainColor5);
}
.toolbar-wrapper > div > ul > li.toolbal-selected {
  background-color: var(--mainColor4);
}

.toolbat-title {
  color: var(--mainColor5);
  font-size: 14px;
  font-weight: bold;
}

.toolbar-icon {
  color: var(--mainColor5);
}

@media only screen and (max-width: 600px) {
  .toolbar-wrapper > div > ul > li,
  .lastitem-p > div,
  .lastitem {
    padding: 0 12px 0 12px;
  }
  .toolbar-wrapper > div > ul > li .brandmi-icon,
  .lastitem-p > div .brandmi-icon,
  .lastitem .brandmi-icon,
  .toolbar-wrapper > div > ul > li .avatar,
  .lastitem-p > div .avatar,
  .lastitem .avatar {
    display: none;
  }
  .toolbar-wrapper > div > ul > li {
    border-bottom: 1px dashed #ccc;
  }

  .toolbar-component {
    right: 85px;
    transform: none;
    left: 50px;
    max-width: calc(100% - 135px);
  }
}

.add-companies {
  width: 148px;
  display: inline-flex;
  position: relative;
  margin: 0.5rem;
  border-radius: 15px;
  padding: 0.1rem;
  overflow: hidden;
  text-align: center;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  border: none;
  float: right;
}

.add-company-component {
  width: 128px;
  height: 128px;
  /* border: 1px solid #e5e5e5; */
  border-radius: 50%;
  background-color: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 8px 44px;
  cursor: pointer;
  filter: grayscale(90) blur(1px);
  background: linear-gradient(180deg, #ccc, #eee);
  transition: 0.3s;
  opacity: 0.7;
  overflow: hidden;
  border: 8px solid #ddd;
}

.add-companies.add-companies-min-size {
  width: 90px;
  height: 90px;
  border-radius: 5px;
  font-size: 10px;
  margin: 2px;
}

.add-companies.add-companies-min-size .add-company-component {
  width: 80px;
  height: 80px;
  border-radius: 5px;
  margin: 2px;
  border: 1px solid #ddd;
}

.add-companies.add-companies-min-size .add-company-title-wrapper {
  min-width: 80px;
  border-radius: 2px;
  height: 18px;
}
.add-companies.add-companies-min-size
  .add-company-title-wrapper
  .add-company-title {
  min-width: 80px;
  width: 78px;
  font-size: 10px;
  padding: 2px;
}

.add-companies.add-companies-min-size:hover .add-company-title {
  transition: 0.3s !important;
  transform: translateX(-100%);
  animation: 4000ms pulsate2 infinite !important;
  overflow: hidden !important;
  width: fit-content !important;
  overflow: initial !important;
}

.select,
.selected,
.add-company-component:hover {
  transition: 0.3s;
  filter: grayscale(0) blur(0px);
  background: linear-gradient(180deg, var(--mainColor5), var(--mainColor5) 33);
  opacity: 1;
}

.select {
  border: 4px solid var(--mainColor5);
  border-radius: 10px;
}
.select + div {
  background: var(--mainColor5);
  color: var(--mainColor4) !important;
}
.select + div .add-company-title {
  background: var(--mainColor5);
  color: var(--mainColor4) !important;
}

/* .add-company-component:hover {
  border: 1px solid #8ce2de;
} */

.add-company-img {
  width: 100%;
  margin: auto;
  display: block;
  transition: 0.3s;
}

.add-company-component:hover .add-company-img {
  transition: 0.3s;
  transform: scale(1.1) rotate(-1deg);
}
.add-company-title-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  /* width: 170px; */
  position: relative;
  height: 25px;
  min-width: 148px;
  overflow: hidden;
  margin-top: -20px;
  border-radius: 10px;
  background: #eee;
}

.add-company-title {
  text-align: center;
  font-size: 13px;
  color: var(--mainColor5);
  font-weight: bold;
  cursor: pointer;
  position: absolute;
  min-width: 148px;
  /*width: fit-content;*/
  white-space: nowrap;
  padding: 0 10px;
  right: 50%;
  transition: 0.3s;
  transform: translateX(50%);
  width: 91px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.add-companies:hover .add-company-title {
  transition: 0.3s;
  transform: translateX(-100%);
  animation: 4000ms pulsate infinite;
  overflow: hidden;
  width: fit-content;
  overflow: initial;
}

@keyframes pulsate {
  0% {
    right: 0;
    left: 0;
    transform: translateX(0);
    transition: 0.3s;
  }
  50% {
    transform: translateX(calc(100% - 148px));
    transition: 0.3s;
  }
  100% {
    right: 0;
    left: 0;
    transform: translateX(0);
    transition: 0.3s;
  }
}
@keyframes pulsate2 {
  0% {
    right: 0;
    left: 0;
    transform: translateX(0);
    transition: 0.3s;
  }
  50% {
    transform: translateX(calc(100% - 50px));
    transition: 0.3s;
  }
  100% {
    right: 0;
    left: 0;
    transform: translateX(0);
    transition: 0.3s;
  }
}

.add-company-title:hover {
  color: #a5acc6;
}

.add-company-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.add-company-wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}

.add-company-wrapper-show {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.add-company-btn {
  margin: 0 16px;
  justify-content: flex-start;
  display: flex;
}

.add-company-wrapper-show-null {
  border-radius: 15px;
  padding: 20px;
  border: 2px dashed #999;
  line-height: 27px;
  color: var(--mainColor8);
}

.check-icon-close {
  position: absolute;
  left: 46px;
  top: 10px;
  z-index: 10;
  background-color: #900;
  color: var(--mainColor6);
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
  cursor: pointer;
}

@media only screen and (max-width: 640px) {
  .company-cpmpare-wrapper {
    overflow-x: scroll;
  }
  .add-company-wrapper-show {
    display: block;
  }
  .company-cpmpare-wrapper > .add-company-wrapper-show > div:first-of-type {
    display: none;
  }
  .company-cpmpare-wrapper > .add-company-wrapper-show > div {
    margin: 4px;
    justify-content: center;
  }
  .add-companies {
    width: 78px;
    display: inline-flex;
  }
  .add-company-component {
    width: 70px;
    height: 70px;
  }
  .add-company-wrapper {
    height: calc(72vh - 70px) !important;
  }
  .search-filter-component + div > span {
    display: none !important;
  }
}

/* @media only screen and (min-width: 1182px) {
  .company-cpmpare-wrapper {
    overflow-x: scroll;
  }
} */

.access-component {
  width: 100%;
  /* height: 232px; */
  /* background-color: red; */
  position: relative;
}

.access-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  color: var(--mainColor5);
  font-weight: bold;
  font-size: 13px;
  flex-direction: column;
  text-align: center;
}

.access-title {
  margin: 12px 0;
}

.access-img {
  width: 74%;
  max-width: 400px;
  /* width: 400px; */
}

.access-disabled {
  display: flex;
  align-items: center;
  justify-content: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute;
  z-index: 1000;
  background-color: rgba(255, 255, 255, 0.5);
  user-select: none;
  /* height: 232px; */
}

.access-disabled-background {
  width: 100%;
  height: 100%;
  background-color: rgba(211, 211, 211, 0.185);
  position: relative;
  filter: grayscale(1) blur(5px);
}

.smart-secretary-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  overflow: auto;
  background-color: #f6f8fb;
  border-radius: 8px;
  font-size: 12px;
  color: var(--mainColor5);
  padding: 10px;
}

.smart-secretary-details {
  display: flex;
  align-items: center;
  margin: 3px 0;
}

.smart-secretary-item {
  display: flex;
}

.smart-secretary-item-space {
  flex: 1;
}

.smart-secretary-text {
  text-align: center;
  align-items: center;
  padding: 0 12px;
}

.smart-secretary-button-wrapper {
  padding: 2px;
  display: flex;
  flex-direction: row;
}

.smart-secretary-button {
  margin: 3px;
}

.smart-secretary-details-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 0 12px 0;
  cursor: pointer;
}

.smart-secretary-details-text {
  font-size: 15px;
  color: var(--mainColor5);
  text-align: center;
  padding: 0 0 4px 0;
}

.smart-secretary-select {
  padding: 16px 0 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.reaction-icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

.user-info-draw {
  border: none;
  border-bottom: 2px solid #f6f8fb;
  margin: 0px 10% 0 auto;
  width: 80%;
}

.reaction-icon-close {
  width: 24px;
  height: 24px;
  background-color: #ffb1b1;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.reaction-icon-warning {
  width: 24px;
  height: 24px;
  user-select: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.warning-icon {
  margin: 4px 0 0 0;
}

.user-info-label {
  margin: 8px 16px;
}

.user-info-count-wrapper {
  width: auto;
  display: flex;
  align-items: center;
  font-size: 14px;
}

.user-info-count-max {
  font-weight: bold;
}

.user-info-component {
  width: 100%;
  height: 716px;
  align-items: center;
  flex-direction: column;
}

.button-wrapper {
  margin: 64px 0 0 0;
  text-align: center;
}

@media only screen and (max-width: 600px) {
  .button-wrapper {
    margin: 16px 0 0 0;
  }
}

.useful-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 120px;
}

.card-useful-item {
  background-color: #f6f8fb;
  box-shadow: 0px 2px 10px rgba(111, 111, 111, 0.21);
}

.useful-icon-item {
  position: absolute;
  color: #ccd4df;
  font-size: 45px;
  top: 10px;
}

.useful-label-item {
  position: absolute;
  bottom: 0;
  z-index: 1;
  color: #a5acc6;
  font-size: 18px;
}

.card-quick-item {
  background-color: #ecfdff;
  box-shadow: 0px 2px 10px rgba(111, 111, 111, 0.21);
}

.quick-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 120px;
}

.quick-icon-item {
  position: absolute;
  color: #ccd4df;
  font-size: 45px;
  top: 10px;
}

.quick-label-item {
  position: absolute;
  bottom: 0;
  z-index: 1;
  color: #a5acc6;
  font-size: 18px;
}

.card-quick-item2 {
  position: absolute;
  background-color: tomato;
}

.smart-secretary-channellist-component {
  justify-content: center;
  display: flex;
  width: 100%;
}

.smart-secretary-channellist-wrapper {
  justify-content: center;
  width: 100%;
  display: flex;
}

.smart-secretary-channellist-input {
  width: 300px;
}

.smart-secretary-channellist-inner-icon {
  cursor: pointer;
  position: absolute;
  top: 2px;
  left: 16px;
  color: var(--mainColor5);
}

.smart-secretary-channellist-button {
  margin: 0 2px;
  height: 44px;
  width: 100px;
}

@media only screen and (max-width: 768px) {
  .smart-secretary-channellist-input {
    width: calc(100% - 2px);
  }

  .smart-secretary-channellist-inner-icon {
    top: 2px;
    left: 1px;
  }

  .smart-secretary-channellist-component {
    justify-content: space-between;
    width: 100%;
    display: flex;
  }
  .smart-secretary-channellist-button {
    margin: 0 0 12px 0;
    align-items: center;
    justify-content: center;
    width: calc(100% - 4px);
  }
}

.smart-secretary-form-input {
  width: 400px;
}

.smart-secretary-form-text-area {
  width: 600px;
  height: 200px;
}

@media only screen and (max-width: 600px) {
  .smart-secretary-form-input {
    width: 310px;
  }

  .smart-secretary-form-text-area {
    width: 310px;
    height: 200px;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .smart-secretary-form-input {
    width: 300px;
  }

  .smart-secretary-form-text-area {
    width: 400px;
    height: 200px;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .smart-secretary-form-input {
    width: 300px;
  }

  .smart-secretary-form-text-area {
    width: 310px;
    height: 200px;
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .smart-secretary-form-text-area {
    width: 300px;
    height: 200px;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .smart-secretary-form-text-area {
    width: 600px;
    height: 200px;
  }
}

.event-title {
  color: #a5acc6;
  padding: 5px;
}

.event-date {
  float: left;
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 0;
  cursor: pointer;
  transition: 0.3s;
}
.event-date:hover {
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  transition: 0.3s;
}
.event-date h1,
.event-date h3 {
  padding: 0;
  margin: 0;
  white-space: nowrap;
  font-size: 18px;
}

.event-text {
  /* display: inline-block; */
  margin: 0 4px;
}

.event-category {
  display: inline-block;
  background: #f6f6f6;
  color: #999999;
  border-radius: 4px;
  padding: 2px 8px;
  margin: 0 4px;
  font-size: 10px;
}
.events-list {
  border: 1px solid #eee;
  margin: 0 20px;
  display: inline-block;
  width: calc(100% - 180px);
  border-radius: 8px;
}
.events-list-today {
  border: 1px solid #eee;
  margin: 0 20px;
  display: inline-block;
  width: calc(100% - 36px);
  border-radius: 8px;
}
.events-list legend {
  color: var(--mainColor5);
}
.events-list ul li {
  margin: 2px;
}

.card-gishe-wrapper {
  display: flex;
  color: var(--mainColor5);
  align-items: center;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  color: var(--mainColor5);
  font-weight: bold;
  font-size: 16px;
}

@media only screen and (max-width: 768px) {
  .event-date {
    float: none;
    margin: auto;
  }
  .events-list {
    width: calc(100% - 40px);
  }
}

span.cat {
  color: var(--mainColor6);
}
span.cat.cat-2 {
  background-color: #c99a7d !important;
}

span.cat.cat-3 {
  background-color: #87986a !important;
}

span.cat.cat-4 {
  background-color: #ffafcc !important;
}

span.cat.cat-7 {
  background-color: #68afab !important;
}

span.cat.cat-8 {
  background: #c0a2d7 !important;
}

span.cat.cat-11 {
  background-color: #7abdfb !important;
}

span.cat.cat-5 {
  background-color: #e3c312 !important;
}

.h-a {
  background: linear-gradient(45deg, #253044, #00b2bb, #95c122);
  background-size: 600% 600%;

  -webkit-animation: AnimationName 30s ease infinite;
  -moz-animation: AnimationName 30s ease infinite;
  animation: AnimationName 30s ease infinite;

  height: 100px;
}
.h-a a {
  background-size: auto 100%;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-position: center;
  border-radius: 5px;

  /*-webkit-animation: AnimationName2 30s ease infinite;*/
  /*-moz-animation: AnimationName2 30s ease infinite;*/
  /*animation: AnimationName2 30s ease infinite;*/
  transition: 0.3s;
}
.h-a a:hover {
  box-shadow: 0 5px 10px #000;
  transition: 0.3s;
}

@-webkit-keyframes AnimationName {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@-moz-keyframes AnimationName {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes AnimationName {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@-webkit-keyframes AnimationName2 {
  0% {
    filter: hue-rotate(0deg);
  }
  50% {
    filter: hue-rotate(180deg);
  }
  100% {
    filter: hue-rotate(360deg);
  }
}
@-moz-keyframes AnimationName2 {
  0% {
    filter: hue-rotate(0deg);
  }
  50% {
    filter: hue-rotate(180deg);
  }
  100% {
    filter: hue-rotate(360deg);
  }
}
@keyframes AnimationName2 {
  0% {
    filter: hue-rotate(0deg);
  }
  50% {
    filter: hue-rotate(180deg);
  }
  100% {
    filter: hue-rotate(360deg);
  }
}
@media only screen and (max-width: 640px) {
  .h-a {
    min-height: 120px;
  }
}

.user-info-component-wrapper-1 {
  display: flex;
  width: 100%;
  flex-direction: column;
  user-select: none;
}

.user-info-avatar-wrapper-1 {
  display: flex;
}

.user-info-avatar-1 {
  width: 60px;
  height: 60px;
  background-color: var(--mainColor4);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  position: absolute;
  top: 6px;
  right: 4px;
}
.user-info-avatar-1:hover,
.user-info-avatar-1:hover .avatar {
  border-radius: 10px;
  transition: 0.3s;
}

.user-info-avatar-image-1 {
  width: 92px;
  height: 92px;
  background-color: rgb(223, 223, 223);
  border-radius: 50%;
}

.user-info-title-wrapper-1 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 12px;
  background-color: var(--mainColor4);
  border: 1px solid #c5f7ef;
  width: 100%;
  margin: 18px 0;
  border-radius: 12px;
}

.user-info-name-1 {
  color: var(--mainColor8);
  font-size: 14px;
  /* text-align: center; */
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: var(--mainColor5);
  /* font-weight: bold; */
  margin: 0 50px 0 0;
  padding: 0 0 4px 0;
}

.user-info-account-1 {
  color: var(--mainColor5);
  /* font-weight: bold; */
  font-size: 14px;
  direction: ltr;
  margin: 0 24px 0 6px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  font-family: Verdana, Geneva, Tahoma, sans-serif !important;
}

.user-info-customer-wrapper {
  display: flex;
  padding: 0 0 16px 0;
}

.user-info-brand-wrapper-1 {
  width: 100%;
  height: 44px;
  border-radius: 10px;
}

.user-info-brand-1 {
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
  /* background-color: var(--mainColor5); */
  border: 1px solid #e1f5f4;
  border-radius: 10px;
  padding: 2px;
}

.user-info-brand-image-wrapper-1 {
  display: flex;
  justify-content: flex-start;
  margin: 4px 16px;
}

.user-info-brand-name-1 {
  color: var(--mainColor8);
  font-size: 14px;
  justify-content: center;
  color: var(--mainColor5);
  /* text-align: center;
  width: 70%; */
}

.user-info-credit-wrapper-1 {
  border-radius: 8px;
  width: 100%;
  height: 44px;
  /* margin: 0 0 8px 8px; */
}

.user-info-credit-1 {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  height: 100%;
  padding: 0 8px;
}

.user-info-credit-profile-1 {
  /* display: flex; */
  /* width: 100%; */
  padding: 12px 0;
}

.user-info-credit-text-1 {
  color: #997070;
  font-size: 14px;
}

.user-info-credit-profile-text-1 {
  color: #997070;
  font-size: 12px;
}

.user-info-credit-number-1 {
  color: var(--mainColor8);
  font-size: 18px;
}

.user-info-title-profile-wrapper-1 {
  display: flex;
  background-color: var(--mainColor4);
  border-radius: 8px;
  height: 44px;
  align-items: center;
  justify-content: space-between;
  padding: 0 6px;
}

.rc-tooltip.rc-tooltip-zoom-appear,
.rc-tooltip.rc-tooltip-zoom-enter {
  opacity: 0;
}
.rc-tooltip.rc-tooltip-zoom-enter,
.rc-tooltip.rc-tooltip-zoom-leave {
  display: block;
}
.rc-tooltip-zoom-enter,
.rc-tooltip-zoom-appear {
  opacity: 0;
  animation-duration: 0.3s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
  animation-play-state: paused;
}
.rc-tooltip-zoom-leave {
  animation-duration: 0.3s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.6, -0.3, 0.74, 0.05);
  animation-play-state: paused;
}
.rc-tooltip-zoom-enter.rc-tooltip-zoom-enter-active,
.rc-tooltip-zoom-appear.rc-tooltip-zoom-appear-active {
  animation-name: rcToolTipZoomIn;
  animation-play-state: running;
}
.rc-tooltip-zoom-leave.rc-tooltip-zoom-leave-active {
  animation-name: rcToolTipZoomOut;
  animation-play-state: running;
}
@keyframes rcToolTipZoomIn {
  0% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(0, 0);
  }
  100% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
  }
}
@keyframes rcToolTipZoomOut {
  0% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
  }
  100% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(0, 0);
  }
}
.rc-tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  visibility: visible;
  font-size: 12px;
  line-height: 1.5;
  opacity: 0.9;
}
.rc-tooltip-hidden {
  display: none;
}
.rc-tooltip-placement-top,
.rc-tooltip-placement-topLeft,
.rc-tooltip-placement-topRight {
  padding: 5px 0 9px 0;
}
.rc-tooltip-placement-right,
.rc-tooltip-placement-rightTop,
.rc-tooltip-placement-rightBottom {
  padding: 0 5px 0 9px;
}
.rc-tooltip-placement-bottom,
.rc-tooltip-placement-bottomLeft,
.rc-tooltip-placement-bottomRight {
  padding: 9px 0 5px 0;
}
.rc-tooltip-placement-left,
.rc-tooltip-placement-leftTop,
.rc-tooltip-placement-leftBottom {
  padding: 0 9px 0 5px;
}
.rc-tooltip-inner {
  padding: 8px 10px;
  color: #fff;
  text-align: left;
  text-decoration: none;
  background-color: #373737;
  border-radius: 6px;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.17);
  min-height: 34px;
}
.rc-tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.rc-tooltip-placement-top .rc-tooltip-arrow,
.rc-tooltip-placement-topLeft .rc-tooltip-arrow,
.rc-tooltip-placement-topRight .rc-tooltip-arrow {
  bottom: 4px;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #373737;
}
.rc-tooltip-placement-top .rc-tooltip-arrow {
  left: 50%;
}
.rc-tooltip-placement-topLeft .rc-tooltip-arrow {
  left: 15%;
}
.rc-tooltip-placement-topRight .rc-tooltip-arrow {
  right: 15%;
}
.rc-tooltip-placement-right .rc-tooltip-arrow,
.rc-tooltip-placement-rightTop .rc-tooltip-arrow,
.rc-tooltip-placement-rightBottom .rc-tooltip-arrow {
  left: 4px;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #373737;
}
.rc-tooltip-placement-right .rc-tooltip-arrow {
  top: 50%;
}
.rc-tooltip-placement-rightTop .rc-tooltip-arrow {
  top: 15%;
  margin-top: 0;
}
.rc-tooltip-placement-rightBottom .rc-tooltip-arrow {
  bottom: 15%;
}
.rc-tooltip-placement-left .rc-tooltip-arrow,
.rc-tooltip-placement-leftTop .rc-tooltip-arrow,
.rc-tooltip-placement-leftBottom .rc-tooltip-arrow {
  right: 4px;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #373737;
}
.rc-tooltip-placement-left .rc-tooltip-arrow {
  top: 50%;
}
.rc-tooltip-placement-leftTop .rc-tooltip-arrow {
  top: 15%;
  margin-top: 0;
}
.rc-tooltip-placement-leftBottom .rc-tooltip-arrow {
  bottom: 15%;
}
.rc-tooltip-placement-bottom .rc-tooltip-arrow,
.rc-tooltip-placement-bottomLeft .rc-tooltip-arrow,
.rc-tooltip-placement-bottomRight .rc-tooltip-arrow {
  top: 4px;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #373737;
}
.rc-tooltip-placement-bottom .rc-tooltip-arrow {
  left: 50%;
}
.rc-tooltip-placement-bottomLeft .rc-tooltip-arrow {
  left: 15%;
}
.rc-tooltip-placement-bottomRight .rc-tooltip-arrow {
  right: 15%;
}

#header {
  height: 50px;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
  background: var(--mainColor6);
  position: sticky;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1050;
}
#header .header-logo {
  height: 50px;
  display: inline-flex;
}
#header .header-logo a {
  overflow: hidden;
  display: block;
  white-space: nowrap;
}
#header .header-logo h1 {
  margin: 0;
  padding: 8px;
  font-size: 16px;
  float: right;
}
#header .header-logo h1 svg {
  float: right;
  margin: 0 0 0 8px;
}
#header .header-logo h1 svg * {
  stroke: var(--mainColor2);
}

#header .header-logo a {
  color: var(--themIconTextColor);
}
#header .header-menu {
  cursor: pointer;
  margin: 16px 8px 0 4px;
  float: left;
}
#header .header-menu {
  color: var(--themIconTextColor);
}
#header .header-menu:hover {
  color: var(--color8);
}
#header .header-datetime {
  user-select: none;
  position: absolute;
  top: 0;
  right: 220px;
  padding: 4px 10px;
  border-radius: 0 0 12px 12px;
  font-size: 14px;
}
#header .header-datetime h2,
#header .header-datetime h4 {
  display: inline-block;
  text-align: center;
  padding: 0;
  margin: 0 2px;
}
#header .header-datetime span {
  display: inline-block;
  min-width: 80px;
  text-align: center;
}
#header .header-toolbar {
  float: left;
  margin: 0 24px;
  position: relative;
}

#header .header-toolbar .header-toolbar-menu {
  display: none;
  margin: 16px 0 0 0;
  cursor: pointer;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar > ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#header .header-toolbar > ul > li {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 8px 2px;
  cursor: pointer;
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  border-radius: 4px;
}
#header .header-toolbar > ul > li a {
  line-height: 0;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li span {
  padding: 6px;
}
#header .header-toolbar > ul > li .toolbar-title,
#header .header-toolbar > ul > li a .toolbar-title {
  display: none;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li:hover {
  background: var(--themIconHoverBgColor);
}
#header .header-toolbar > ul > li svg * {
  /* stroke: var(--themIconTextColor); */
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.active,
#header .header-toolbar > ul > li.active a,
#header .header-toolbar > ul > li.active .toolbar-title,
#header .header-toolbar > ul > li.active a .toolbar-title {
  background: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
}
#header .header-toolbar > ul > li.active svg * {
  stroke: var(--themIconActiveTextColor);
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.disable,
#header .header-toolbar > ul > li.disable a,
#header .header-toolbar > ul > li.disable .toolbar-title,
#header .header-toolbar > ul > li.disable a .toolbar-title {
  cursor: not-allowed;
  background: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
}
#header .header-toolbar > ul > li.disable svg * {
  stroke: var(--themIconDisableTextColor);
  stroke-width: 1px;
}
#header .header-toolbar.header-toolbar-menu-close {
  color: #000;
}
#header .header-toolbar.header-toolbar-menu-open {
  color: #000;
}

#header .header-toolbar > ul > li .toolbar-count {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: -4px;
  top: -4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  font-size: 9px;
  direction: ltr;
  box-shadow: 0 0 1px #fff;
}
#header .header-toolbar > ul > li .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor2);
}
#header .header-toolbar > ul > li.active .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor1);
}

#header .header-toolbar > ul > li .toolbar-count-read {
  color: #666;
  background: rgba(240, 240, 240, 0.8);
}

.add-booltan {
  cursor: pointer;
  display: flex;
}

.show-booltan {
  width: 30px;
  height: 30px;
  display: flex;
}

.hide-booltan {
  display: none;
}
#header .header-toolbar > ul > li.toolbar-item {
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  animation-name: action;
  animation-duration: 0.6s;
  animation-direction: alternate;
}

.help-box {
  position: fixed;
  width: 280px;
  left: -300px;
  top: 50px;
  z-index: 1002;
  bottom: 50px;
  background: #fafafa;
  padding: 0 8px 0 8px;
  overflow: auto;
  box-shadow: 5px 0 5px rgba(0, 0, 0, 0.3);
  transition: 0.3s;
  border-radius: 0 12px 12px 0;
}
.help-box-show {
  transition: 0.3s;
  left: 0;
}

@keyframes action {
  0% {
    background-color: var(--themIconActiveBgColor);
    color: var(--themIconActiveTextColor);
    filter: blur(2px);
  }
  50% {
    transform: scale(1.5);
    filter: blur(4px);
  }
  100% {
    filter: blur(0px);
    background-color: var(--themIconBgColor);
    color: var(--themIconTextColor);
  }
}

@media only screen and (max-width: 1200px) {
  #header .header-datetime span {
    display: none;
  }

  #header .header-toolbar .header-toolbar-menu {
    display: block;
  }
  #header .header-toolbar .header-toolbar-hidden {
    display: none;
  }
  #header .header-toolbar ul.header-toolbar-show {
    position: absolute;
    background: var(--mainColor6);
    width: 200px;
    left: -10px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    top: 50px;
    padding: 4px 0;
    z-index: 10002;
  }
  #header .header-toolbar > ul > li {
    margin: 2px;
    padding: 4px;
    cursor: pointer;
    background-color: var(--themIconBgColor);
    border-radius: 4px;
  }
  #header .header-toolbar > ul > li,
  #header .header-toolbar > ul > li a {
    display: flex;
    align-items: center;
    justify-content: start;
  }
  #header .header-toolbar > ul > li a {
    line-height: 20px;
  }
  #header .header-toolbar > ul > li .toolbar-title,
  #header .header-toolbar > ul > li a .toolbar-title {
    display: inline-block;
    margin: 0 2px;
  }

  #header .header-toolbar > ul > li .toolbar-count {
    position: absolute;
    left: 8px;
    top: 4px;
    right: auto;
  }
}

.demo-user {
  background: linear-gradient(
    45deg,
    #110000 10%,
    #550000 20%,
    #660000 25%,
    #aa0000
  );
  color: var(--mainColor6);
  padding: 20px 35px;
  font-size: 16px;
  position: sticky;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.demo-user b {
  display: inline-block;
  font-size: 22px;
  margin: 0 8px;
  color: #000000;
}
.demo-user a {
  float: left;
  padding: 5px 20px;
  border-radius: 5px;
  color: var(--mainColor6);
  background-color: #0d8400;
}

@media only screen and (max-width: 992px) {
  #header {
    position: fixed;
  }
  .demo-user {
    margin-top: 52px;
  }
}

@media only screen and (max-width: 600px) {
  #header .header-datetime {
    display: none;
  }
  .demo-user + #side + #content {
    top: 100px;
  }
}

#side {
  transition: 0.3s;
  height: calc(100vh - 50px);
  float: right;
  overflow: hidden;
  color: var(--themSideTextColor);
  background-color: var(--themSideBgColor);
  font-size: 14px;
  position: sticky;
  top: 50px;
  z-index: 1002;
}
#side .side-space {
  height: 8px;
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
#side ul {
  margin: 5px 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
  min-width: 60px;
  height: 100%;
}
#side ul li > ul {
  padding: 0 16px 0 0;
  background-color: rgba(0, 0, 0, 0.3);
  max-height: 200px;
}
#side ul li {
  margin: 1px 0;
  padding: 0;
  list-style: none;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  min-width: 180px;
}
#side ul li a {
  position: relative;
  display: flex;
  padding: 8px 4px;
}
#side ul li a span.brandmi-icon {
  margin: 0px 12px;
  display: inline-block;
}
#side ul li a,
#side ul li a * {
  color: var(--color9);
  stroke: var(--color9);
  background-color: var(--themSideBgColor);
}
#side ul li > ul a,
#side ul li > ul a * {
  color: var(--color9) aa;
  stroke: var(--color9) aa;
  background-color: var(--color7) aa;
}
#side ul li a:hover,
#side ul li a:hover * {
  background-color: var(--themSideHoverBgColor);
  color: var(--themSideHoverTextColor);
  stroke: var(--themSideHoverTextColor);
}
#side ul li a.active-item,
#side ul li a.active-item * {
  background-color: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
  stroke: var(--themIconActiveTextColor);
}
#side ul li a.active-item::before {
  content: "";
  position: absolute;
  right: 0;
  top: 1px;
  bottom: 1px;
  background-color: var(--color9);
  border-radius: 8px 0 0 8px;
  width: 4px;
}
#side ul li a.disable,
#side ul li a.disable *,
#side ul li a.disable:hover {
  cursor: not-allowed;
  color: var(--color6);
  stroke: var(--color6);
  background-color: var(--color7);
}

@media only screen and (max-width: 992px) {
  #side {
    float: none;
    position: fixed;
    z-index: 1051;
    right: 0;
  }
}

#content {
  transition: 0.3s;
  float: left;
  /*overflow-y: auto;*/
  background: var(--color9);
  min-height: calc(100vh - 50px);
  /*height: calc(100vh - 50px);*/
}
.content-shadow {
  transition: 0.3s;
  position: fixed;
  z-index: 1049;
  left: 0;
  bottom: 0;
  overflow-y: auto;
  width: 100%;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
}
.content-footer {
  height: 90px;
  background: linear-gradient(180deg, #f6f6f6, #e5e5e5);
  text-align: center;
  padding: 10px;
  color: #a5acc6;
  margin-top: 16px;
}
.content-footer ul {
  list-style: none;
  padding: 0;
  margin: 5px 0;
}
.content-footer ul li {
  display: inline-block;
}

.content-footer ul li a {
  color: var(--mainColor7);
  padding: 4px;
}
.content-footer ul li a:hover {
  color: var(--mainColor5);
}

@media only screen and (max-width: 992px) {
  #content {
    position: absolute;
    left: 0;
    top: 50px;
  }
}

#header {
  height: 50px;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
  background: var(--mainColor6);
  position: sticky;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1050;
}
#header .header-logo {
  height: 50px;
  display: inline-flex;
}
#header .header-logo a {
  overflow: hidden;
  display: block;
  white-space: nowrap;
}
#header .header-logo h1 {
  margin: 0;
  padding: 8px;
  font-size: 16px;
  float: right;
}
#header .header-logo h1 svg {
  float: right;
  margin: 0 0 0 8px;
}
#header .header-logo h1 svg * {
  stroke: var(--mainColor2);
}

#header .header-logo a {
  color: var(--themIconTextColor);
}
#header .header-menu {
  cursor: pointer;
  margin: 16px 8px 0 4px;
  float: left;
}
#header .header-menu {
  color: var(--themIconTextColor);
}
#header .header-menu:hover {
  color: var(--color8);
}
#header .header-datetime {
  user-select: none;
  position: absolute;
  top: 0;
  right: 220px;
  padding: 4px 10px;
  border-radius: 0 0 12px 12px;
  font-size: 14px;
}
#header .header-datetime h2,
#header .header-datetime h4 {
  display: inline-block;
  text-align: center;
  padding: 0;
  margin: 0 2px;
}
#header .header-datetime span {
  display: inline-block;
  min-width: 80px;
  text-align: center;
}
#header .header-toolbar {
  float: left;
  margin: 0 24px;
  position: relative;
}

#header .header-toolbar .header-toolbar-menu {
  display: none;
  margin: 16px 0 0 0;
  cursor: pointer;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar > ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#header .header-toolbar > ul > li {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 8px 2px;
  cursor: pointer;
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  border-radius: 4px;
}
#header .header-toolbar > ul > li a {
  line-height: 0;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li span {
  padding: 6px;
}
#header .header-toolbar > ul > li .toolbar-title,
#header .header-toolbar > ul > li a .toolbar-title {
  display: none;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li:hover {
  background: var(--themIconHoverBgColor);
}
#header .header-toolbar > ul > li svg * {
  /* stroke: var(--themIconTextColor); */
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.active,
#header .header-toolbar > ul > li.active a,
#header .header-toolbar > ul > li.active .toolbar-title,
#header .header-toolbar > ul > li.active a .toolbar-title {
  background: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
}
#header .header-toolbar > ul > li.active svg * {
  stroke: var(--themIconActiveTextColor);
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.disable,
#header .header-toolbar > ul > li.disable a,
#header .header-toolbar > ul > li.disable .toolbar-title,
#header .header-toolbar > ul > li.disable a .toolbar-title {
  cursor: not-allowed;
  background: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
}
#header .header-toolbar > ul > li.disable svg * {
  stroke: var(--themIconDisableTextColor);
  stroke-width: 1px;
}
#header .header-toolbar.header-toolbar-menu-close {
  color: #000;
}
#header .header-toolbar.header-toolbar-menu-open {
  color: #000;
}

#header .header-toolbar > ul > li .toolbar-count {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: -4px;
  top: -4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  font-size: 9px;
  direction: ltr;
  box-shadow: 0 0 1px #fff;
}
#header .header-toolbar > ul > li .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor2);
}
#header .header-toolbar > ul > li.active .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor1);
}

#header .header-toolbar > ul > li .toolbar-count-read {
  color: #666;
  background: rgba(240, 240, 240, 0.8);
}

.add-booltan {
  cursor: pointer;
  display: flex;
}

.show-booltan {
  width: 30px;
  height: 30px;
  display: flex;
}

.hide-booltan {
  display: none;
}
#header .header-toolbar > ul > li.toolbar-item {
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  animation-name: action;
  animation-duration: 0.6s;
  animation-direction: alternate;
}

.help-box {
  position: fixed;
  width: 280px;
  left: -300px;
  top: 50px;
  z-index: 1002;
  bottom: 50px;
  background: #fafafa;
  padding: 0 8px 0 8px;
  overflow: auto;
  box-shadow: 5px 0 5px rgba(0, 0, 0, 0.3);
  transition: 0.3s;
  border-radius: 0 12px 12px 0;
}
.help-box-show {
  transition: 0.3s;
  left: 0;
}

@keyframes action {
  0% {
    background-color: var(--themIconActiveBgColor);
    color: var(--themIconActiveTextColor);
    filter: blur(2px);
  }
  50% {
    transform: scale(1.5);
    filter: blur(4px);
  }
  100% {
    filter: blur(0px);
    background-color: var(--themIconBgColor);
    color: var(--themIconTextColor);
  }
}

@media only screen and (max-width: 1200px) {
  #header .header-datetime span {
    display: none;
  }

  #header .header-toolbar .header-toolbar-menu {
    display: block;
  }
  #header .header-toolbar .header-toolbar-hidden {
    display: none;
  }
  #header .header-toolbar ul.header-toolbar-show {
    position: absolute;
    background: var(--mainColor6);
    width: 200px;
    left: -10px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    top: 50px;
    padding: 4px 0;
    z-index: 10002;
  }
  #header .header-toolbar > ul > li {
    margin: 2px;
    padding: 4px;
    cursor: pointer;
    background-color: var(--themIconBgColor);
    border-radius: 4px;
  }
  #header .header-toolbar > ul > li,
  #header .header-toolbar > ul > li a {
    display: flex;
    align-items: center;
    justify-content: start;
  }
  #header .header-toolbar > ul > li a {
    line-height: 20px;
  }
  #header .header-toolbar > ul > li .toolbar-title,
  #header .header-toolbar > ul > li a .toolbar-title {
    display: inline-block;
    margin: 0 2px;
  }

  #header .header-toolbar > ul > li .toolbar-count {
    position: absolute;
    left: 8px;
    top: 4px;
    right: auto;
  }
}

@media only screen and (max-width: 992px) {
  #header {
    position: fixed;
  }
}
@media only screen and (max-width: 600px) {
  #header .header-datetime {
    display: none;
  }
}

#side {
  transition: 0.3s;
  height: calc(100vh - 50px);
  float: right;
  overflow: hidden;
  color: var(--themSideTextColor);
  background-color: var(--themSideBgColor);
  font-size: 14px;
  position: sticky;
  top: 50px;
  z-index: 1002;
}
#side .side-space {
  height: 8px;
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
#side ul {
  margin: 5px 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
  min-width: 60px;
  height: 100%;
}
#side ul li > ul {
  padding: 0 16px 0 0;
  background-color: rgba(0, 0, 0, 0.3);
  max-height: 200px;
}
#side ul li {
  margin: 1px 0;
  padding: 0;
  list-style: none;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  min-width: 180px;
}
#side ul li a {
  position: relative;
  display: flex;
  padding: 8px 4px;
}
#side ul li a span.brandmi-icon {
  margin: 0px 12px;
  display: inline-block;
}
#side ul li a,
#side ul li a * {
  color: var(--color9);
  stroke: var(--color9);
  background-color: var(--themSideBgColor);
}
#side ul li > ul a,
#side ul li > ul a * {
  color: var(--color9) aa;
  stroke: var(--color9) aa;
  background-color: var(--color7) aa;
}
#side ul li a:hover,
#side ul li a:hover * {
  background-color: var(--themSideHoverBgColor);
  color: var(--themSideHoverTextColor);
  stroke: var(--themSideHoverTextColor);
}
#side ul li a.active-item,
#side ul li a.active-item * {
  background-color: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
  stroke: var(--themIconActiveTextColor);
}
#side ul li a.active-item::before {
  content: "";
  position: absolute;
  right: 0;
  top: 1px;
  bottom: 1px;
  background-color: var(--color9);
  border-radius: 8px 0 0 8px;
  width: 4px;
}
#side ul li a.disable,
#side ul li a.disable *,
#side ul li a.disable:hover {
  cursor: not-allowed;
  color: var(--color6);
  stroke: var(--color6);
  background-color: var(--color7);
}

@media only screen and (max-width: 992px) {
  #side {
    float: none;
    position: fixed;
    z-index: 1051;
    right: 0;
  }
}

#content {
  transition: 0.3s;
  float: left;
  /*overflow-y: auto;*/
  background: var(--color9);
  min-height: calc(100vh - 50px);
  /*height: calc(100vh - 50px);*/
}
.content-shadow {
  transition: 0.3s;
  position: fixed;
  z-index: 1049;
  left: 0;
  bottom: 0;
  overflow-y: auto;
  width: 100%;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
}
.content-footer {
  height: 90px;
  background: linear-gradient(180deg, #f6f6f6, #e5e5e5);
  text-align: center;
  padding: 10px;
  color: #a5acc6;
  margin-top: 16px;
}
.content-footer ul {
  list-style: none;
  padding: 0;
  margin: 5px 0;
}
.content-footer ul li {
  display: inline-block;
}

.content-footer ul li a {
  color: var(--mainColor7);
  padding: 4px;
}
.content-footer ul li a:hover {
  color: var(--mainColor5);
}

@media only screen and (max-width: 992px) {
  #content {
    position: absolute;
    left: 0;
    top: 50px;
  }
}

#header {
  height: 50px;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
  background: var(--mainColor6);
  position: sticky;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1050;
}
#header .header-logo {
  height: 50px;
  display: inline-flex;
}
#header .header-logo a {
  overflow: hidden;
  display: block;
  white-space: nowrap;
}
#header .header-logo h1 {
  margin: 0;
  padding: 8px;
  font-size: 16px;
  float: right;
}
#header .header-logo h1 svg {
  float: right;
  margin: 0 0 0 8px;
}
#header .header-logo h1 svg * {
  stroke: var(--mainColor2);
}

#header .header-logo a {
  color: var(--themIconTextColor);
}
#header .header-menu {
  cursor: pointer;
  margin: 16px 8px 0 4px;
  float: left;
}
#header .header-menu {
  color: var(--themIconTextColor);
}
#header .header-menu:hover {
  color: var(--color8);
}
#header .header-datetime {
  user-select: none;
  position: absolute;
  top: 0;
  right: 220px;
  padding: 4px 10px;
  border-radius: 0 0 12px 12px;
  font-size: 14px;
}
#header .header-datetime h2,
#header .header-datetime h4 {
  display: inline-block;
  text-align: center;
  padding: 0;
  margin: 0 2px;
}
#header .header-datetime span {
  display: inline-block;
  min-width: 80px;
  text-align: center;
}
#header .header-toolbar {
  float: left;
  margin: 0 24px;
  position: relative;
}

#header .header-toolbar .header-toolbar-menu {
  display: none;
  margin: 16px 0 0 0;
  cursor: pointer;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar > ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#header .header-toolbar > ul > li {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 8px 2px;
  cursor: pointer;
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  border-radius: 4px;
}
#header .header-toolbar > ul > li a {
  line-height: 0;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li span {
  padding: 6px;
}
#header .header-toolbar > ul > li .toolbar-title,
#header .header-toolbar > ul > li a .toolbar-title {
  display: none;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li:hover {
  background: var(--themIconHoverBgColor);
}
#header .header-toolbar > ul > li svg * {
  /* stroke: var(--themIconTextColor); */
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.active,
#header .header-toolbar > ul > li.active a,
#header .header-toolbar > ul > li.active .toolbar-title,
#header .header-toolbar > ul > li.active a .toolbar-title {
  background: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
}
#header .header-toolbar > ul > li.active svg * {
  stroke: var(--themIconActiveTextColor);
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.disable,
#header .header-toolbar > ul > li.disable a,
#header .header-toolbar > ul > li.disable .toolbar-title,
#header .header-toolbar > ul > li.disable a .toolbar-title {
  cursor: not-allowed;
  background: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
}
#header .header-toolbar > ul > li.disable svg * {
  stroke: var(--themIconDisableTextColor);
  stroke-width: 1px;
}
#header .header-toolbar.header-toolbar-menu-close {
  color: #000;
}
#header .header-toolbar.header-toolbar-menu-open {
  color: #000;
}

#header .header-toolbar > ul > li .toolbar-count {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: -4px;
  top: -4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  font-size: 9px;
  direction: ltr;
  box-shadow: 0 0 1px #fff;
}
#header .header-toolbar > ul > li .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor2);
}
#header .header-toolbar > ul > li.active .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor1);
}

#header .header-toolbar > ul > li .toolbar-count-read {
  color: #666;
  background: rgba(240, 240, 240, 0.8);
}

.add-booltan {
  cursor: pointer;
  display: flex;
}

.show-booltan {
  width: 30px;
  height: 30px;
  display: flex;
}

.hide-booltan {
  display: none;
}
#header .header-toolbar > ul > li.toolbar-item {
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  animation-name: action;
  animation-duration: 0.6s;
  animation-direction: alternate;
}

.help-box {
  position: fixed;
  width: 280px;
  left: -300px;
  top: 50px;
  z-index: 1002;
  bottom: 50px;
  background: #fafafa;
  padding: 0 8px 0 8px;
  overflow: auto;
  box-shadow: 5px 0 5px rgba(0, 0, 0, 0.3);
  transition: 0.3s;
  border-radius: 0 12px 12px 0;
}
.help-box-show {
  transition: 0.3s;
  left: 0;
}

@keyframes action {
  0% {
    background-color: var(--themIconActiveBgColor);
    color: var(--themIconActiveTextColor);
    filter: blur(2px);
  }
  50% {
    transform: scale(1.5);
    filter: blur(4px);
  }
  100% {
    filter: blur(0px);
    background-color: var(--themIconBgColor);
    color: var(--themIconTextColor);
  }
}

@media only screen and (max-width: 1200px) {
  #header .header-datetime span {
    display: none;
  }

  #header .header-toolbar .header-toolbar-menu {
    display: block;
  }
  #header .header-toolbar .header-toolbar-hidden {
    display: none;
  }
  #header .header-toolbar ul.header-toolbar-show {
    position: absolute;
    background: var(--mainColor6);
    width: 200px;
    left: -10px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    top: 50px;
    padding: 4px 0;
    z-index: 10002;
  }
  #header .header-toolbar > ul > li {
    margin: 2px;
    padding: 4px;
    cursor: pointer;
    background-color: var(--themIconBgColor);
    border-radius: 4px;
  }
  #header .header-toolbar > ul > li,
  #header .header-toolbar > ul > li a {
    display: flex;
    align-items: center;
    justify-content: start;
  }
  #header .header-toolbar > ul > li a {
    line-height: 20px;
  }
  #header .header-toolbar > ul > li .toolbar-title,
  #header .header-toolbar > ul > li a .toolbar-title {
    display: inline-block;
    margin: 0 2px;
  }

  #header .header-toolbar > ul > li .toolbar-count {
    position: absolute;
    left: 8px;
    top: 4px;
    right: auto;
  }
}

@media only screen and (max-width: 992px) {
  #header {
    position: fixed;
  }
}
@media only screen and (max-width: 600px) {
  #header .header-datetime {
    display: none;
  }
}

#side {
  transition: 0.3s;
  height: calc(100vh - 50px);
  float: right;
  overflow: hidden;
  color: var(--themSideTextColor);
  background-color: var(--themSideBgColor);
  font-size: 14px;
  position: sticky;
  top: 50px;
  z-index: 1002;
}
#side .side-space {
  height: 8px;
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
#side ul {
  margin: 5px 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
  min-width: 60px;
  height: 100%;
}
#side ul li > ul {
  padding: 0 16px 0 0;
  background-color: rgba(0, 0, 0, 0.3);
  max-height: 200px;
}
#side ul li {
  margin: 1px 0;
  padding: 0;
  list-style: none;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  min-width: 180px;
}
#side ul li a {
  position: relative;
  display: flex;
  padding: 8px 4px;
}
#side ul li a span.brandmi-icon {
  margin: 0px 12px;
  display: inline-block;
}
#side ul li a,
#side ul li a * {
  color: var(--color9);
  stroke: var(--color9);
  background-color: var(--themSideBgColor);
}
#side ul li > ul a,
#side ul li > ul a * {
  color: var(--color9) aa;
  stroke: var(--color9) aa;
  background-color: var(--color7) aa;
}
#side ul li a:hover,
#side ul li a:hover * {
  background-color: var(--themSideHoverBgColor);
  color: var(--themSideHoverTextColor);
  stroke: var(--themSideHoverTextColor);
}
#side ul li a.active-item,
#side ul li a.active-item * {
  background-color: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
  stroke: var(--themIconActiveTextColor);
}
#side ul li a.active-item::before {
  content: "";
  position: absolute;
  right: 0;
  top: 1px;
  bottom: 1px;
  background-color: var(--color9);
  border-radius: 8px 0 0 8px;
  width: 4px;
}
#side ul li a.disable,
#side ul li a.disable *,
#side ul li a.disable:hover {
  cursor: not-allowed;
  color: var(--color6);
  stroke: var(--color6);
  background-color: var(--color7);
}

@media only screen and (max-width: 992px) {
  #side {
    float: none;
    position: fixed;
    z-index: 1051;
    right: 0;
  }
}

#content {
  transition: 0.3s;
  float: left;
  /*overflow-y: auto;*/
  background: var(--color9);
  min-height: calc(100vh - 50px);
  /*height: calc(100vh - 50px);*/
}
.content-shadow {
  transition: 0.3s;
  position: fixed;
  z-index: 1049;
  left: 0;
  bottom: 0;
  overflow-y: auto;
  width: 100%;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
}
.content-footer {
  height: 90px;
  background: linear-gradient(180deg, #f6f6f6, #e5e5e5);
  text-align: center;
  padding: 10px;
  color: #a5acc6;
  margin-top: 16px;
}
.content-footer ul {
  list-style: none;
  padding: 0;
  margin: 5px 0;
}
.content-footer ul li {
  display: inline-block;
}

.content-footer ul li a {
  color: var(--mainColor7);
  padding: 4px;
}
.content-footer ul li a:hover {
  color: var(--mainColor5);
}

@media only screen and (max-width: 992px) {
  #content {
    position: absolute;
    left: 0;
    top: 50px;
  }
}

#header {
  height: 50px;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
  background: var(--mainColor6);
  position: sticky;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1050;
}
#header .header-logo {
  height: 50px;
  display: inline-flex;
}
#header .header-logo a {
  overflow: hidden;
  display: block;
  white-space: nowrap;
}
#header .header-logo h1 {
  margin: 0;
  padding: 8px;
  font-size: 16px;
  float: right;
}
#header .header-logo h1 svg {
  float: right;
  margin: 0 0 0 8px;
}
#header .header-logo h1 svg * {
  stroke: var(--mainColor2);
}

#header .header-logo a {
  color: var(--themIconTextColor);
}
#header .header-menu {
  cursor: pointer;
  margin: 16px 8px 0 4px;
  float: left;
}
#header .header-menu {
  color: var(--themIconTextColor);
}
#header .header-menu:hover {
  color: var(--color8);
}
#header .header-datetime {
  user-select: none;
  position: absolute;
  top: 0;
  right: 220px;
  padding: 4px 10px;
  border-radius: 0 0 12px 12px;
  font-size: 14px;
}
#header .header-datetime h2,
#header .header-datetime h4 {
  display: inline-block;
  text-align: center;
  padding: 0;
  margin: 0 2px;
}
#header .header-datetime span {
  display: inline-block;
  min-width: 80px;
  text-align: center;
}
#header .header-toolbar {
  float: left;
  margin: 0 24px;
  position: relative;
}

#header .header-toolbar .header-toolbar-menu {
  display: none;
  margin: 16px 0 0 0;
  cursor: pointer;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar > ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#header .header-toolbar > ul > li {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 8px 2px;
  cursor: pointer;
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  border-radius: 4px;
}
#header .header-toolbar > ul > li a {
  line-height: 0;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li span {
  padding: 6px;
}
#header .header-toolbar > ul > li .toolbar-title,
#header .header-toolbar > ul > li a .toolbar-title {
  display: none;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li:hover {
  background: var(--themIconHoverBgColor);
}
#header .header-toolbar > ul > li svg * {
  /* stroke: var(--themIconTextColor); */
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.active,
#header .header-toolbar > ul > li.active a,
#header .header-toolbar > ul > li.active .toolbar-title,
#header .header-toolbar > ul > li.active a .toolbar-title {
  background: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
}
#header .header-toolbar > ul > li.active svg * {
  stroke: var(--themIconActiveTextColor);
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.disable,
#header .header-toolbar > ul > li.disable a,
#header .header-toolbar > ul > li.disable .toolbar-title,
#header .header-toolbar > ul > li.disable a .toolbar-title {
  cursor: not-allowed;
  background: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
}
#header .header-toolbar > ul > li.disable svg * {
  stroke: var(--themIconDisableTextColor);
  stroke-width: 1px;
}
#header .header-toolbar.header-toolbar-menu-close {
  color: #000;
}
#header .header-toolbar.header-toolbar-menu-open {
  color: #000;
}

#header .header-toolbar > ul > li .toolbar-count {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: -4px;
  top: -4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  font-size: 9px;
  direction: ltr;
  box-shadow: 0 0 1px #fff;
}
#header .header-toolbar > ul > li .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor2);
}
#header .header-toolbar > ul > li.active .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor1);
}

#header .header-toolbar > ul > li .toolbar-count-read {
  color: #666;
  background: rgba(240, 240, 240, 0.8);
}

.add-booltan {
  cursor: pointer;
  display: flex;
}

.show-booltan {
  width: 30px;
  height: 30px;
  display: flex;
}

.hide-booltan {
  display: none;
}
#header .header-toolbar > ul > li.toolbar-item {
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  animation-name: action;
  animation-duration: 0.6s;
  animation-direction: alternate;
}

.help-box {
  position: fixed;
  width: 280px;
  left: -300px;
  top: 50px;
  z-index: 1002;
  bottom: 50px;
  background: #fafafa;
  padding: 0 8px 0 8px;
  overflow: auto;
  box-shadow: 5px 0 5px rgba(0, 0, 0, 0.3);
  transition: 0.3s;
  border-radius: 0 12px 12px 0;
}
.help-box-show {
  transition: 0.3s;
  left: 0;
}

@keyframes action {
  0% {
    background-color: var(--themIconActiveBgColor);
    color: var(--themIconActiveTextColor);
    filter: blur(2px);
  }
  50% {
    transform: scale(1.5);
    filter: blur(4px);
  }
  100% {
    filter: blur(0px);
    background-color: var(--themIconBgColor);
    color: var(--themIconTextColor);
  }
}

@media only screen and (max-width: 1200px) {
  #header .header-datetime span {
    display: none;
  }

  #header .header-toolbar .header-toolbar-menu {
    display: block;
  }
  #header .header-toolbar .header-toolbar-hidden {
    display: none;
  }
  #header .header-toolbar ul.header-toolbar-show {
    position: absolute;
    background: var(--mainColor6);
    width: 200px;
    left: -10px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    top: 50px;
    padding: 4px 0;
    z-index: 10002;
  }
  #header .header-toolbar > ul > li {
    margin: 2px;
    padding: 4px;
    cursor: pointer;
    background-color: var(--themIconBgColor);
    border-radius: 4px;
  }
  #header .header-toolbar > ul > li,
  #header .header-toolbar > ul > li a {
    display: flex;
    align-items: center;
    justify-content: start;
  }
  #header .header-toolbar > ul > li a {
    line-height: 20px;
  }
  #header .header-toolbar > ul > li .toolbar-title,
  #header .header-toolbar > ul > li a .toolbar-title {
    display: inline-block;
    margin: 0 2px;
  }

  #header .header-toolbar > ul > li .toolbar-count {
    position: absolute;
    left: 8px;
    top: 4px;
    right: auto;
  }
}

@media only screen and (max-width: 992px) {
  #header {
    position: fixed;
  }
}
@media only screen and (max-width: 600px) {
  #header .header-datetime {
    display: none;
  }
}

#side {
  transition: 0.3s;
  height: calc(100vh - 50px);
  float: right;
  overflow: hidden;
  color: var(--themSideTextColor);
  background-color: var(--themSideBgColor);
  font-size: 14px;
  position: sticky;
  top: 50px;
  z-index: 1002;
}
#side .side-space {
  height: 8px;
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
#side ul {
  margin: 5px 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
  min-width: 60px;
  height: 100%;
}
#side ul li > ul {
  padding: 0 16px 0 0;
  background-color: rgba(0, 0, 0, 0.3);
  max-height: 200px;
}
#side ul li {
  margin: 1px 0;
  padding: 0;
  list-style: none;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  min-width: 180px;
}
#side ul li a {
  position: relative;
  display: flex;
  padding: 8px 4px;
}
#side ul li a span.brandmi-icon {
  margin: 0px 12px;
  display: inline-block;
}
#side ul li a,
#side ul li a * {
  color: var(--color9);
  stroke: var(--color9);
  background-color: var(--themSideBgColor);
}
#side ul li > ul a,
#side ul li > ul a * {
  color: var(--color9) aa;
  stroke: var(--color9) aa;
  background-color: var(--color7) aa;
}
#side ul li a:hover,
#side ul li a:hover * {
  background-color: var(--themSideHoverBgColor);
  color: var(--themSideHoverTextColor);
  stroke: var(--themSideHoverTextColor);
}
#side ul li a.active-item,
#side ul li a.active-item * {
  background-color: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
  stroke: var(--themIconActiveTextColor);
}
#side ul li a.active-item::before {
  content: "";
  position: absolute;
  right: 0;
  top: 1px;
  bottom: 1px;
  background-color: var(--color9);
  border-radius: 8px 0 0 8px;
  width: 4px;
}
#side ul li a.disable,
#side ul li a.disable *,
#side ul li a.disable:hover {
  cursor: not-allowed;
  color: var(--color6);
  stroke: var(--color6);
  background-color: var(--color7);
}

@media only screen and (max-width: 992px) {
  #side {
    float: none;
    position: fixed;
    z-index: 1051;
    right: 0;
  }
}

#content {
  transition: 0.3s;
  float: left;
  /*overflow-y: auto;*/
  background: var(--color9);
  min-height: calc(100vh - 50px);
  /*height: calc(100vh - 50px);*/
}
.content-shadow {
  transition: 0.3s;
  position: fixed;
  z-index: 1049;
  left: 0;
  bottom: 0;
  overflow-y: auto;
  width: 100%;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
}
.content-footer {
  height: 90px;
  background: linear-gradient(180deg, #f6f6f6, #e5e5e5);
  text-align: center;
  padding: 10px;
  color: #a5acc6;
  margin-top: 16px;
}
.content-footer ul {
  list-style: none;
  padding: 0;
  margin: 5px 0;
}
.content-footer ul li {
  display: inline-block;
}

.content-footer ul li a {
  color: var(--mainColor7);
  padding: 4px;
}
.content-footer ul li a:hover {
  color: var(--mainColor5);
}

@media only screen and (max-width: 992px) {
  #content {
    position: absolute;
    left: 0;
    top: 50px;
  }
}

#header {
  height: 50px;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
  background: var(--mainColor6);
  position: sticky;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1050;
}
#header .header-logo {
  height: 50px;
  display: inline-flex;
}
#header .header-logo a {
  overflow: hidden;
  display: block;
  white-space: nowrap;
}
#header .header-logo h1 {
  margin: 0;
  padding: 8px;
  font-size: 16px;
  float: right;
  display: flex;
}
#header .header-logo h1 svg {
  float: right;
  margin: 0 0 0 8px;
}
#header .header-logo h1 svg * {
  stroke: var(--mainColor2);
}

#header .header-logo a {
  color: var(--themIconTextColor);
}
#header .header-menu {
  cursor: pointer;
  margin: 16px 8px 0 4px;
  float: left;
}
#header .header-menu {
  color: var(--themIconTextColor);
}
#header .header-menu:hover {
  color: var(--color8);
}
#header .header-datetime {
  user-select: none;
  position: absolute;
  top: 0;
  right: 220px;
  padding: 4px 10px;
  border-radius: 0 0 12px 12px;
  font-size: 14px;
}
#header .header-datetime h2,
#header .header-datetime h4 {
  display: inline-block;
  text-align: center;
  padding: 0;
  margin: 0 2px;
}
#header .header-datetime span {
  display: inline-block;
  min-width: 80px;
  text-align: center;
}
#header .header-toolbar {
  float: left;
  margin: 0 24px;
  position: relative;
}

#header .header-toolbar .header-toolbar-menu {
  display: none;
  margin: 16px 0 0 0;
  cursor: pointer;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar > ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#header .header-toolbar > ul > li {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 8px 2px;
  cursor: pointer;
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  border-radius: 4px;
}
#header .header-toolbar > ul > li a {
  line-height: 0;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li span {
  padding: 6px;
}
#header .header-toolbar > ul > li .toolbar-title,
#header .header-toolbar > ul > li a .toolbar-title {
  display: none;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li:hover {
  background: var(--themIconHoverBgColor);
}
#header .header-toolbar > ul > li svg * {
  /* stroke: var(--themIconTextColor); */
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.active,
#header .header-toolbar > ul > li.active a,
#header .header-toolbar > ul > li.active .toolbar-title,
#header .header-toolbar > ul > li.active a .toolbar-title {
  background: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
}
#header .header-toolbar > ul > li.active svg * {
  stroke: var(--themIconActiveTextColor);
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.disable,
#header .header-toolbar > ul > li.disable a,
#header .header-toolbar > ul > li.disable .toolbar-title,
#header .header-toolbar > ul > li.disable a .toolbar-title {
  cursor: not-allowed;
  background: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
}
#header .header-toolbar > ul > li.disable svg * {
  stroke: var(--themIconDisableTextColor);
  stroke-width: 1px;
}
#header .header-toolbar.header-toolbar-menu-close {
  color: #000;
}
#header .header-toolbar.header-toolbar-menu-open {
  color: #000;
}

#header .header-toolbar > ul > li .toolbar-count {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: -4px;
  top: -4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  font-size: 9px;
  direction: ltr;
  box-shadow: 0 0 1px #fff;
}
#header .header-toolbar > ul > li .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor2);
}
#header .header-toolbar > ul > li.active .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor1);
}

#header .header-toolbar > ul > li .toolbar-count-read {
  color: #666;
  background: rgba(240, 240, 240, 0.8);
}

.add-booltan {
  cursor: pointer;
  display: flex;
}

.show-booltan {
  width: 30px;
  height: 30px;
  display: flex;
}

.hide-booltan {
  display: none;
}
#header .header-toolbar > ul > li.toolbar-item {
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  animation-name: action;
  animation-duration: 0.6s;
  animation-direction: alternate;
}

.help-box {
  position: fixed;
  width: 280px;
  left: -300px;
  top: 50px;
  z-index: 1002;
  bottom: 50px;
  background: #fafafa;
  padding: 0 8px 0 8px;
  overflow: auto;
  box-shadow: 5px 0 5px rgba(0, 0, 0, 0.3);
  transition: 0.3s;
  border-radius: 0 12px 12px 0;
}
.help-box-show {
  transition: 0.3s;
  left: 0;
}

@keyframes action {
  0% {
    background-color: var(--themIconActiveBgColor);
    color: var(--themIconActiveTextColor);
    filter: blur(2px);
  }
  50% {
    transform: scale(1.5);
    filter: blur(4px);
  }
  100% {
    filter: blur(0px);
    background-color: var(--themIconBgColor);
    color: var(--themIconTextColor);
  }
}

@media only screen and (max-width: 1200px) {
  #header .header-datetime span {
    display: none;
  }

  #header .header-toolbar .header-toolbar-menu {
    display: block;
  }
  #header .header-toolbar .header-toolbar-hidden {
    display: none;
  }
  #header .header-toolbar ul.header-toolbar-show {
    position: absolute;
    background: var(--mainColor6);
    width: 200px;
    left: -10px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    top: 50px;
    padding: 4px 0;
    z-index: 10002;
  }
  #header .header-toolbar > ul > li {
    margin: 2px;
    padding: 4px;
    cursor: pointer;
    background-color: var(--themIconBgColor);
    border-radius: 4px;
  }
  #header .header-toolbar > ul > li,
  #header .header-toolbar > ul > li a {
    display: flex;
    align-items: center;
    justify-content: start;
  }
  #header .header-toolbar > ul > li a {
    line-height: 20px;
  }
  #header .header-toolbar > ul > li .toolbar-title,
  #header .header-toolbar > ul > li a .toolbar-title {
    display: inline-block;
    margin: 0 2px;
  }

  #header .header-toolbar > ul > li .toolbar-count {
    position: absolute;
    left: 8px;
    top: 4px;
    right: auto;
  }
}

@media only screen and (max-width: 992px) {
  #header {
    position: fixed;
  }
}
@media only screen and (max-width: 600px) {
  #header .header-datetime {
    display: none;
  }
}

#side {
  transition: 0.3s;
  height: calc(100vh - 50px);
  float: right;
  overflow: hidden;
  color: var(--themSideTextColor);
  background-color: var(--themSideBgColor);
  font-size: 14px;
  position: sticky;
  top: 50px;
  z-index: 1002;
}
#side .side-space {
  height: 8px;
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
#side ul {
  margin: 5px 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
  min-width: 60px;
  height: 100%;
  max-width: 100% !important;
}
#side ul li > ul {
  padding: 0 16px 0 0;
  background-color: rgba(0, 0, 0, 0.3);
  max-height: 200px;
  display: none;
  border: 1px solid #000;
  z-index: 1;
}
#side ul li > span {
  position: absolute;
  left: 5px;
  margin-top: -30px;
  z-index: 10;
}
#side ul li:hover > ul {
  display: block;
}
#side ul li:hover > span {
  transform: rotate(180deg);
}
#side ul li {
  margin: 1px 0;
  padding: 0;
  list-style: none;
  display: flex;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  flex-direction: column;
  min-width: 180px;
}
#side ul li a {
  position: relative;
  display: flex;
  padding: 8px 4px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
#side ul li a > div {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
#side ul li a span.brandmi-icon {
  margin: 0px 12px;
  display: inline-flex;
  max-width: 500px;
  overflow: hidden;
}
#side ul li a,
#side ul li a * {
  color: var(--color9);
  stroke: var(--color9);
  background-color: var(--themSideBgColor);
}
#side ul li > ul a,
#side ul li > ul a * {
  color: var(--color9) aa;
  stroke: var(--color9) aa;
  background-color: var(--color7) aa;
}
#side ul li a:hover,
#side ul li a:hover * {
  background-color: var(--themSideHoverBgColor);
  color: var(--themSideHoverTextColor);
  stroke: var(--themSideHoverTextColor);
}
#side ul li a.active-item,
#side ul li a.active-item * {
  background-color: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
  stroke: var(--themIconActiveTextColor);
}
#side ul li a.active-item::before {
  content: "";
  position: absolute;
  right: 0;
  top: 1px;
  bottom: 1px;
  background-color: var(--color9);
  border-radius: 8px 0 0 8px;
  width: 4px;
}
#side ul li a.disable,
#side ul li a.disable *,
#side ul li a.disable:hover {
  cursor: not-allowed;
  color: var(--color6);
  stroke: var(--color6);
  background-color: var(--color7);
}

@media only screen and (max-width: 992px) {
  #side {
    float: none;
    position: fixed;
    z-index: 1051;
    right: 0;
  }
}

#content {
  transition: 0.3s;
  float: left;
  /*overflow-y: auto;*/
  background: var(--color9);
  min-height: calc(100vh - 50px);
  /*height: calc(100vh - 50px);*/
}
.content-shadow {
  transition: 0.3s;
  position: fixed;
  z-index: 1049;
  left: 0;
  bottom: 0;
  overflow-y: auto;
  width: 100%;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
}
.content-footer {
  height: 90px;
  background: linear-gradient(180deg, #f6f6f6, #e5e5e5);
  text-align: center;
  padding: 10px;
  color: #a5acc6;
  margin-top: 16px;
}
.content-footer ul {
  list-style: none;
  padding: 0;
  margin: 5px 0;
}
.content-footer ul li {
  display: inline-block;
}

.content-footer ul li a {
  color: var(--mainColor7);
  padding: 4px;
}
.content-footer ul li a:hover {
  color: var(--mainColor5);
}

@media only screen and (max-width: 992px) {
  #content {
    position: absolute;
    left: 0;
    top: 50px;
  }
}

#header {
  height: 50px;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
  background: var(--mainColor6);
  position: sticky;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1050;
}
#header .header-logo {
  height: 50px;
  display: inline-flex;
}
#header .header-logo a {
  overflow: hidden;
  display: block;
  white-space: nowrap;
}
#header .header-logo h1 {
  margin: 0;
  padding: 8px;
  font-size: 16px;
  float: right;
  display: flex;
}
#header .header-logo h1 svg {
  float: right;
  margin: 0 0 0 8px;
}
#header .header-logo h1 svg * {
  stroke: var(--mainColor2);
}

#header .header-logo a {
  color: var(--themIconTextColor);
}
#header .header-menu {
  cursor: pointer;
  margin: 16px 8px 0 4px;
  float: left;
}
#header .header-menu {
  color: var(--themIconTextColor);
}
#header .header-menu:hover {
  color: var(--color8);
}
#header .header-datetime {
  user-select: none;
  position: absolute;
  top: 0;
  right: 220px;
  padding: 4px 10px;
  border-radius: 0 0 12px 12px;
  font-size: 14px;
}
#header .header-datetime h2,
#header .header-datetime h4 {
  display: inline-block;
  text-align: center;
  padding: 0;
  margin: 0 2px;
}
#header .header-datetime span {
  display: inline-block;
  min-width: 80px;
  text-align: center;
}
#header .header-toolbar {
  float: left;
  margin: 0 24px;
  position: relative;
}

#header .header-toolbar .header-toolbar-menu {
  display: none;
  margin: 16px 0 0 0;
  cursor: pointer;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar .header-toolbar-hidden {
  display: block;
}
#header .header-toolbar > ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#header .header-toolbar > ul > li {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 8px 2px;
  cursor: pointer;
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  border-radius: 4px;
}
#header .header-toolbar > ul > li a {
  line-height: 0;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li span {
  padding: 6px;
}
#header .header-toolbar > ul > li .toolbar-title,
#header .header-toolbar > ul > li a .toolbar-title {
  display: none;
  color: var(--themIconTextColor);
}
#header .header-toolbar > ul > li:hover {
  background: var(--themIconHoverBgColor);
}
#header .header-toolbar > ul > li svg * {
  /* stroke: var(--themIconTextColor); */
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.active,
#header .header-toolbar > ul > li.active a,
#header .header-toolbar > ul > li.active .toolbar-title,
#header .header-toolbar > ul > li.active a .toolbar-title {
  background: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
}
#header .header-toolbar > ul > li.active svg * {
  stroke: var(--themIconActiveTextColor);
  stroke-width: 1px;
}
#header .header-toolbar > ul > li.disable,
#header .header-toolbar > ul > li.disable a,
#header .header-toolbar > ul > li.disable .toolbar-title,
#header .header-toolbar > ul > li.disable a .toolbar-title {
  cursor: not-allowed;
  background: var(--themIconDisableBgColor);
  color: var(--themIconDisableTextColor);
}
#header .header-toolbar > ul > li.disable svg * {
  stroke: var(--themIconDisableTextColor);
  stroke-width: 1px;
}
#header .header-toolbar.header-toolbar-menu-close {
  color: #000;
}
#header .header-toolbar.header-toolbar-menu-open {
  color: #000;
}

#header .header-toolbar > ul > li .toolbar-count {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: -4px;
  top: -4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  font-size: 9px;
  direction: ltr;
  box-shadow: 0 0 1px #fff;
}
#header .header-toolbar > ul > li .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor2);
}
#header .header-toolbar > ul > li.active .toolbar-count-unread {
  color: var(--mainColor6);
  background: var(--mainColor1);
}

#header .header-toolbar > ul > li .toolbar-count-read {
  color: #666;
  background: rgba(240, 240, 240, 0.8);
}

.add-booltan {
  cursor: pointer;
  display: flex;
}

.show-booltan {
  width: 30px;
  height: 30px;
  display: flex;
}

.hide-booltan {
  display: none;
}
#header .header-toolbar > ul > li.toolbar-item {
  background-color: var(--themIconBgColor);
  color: var(--themIconTextColor);
  animation-name: action;
  animation-duration: 0.6s;
  animation-direction: alternate;
}

.help-box {
  position: fixed;
  width: 280px;
  left: -300px;
  top: 50px;
  z-index: 1002;
  bottom: 50px;
  background: #fafafa;
  padding: 0 8px 0 8px;
  overflow: auto;
  box-shadow: 5px 0 5px rgba(0, 0, 0, 0.3);
  transition: 0.3s;
  border-radius: 0 12px 12px 0;
}
.help-box-show {
  transition: 0.3s;
  left: 0;
}

@keyframes action {
  0% {
    background-color: var(--themIconActiveBgColor);
    color: var(--themIconActiveTextColor);
    filter: blur(2px);
  }
  50% {
    transform: scale(1.5);
    filter: blur(4px);
  }
  100% {
    filter: blur(0px);
    background-color: var(--themIconBgColor);
    color: var(--themIconTextColor);
  }
}

@media only screen and (max-width: 1200px) {
  #header .header-datetime span {
    display: none;
  }

  #header .header-toolbar .header-toolbar-menu {
    display: block;
  }
  #header .header-toolbar .header-toolbar-hidden {
    display: none;
  }
  #header .header-toolbar ul.header-toolbar-show {
    position: absolute;
    background: var(--mainColor6);
    width: 200px;
    left: -10px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    top: 50px;
    padding: 4px 0;
    z-index: 10002;
  }
  #header .header-toolbar > ul > li {
    margin: 2px;
    padding: 4px;
    cursor: pointer;
    background-color: var(--themIconBgColor);
    border-radius: 4px;
  }
  #header .header-toolbar > ul > li,
  #header .header-toolbar > ul > li a {
    display: flex;
    align-items: center;
    justify-content: start;
  }
  #header .header-toolbar > ul > li a {
    line-height: 20px;
  }
  #header .header-toolbar > ul > li .toolbar-title,
  #header .header-toolbar > ul > li a .toolbar-title {
    display: inline-block;
    margin: 0 2px;
  }

  #header .header-toolbar > ul > li .toolbar-count {
    position: absolute;
    left: 8px;
    top: 4px;
    right: auto;
  }
}

@media only screen and (max-width: 992px) {
  #header {
    position: fixed;
  }
}
@media only screen and (max-width: 600px) {
  #header .header-datetime {
    display: none;
  }
}

#side {
  transition: 0.3s;
  height: calc(100vh - 50px);
  float: right;
  overflow: hidden;
  color: var(--themSideTextColor);
  background-color: var(--themSideBgColor);
  font-size: 14px;
  position: sticky;
  top: 50px;
  z-index: 1002;
}
#side .side-space {
  height: 8px;
  background: linear-gradient(-30deg, var(--mainColor3), var(--mainColor2));
}
#side ul {
  margin: 5px 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
  min-width: 60px;
  height: 100%;
}
#side ul li > ul {
  padding: 0 16px 0 0;
  background-color: rgba(0, 0, 0, 0.3);
  max-height: 200px;
}
#side ul li {
  margin: 1px 0;
  padding: 0;
  list-style: none;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  min-width: 180px;
}
#side ul li a {
  position: relative;
  display: flex;
  padding: 8px 4px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
#side ul li a span.brandmi-icon {
  margin: 0px 12px;
  display: inline-flex;
  max-width: 500px;
  overflow: hidden;
}
#side ul li a,
#side ul li a * {
  color: var(--color9);
  stroke: var(--color9);
  background-color: var(--themSideBgColor);
}
#side ul li > ul a,
#side ul li > ul a * {
  color: var(--color9) aa;
  stroke: var(--color9) aa;
  background-color: var(--color7) aa;
}
#side ul li a:hover,
#side ul li a:hover * {
  background-color: var(--themSideHoverBgColor);
  color: var(--themSideHoverTextColor);
  stroke: var(--themSideHoverTextColor);
}
#side ul li a.active-item,
#side ul li a.active-item * {
  background-color: var(--themIconActiveBgColor);
  color: var(--themIconActiveTextColor);
  stroke: var(--themIconActiveTextColor);
}
#side ul li a.active-item::before {
  content: "";
  position: absolute;
  right: 0;
  top: 1px;
  bottom: 1px;
  background-color: var(--color9);
  border-radius: 8px 0 0 8px;
  width: 4px;
}
#side ul li a.disable,
#side ul li a.disable *,
#side ul li a.disable:hover {
  cursor: not-allowed;
  color: var(--color6);
  stroke: var(--color6);
  background-color: var(--color7);
}

@media only screen and (max-width: 992px) {
  #side {
    float: none;
    position: fixed;
    z-index: 1051;
    right: 0;
  }
}

.add-nav {
  border: 1px dashed #aaa;
  padding: 10px;
  text-align: center;
  margin: 5px;
  border-radius: 3px;
  color: var(--mainColor4);
  background: var(--mainColor5);
  cursor: pointer;
}

.add-nav:hover {
  border: 1px dashed #aaa;
  padding: 10px;
  text-align: center;
  margin: 5px;
  border-radius: 3px;
  color: var(--mainColor5);
  background: var(--mainColor4);
}

#content {
  transition: 0.3s;
  float: left;
  /*overflow-y: auto;*/
  background: var(--color9);
  min-height: calc(100vh - 50px);
  /*height: calc(100vh - 50px);*/
}
.content-shadow {
  transition: 0.3s;
  position: fixed;
  z-index: 1049;
  left: 0;
  bottom: 0;
  overflow-y: auto;
  width: 100%;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
}
.content-footer {
  height: 90px;
  background: linear-gradient(180deg, #f6f6f6, #e5e5e5);
  text-align: center;
  padding: 10px;
  color: #a5acc6;
  margin-top: 16px;
}
.content-footer ul {
  list-style: none;
  padding: 0;
  margin: 5px 0;
}
.content-footer ul li {
  display: inline-block;
}

.content-footer ul li a {
  color: var(--mainColor7);
  padding: 4px;
}
.content-footer ul li a:hover {
  color: var(--mainColor5);
}

@media only screen and (max-width: 992px) {
  #content {
    position: absolute;
    left: 0;
    top: 50px;
  }
}

.textArea-wrapper {
  position: relative;
  width: 100%;
  padding-top: 12px;
  background-color: var(--mainColor6);
  overflow: hidden;
}

.textArea-field {
  background: transparent;
  transition: border-color 0.2s;
  height: 44px;
  padding-right: 16px;
}

.textArea-field:placeholder-shown ~ .textArea-label {
  cursor: text;
  top: 34px;
  display: inline-block;
  white-space: pre;
  word-break: break-word;
}

.textArea-label {
  user-select: none;
  line-height: 0;
  height: 3px;
  padding: 0 8px;
  margin: 0 4px;
  background-color: transparent;
}
.textArea-label,
.textArea-field:focus ~ .textArea-label {
  position: absolute;
  top: 11px;
  right: 16px;
  display: block;
  transition: 0.2s;
  font-size: 14px;
  color: #cbd1dc;
  background-color: var(--mainColor6);
}

.textArea-field:focus ~ .textArea-label {
  color: var(--mainColor2);
}

.textArea-field::placeholder {
  color: var(--mainColor6);
  opacity: 1;
  transition: 0.3s;
}
.textArea-field::-ms-textarea-placeholder {
  color: var(--mainColor6);
  transition: 0.3s;
}
.textArea-field::-ms-textarea-placeholder {
  color: var(--mainColor6);
  transition: 0.3s;
}
.textArea-field:focus::placeholder {
  color: #ccc;
  opacity: 1;
  transition: 0.3s;
}
.textArea-field:focus::-ms-textarea-placeholder {
  color: #ccc;
  transition: 0.3s;
}
.textArea-field:focus::-ms-textarea-placeholder {
  color: #ccc;
  transition: 0.3s;
}

.textArea-inner-icon {
  position: absolute;
  top: 20px;
  left: 20px;
  display: flex;
}

.textArea-icon-wrapper {
  /* display: flex; */
  align-items: center;
  /* justify-content: center; */
  width: 20px;
  height: 20px;
  margin: 2px;
}

textArea:-internal-autofill-selected,
textArea:-webkit-autofill,
textArea:-webkit-autofill:hover,
textArea:-webkit-autofill:focus,
textArea:-webkit-autofill:active,
textArea:active {
  background-color: transparent !important;
  -webkit-box-shadow: 0 0 0 30px var(--mainColor6) inset !important;
}

@media only screen and (max-width: 600px) {
  .textArea-field:placeholder-shown ~ .textArea-label {
    font-size: 10px;
    padding: 0 2px;
    margin: 0 1px;
  }

  .textArea-field {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
  }
}

#emojis {
  background: var(--mainColor6);
  height: 200px;
  max-height: 80%;
  overflow: auto;
  width: 218px;
  padding: 10px;
  user-select: none;
  position: absolute;
  z-index: 5;
  bottom: 1px;
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.3);
  border-radius: 2px;
  border: 1px solid var(--mainColor5);
  left: 10px;
}
#emojis ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#emojis ul li {
  margin: 2px;
  display: inline-block;
  border: 1px solid #fff;
  border-radius: 5px;
  cursor: pointer;
  padding: 1px;
  background: #f2f2f2;
  font-size: 15px;
  transition: all 0.3s;
}
#emojis ul li:hover {
  border: 1px solid #999;
  transition: all 0.3s;
}

.max-len-component {
  user-select: none;
  border-radius: 50%;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  opacity: 0.7;
}
.max-len-component:hover {
  opacity: 1;
}

.bulletin-form-input {
  width: 400px;
}

.bulletin-form-text-area {
  width: 600px;
  height: 200px;
}

@media only screen and (max-width: 600px) {
  .bulletin-form-input {
    width: 310px;
  }

  .bulletin-form-text-area {
    width: 310px;
    height: 200px;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .bulletin-form-input {
    width: 300px;
  }

  .bulletin-form-text-area {
    width: 400px;
    height: 200px;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .bulletin-form-input {
    width: 300px;
  }

  .bulletin-form-text-area {
    width: 310px;
    height: 200px;
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .bulletin-form-text-area {
    width: 300px;
    height: 200px;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .bulletin-form-text-area {
    width: 600px;
    height: 200px;
  }
}

.slide-control {
  display: flex;
  align-items: center;
  padding: 12px 0 0 0;
}

.slide-wrapper {
  background-color: var(--mainColor6);
  /* background-color: var(--mainColor4); */
  box-shadow: 1px 4px 6px 1px #eee;
  border-radius: 8px;
  display: flex;
  margin: 0 5px;
  /* flex: 1; */
  width: 180px;
}

.slide-items {
  display: flex;
  flex: 1;
  width: 100%;
}

.item-logo {
  margin: 0 16px;
  display: flex;
  color: var(--mainColor5);
}

.item-text {
  width: calc(100%- 100px);
  white-space: pre;
  word-break: break-word;
  align-items: center;
  justify-content: center;
  height: 100%;
  display: flex;
  color: var(--mainColor5);
  flex: 1;
}

.slide-step-btn {
  margin: 4px 0 4px 0;
  cursor: pointer;
  background-color: var(--mainColor6);
  width: 32px;
  height: 32px;
  color: var(--mainColor5);
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.slide-step-btn-disable {
  color: #cccccc;
  cursor: default;
}

.select-details {
  width: 100%;
  /* display: inline-flex; */
  align-items: center;
}

.select-details-img {
  width: 20px;
  margin: 0 4px 0 16px;
}

.details-config {
  font-size: 12px;
  width: 100%;
  display: flex;
  flex-direction: row;
  margin: 24px 8px 0 0;
}

.cover-wrapper {
  padding: 12px 0 0 0;
  display: flex;
}

.front-cover {
  padding: 0 8px;
  display: flex;
  width: 100%;
}

.cover-items {
  padding: 0 10px;
  display: flex;
  /* width: 100%; */
  justify-content: center;
}

.cover-title {
  padding: 12px 0 0 24px;
  font-size: 12px;
  color: var(--mainColor5);
  width: 110px;
}

.select-image-component {
  padding: 70px 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  /* width: 100%; */
  /* width: 86px;
  min-height: 116px; */
}

.select-image-wrapper {
  background-color: #eee;
  width: 86px;
  min-height: 116px;
  display: inline-flex;
  margin: 0 8px;
  border: 2px solid #ffffff;
  box-shadow: 0 0 5px #666;
  justify-content: center;
  align-items: center;
  color: #cccccc;
  user-select: none;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
}
.remove-image-wrapper {
  position: absolute;
  top: 5px;
  left: 5px;
  color: #d04863;
  border-radius: 30px;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-color: var(--mainColor6);
  z-index: 5;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
}
.remove-image-wrapper:hover {
  color: var(--mainColor6);
  background-color: #d04863;
}

.image-selected {
  width: 80px;
}

.label-color {
  cursor: pointer;
  border-radius: 8px;
  padding: 5px 32px;
  margin: 5px;
  background: var(--mainColor4);
  display: inline-block;
  width: 142px;
  height: 44px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.label {
  cursor: pointer;
  border-radius: 8px;
  padding: 5px 32px;
  margin: 5px;
  background: var(--mainColor5);
  width: 142px;
  height: 44px;
  color: var(--mainColor6);
  font-size: 14px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.input-color-config {
  padding: 0px;
  background-color: transparent;
}

.label-color:hover {
  background: #d1fffd;
}

label.label input[type="file"] {
  position: absolute;
  top: -1000px;
}

.bulletin-list-component {
  justify-content: center;
  display: flex;
  width: 100%;
}

.bulletin-list-wrapper {
  justify-content: center;
  width: 100%;
  display: flex;
}

.bulletin-list-input {
  width: 300px;
}

.bulletin-list-inner-icon {
  cursor: pointer;
  position: absolute;
  top: 2px;
  left: 16px;
  color: var(--mainColor5);
}

.bulletin-list-button {
  margin: 0 2px;
  height: 44px;
  width: 100px;
}

@media only screen and (max-width: 768px) {
  .bulletin-list-input {
    width: calc(100% - 2px);
  }

  .bulletin-list-inner-icon {
    top: 2px;
    left: 1px;
  }

  .bulletin-list-component {
    justify-content: space-between;
    width: 100%;
    display: flex;
  }
  .bulletin-list-button {
    margin: 0 0 12px 0;
    align-items: center;
    justify-content: center;
    width: calc(100% - 4px);
  }
}


.link-icon {
  margin: 4px 12px;
  display: flex;
  height: 100%;
  align-items: flex-start;
  justify-content: flex-start;
  width: 32px;
  color: #ccd4df;
  cursor: pointer;
}

.link-icon:hover * {
  color: var(--mainColor5);
}

.calendar-month {
  display: flex;
  flex-wrap: wrap;
}
.calendar-month > div {
  display: flex;
  justify-content: center;
  min-width: 280px;
  width: 300px;
}
.calendar-month-events {
  flex: 1;
}
.calendar-month-events ul {
  list-style: none;
  width: 100%;
}
.calendar-month-events ul li {
  display: flex;
  align-items: flex-start;
  margin: 2px;
  color: #666;
}
.calendar-month-events ul li > span {
  display: flex;
  margin: 0 4px;
  flex: 1;
}
.calendar-month-events ul li > span:first-of-type {
  width: 20px;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  color: #333;
  background-color: #ddd;
  white-space: pre;
  word-break: break-word;
  border: 2px solid #ddd;
  flex: 0 0 20px;
}
.calendar-month-events ul li.calendar-item-last {
  color: #999999;
}
.calendar-month-events ul li.calendar-item-last > span.number {
  color: #999999;
  background-color: #eeeeee;
  border: 2px solid #eeeeee;
  text-shadow: none;
}

.calendar-month-events ul li.calendar-item-todya {
  color: #00747a;
}
.calendar-month-events ul li.calendar-item-todya > span.number {
  color: var(--mainColor6);
  background-color: #00747a;
  border: 2px solid #00747a;
  text-shadow: none;
}
.calendar-month-events ul li span {
  display: inline-flex;
  padding: 2px 4px;
  border-radius: 4px;
  white-space: pre;
  word-break: break-word;
  flex: 0;
  justify-content: center;
  align-items: center;
  min-height: 26px;
}
.calendar-month-events ul li span.txt,
.calendar-month-events ul li div.txt {
  white-space: pre-wrap;
  word-break: break-word;
  flex: 1;
  overflow-wrap: anywhere;
  justify-content: start;
}
.calendar-month-events ul li span.cat {
  background: #f2f2f2;
  color: #999;
}
.calendar-month-events ul li span.share-item {
  background: #6348d0;
  color: var(--mainColor6);
  cursor: pointer;
}
.calendar-month-events ul li span.delete-item {
  background: #d04863;
  color: var(--mainColor6);
  cursor: pointer;
}

.client-calendar-action span {
  cursor: pointer;
}
.client-calendar-action span:hover {
  color: #00747a;
}

.no-shadow {
  box-shadow: none !important;
}

@media only screen and (max-width: 768px) {
  .calendar-month > div {
    display: flex;
    justify-content: center;
    min-width: 280px;
    width: 300px;
    margin: auto;
  }
  .calendar-month-events {
    width: 100%;
    margin: 5px;
  }
  .calendar-month-events ul {
    padding: 0;
  }
}

span.cat {
  color: var(--mainColor6);
}
span.cat.cat-2 {
  background-color: #c99a7d !important;
}

span.cat.cat-3 {
  background-color: #87986a !important;
}

span.cat.cat-4 {
  background-color: #ffafcc !important;
}

span.cat.cat-7 {
  background-color: #68afab !important;
}

span.cat.cat-8 {
  background: #c0a2d7 !important;
}

span.cat.cat-11 {
  background-color: #7abdfb !important;
}

span.cat.cat-5 {
  background-color: #e3c312 !important;
}

.form-tab {
  background-color: transparent;
}
.form-tab-item {
  cursor: pointer;
  color: #666;
  margin: 1px;
  padding: 5px 8px;
}
.form-tab-item-active {
  cursor: pointer;
  background-color: #d7fdff;
  color: var(--mainColor5);
  padding: 5px 12px;
}
.form-tab-item-content {
  display: none;
}
.form-tab-item-content-active {
  display: block;
}

.toggle-field {
  display: flex;
  color: #999;
  align-items: center;
  margin: 8px 0;
}
.toggle-field > div {
  padding: 5px;
}

.toggle-field-item {
  border-radius: 18px;
  width: 40px;
  height: 22px;
  background-color: var(--mainColor5);
  position: relative;
  transition: 0.3s;
  box-shadow: inset 0 1px 2px #000;
  color: var(--mainColor6);
}
.toggle-field-item > div {
  position: absolute;
  width: 18px;
  height: 18px;
  background-color: var(--mainColor6);
  border-radius: 15px;
  top: 2px;
  transition: 0.3s;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  cursor: pointer;
}
.toggle-field-item > div.toggle-field-item-i-e {
  right: 2px;
  background-color: transparent;
  z-index: 1;
}
.toggle-field-item > div.toggle-field-item-i-o {
  left: 2px;
  background-color: transparent;
  z-index: 1;
}
.toggle-field-item > div.toggle-field-item-f {
  transition: 0.3s;
}
.toggle-field-item-s {
  color: var(--mainColor5);
}

.preview-box {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 200px;
  user-select: none;
  flex-direction: column;
  color: #999;
}

.preview-box > div:last-of-type {
  position: relative;
  width: 250px;
  height: 120px;
  border: 1px solid #666;
  margin: 10px auto;
}
.preview-box > div > div {
  position: absolute;
  background-color: rgba(250, 250, 250, 0.6);
  border: 1px solid #000;
  border-radius: 1px;
}

.preview-box-logo {
  top: 0.5rem;
  right: 0.5rem;
  width: 20px;
  height: 20px;
}
.preview-box-news {
  top: 40px;
  left: 8px;
  width: 70px;
  height: 50px;
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 1);
}
.preview-box-newspaper {
  top: 10px;
  right: 35px;
  width: 80px;
  height: 90px;
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 1);
}
.preview-box-message {
  top: 50%;
  right: 50%;
  width: 50px;
  height: 20px;
  transform: translate(50%, -50%);
  text-align: center;
  font-size: 10px;
  background-color: rgba(0, 0, 0, 0.6) !important;
}

.preview-box-video {
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}
.preview-box-footer {
  bottom: 0;
  right: 0;
  left: 0;
  height: 10px;
  font-size: 10px;
  box-shadow: 0px -2px 3px rgb(0, 0, 0);
  line-height: 6px;
  padding: 0 5px;
}

.preview-box-data-time {
  top: 0.5rem;
  left: 0.5rem;
  box-shadow: 0px 1px 3px rgba(250, 250, 250, 0.7);
}
.preview-box-data-time-date {
  position: relative;
  width: 30px;
  height: 10px;
  margin: 2px;
  background-color: rgba(0, 0, 0, 0.6);
}
.preview-box-data-time-time {
  position: relative;
  width: 30px;
  height: 10px;
  margin: 2px;
  background-color: rgba(0, 0, 0, 0.6);
}

.field-radio {
  margin: 16px 2px;
}
.field-radio-label {
  color: var(--mainColor5);
}
.field-radio-list {
  list-style: none;
  padding: 0;
  margin: 0;
  color: var(--mainColor6);
  border-radius: 5px;
  width: fit-content;
  user-select: none;
}
.field-radio-list li {
  display: inline-block;
  margin: 3px 0;
  padding: 5px 10px;
  cursor: pointer;
  border: 1px solid var(--mainColor5);
  background-color: var(--mainColor5);
  background-color: #bce4e2;
  color: var(--mainColor5);
  border-left: 1px solid rgba(0, 0, 0, 0.3);
  box-shadow: 0 5px 1px rgb(0 0 0 / 30%);
  transition: 0.3s;
}
.field-radio-list li:hover {
  background-color: var(--mainColor5);
  color: var(--mainColor6);
  box-shadow: 0 5px 1px rgb(0 0 0 / 50%);
  transition: 0.3s;
}
.field-radio-list li:first-of-type {
  border-radius: 0 5px 5px 0;
}
.field-radio-list li:last-of-type {
  border-radius: 5px 0 0 5px;
}
.field-radio-list-item-true {
  background-color: #01746e !important;
  color: #ffffff !important;
  box-shadow: inset 0px 2px 2px rgb(0 0 0 / 70%), 0 3px 1px rgb(0 0 0 / 30%) !important;
}

.newspaper-info {
  background-color: var(--mainColor4);
  width: 300px;
  max-width: 100%;
  height: 40px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  margin: 8px auto;
  color: var(--mainColor5);
}
.newspaper-info,
.newspaper-info a {
  color: var(--mainColor5);
}
.newspaper-info-lg {
  border-radius: 8px 0 0 8px;
  margin: 8px -16px 8px auto;
}
.newspaper-info-date {
  float: left;
}
.newspaper-control {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 8px;
}
.newspaper-step {
  background-color: var(--mainColor4);
  width: 160px;
  height: 40px;
  align-items: center;
  justify-content: center;
  display: flex;
  color: var(--mainColor5);
  border-radius: 8px;
}
.newspaper-step-text {
  margin: 0;
  padding: 0;
  width: 300px;
  text-align: center;
}
.newspaper-step-control {
  margin: 0 0 0 8px;
  cursor: pointer;
  z-index: 1;
}
.newspapaer-step-progress {
  height: 3px;
  border-radius: 5px;
  overflow: hidden;
  position: absolute;
  bottom: 1px;
  left: 5px;
  right: 5px;
  direction: ltr;
}
.newspapaer-step-progress-bar {
  transition: 0.01s;
  height: 4px;
  background: var(--mainColor5);
}
.newspaper-step-control-btn {
  margin: 4px;
  cursor: pointer;
  background-color: var(--mainColor4);
  width: 40px;
  height: 40px;
  color: var(--mainColor5);
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.newspaper-image {
  display: flex;
  justify-content: center;
  align-items: top;
  min-height: 70vh;
}

.grid-view-categry-component {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}

.grid-view-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  overflow: auto;
  height: 450px;
}

.grid-view-category-wrapper {
  width: 82%;
  display: flex;
  padding: 16px 40px 16px 40px;
}

.grid-view-category {
  height: 80px;
  width: 100%;
  background-color: var(--mainColor6);
}

.grid-view-category-item-wrapper {
  width: 100%;
  height: 78%;
  display: flex;
  align-items: center;
  justify-content: center;
  align-items: center;
  background-color: #f7f8fc;
  border-radius: 10px;
}

.grid-view-category-item {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  width: 140px;
  height: 60px;
  background-color: #f7f8fc;
  color: #ccd4df;
  margin: 2px;
  font-size: 14px;
  /* border-radius: 10px; */
  /* background-color: rgb(252, 252, 252); */
  /* border: 1px solid rgb(233, 229, 229); */
  /* box-shadow: 0 0 4px 1px rgba(217, 221, 220, 0.5); */
}

.grid-view-category-item.--active {
  background-color: var(--mainColor4);
  color: var(--mainColor5);
}

.grid-view-category-item.--active-right {
  border-radius: 0 10px 10px 0;
  background-color: var(--mainColor4);
  color: var(--mainColor5);
}

.grid-view-category-item.--active-left {
  border-radius: 10px 0 0 10px;
  background-color: var(--mainColor4);
  color: var(--mainColor5);
}

.grid-view-item-image {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  margin: 10px;
  padding: 8px 2px 0 2px;
  width: 140px;
  height: 106px;
  border-radius: 5px;
  background-color: rgb(250, 249, 249);
  border: 1px solid rgb(233, 229, 229);
  box-shadow: 0 0 4px 1px rgba(207, 226, 221, 0.5);
}

.bulletin-details-item-close-icon {
  background-color: #f4f4f4;
  border-radius: 0 4px 4px 0;
  width: 24px;
  height: 22px;
  position: absolute;
  left: 0;
  top: 15px;
  cursor: pointer;
  z-index: 2;
  color: #f00;
}

.bulletin-details-item-date-top {
  margin: 1px 16px;
}

.bulletin-details-item-content {
  padding: 4px 0;
  /* max-height: 184px; */
  /* overflow: hidden; */
  text-overflow: ellipsis;
  max-width: 100%;
  font-size: 13px;
}

.bulletin-details-item-date-wrapper {
  padding: 8px;
  margin: 12px;
}

.bulletin-details-item-date-bottom {
  position: absolute;
  left: 5px;
  bottom: 8px;
}

.bulletin-details-more-button {
  position: absolute;
  bottom: 0;
  left: 50%;
  background-color: var(--mainColor7);
  width: 58px;
  height: 14px;
  border-radius: 8px 8px 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.bulletin-details-more-button-text {
  font-size: 16px;
  color: #4d567e;
}

.inactive-bulletin-approach {
  background: rgba(255, 255, 255, 0.7);
  position: absolute;
  left: 0;
  top: 0;
  right: 100px;
  bottom: 0;
}

.bulletin-approach-wrapper {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  display: flex;
  height: 100%;
}

.approach-positive {
  background-color: #16d39a;
  border-radius: 8px;
  margin: 0 2px;
  color: var(--mainColor6);
  font-size: 14px;
  height: 36px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.approach-nagative {
  background-color: #ff7588;
  border-radius: 8px;
  margin: 0 2px;
  color: var(--mainColor6);
  font-size: 14px;
  height: 36px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.approach-neutral {
  background-color: #dbdbdb;
  border-radius: 8px;
  margin: 0 2px;
  color: var(--mainColor6);
  font-size: 14px;
  height: 36px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.approach-irrelevant {
  background-color: #000000;
  border-radius: 8px;
  margin: 0 2px;
  color: var(--mainColor6);
  font-size: 14px;
  height: 36px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.bulletin-details-approach-icon-delete {
  display: flex;
  align-items: center;
  margin: 0 32px 0 16px;
  cursor: pointer;
}

.bulletin-details-arrow-wrapper {
  color: var(--mainColor5);
  display: flex;
  align-items: center;
}

.bulletin-details-arrow {
  padding: 0 12px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.bulletin-items-length {
  float: right;
  display: flex;
  height: 30px;
}

.bulletin-items-length > div {
  background: #f1f4f8;
  border-radius: 6px;
  width: 90px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  color: var(--mainColor5);
}

.bulletin-items-length > button {
  width: 20px;
  height: 20px;
  border: 1px dashed var(--mainColor5);
  color: var(--mainColor5);
  background-color: var(--mainColor6);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  line-height: 0;
  margin: 2px 5px;
  cursor: pointer;
}

.bulletin-details-platforms {
  margin: 12px 12px 0 12px;
}
.bulletin-details-platforms button {
  background-color: var(--mainColor6);
  border-radius: 8px;
  margin: 0 8px;
  box-sizing: border-box;
  border: 1px solid #ffffff;
  color: var(--mainColor5);
  box-shadow: 0px 2px 20px rgba(180, 188, 188, 0.2);
  opacity: 1;
  cursor: pointer;
  min-width: 90px;
  display: inline-flex;
  align-items: center;
}
.bulletin-details-platforms button span {
  display: inline-block;
  margin: 2px;
}
/* .bulletin-details-platforms-btn,
.bulletin-details-platforms-btn:hover {
} */
.bulletin-details-platforms button.bulletin-details-platforms-btn-selected {
  background: #eefeff;
  border: 1px solid var(--mainColor5);
  opacity: 1;
}

.bulletin-details-platforms button.bulletin-details-platforms-btn:hover,
.bulletin-details-platforms
  button.bulletin-details-platforms-btn-selected:hover {
  background: #e7fcfd;
  border: 1px solid var(--mainColor5) !important;
  opacity: 1;
}

.bulletin-details-comment-component {
  height: auto;
  background-color: var(--mainColor4);
  display: flex;
  flex-direction: row;
  min-height: 120px;
}

.bulletin-details-comment-wrapper {
  display: flex;
}

.bulletin-details-comment-icon {
  background-color: var(--mainColor6);
  width: 54px;
  height: 72px;
  border-radius: 6px 0px 0px 6px;
  display: flex;
  justify-content: center;
  position: absolute;
  right: 0;
  top: 10px;
}

.bulletin-details-comment-text {
  color: var(--mainColor5);
  font-size: 13px;
  margin: 8px 52px 8px 24px;
  white-space: pre-wrap;
  word-break: break-word;
  text-align: justify;
}

.bulletin-details-management-image-wrapper {
  height: auto;
  background-color: #eee;
  border-radius: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 16px 32px;
}

.bulletin-details-management-image {
  width: 100%;
  height: 100%;
  max-height: 700px;
  border-radius: 15px;
}

.bulletin-details-management-title {
  color: var(--mainColor5);
  font-size: 15px;
  font-weight: bold;
  padding: 8px 32px 8px 32px;
}

.bulletin-details-management-content {
  text-align: justify;
  font-size: 13px;
  color: var(--mainColor8);
  padding: 0 32px 16px 32px;
  max-height: 900px;
  overflow: auto;
  margin: 0 0 12px 0;
}

.buffer-list-wrapper {
  min-height: 280px;
  min-width: 260px;
  width: 220px;
  /* overflow: auto; */
}

.buffer-list-input-value {
  height: 44px;
  width: 260px;
  margin: 0 0 0 12px;
  background-color: var(--mainColor6);
  font-size: 11px;
  border: 1px solid var(--mainColor5);
}

.buffer-list-button {
  font-size: 26px;
  width: 64px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mainColor5);
  cursor: pointer;
}
.buffer-list-button-disabled {
  color: var(--themIconDisableTextColor);
  cursor: not-allowed;
}

.buffer-list-chip {
  max-height: 132px;
  overflow: auto;
  margin: 8px 0;
}

.bulletin-details-management-wrapper {
  text-align: left;
  margin: 0 12px;
  position: absolute;
  top: 70px;
  left: 16px;
  display: flex;
}

.back-button-management {
  display: flex;
  background-color: var(--mainColor6);
  border-radius: 8px;
  height: 54px;
  text-align: center;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  cursor: pointer;
}

.approve-button-management {
  border-radius: 8px;
  height: 54px;
  text-align: center;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  cursor: pointer;
  margin: 0 20px;
}

.back-button-management-text {
  margin: 6px 8px;
  color: var(--mainColor5);
  font-size: 13px;
}

.back-button-management-icon {
  margin: 2px 0;
  color: var(--mainColor5);
}

.inactive-bulletin-details {
  background: rgba(255, 255, 255, 0.7);
  position: absolute;
  left: 0;
  top: 0;
  right: 100px;
  bottom: 0;
}

.bulletin-manage-items-length {
  float: right;
  display: flex;
  height: 30px;
}

.bulletin-manage-items-length > div {
  background: #f1f4f8;
  border-radius: 6px;
  width: 90px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  color: var(--mainColor5);
}

.bulletin-manage-items-length > button {
  width: 20px;
  height: 20px;
  border: 1px dashed var(--mainColor5);
  color: var(--mainColor5);
  background-color: var(--mainColor6);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  line-height: 0;
  margin: 2px 5px;
  cursor: pointer;
}

.bulletin-approach-details-wrapper {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  display: flex;
  height: 100%;
}

.approach-positive {
  background-color: #16d39a;
  border-radius: 8px;
  margin: 0 2px;
  color: var(--mainColor6);
  font-size: 14px;
  height: 36px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.approach-nagative {
  background-color: #ff7588;
  border-radius: 8px;
  margin: 0 2px;
  color: var(--mainColor6);
  font-size: 14px;
  height: 36px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.approach-neutral {
  background-color: #dbdbdb;
  border-radius: 8px;
  margin: 0 2px;
  color: var(--mainColor6);
  font-size: 14px;
  height: 36px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.approach-irrelevant {
  background-color: #000000;
  border-radius: 8px;
  margin: 0 2px;
  color: var(--mainColor6);
  font-size: 14px;
  height: 36px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.bulletin-details-icon-delete {
  display: flex;
  align-items: center;
  margin: 0 24px 0 10px;
  cursor: pointer;
}

.bulletin-details-icon-wrapper {
  color: var(--mainColor5);
  display: flex;
  align-items: center;
}

.bulletin-details-icons {
  padding: 6px;
  margin: 2px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.bulletin-details-icons-active {
  background-color: var(--mainColor4);
}

.r-d-i-m-f {
  display: flex;
  position: relative;
}
.r-d-i-m-f-t {
  border: 1px solid #beebed !important;
  border-radius: 0 8px 8px 0 !important;
  min-width: 100% !important;
  min-height: 61px !important;
  height: 51px !important;
  border-left: none !important;
  resize: none !important;
}
.r-d-i-m-f-b {
  border-radius: 8px 0 0 8px;
  margin: 12px 0 27px;
  display: flex;
  border: 1px solid #beebed;
  border-right: none;
  padding: 4px;
}
.r-d-i-m-f-b-b {
  width: 60px;
  border-radius: 8px;
}

.r-d-i-m {
  position: relative;
  overflow-y: scroll;
  padding: 5px 10px;
  background: #fafafa;
  border-radius: 8px;
  height: 585px;
  scroll-behavior: smooth;
  transition: 0.5s;
}

.r-d-i-m-g {
  text-align: center;
  position: sticky;
  top: -15px;
  z-index: 2;
  cursor: pointer;
}
.r-d-i-m-g > div {
  margin: 20px 0 10px 0;
  padding: 2px 50px;
  background: #e5e5e5;
  color: #79819f;
  border-radius: 5px;
  width: 170px;
  display: inline-block;
  transition: 0.3s;
}
.r-d-i-m-g > div:hover {
  color: #e5e5e5;
  background: #79819f;
  transition: 0.3s;
}

.r-d-i-m-i {
  margin: 1px;
}
.r-d-i-m-i > div {
  display: flex;
}
.r-d-i-m-i > div > div {
  position: relative;
}
.r-d-i-m-i-a {
  display: flex;
  flex-direction: column;
}
.r-d-i-m-i-m {
  padding: 5px 10px;
  margin: 5px;
  min-width: 140px;
  max-width: 350px;
  overflow-wrap: break-word;
  box-shadow: 0px 2px 5px rgb(180 188 188 / 20%);
  white-space: pre-wrap;
  word-break: break-word;
}
.r-d-i-m-i-m-m {
  color: #999;
  padding: 0 0 5px 0;
}
.r-d-i-m-i-m-d {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  color: #999;
  display: flex;
  padding: 5px 0 0 0;
  margin: 5px 0 0 0;
}

.r-d-i-i-i {
  margin: 0 0 16px 0;
}
.r-d-i-i-i > span {
  display: inline-block;
  background: var(--mainColor4);
  color: var(--mainColor5);
  padding: 4px 8px;
  border-radius: 4px;
}
.r-d-i-i-i > div {
  padding: 2px 8px;
  text-align: justify;
  color: #666666;
}
.r-d-i-i-i-s {
  font-size: 10px;
  padding: 1px 8px;
  border-radius: 4px;
  background-color: #f2f2f2;
  cursor: default;
}
.r-d-i-i-i-s-undefinde {
  display: none;
}

.r-d-i-i-i-s-processing {
  background-color: #ffeebf;
}

.r-d-i-a {
  background: linear-gradient(45deg, #253044, #00b2bb, #95c122);
  background-size: 600% 600%;

  -webkit-animation: AnimationName 30s ease infinite;
  -moz-animation: AnimationName 30s ease infinite;
  animation: AnimationName 30s ease infinite;
}

@-webkit-keyframes AnimationName {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@-moz-keyframes AnimationName {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes AnimationName {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.histogram-popup-content {
  padding: 10px;
  color: #376466;
}
.histogram-popup-content > div {
  display: flex;
  align-items: center;
  min-height: 40px;
  width: 100%;
  justify-content: space-around;
}

.histogram-popup-content > div span {
  padding: 5px;
  display: inline-block;
}
.histogram-popup-content > div > span:first-of-type {
  width: 40px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--themLinkTextColor);
}

.histogram-popup-content > div > span:last-of-type {
  direction: ltr;
  text-align: left;
  flex: 1;
}
.histogram-popup-content > div > span:last-of-type span {
  background-color: var(--mainColor4);
  color: var(--mainColor2);
  border-radius: 5px;
}

.automatic-alarm-module-wrapper-init {
  width: 100%;
  /* height: calc(100%- 400px); */
  height: 624px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  text-align: center;
  border-radius: 8px;
}

.first-text-init {
  color: var(--mainColor8);
  font-size: 14px;
  /* text-align: justify; */
  padding: 0 0 24px 0;
}

.alert-active-wrapper-init {
  background-color: rgba(211, 211, 211, 0.185);
  filter: grayscale(0.6) blur(2px);
  width: 210px;
  height: 300px;
  border-radius: 87px;
  margin: 24px 0;
  position: relative;
  align-items: center;
  display: flex;
  justify-content: center;
}

.alert-active-img-init {
  width: 100px;
}

.automatic-alarm-button-wrapper-init {
  display: flex;
  align-items: flex-end;
  width: 100%;
  padding: 32px 32px 0 32px;
  justify-content: center;
}

.automatic-alarm-module-wrapper-form {
  width: 100%;
  height: 624px;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
  border-radius: 8px;
}

.automatic-alarm-title-form {
  color: #a0a4a8;
  font-size: 14px;
  align-items: flex-start;
  width: 100%;
  padding: 16px 4px 2px 0;
}

.automatic-alarm-checkbox-wrapper {
  margin: 0 4px 0 0;
  position: relative;
}

.automatic-alarm-checkbox-status {
  position: absolute;
  top: 0px;
  left: 25px;
}

.automatic-alarm-button-wrapper-form {
  display: flex;
  align-items: flex-end;
  height: 100%;
  width: 100%;
  justify-content: center;
  padding: 0 32px 32px 32px;
  justify-content: center;
}

.automatic-alarm {
  min-height: 536px;
  position: relative;
}

.alert-disable {
  position: absolute;
  width: 100%;
  height: 500px;
}

.automatic-alarm-approve-view {
  background-color: var(--mainColor11);
  width: 100%;
  height: 154px;
  border-radius: 7px;
  position: relative;
}

.automatic-alarm-item {
  width: 12px;
  height: 33px;
  background-color: var(--mainColor5);
  border-radius: 3px 0px 0px 3px;
  position: absolute;
  top: 38%;
}

.automatic-alarm-item-wrapper {
  display: flex;
  padding: 54px 28px 0 0;
  flex-direction: column;
}

.automatic-alarm-title-wrapper {
  display: flex;
  flex-direction: column;
  margin: 20px 0;
}

.automatic-alarm-title {
  color: var(--mainColor5);
  font-size: 20px;
}

.automatic-alarm-text {
  color: #a0a4a8;
  font-size: 14px;
}

.automatic-alarm-gradient {
  background: linear-gradient(
    90deg,
    var(--mainColor5) 22.3%,
    rgba(0, 146, 153, 0) 173.87%
  );
  width: 113px;
  height: 123px;
  border-radius: 0 0 12px 12px;
  float: left;
  margin: 0 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0px;
  top: 0px;
}

.automatic-alarm-gradient-chart {
  width: 103px;
  height: 42px;
  position: absolute;
  bottom: 16px;
}

.automatic-alarm-gradient-text {
  font-size: 24px;
  color: var(--mainColor6);
  position: absolute;
  top: 24px;
}

.automatic-alarm-module-wrapper-view {
  width: 100%;
  /* height: 446px; */
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 8px;
}

.first-text-view {
  color: var(--mainColor8);
  font-size: 14px;
  text-align: center;
  padding: 32px 4px 16px 4px;
}

.dynamic-value {
  color: var(--mainColor5);
  font-weight: bold;
}

.alert-active-component-view {
  display: flex;
  align-items: center;
  justify-content: center;
}

.alert-active-wrapper-view {
  background-color: var(--mainColor11);
  width: 240px;
  height: 174px;
  border-radius: 87px;
  margin: 24px 0 44px 0;
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative;
}

.alert-active-img-view {
  width: 136px;
}

.automatic-alarm-button-wrapper-view {
  display: flex;
  align-items: flex-end;
  height: 100%;
  width: 100%;
  justify-content: center;
  padding: 8px 32px 32px 32px;
}

@media only screen and (max-width: 768px) {
  .automatic-alarm-title-wrapper {
    display: none;
  }
}

.drawer-line {
  border: 1px solid #f6f8fb;
  position: absolute;
  top: 40px;
  z-index: 10;
  width: 100%;
  right: 0;
}

.statistics-wrapper {
  list-style: none;
  padding-right: 0;
  /* border-top: 2px solid #f6f8fb; */
  margin: 0 32px;
  min-height: 226px;
}

.wrapper-lists {
  margin: 26px 12px;
  color: #a0a4a8;
  font-size: 14px;
  font-weight: bold;
  display: flex;
  justify-content: space-between;
}

.count-list {
  color: #4d567e;
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (max-width: 600px) {
  .statistics-wrapper {
    margin: 0 8px;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .statistics-wrapper {
    margin: 0 4px;
  }

  .wrapper-lists {
    font-size: 12px;
    display: flex;
    flex-direction: column;
    width: 100px;
    margin: 16px 10px;
    justify-content: center;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1355px) {
  .statistics-wrapper {
    list-style: none;
    padding-right: 0;
    /* border-top: 2px solid #f6f8fb; */
    margin: 0 32px;
    min-height: 226px;
  }

  .wrapper-lists {
    margin: 26px 0px;
    color: #a0a4a8;
    font-size: 14px;
    font-weight: bold;
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
  }
}

@media only screen and (max-width: 640px) {
  .wrapper-lists,
  .wrapper-lists * {
    font-size: 0.9rem;
  }
}

.sort-component {
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}

.sort-wrapper {
  width: 240px;
  height: 42px;
  background-color: var(--mainColor4);
  border-radius: 7px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 16px 0 8px;
}
.sort-component-border .sort-wrapper {
  background-color: transparent;
  border: 1px solid var(--mainColor5);
  width: 100%;
  margin: 5px;
}

.sort-component-border .sort-wrapper > span {
  color: var(--mainColor5);
}

.sort-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--mainColor4);
  background-color: var(--mainColor5);
  cursor: pointer;
  border: 1px solid var(--mainColor2);
  padding: 0.2em;
  border-radius: 0.2em;
}

.sort-title {
  width: 160px;
  /* height: 40px; */
  background-color: transparent;
  border-radius: 7px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--mainColor5);
  max-width: 90%;
}
.sort-title .form-select {
  border: 1px dashed var(--mainColor5);
}

@media only screen and (max-width: 600px) {
  .sort-title {
    max-width: 80%;
    width: fit-content;
  }
  .sort-wrapper {
    width: 90%;
    height: 36px;
    padding: 8px;
    margin: -4px 0;
  }
  .sort-icon {
    padding: 0 0 0 8px;
  }
}

.statistics-content-wrapper {
  height: 40px;
  border-radius: 5px;
  justify-content: space-between;
  display: flex;
  align-items: center;
  padding: 0 24px;
  margin: 10px 15px 15px 15px;
}
.statistics-content-wrapper div {
  align-items: center;
  display: flex;
}

.statistics-content-wrapper-data {
  margin: 15px 10px;
}

.statistics-content-item {
  display: flex;
  align-items: center;
}

.statistics-content {
  background-color: #ff7588;
  color: var(--mainColor6);
  font-size: 14px;
  font-weight: 700;
}

.statistics-title {
  background-color: rgb(129, 178, 252);
  color: var(--mainColor6);
  font-size: 14px;
  font-weight: 700;
}

.statistics-publish {
  background-color: #b7e778;
  color: var(--mainColor6);
  font-size: 14px;
  font-weight: 700;
}

.statistics-like {
  background-color: #1ad7db;
  color: var(--mainColor6);
  font-size: 14px;
  font-weight: 700;
}

.statistics-comment {
  background-color: #8258fb;
  color: var(--mainColor6);
  font-size: 14px;
  font-weight: 700;
}

.statistics-view {
  background-color: #5edfff;
  color: var(--mainColor6);
  font-size: 14px;
  font-weight: 700;
}

.statistics-content-details {
  background-color: var(--mainColor11);
  flex: 1;
  height: 32px;
  color: #a0a4a8;
  font-size: 14px;
  font-weight: 700;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px 0 24px;
  margin: 5px 12px 5px 4px;
}

.statistics-platform-icon {
  color: var(--mainColor5);
}

.statistics-more {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  background-color: var(--mainColor7);
  width: 168px;
  height: 26px;
  border-radius: 10px 10px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.statistics-more-details {
  font-size: 13px;
  color: var(--mainColor5);
  padding: 0 8px;
}

.statistics-more-details-icon {
  transform: rotate(90deg);
  font-size: 16px;
  color: var(--mainColor5);
}

@media only screen and (max-width: 640px) {
  .statistics-content-details {
    font-size: 1rem;
  }
}

.post-list-sort-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 8px;
  left: 40%;
}
.live-icon {
  display: inline-block;
  width: 10px;
  height: 10px;
  background: red;
  margin: 0 5px;
  transition: all 0.3s;
  animation: animatename 1s linear infinite;
  border-radius: 2px;
}
.post-item-children-class-name {
  background: var(--mainColor6);
  animation: animatename 1s linear;
  border-radius: 8px;
}
@keyframes animatename {
  0% {
    background: var(--themLinkTextColor);
    opacity: 0;
  }
  100% {
    background: var(--mainColor6);
    opacity: 1;
  }
}
@media screen and (max-width: 600px) {
  .post-list-sort-wrapper {
    margin: 6px auto;
    top: 0;
    transform: none;
    z-index: 1;
    left: 0;
    right: 0;
    width: fit-content;
    position: relative;
  }
}

@keyframes new-post {
  0% {
    margin-top: -150px;
    background: var(--mainColor6);
    opacity: 0;
  }
  30% {
    opacity: 0.4;
    background: var(--mainColor6);
  }
  90% {
    background: #ffe5a7;
    opacity: 1;
  }
  100% {
    margin-top: 4px;
    background: var(--mainColor6);
  }
}

.compare-wave-form {
  display: flex;
  margin: 10px;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid #999;
  align-items: center;
  flex-direction: column;
}

.custom-text-card {
  min-height: 200px;
  max-height: 752px;
  overflow: auto;
}

.custom-company-wrapper {
  font-size: 13px;
  font-weight: bold;
  color: #a5acc6;
  padding: 0px 0 10px 0;
}

.custom-text-wrapper {
  text-align: justify;
  color: #1b1534;
  font-size: 13px;
  padding: 0 20px;
}

.account-info {
  text-align: center;
}

.account-info-component {
  font-size: 14px;
  color: #b0b6cd;
  margin-top: 8px;
}

.account-info-wrapper {
  font-size: 13px;
  padding: 20px 16px;
  color: #4d567e;
}

.account-info-details {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.account-info-details-wrapper {
  padding: 12px 8px;
  border-bottom: 2px solid #f6f8fb;
  justify-content: space-between;
  display: flex;
}

.shape-bulletin-component {
  width: 100%;
  display: flex;
  margin: 24px 14px;
  position: relative;
}

.shape-bulletin-gradient {
  position: absolute;
  top: -7px;
  right: -50px;
  width: 60px;
  height: 32px;
  border-radius: 6px 0 0 6px;
  background: linear-gradient(
    90deg,
    rgba(165, 172, 198, 0.37) 0%,
    rgba(165, 172, 198, 0) 64%
  );
}

.shape-bulletin-rect {
  width: 18px;
  height: 18px;
  border-radius: 4px;
  background-color: var(--mainColor5);
  z-index: 0;
}
.bulletin-wrapper-title {
  color: var(--mainColor5);
  font-size: 14px;
  padding: 0 12px;
}

.graph-play {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 4px 16px;
  user-select: none;
}

.graph-play-container {
  width: 100%;
  border-radius: 5px;
  background: var(--mainColor4);
  position: relative;
  height: 5px;
  cursor: pointer;
}
.graph-play-container-linear {
  position: absolute;
  left: 0;
  height: 5px;
  border-radius: 5px;
  background: var(--mainColor5);
}
.graph-play-container-linear-number {
  margin-top: -25px;
  width: 40px;
  height: 25px;
  position: absolute;
  text-align: center;
  overflow: hidden;
  border-radius: 5px 5px 0 0;
}
.graph-play-container-linear-number-value {
  width: 100%;
  height: 20px;
  padding: 5px;
  border-radius: 5px;
  text-align: left;
  display: block;
  font-size: 9px;
  font-family: monospace, sans-serif, sans;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}
.graph-play-container-linear-number-arrow {
  transform: rotate(45deg);
  width: 10px;
  height: 10px;
  display: block;
}
.graph-play-container-btn {
  margin: 0 3px;
  padding: 3px;
  cursor: pointer;
  border-radius: 3px;
}

@media print {
  #ApproachWidget .highcharts-container,
  #SubjectActivityWrapper .highcharts-container {
    display: flex !important;
    justify-content: end !important;
    align-items: center !important;
    width: 12.2cm !important;
    direction: ltr !important;
  }
  #ApproachWidget .highcharts-container svg,
  #SubjectActivityWrapper .highcharts-container svg {
    width: 11.5cm !important;
  }
  #Hashtag .highcharts-container,
  #FlowgraphWidget .highcharts-container {
    display: flex !important;
    justify-content: end !important;
    align-items: center !important;
    direction: ltr !important;
  }
  #Hashtag .highcharts-container svg,
  #FlowgraphWidget .highcharts-container svg {
    height: 9cm !important;
  }
}

.date-preview-component {
  position: relative;
  display: flex;
  padding: 0 32px;
  z-index: 10;
}
.date-preview-component-border {
  border: 1px solid var(--mainColor5);
  padding: 6px 0;
  border-radius: 8px;
  margin: 4px;
  display: flex;
  justify-content: center;
}
.date-preview-wrapper {
  width: 150px;
  height: 26px;
  border-radius: 4px;
  border: none;
  background-color: var(--mainColor4);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  color: var(--mainColor5);
}

.dash {
  display: inline-block;
  margin: 0 8px;
  color: #a5acc6;
  font-size: 14px;
}

.calendar-wrapper {
  position: absolute;
  top: 40px;
  z-index: 10;
}

.title-date-preview {
  color: #a5acc6;
  font-size: 14px;
  display: flex;
  white-space: pre;
  word-break: break-word;
  align-items: center;
  padding: 0 8px;
}

.date-preview-component-border .title-date-preview {
  color: var(--mainColor5);
}
@media only screen and (max-width: 600px) {
  .title-date-preview {
    display: none;
  }
}
.rmdp-day,
.rmdp-week-day,
.rmdp-day span {
  font-size: 12px !important;
}

.rmdp-day,
.rmdp-week-day {
  width: 26px;
  height: 26px;
}
.rmdp-header {
  font-size: 13px;
  height: 25px !important;
  line-height: 23px !important;
}
.rmdp-toolbar > div,
.rmdp-top-class + button {
  margin: 2px auto 5px !important;
  min-width: 80px !important;
  width: 80px !important;
  border-radius: 4px !important;
  height: 26px !important;
  font-size: 11px !important;
  padding: 0px !important;
  flex-basis: inherit !important;
}

.bulletin-automatic-form-wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: flex-end;
}

.bulletin-automatic-form-input {
  /* width: 100%; */
}

.bulletin-automatic-form-text-area {
  width: 100%;
  height: 264px;
}

.bulletin-automatic-form-select {
  width: calc(100% - 8px);
  min-width: calc(100% - 8px);
  /*margin: 4px 4px 24px 4px;*/
}

.bulletin-automatic-form-select input {
  max-width: 100%;
}

.bulletin-automatic-component {
  justify-content: center;
  width: 100%;
  display: flex;
}

.bulletin-automatic-wrapper {
  /* justify-content: center; */

  display: inline-flex;
  margin: auto;
}

.bulletin-automatic-wrapper .form-wrapper {
  width: 300px;
  max-width: 100%;
}

.bulletin-automatic-inner-icon {
  cursor: pointer;
  color: var(--mainColor5);
}

.bulletin-automatic-button {
  height: 44px;
  margin: 0 4px;
}

@media only screen and (max-width: 768px) {
  .bulletin-automatic-input {
    width: calc(100% - 2px);
  }

  .bulletin-automatic-inner-icon {
    top: 2px;
    left: 1px;
  }

  .bulletin-automatic-wrapper {
    display: flex;
    flex-direction: column;
  }

  .bulletin-automatic-component {
    justify-content: space-between;
    width: 100%;
    display: flex;
    flex-direction: column;
  }
  .bulletin-automatic-button {
    margin: 0 0 12px 0;
    align-items: center;
    justify-content: center;
    width: calc(100% - 4px);
  }
}

.smart-secretary-orderlist-component {
  justify-content: center;
  display: flex;
  width: 100%;
}

.smart-secretary-orderlist-wrapper {
  justify-content: center;
  width: 100%;
  display: flex;
}

.smart-secretary-orderlist-input {
  width: 300px;
}

.smart-secretary-orderlist-inner-icon {
  cursor: pointer;
  position: absolute;
  top: 2px;
  left: 16px;
  color: var(--mainColor5);
}

.smart-secretary-orderlist-button {
  margin: 0 2px;
  height: 44px;
  width: 100px;
}

@media only screen and (max-width: 768px) {
  .smart-secretary-orderlist-input {
    width: calc(100% - 2px);
  }

  .smart-secretary-orderlist-inner-icon {
    top: 2px;
    left: 1px;
  }

  .smart-secretary-orderlist-component {
    justify-content: space-between;
    width: 100%;
    display: flex;
  }
  .smart-secretary-orderlist-button {
    margin: 0 0 12px 0;
    align-items: center;
    justify-content: center;
    width: calc(100% - 4px);
  }
}

.check-box-group-component {
}

.check-box-group-list {
  padding: 0;
  margin: 8px 0 0 0;
}

.check-box-group-list-item {
  list-style: none;
}
.check-box-group-label {
  font-size: 12px;
}

.intro-header {
  padding: 8px 0;
  border-radius: 10px;
  background-color: var(--mainColor6);
}

.intro-component {
  display: flex;
  width: 100%;
  justify-content: space-between;
  text-align: justify;
}

.intro-content-wrapper {
  flex-direction: column;
  width: 100%;
  background-color: var(--mainColor6);
  padding: 16px;
  border-radius: 50px;
}

.intro-title {
  font-size: 15px;
  font-weight: bold;
  color: var(--mainColor5);
}

.intro-title-text {
  font-size: 15px;
  font-weight: bold;
  padding: 0 0 4px 0;
}

.intro-text-wrapper {
  font-size: 13px;
  padding: 0 0 16px 0;
}

.intro-text {
  font-size: 15px;
  font-weight: bold;
  color: var(--mainColor5);
  text-align: center;
  margin: 8px auto;
}
.intro-text div {
  font-size: 15px;
  font-weight: bold;
  color: var(--mainColor5);
  text-align: center;
  margin: 8px auto;
  background-color: #f1ffff;
  border-radius: 15px;
  padding: 15px 30px;
  display: inline-block;
  border: 1px solid var(--mainColor5);
}

.intro-details-title {
  color: var(--mainColor5);
  font-weight: bold;
  padding: 0 0 4px 0;
  font-size: 13px;
}

.intro-services-list {
  padding: 0;
  margin: 0;
  list-style: none;
  color: #253044;
}

.intro-services-list li {
  margin: 16px 10px;
  display: inline-block;
  border: 1px solid #eee;
  border-radius: 15px;
  cursor: default;
  min-width: 250px;
  text-align: center;
  cursor: pointer;
}

.intro-services-list li span {
  display: block;
  margin: 15px 0;
  padding: 10px 20px;
}

.intro-services-list li span.brandmi-icon i {
  color: var(--mainColor5);
  font-size: 30px !important;
}

@keyframes fadeMe {
  0% {
    padding: 20px 40px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
  }
  50% {
    padding: 20px 30px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.7);
  }
  100% {
    padding: 20px 40px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
  }
}

.smart-secretary-list-component {
  justify-content: center;
  display: flex;
  width: 100%;
}

.smart-secretary-list-wrapper {
  justify-content: center;
  width: 100%;
  display: flex;
}

.smart-secretary-list-input {
  width: 300px;
}

.smart-secretary-list-inner-icon {
  cursor: pointer;
  position: absolute;
  top: 2px;
  left: 16px;
  color: var(--mainColor5);
}

.smart-secretary-list-button {
  margin: 0 2px;
  height: 44px;
  width: 100px;
}

@media only screen and (max-width: 768px) {
  .smart-secretary-list-input {
    width: calc(100% - 2px);
  }

  .smart-secretary-list-inner-icon {
    top: 2px;
    left: 1px;
  }

  .smart-secretary-list-component {
    justify-content: space-between;
    width: 100%;
    display: flex;
  }
  .smart-secretary-list-button {
    margin: 0 0 12px 0;
    align-items: center;
    justify-content: center;
    width: calc(100% - 4px);
  }
}

.request-list-component {
  justify-content: center;
  display: flex;
  width: 100%;
}

.request-list-wrapper {
  justify-content: center;
  width: 100%;
  display: flex;
}

.request-list-input {
  width: 300px;
}

.request-list-inner-icon {
  cursor: pointer;
  position: absolute;
  top: 2px;
  left: 16px;
  color: var(--mainColor5);
}

.request-list-button {
  margin: 0 2px;
  height: 44px;
  width: 100px;
}

@media only screen and (max-width: 768px) {
  .request-list-input {
    width: calc(100% - 2px);
  }

  .request-list-inner-icon {
    top: 2px;
    left: 1px;
  }

  .request-list-component {
    justify-content: space-between;
    width: 100%;
    display: flex;
  }
  .request-list-button {
    margin: 0 0 12px 0;
    align-items: center;
    justify-content: center;
    width: calc(100% - 4px);
  }
}


.my-brand-manager-wrapper {
  display: flex;
  justify-content: space-between;
  width: 100%;
  color: var(--mainColor5);
  font-weight: bold;
  align-items: center;
}

.my-brand-manager-icon {
  color: var(--mainColor5);
  margin: 10px 0 0 0;
}

.manager-dashboard-text {
  text-align: justify;
  font-size: 14px;
  white-space: break-spaces;
  word-break: break-word;
  margin: 0 34px;
  color: #a0a4a8;
}

.manager-dashboard-image {
  text-align: center;
}
.manager-dashboard-image img {
  width: 100%;
  margin: auto;
  max-width: 800px;
  padding: 0 16px;
}

@media only screen and (max-width: 640px) {
  .manager-dashboard-text {
    font-size: 0.9rem;
  }
}

.statistics-wrapper {
  list-style: none;
  margin-right: 0;
  padding-right: 0;
  border-top: 2px solid #f6f8fb;
  margin: 0 32px;
  min-height: 226px;
}

.wrapper-lists {
  margin: 26px 12px;
  color: #a0a4a8;
  font-size: 14px;
  font-weight: bold;
  display: flex;
  justify-content: space-between;
}

.count-list {
  color: #4d567e;
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (max-width: 600px) {
  .statistics-wrapper {
    margin: 0 8px;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .statistics-wrapper {
    margin: 0 4px;
  }

  .wrapper-lists {
    font-size: 12px;
    display: flex;
    flex-direction: column;
    width: 100px;
    margin: 16px 10px;
    justify-content: center;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1355px) {
  .statistics-wrapper {
    list-style: none;
    margin-right: 0;
    padding-right: 0;
    border-top: 2px solid #f6f8fb;
    margin: 0 32px;
    min-height: 226px;
  }

  .wrapper-lists {
    margin: 26px 0px;
    color: #a0a4a8;
    font-size: 14px;
    font-weight: bold;
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
  }
}

.all-compare .card-extra-list > li {
  color: var(--mainColor6);
}
.all-compare:hover .card-extra-list > li {
  color: var(--mainColor5);
}
.company-cpmpare-wrapper-content-title,
.company-cpmpare-wrapper-content-print {
  display: none;
}
@media print {
  #app .main.base-compare-page {
    width: 29.7cm !important;
    max-width: 29.7cm !important;
  }
  .base-compare-page #header {
    box-shadow: none !important;
    background-size: 29.7cm auto !important;
    height: 21cm !important;
  }

  .base-compare-page .content-footer {
    box-shadow: none !important;
    background-size: 29.7cm auto !important;
    background-position: bottom center !important;
    height: 21cm !important;
    padding: 0 !important;
  }
  .base-compare-page #content {
    background-size: auto 21cm !important;
    padding: 0 !important;
  }

  .company-cpmpare-wrapper-content-title,
  .company-cpmpare-wrapper-content-print {
    display: block !important;
    text-align: center !important;
  }

  .company-cpmpare-wrapper-content-print {
    padding: 1cm !important;
    color: #666 !important;
  }
  #content > #content-compare {
    width: 29.7cm !important;
  }

  #content > #content-compare #filter-box {
    display: none !important;
  }
  #content > #content-compare #SentimentCompare .highcharts-container,
  #content > #content-compare #TopHashtagCompareWrapper .highcharts-container,
  #content > #content-compare #ActivityCompare .highcharts-container {
    display: flex !important;
    justify-content: end !important;
    align-items: center !important;
    width: 6.2cm !important;
    direction: ltr !important;
  }
  #content > #content-compare #SentimentCompare .highcharts-container svg,
  #content
    > #content-compare
    #TopHashtagCompareWrapper
    .highcharts-container
    svg,
  #content > #content-compare #ActivityCompare .highcharts-container svg {
    width: 5.5cm !important;
  }

  #content > #content-compare #StatisticsCompareWrapper .highcharts-container,
  #content > #content-compare #FlowgraphCompareWidget .highcharts-container {
    display: flex !important;
    justify-content: end !important;
    align-items: center !important;
    width: 29cm !important;
    direction: ltr !important;
  }
  .base-compare-page #content-compare .card * {
    max-width: 29.7cm !important;
  }
  #content
    > #content-compare
    #StatisticsCompareWrapper
    .highcharts-container
    svg,
  #content
    > #content-compare
    #FlowgraphCompareWidget
    .highcharts-container
    svg {
    width: 28cm !important;
  }

  #content > #content-compare * {
    margin: 0 !important;
  }
  #content > #content-compare {
    padding: 0.8cm !important;
  }
  #content > #content-compare .card.company-cpmpare-list * {
    margin: 0 auto !important;
  }
  #content > #content-compare .col-24 {
    margin: 0.05cm auto !important;
  }
  .company-cpmpare-wrapper > div > div:first-of-type,
  .company-cpmpare-wrapper > div > .add-company-btn {
    display: none;
  }
  #content > #content-compare > .col-24 > .card.company-cpmpare-list {
    margin-top: -17cm !important;
    margin-bottom: 8cm !important;
    z-index: 10000;
  }
  #content-compare #SentimentCompare .card *,
  #content-compare #TopHashtagCompareWrapper .card *,
  #content-compare #ActivityCompare .card * {
    max-width: unset !important;
  }
  #content-compare #SentimentCompare .card .card-content *,
  #content-compare
    #TopHashtagCompareWrapper
    #top-hashtag
    .col-24
    .d-flex
    .col-24,
  #content-compare #ActivityCompare .card .card-content * {
    max-width: 6.5cm !important;
  }
  #content-compare .col-24#SentimentCompare,
  #content-compare .col-24#ActivityCompare,
  #content-compare .col-24#StatisticsCompareWrapper,
  #content-compare .col-24#FlowgraphCompareWidget,
  #content-compare .col-24#TopHashtagCompareWrapper {
    padding-top: 4cm !important;
  }
  #content-compare #SentimentCompare .d-flex,
  #content-compare #SentimentCompare .card .card-content .d-flex,
  #content-compare #TopHashtagCompareWrapper .d-flex,
  #content-compare #TopHashtagCompareWrapper .card .card-content .d-flex,
  #content-compare #ActivityCompare .d-flex,
  #content-compare #ActivityCompare .card .card-content .d-flex {
    display: flex !important;
    max-width: 28cm !important;
    justify-content: center !important;
  }

  #content-compare #SentimentCompare .card-header .card-title,
  /*#content-compare #TopHashtagCompareWrapper .card-header .card-title,*/
  #content-compare #ActivityCompare .card-header .card-title {
    border: none !important;
    padding: 10px 0 !important;
    margin: 0 0.5cm !important;
  }
  .base-compare-page .version-control {
    top: 15cm !important;
  }
  .base-compare-page .content-footer ul {
    top: 19cm !important;
  }
}

.compare-manager-wrapper {
  display: flex;
  justify-content: space-between;
  width: 100%;
  color: var(--mainColor5);
  font-weight: bold;
  align-items: center;
}

.compare-manager-icon {
  color: var(--mainColor5);
  margin: 10px 0 0 16px;
}

.account-type {
  display: inline-block;
  text-align: center;
  margin: 10px;
  border: 1px solid #ccc;
  border-radius: 15px;
  padding: 20px;
  background-image: linear-gradient(35deg, #eeeeee, #f6f6f6);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  opacity: 0.9;
  filter: grayscale(0.51);
  transition: all 0.3s;
}

.account-type:hover {
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.35);
  opacity: 1;
  filter: grayscale(0);
  transition: all 0.3s;
  border-radius: 5px;
}

.preview-post-reaction {
  padding: 10px 0 0 0;
  display: flex;
  justify-content: space-between;
  color: #777;
  margin-top: 10px;
  cursor: default;
}
.preview-post-reaction > span {
  display: flex;
  align-items: center;
}
.preview-post-reaction > span > span {
  margin: 2px;
}