@font-face {
  font-family: Ppagrandir;
  src: url('../fonts/PPAgrandir-Bold.ttf') format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Ppagrandir;
  src: url('../fonts/PPAgrandir-Medium.ttf') format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-colors--primary: #1c1a1f;
  --color: transparent;
  --buttons--yellow: #fdc100;
  --white: white;
  --font-colors--secondary: #1e266d;
  --background-colors--light-grey: #f8f6f2;
  --background-colors--dark-grey: #2c282f;
  --font-colors--grey: #d8d8d8;
  --font-colors--still-blue: #3d6084;
  --background-colors--dark-blue: #1e183a;
  --dashboard--primary: #272e35;
  --border--default: #e9ecef;
  --body-text: #4a545e;
  --active--background-color: #e5eeff;
  --action--primary: #3062d4;
  --black: black;
  --text-success: #1d7c4d;
  --text-error: #c53434;
  --user-primary: #111827;
  --background-colors--grey: #e6edf2;
  --background-colors--off-white: #ffeee0;
  --buttons--blue: #1574f6;
}

.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.w-layout-grid {
  grid-row-gap: 16px;
  grid-column-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.w-checkbox {
  margin-bottom: 5px;
  padding-left: 20px;
  display: block;
}

.w-checkbox:before {
  content: " ";
  grid-area: 1 / 1 / 2 / 2;
  display: table;
}

.w-checkbox:after {
  content: " ";
  clear: both;
  grid-area: 1 / 1 / 2 / 2;
  display: table;
}

.w-checkbox-input {
  float: left;
  margin: 4px 0 0 -20px;
  line-height: normal;
}

.w-checkbox-input--inputType-custom {
  border: 1px solid #ccc;
  border-radius: 2px;
  width: 12px;
  height: 12px;
}

.w-checkbox-input--inputType-custom.w--redirected-checked {
  background-color: #3898ec;
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/static/custom-checkbox-checkmark.589d534424.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-color: #3898ec;
}

.w-checkbox-input--inputType-custom.w--redirected-focus {
  box-shadow: 0 0 3px 1px #3898ec;
}

.w-form-formradioinput--inputType-custom {
  border: 1px solid #ccc;
  border-radius: 50%;
  width: 12px;
  height: 12px;
}

.w-form-formradioinput--inputType-custom.w--redirected-focus {
  box-shadow: 0 0 3px 1px #3898ec;
}

.w-form-formradioinput--inputType-custom.w--redirected-checked {
  border-width: 4px;
  border-color: #3898ec;
}

@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }
}

body {
  color: var(--font-colors--primary);
  letter-spacing: .2px;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

h1 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-size: 54px;
  font-weight: 700;
  line-height: 1.07407;
}

h2 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-size: 32px;
  font-weight: bold;
  line-height: 36px;
}

p {
  margin-bottom: 0;
}

a {
  color: var(--font-colors--primary);
  text-decoration: none;
}

ol {
  color: #4a545e;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 20px;
}

li {
  margin-bottom: 8px;
}

label {
  margin-bottom: 5px;
  font-weight: bold;
  display: block;
}

strong {
  font-weight: 600;
}

.header {
  padding-top: 36px;
  padding-bottom: 32px;
}

.navbar {
  background-color: var(--color);
}

.container {
  max-width: 1386px;
  padding-left: 20px;
  padding-right: 20px;
}

.nav-link {
  letter-spacing: -.5px;
  padding: 0;
  font-weight: 500;
  line-height: 20px;
  transition: color .3s;
}

.nav-link:hover {
  color: var(--buttons--yellow);
}

.nav-button-group {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  align-items: center;
  margin-left: 10px;
  display: flex;
}

.nav-menu {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  align-items: center;
  display: flex;
}

.brand-logo-wrap.mobile-view {
  display: none;
}

.container-flex {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.container-flex.space {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
}

.primary-button {
  background-color: var(--font-colors--primary);
  color: var(--white);
  border-radius: 8px;
  align-items: center;
  height: 47px;
  max-height: 47px;
  padding-left: 30px;
  padding-right: 30px;
  line-height: 21.12px;
  transition: background-color .3s;
  display: flex;
}

.primary-button:hover {
  background-color: var(--buttons--yellow);
}

.button-text {
  color: var(--white);
  font-family: Ppagrandir, sans-serif;
  font-weight: 700;
}

.button-text.text-dark {
  color: var(--font-colors--primary);
  line-height: 21.12px;
}

.nav-button {
  border: 2px solid var(--font-colors--primary);
  background-color: var(--color);
  border-radius: 8px;
  align-items: center;
  height: 47px;
  max-height: 47px;
  padding-left: 28px;
  padding-right: 28px;
  font-family: Agrandir;
  font-weight: 700;
  display: flex;
}

.nav-button:hover {
  color: var(--white);
}

.hero-main-wrap {
  background-image: url('../images/Hero-Background-Shape.svg');
  background-position: 0 100%;
  background-size: cover;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  border-bottom-right-radius: 16px;
  min-height: 622px;
  padding-top: 30px;
  padding-left: 45px;
  padding-right: 30px;
}

.hero-grid {
  grid-column-gap: 37px;
  grid-row-gap: 37px;
  grid-template-rows: auto;
  grid-template-columns: 3fr 1.4fr;
}

.hero-left-block {
  padding-top: 32px;
  position: relative;
}

.hero-image-wrap {
  position: relative;
}

.hero-content-block {
  padding-bottom: 24px;
}

.hero-sub-tittle {
  margin-bottom: 25px;
  font-weight: 700;
  line-height: 2.125;
}

.hero-heading {
  color: var(--font-colors--secondary);
  margin-top: 0;
  margin-bottom: 24px;
  font-family: Ppagrandir, sans-serif;
}

.hero-text {
  margin-bottom: 0;
  font-size: 18px;
  line-height: 1.72222;
}

.arrow-icon {
  margin-top: 85px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.section-process {
  padding-top: 48px;
}

.section-tittle-wrap {
  text-align: center;
  margin-bottom: 30px;
}

.section-tittle {
  margin-top: 0;
  margin-bottom: 0;
  font-family: Ppagrandir, sans-serif;
  font-size: 38px;
  line-height: 1.38095;
}

.section-sub-text {
  font-size: 24px;
  font-weight: 800;
  line-height: 1.88889;
}

.large-space {
  min-height: 83px;
}

.process-step-one {
  max-width: 1310px;
  margin-left: auto;
  margin-right: auto;
}

.process-grid {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.process-grid.step-two {
  grid-template-columns: 1fr 1fr;
  max-width: 610px;
  margin-left: auto;
  margin-right: auto;
}

.process-grid.step-three {
  grid-template-columns: 1fr 1fr 1fr;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}

.process-card {
  background-color: var(--background-colors--light-grey);
  cursor: pointer;
  border-radius: 8px;
  padding: 35px 30px;
  transition: border .3s, background-color .3s;
}

.process-card:hover {
  background-color: var(--white);
  outline-offset: 0px;
  outline: 3px solid #1c1a1f;
}

.process-card.step-two {
  flex-direction: row;
  min-height: 92px;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.process-card.step-three {
  min-height: 92px;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.process-description {
  color: var(--background-colors--dark-grey);
  margin-bottom: 20px;
  font-size: 18px;
  line-height: 1.11111;
}

.payment-method-text {
  letter-spacing: .32px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Ppagrandir, sans-serif;
  font-size: 31px;
  line-height: 1.06452;
}

.button-wrap {
  justify-content: center;
  align-items: center;
  margin-top: 30px;
  display: flex;
}

.process-button {
  background-color: var(--buttons--yellow);
  text-align: center;
  border-radius: 8px;
  flex: 1;
  max-width: 252px;
  min-height: 48px;
  padding-top: 14px;
  padding-bottom: 14px;
  line-height: 48px;
  transition: color .3s, background-color .3s;
}

.process-button:hover {
  background-color: var(--font-colors--primary);
  color: var(--buttons--yellow);
}

.process-button-text {
  font-weight: 600;
  line-height: 19.36px;
}

.section-tittle-block {
  text-align: center;
  margin-bottom: 50px;
}

.dark-background-wrap {
  background-color: var(--font-colors--primary);
  height: 706px;
  max-height: 706px;
  padding-top: 32px;
}

.features-block {
  max-width: 1206px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 40px;
  padding-left: 28px;
  padding-right: 20px;
}

.features-grid {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.features-left-text {
  color: var(--white);
  letter-spacing: -.6px;
  font-family: Ppagrandir, sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.33333;
}

.active-text {
  color: var(--buttons--yellow);
  font-family: Ppagrandir, sans-serif;
  font-size: 31px;
  font-weight: 700;
  line-height: 1.29032;
}

.features-tittle {
  color: var(--white);
  margin-top: 0;
  margin-bottom: 24px;
}

.features-text {
  color: var(--font-colors--grey);
  padding-left: 20px;
  font-size: 19px;
  line-height: 1.52632;
}

.payment-form-block {
  max-width: 1206px;
  margin-top: -204px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.payment-from-grid {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
}

.payment-from-card {
  background-color: #e1e7f9;
  border-radius: 8px;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 40px;
  display: flex;
}

.card-tittle {
  margin-top: 0;
  margin-bottom: 20px;
  font-family: Ppagrandir, sans-serif;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.34615;
}

.card-list {
  color: var(--background-colors--dark-grey);
  margin-bottom: 46px;
  padding-left: 20px;
  font-family: Inter, sans-serif;
  font-size: 18px;
  line-height: 1.55556;
}

.card-button {
  background-color: var(--font-colors--primary);
  color: var(--white);
  letter-spacing: .17px;
  border-radius: 8px;
  padding: 10px 20px;
  font-family: Ppagrandir, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1;
  transition: background-color .3s;
}

.card-button:hover {
  background-color: var(--buttons--yellow);
}

.invoice-button-wrap {
  justify-content: center;
  margin-bottom: 72px;
  display: flex;
}

.invoice-button {
  text-align: center;
  background-color: #1574f6;
  border-radius: 16px;
  justify-content: center;
  align-items: center;
  width: 600px;
  max-width: 600px;
  min-height: 69px;
  padding: 0;
  font-family: Ppagrandir, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.27778;
  transition: background-color .3s;
  display: flex;
}

.invoice-button:hover {
  background-color: #0a4ca7;
}

.invoice-wrap {
  background-image: url('../images/Invoice-Background-Shape.svg');
  background-position: 50% 100%;
  background-size: cover;
  justify-content: center;
  align-items: center;
  min-height: 688px;
  display: flex;
}

.invoice-content-wrap {
  text-align: center;
  width: 706px;
  max-width: 706px;
}

.invoice-sub-tittle {
  color: var(--font-colors--secondary);
  max-width: 95%;
  margin-bottom: 35px;
  margin-left: auto;
  margin-right: auto;
  font-size: 19px;
  font-weight: 600;
  line-height: 1.68421;
}

.invoice-logo-wrap {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-bottom: 35px;
  display: grid;
}

.logo-block {
  justify-content: center;
  align-items: center;
  display: flex;
}

.payment-process-text {
  color: var(--font-colors--secondary);
  letter-spacing: -.2px;
  max-width: 97%;
  margin-bottom: 35px;
  margin-left: auto;
  margin-right: auto;
  font-weight: 600;
  line-height: 1.625;
}

.brand-logo-block {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.make-it-easy {
  letter-spacing: -.2px;
  margin-left: 0;
  font-family: Ppagrandir, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.28571;
}

.business-main-wrap {
  max-width: 1232px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

.business-section-tittle {
  text-align: left;
  max-width: 48%;
  min-height: 181px;
  margin-top: 0;
  margin-bottom: 26px;
  font-family: Ppagrandir, sans-serif;
  font-size: 34px;
  line-height: 1.29412;
}

.business-grid {
  grid-column-gap: 26px;
  grid-row-gap: 26px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.author-info-block {
  justify-content: space-between;
  margin-top: 15px;
  display: flex;
}

.business-tittle {
  color: var(--font-colors--still-blue);
  text-transform: uppercase;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.22222;
}

.business-type-text {
  color: var(--font-colors--secondary);
  font-family: Ppagrandir, sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.33333;
}

.section-cta {
  text-align: center;
  background-color: #f1e6fe;
  padding-top: 100px;
  padding-bottom: 96px;
}

.cta-heading {
  margin-top: 0;
  margin-bottom: 16px;
  font-family: Ppagrandir, sans-serif;
  font-size: 28px;
  line-height: 1.39286;
  display: inline-block;
}

.cta-content-wrap {
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
  display: inline-block;
}

.cta-text {
  color: var(--font-colors--still-blue);
  margin-bottom: 40px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.5;
}

.cta-button {
  background-color: #1574f6;
  border-radius: 8px;
  max-height: 47px;
  padding: 14px 30px;
  font-family: Ppagrandir, sans-serif;
  font-weight: 700;
  line-height: 20px;
  transition: background-color .3s;
}

.cta-button:hover {
  background-color: #0a4ca7;
}

.brand-logos-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  grid-template-rows: auto;
  grid-template-columns: minmax(184px, 1fr) 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  max-width: 796px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
  display: grid;
}

.footer {
  background-color: var(--background-colors--dark-blue);
  padding-top: 40px;
  padding-bottom: 32px;
}

.footer-main-wrap {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

.footer-grid {
  grid-column-gap: 132px;
  grid-row-gap: 132px;
  grid-template-rows: auto;
  grid-template-columns: 2.75fr 1fr 1fr;
}

.footer-logo-wrap {
  margin-bottom: 28px;
}

.footer-text {
  color: #ffffffa8;
  max-width: 60%;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.57143;
}

.social-icon-wrap {
  grid-column-gap: 13px;
  grid-row-gap: 13px;
  margin-bottom: 32px;
  display: flex;
}

.social-icon {
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  transition: transform .3s;
  display: flex;
}

.social-icon:hover {
  transform: translate(0, -3px);
}

.widget-tittle {
  color: var(--white);
  margin-bottom: 16px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.57143;
}

.footer-link-list {
  color: #ffffffa6;
  margin-bottom: 0;
  font-size: 14px;
  line-height: 1.57143;
}

.footer-link {
  color: #ffffffa6;
  font-size: 14px;
  line-height: 1.57143;
  transition: color .3s;
}

.footer-link:hover {
  color: var(--buttons--yellow);
}

.copyright-text-wrap {
  margin-top: 0;
  display: inline-block;
}

.copyright-text {
  color: #ffffffa6;
  font-size: 14px;
  font-weight: 500;
  display: inline-block;
}

.project-link {
  color: var(--font-colors--grey);
  transition: color .3s;
}

.project-link:hover {
  color: var(--buttons--yellow);
}

.icon {
  display: flex;
}

.planet-circle {
  border: 1px solid #a6b3ff;
  border-radius: 50%;
  width: 773px;
  height: 773px;
  margin: auto;
  position: absolute;
  inset: 0%;
}

.planet-circle.medium {
  width: 607px;
  height: 607px;
}

.planet-circle.small {
  border: 0px none var(--color);
  background-color: #ffeee0;
  justify-content: center;
  align-items: center;
  width: 409px;
  height: 409px;
  padding: 76px;
  display: flex;
}

.planet-block {
  min-height: 800px;
  position: relative;
}

.planet-center-text {
  text-align: center;
  font-family: Ppagrandir, sans-serif;
  font-size: 33px;
  font-weight: 700;
  line-height: 1.27273;
}

.user-review-block {
  z-index: 2;
  border-radius: 4px;
  flex-direction: row-reverse;
  justify-content: center;
  align-items: center;
  max-width: 212px;
  display: flex;
  position: absolute;
  top: 249px;
  left: -17px;
  right: auto;
}

.user-review-block.right {
  flex-direction: row;
  left: auto;
  right: -16px;
}

.user-review-block.right.left-top {
  top: 8px;
  left: -41px;
  right: auto;
}

.user-review-block.right.left-bottom {
  inset: auto auto 60px -100px;
}

.user-review-block.right-corner {
  inset: auto -65px 40px auto;
}

.user-review-block.right-mid {
  inset: auto -180px 210px auto;
}

.user-review-block.left-top {
  top: 34px;
}

.user-review-block.image-top {
  flex-direction: column-reverse;
  inset: auto 225px -90px auto;
}

.user-review-block.image-bottom {
  flex-direction: column;
  inset: -78px 105px auto auto;
}

.reviewer {
  margin-bottom: 8px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.2;
}

.reviewer-image {
  background-color: var(--font-colors--still-blue);
  outline-offset: 0px;
  object-fit: cover;
  border-radius: 50%;
  outline: 3px solid #d9d9d9;
  width: 51px;
  height: 51px;
  margin-top: 2px;
  position: relative;
  right: -10px;
}

.reviewer-image.right {
  left: -10px;
  right: 0;
}

.reviewer-image.bottom {
  margin-top: 0;
  top: 6px;
  right: 0;
}

.reviewer-image.top {
  margin-top: -15px;
  top: 6px;
  right: 0;
}

.user-content-block {
  background-color: var(--white);
  text-align: center;
  border-radius: 4px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 176px;
  max-width: 176px;
  min-height: 74px;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
  box-shadow: 0 10px 20px 5px #0003;
}

.check-circle {
  background-color: #596eff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 61px;
  height: 61px;
  display: flex;
  position: absolute;
  inset: auto auto 210px -30px;
}

.thumbs-circle {
  background-color: #596eff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 61px;
  height: 61px;
  display: flex;
  position: absolute;
  inset: 115px 55px auto auto;
}

.input-check-wrap {
  flex-direction: row;
  flex: 1;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.process-step-two {
  max-width: 1310px;
  margin: 37px auto;
}

.sub-tittle-wrap {
  text-align: center;
  margin-bottom: 30px;
}

.process-tittle {
  display: inline-block;
}

.process-step-three {
  max-width: 1310px;
  margin-bottom: 37px;
  margin-left: auto;
  margin-right: auto;
}

.tabs-main-wrap {
  max-width: 1162px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
  display: block;
}

.tabs-tittle-wrap {
  text-align: center;
  margin-bottom: 56px;
}

.tabs-tittle {
  margin-top: 0;
  margin-bottom: 16px;
  font-family: Ppagrandir, sans-serif;
  font-size: 31px;
  font-weight: 700;
}

.tabs-tittle-text {
  max-width: 85%;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
}

.tabs {
  display: flex;
}

.tabs-menu {
  border: 2px solid #000;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
  flex-direction: column;
  width: 336px;
  max-width: 336px;
  display: flex;
}

.tabs-content {
  background-color: var(--background-colors--dark-grey);
  flex: 1;
}

.tab-link {
  background-color: var(--color);
  padding: 28px 28px 0;
}

.tab-link.w--current {
  background-color: #e1e7f9;
}

.tab-link.top {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.tab-menu {
  max-width: 80%;
  font-family: Ppagrandir, sans-serif;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.11538;
}

.tabs-menu-holder {
  justify-content: space-between;
  margin-bottom: 28px;
  display: flex;
}

.tab-content-wrap {
  padding: 50px;
}

.paymlink {
  color: #141414;
  font-weight: 800;
}

.tab-text {
  color: #fffc;
  margin-bottom: 30px;
  font-weight: 600;
  line-height: 1.625;
}

.tab-text.extra-weight {
  font-weight: 700;
}

.email-from {
  max-width: 360px;
  position: relative;
}

.from-field {
  color: var(--dashboard--primary);
  border-radius: 4px;
  min-height: 48px;
}

.submit-button {
  background-color: var(--buttons--yellow);
  color: var(--font-colors--primary);
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  padding: 16px 27px;
  font-weight: 600;
  line-height: 1;
  position: absolute;
  inset: auto 0% 0% auto;
}

.link-divider {
  background-color: #0006;
  width: 100%;
  height: 1px;
}

.input-check {
  display: block;
}

.author-image-wrap {
  overflow: hidden;
}

.accordion-main-wrap {
  max-width: 1162px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
  display: none;
}

.accordion {
  border: 2px solid #000;
  border-radius: 8px;
}

.accordion-item {
  border-bottom: 1px solid #000;
}

.accordion-item.last-item {
  border-bottom: 0px none var(--color);
}

.accordion-toggle {
  cursor: pointer;
  justify-content: space-between;
  align-items: center;
  padding: 24px;
  display: flex;
}

.accordion-toggle.bottom {
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}

.accordion-toggle.top {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.accordion-body {
  background-color: var(--font-colors--primary);
  padding: 24px;
  display: none;
}

.accordion-tittle {
  margin-top: 0;
  margin-bottom: 0;
  font-family: Agrandir;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.11538;
}

.dashboard-wrapper {
  flex-flow: column;
  align-items: stretch;
  width: 100%;
  min-height: 100vh;
  display: flex;
}

.dashboard-wrapper.test {
  display: block;
}

.sidebar-nav {
  background-color: #fbfcfd;
  height: 100vh;
  position: fixed;
}

.sidebar-nav.mobile-view {
  display: none;
}

.sidebar-nav.test {
  float: left;
}

.sidebar-nav.sidebar {
  display: none;
}

.dashboard-sidebar {
  border-right: 1px solid #e9ecef;
  flex-flow: column;
  width: 280px;
  height: 100%;
  display: flex;
  overflow: auto;
}

.logo-wrapper {
  z-index: 9999;
  border-bottom: 1px solid var(--border--default);
  background-color: var(--white);
  justify-content: space-between;
  align-items: center;
  height: 70px;
  min-height: 70px;
  padding-left: 24px;
  padding-right: 16px;
  display: flex;
  position: sticky;
  top: 0;
}

.sidebar-collapse {
  cursor: pointer;
}

.sidebar-menu {
  padding-top: 12px;
}

.workspace-wrap {
  margin-bottom: 8px;
}

.workspace-text {
  color: #272e35;
  letter-spacing: .1px;
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
}

.sidebar-menu-block {
  padding-left: 8px;
  padding-right: 8px;
}

.link-item {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  color: var(--body-text);
  border-radius: 6px;
  justify-content: flex-start;
  align-items: center;
  min-height: 40px;
  padding-left: 1rem;
  padding-right: 1rem;
  line-height: 20px;
  transition: color .3s, background-color .3s;
  display: flex;
  position: relative;
}

.link-item:hover {
  color: var(--background-colors--dark-blue);
  background-color: #f0f3f5;
}

.link-item:focus {
  background-color: var(--white);
  border-radius: 6px;
  box-shadow: inset 0 0 0 2px #6792f4;
}

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

.link-item.disable.brand-link, .link-item.brand-link {
  background-color: var(--white);
}

.link-item.brand-link.w--current {
  color: var(--dashboard--primary);
  background-color: #10284817;
}

.link-item.active {
  background-color: var(--active--background-color);
  color: var(--action--primary);
}

.sidebar-icon {
  filter: brightness(30%);
  transition: background-color .3s;
}

.sidebar-icon.active {
  filter: none;
}

.fill-button {
  color: var(--dashboard--primary);
  background-color: #ffe8d1;
  border-radius: 16px;
  justify-content: flex-start;
  align-items: center;
  height: 20px;
  padding-left: 6px;
  padding-right: 6px;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  display: flex;
  position: absolute;
  inset: 10px 16px 0% auto;
}

.fill-button.light {
  background-color: #e5eeff;
}

.fill-button.alert {
  color: var(--white);
  background-color: #c53434;
}

.content-flex {
  flex: 1;
  justify-content: space-between;
  display: flex;
}

.content-flex.add-padding {
  padding-right: 16px;
}

.navigation-divider {
  background-color: #e9ecef;
  width: 100%;
  height: 1px;
  margin-top: 8px;
  margin-bottom: 8px;
}

.collapse-toggle {
  color: #4a545e;
  cursor: pointer;
  border-radius: 6px;
  align-items: center;
  min-height: 40px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.71429;
  transition: background-color .3s;
  display: flex;
  position: relative;
}

.collapse-toggle:hover {
  background-color: #f0f3f5;
}

.collapse-icon-block {
  padding-left: 16px;
  padding-right: 16px;
}

.collapse-body {
  flex-direction: column;
  padding-top: 8px;
  display: flex;
}

.collapse-link-wrap {
  color: #4a545e;
  border-radius: 6px;
  justify-content: flex-start;
  align-items: center;
  height: 32px;
  padding: 0;
  transition: background-color .3s;
  display: flex;
}

.collapse-link-wrap:hover {
  color: #3a424a;
  background-color: #022f520f;
}

.collapse-link-wrap:focus {
  background-color: var(--white);
  box-shadow: inset 0 0 0 2px #6792f4;
}

.collapse-link-wrap.w--current {
  color: var(--action--primary);
  background-color: #e5eeff;
}

.collapse-link-wrap.margin-top {
  background-color: var(--white);
  margin-top: 8px;
  padding-left: 68px;
}

.collapse-link-wrap.margin-top.w--current {
  color: var(--dashboard--primary);
  background-color: #10284817;
}

.collapse-link-wrap.brand-link {
  background-color: var(--white);
  padding-left: 68px;
}

.collapse-link-wrap.brand-link.w--current {
  color: var(--dashboard--primary);
  background-color: #10284817;
}

.collapse-indicator {
  position: absolute;
  bottom: 11px;
  left: 0;
}

.side-menu-heading {
  cursor: pointer;
  justify-content: space-between;
  align-items: center;
  min-height: 36px;
  padding-left: 16px;
  padding-right: 16px;
  display: flex;
}

.menu-heading-text {
  color: #7e8b99;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.66667;
}

.plans-nav {
  padding-top: 4px;
  padding-left: 25px;
  padding-right: 25px;
}

.plan-heading-wrap {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  display: flex;
}

.primary-text {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}

.primary-text.active {
  color: #3062d4;
}

.primary-text.label {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  margin-bottom: 8px;
}

.primary-text.text-light {
  color: #4a545e;
}

.primary-text.text-bold {
  color: var(--black);
  font-weight: 600;
}

.primary-text.date {
  color: var(--black);
}

.primary-text.add-margin {
  margin-bottom: 8px;
}

.primary-text.text-black {
  color: #000;
  line-height: 24px;
}

.primary-text.text-gray {
  color: #555f6d;
  margin-bottom: 0;
}

.primary-text.text-large {
  color: #1e183a;
  font-size: 16px;
  line-height: 28px;
  display: block;
}

.primary-text.price {
  text-align: right;
}

.primary-text.bold {
  color: var(--black);
  letter-spacing: .1px;
  margin-bottom: 14px;
  font-weight: 600;
}

.primary-text.bold.margin-none {
  margin-bottom: 0;
}

.primary-text.grow {
  flex: none;
  margin-bottom: 0;
}

.primary-text.light {
  color: #555f6d;
  font-size: 12px;
  line-height: 20px;
}

.primary-text.is-title {
  letter-spacing: .1px;
  font-weight: 600;
}

.primary-text.is-title.margin-none {
  margin-bottom: 0;
}

.plan-progress-block {
  grid-column-gap: 16px;
  justify-content: space-around;
  align-items: center;
  margin-bottom: 10px;
  display: flex;
}

.plan-number-text {
  color: #555f6d;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.71429;
}

.progress-line {
  background-color: #f0f3f5;
  border-radius: 2px;
  width: 100%;
  height: 4px;
}

.progress-active {
  background-color: #3062d4;
  border-radius: 2px;
  width: 50%;
  height: 4px;
}

.usage-text {
  color: #555f6d;
  letter-spacing: .2px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.66667;
}

.user-block {
  grid-column-gap: 12px;
  align-items: center;
  padding: 12px 16px 12px 20px;
  display: flex;
}

.user-image {
  border-radius: 50px;
}

.user-info {
  flex-direction: column;
  display: flex;
}

.mail-text {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.66667;
}

.doshboard-main.test {
  padding-left: 280px;
}

.doshboard-main.paading-bottom {
  padding-bottom: 2.5rem;
}

.dashboard-header {
  z-index: 999;
  border-bottom: 1px solid var(--border--default);
  background-color: var(--white);
  justify-content: flex-start;
  align-items: center;
  height: 70px;
  display: flex;
  position: sticky;
  top: 0;
}

.dashboard-header.brand {
  margin-bottom: 0;
}

.logo-text {
  color: #9747ff;
  letter-spacing: .1px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.5;
}

.logo-text.mobile-view {
  display: none;
}

.cancle-block {
  grid-column-gap: 8px;
  align-items: center;
  padding: 8px 16px 8px 12px;
  display: flex;
}

.navbar-flex {
  flex: 1;
  justify-content: space-between;
  align-items: center;
  max-width: 1151px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 45px;
  padding-right: 45px;
  display: flex;
}

.navbar-flex.payment-send {
  max-width: 1151px;
}

.dashboard-content {
  box-shadow: none;
  flex: 1;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.dashboard-content.branding {
  padding-top: 0;
  padding-bottom: 0;
}

.dashboard-content.add-padding {
  padding-bottom: 40px;
}

.dashboard-container {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 45px;
  padding-right: 45px;
}

.section-heading-wrap {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  display: flex;
}

.section-heading-wrap.less-margin {
  margin-bottom: 13px;
}

.section-heading-wrap.flex-value-change {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  margin-bottom: 14px;
}

.section-heading-wrap.view-payment {
  margin-bottom: 32px;
}

.section-heading-wrap.margin-medium {
  margin-bottom: 24px;
}

.section-heading {
  color: var(--black);
  letter-spacing: .1px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.77778;
}

.section-heading.add-margin {
  margin-bottom: 12px;
}

.customer-full-details {
  margin-bottom: 36px;
}

.customer-info {
  grid-column-gap: 24px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 620px;
  max-width: 620px;
  display: grid;
}

.customer-info.view-payment {
  width: 50%;
  max-width: none;
}

.customer-info.customer {
  max-width: 658px;
}

.customer-info.input-fields {
  width: 658px;
  max-width: 658px;
}

.details-block.margin-bottom {
  margin-bottom: 20px;
}

.input-field {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  width: 100%;
  max-width: 493px;
  min-height: 40px;
  margin-bottom: 0;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.input-field:hover {
  border-color: #6792f4;
}

.input-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.input-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.input-field.address {
  min-height: 127px;
}

.input-field.qty {
  min-width: 60px;
}

.input-field.description {
  min-width: 418px;
  padding-bottom: 9px;
}

.input-field.vat {
  max-width: 106px;
}

.input-field.payment {
  border-radius: 6px 0 0 6px;
  width: 440px;
}

.input-field.payment::placeholder {
  color: var(--dashboard--primary);
}

.input-field.price {
  background-image: url('../images/Euro.svg');
  background-position: 8px;
  background-repeat: no-repeat;
  background-size: auto;
  max-width: 106px;
  padding-left: 40px;
}

.input-field.price.full-width {
  max-width: none;
}

.input-field.rate {
  max-width: 205px;
  padding-bottom: 9px;
}

.input-field.parcent {
  background-image: url('../images/Parcent.svg');
  background-position: 85%;
  background-repeat: no-repeat;
  background-size: auto;
  max-width: 120px;
  padding-bottom: 9px;
}

.input-field.text-dark::placeholder {
  color: var(--dashboard--primary);
}

.input-field.edit {
  padding-bottom: 9px;
}

.input-field.page-text {
  max-width: none;
  min-height: 108px;
}

.input-field.grow {
  max-width: none;
}

.single-block {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  flex-direction: column;
  display: flex;
}

.single-block.view-payment {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
}

.optional {
  color: #7e8b99;
  margin-left: 4px;
}

.checkbox-field {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 0;
  padding-left: 14px;
  display: flex;
}

.checkbox-field.margin-bottom {
  margin-bottom: 24px;
}

.checkbox-label {
  margin-bottom: 0;
}

.checkbox {
  cursor: pointer;
  border-radius: 4px;
  flex: none;
  width: 16px;
  height: 16px;
  margin-top: 0;
}

.checkbox.w--redirected-checked {
  background-color: #1e50c0;
  background-size: 12px;
  border: 0 #fff;
  border-radius: 4px;
}

.checkbox.w--redirected-focus {
  box-shadow: none;
}

.customer-details-block {
  display: flex;
}

.customer-details-block.customer {
  grid-column-gap: 48px;
  grid-row-gap: 48px;
}

.grid-divider {
  background-color: #e9ecef;
  width: 1px;
  max-height: 250px;
  margin-left: 36px;
  margin-right: 36px;
}

.summary-block {
  grid-row-gap: 15px;
  flex-direction: column;
  flex: 1;
  min-width: 200px;
  display: flex;
}

.summary-block.customer {
  grid-row-gap: 0px;
}

.payment-form {
  background-color: var(--color);
  position: relative;
}

.checkbox-group {
  grid-column-gap: 24px;
  flex-flow: row;
  display: flex;
  position: relative;
}

.checkbox-group.right-align {
  justify-content: flex-end;
  align-items: center;
  margin-right: -10px;
}

.cart-block {
  grid-column-gap: 5px;
  align-items: flex-end;
  display: flex;
}

.more-vertical-icon {
  color: #7e8b99;
  cursor: pointer;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-self: center;
  margin-top: auto;
  margin-bottom: 12px;
  margin-right: 5px;
}

.single-cart.is-description {
  flex: 1;
  min-width: 160px;
  max-width: 408px;
}

.single-cart.qty {
  max-width: 64px;
}

.single-cart.unit-price {
  max-width: 124px;
}

.close-block {
  margin-bottom: 10px;
  margin-left: 7px;
}

.cart-summary-block {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.add-button-block {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.add-button {
  grid-column-gap: 12px;
  color: var(--white);
  letter-spacing: -.2px;
  background-color: #3062d4;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-width: 180px;
  min-height: 40px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: background-color .3s;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.add-button:hover {
  background-color: #1e50c0;
}

.summury-block {
  grid-column-gap: 30px;
  display: flex;
}

.payment-date-block {
  grid-column-gap: 11px;
  grid-row-gap: 11px;
  align-items: flex-start;
  display: flex;
}

.payment-date-block.card {
  flex-direction: row;
  margin-bottom: 14px;
}

.summary-tittle {
  color: var(--black);
  letter-spacing: .1px;
  font-size: 16px;
  font-weight: 600;
  line-height: 28px;
}

.payment-icon {
  margin-top: 4px;
  display: flex;
}

.payment-date {
  color: #4a545e;
  letter-spacing: -.2px;
  font-size: 14px;
  line-height: 24px;
}

.payment-amount {
  background-color: #f5f8ff;
  border: 1px solid #cdddff;
  border-radius: 6px;
  flex-flow: row;
  justify-content: flex-end;
  align-items: center;
  min-width: 207px;
  min-height: 140px;
  padding-right: 40px;
  display: flex;
}

.amout-content-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  display: flex;
}

.amout-content-block.card {
  flex-flow: row;
  justify-content: space-between;
}

.amount-single-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.summary-right {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  flex-direction: column;
  flex: none;
  align-items: flex-end;
  display: flex;
}

.payment-flex {
  flex-direction: column;
  align-items: flex-end;
  display: flex;
}

.payment-flex.card {
  flex-direction: row;
  flex: 1;
  justify-content: space-between;
}

.payment-link-wrap {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  flex-direction: column;
  display: flex;
}

.payment-link-text {
  color: #4a545e;
  letter-spacing: -.2px;
  font-size: 14px;
  line-height: 24px;
}

.payment-link-form {
  justify-content: flex-end;
  display: flex;
  position: relative;
}

.payment-link-form.right {
  justify-content: flex-start;
  max-width: 631px;
}

.copy-link {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  background-color: #fee6e6;
  border: 1px solid #cfd6dd;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  justify-content: center;
  align-items: center;
  min-width: 174px;
  display: flex;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.function-wrap {
  grid-column-gap: 12px;
  padding-top: 8px;
  display: flex;
}

.save-draft-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--body-text);
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  align-items: center;
  min-height: 48px;
  padding-left: 12px;
  padding-right: 16px;
  transition: border .3s;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.save-draft-button:hover {
  border-color: #9ea8b3;
}

.sahre-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  background-color: #3062d4;
  border-radius: 6px;
  align-items: center;
  min-height: 48px;
  padding-left: 12px;
  padding-right: 16px;
  transition: background-color .3s;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.sahre-button:hover {
  background-color: #1e50c0;
}

.email-payment-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  background-color: #1d7c4d;
  border-radius: 6px;
  align-items: center;
  min-height: 48px;
  padding-left: 12px;
  padding-right: 16px;
  transition: background-color .3s;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.email-payment-btn:hover {
  background-color: #196742;
}

.payment-process-block {
  padding-bottom: 20px;
}

.process-single-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 5px;
  display: flex;
}

.hero-from {
  max-width: 596px;
  position: relative;
}

.claim-link-button {
  background-color: var(--buttons--yellow);
  color: var(--font-colors--primary);
  border-radius: 4px;
  max-height: 43px;
  margin-top: 8px;
  margin-bottom: 8px;
  margin-right: 8px;
  padding: 0 35.5px;
  font-family: Ppagrandir, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 31px;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.hero-link-field {
  color: var(--font-colors--primary);
  border: 3px solid #000;
  border-radius: 6px;
  max-width: 596px;
  min-height: 60px;
  padding-top: 12px;
  padding-bottom: 16px;
  padding-left: 24px;
  font-size: 26px;
  font-weight: 600;
  line-height: 34;
}

.hero-link-field:focus {
  border-color: #000;
}

.hero-link-field::placeholder {
  color: #b9b9b9;
  font-size: 26px;
  font-weight: 600;
  line-height: 34px;
}

.hero-link-text {
  font-size: 13px;
  font-weight: 600;
  line-height: 2.38462;
}

.hero-from-block {
  margin-bottom: 10px;
}

.text-white {
  color: var(--white);
}

.content-tab-menu {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border-bottom: 1px solid #e9ecef;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  margin-bottom: 35px;
  display: grid;
}

.content-tab-menu.is-four-grid {
  grid-template-columns: 1fr 1fr 1fr 1fr;
  overflow: auto;
}

.content-tab-menu.is-five-grid {
  overflow: auto;
}

.content-tab-menu.is-three-grid {
  grid-template-columns: 1fr 1fr 1fr;
}

.content-tab-menu.is-two-grid {
  grid-template-columns: 1fr 1fr;
  margin-bottom: 0;
}

.content-tab-menu.is-six-grid {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  overflow: auto;
}

.content-tab-menu.is-six-grid.less-m-argin {
  margin-bottom: 16px;
}

.tab-menu-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: var(--color);
  color: #4a545e;
  letter-spacing: .2px;
  justify-content: center;
  align-items: center;
  padding: 12px 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.tab-menu-block.w--current {
  background-color: var(--color);
  color: #3062d4;
  letter-spacing: .1px;
  font-weight: 600;
}

.tab-content-block {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  display: flex;
}

.from-block {
  margin-bottom: 0;
}

.table-content {
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.table-content.is-title {
  letter-spacing: .1px;
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
}

.table-content.light {
  font-weight: 400;
}

.table-content.left-padding {
  padding-left: 8px;
}

.table-content.tittle {
  color: #7e8b99;
}

.table-content.tittle.margin-bottom {
  margin-bottom: 5px;
}

.view-button {
  letter-spacing: .2px;
  background-color: #3062d4;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  max-width: 58px;
  height: 32px;
  padding: 0 12px;
  font-size: 14px;
  line-height: 24px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.pagination-main {
  justify-content: space-between;
  align-items: center;
  min-width: 1024px;
  display: flex;
}

.pagination-main.width-auto, .pagination-main.desktop-auto {
  min-width: auto;
}

.result-view {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  color: #4a545e;
  align-items: center;
  min-width: 100px;
  font-size: 14px;
  line-height: 24px;
  display: flex;
}

.pagination-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr minmax(0, 13px) 1fr 1fr;
  grid-auto-columns: 1fr;
  max-width: 520px;
  display: grid;
}

.prev-link {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #4a545e;
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  align-items: center;
  padding: 6px 16px 6px 12px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
}

.next-link {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #4a545e;
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  align-items: center;
  padding: 6px 12px 6px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
}

.paginate-number-block {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  align-items: center;
  display: flex;
}

.paginate-number {
  color: #4a545e;
  letter-spacing: .2px;
  border-radius: 6px;
  padding: 6px 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: background-color .3s;
}

.paginate-number:hover, .paginate-number.w--current {
  background-color: #022f520f;
}

.dot-group {
  justify-content: center;
  align-items: center;
  display: flex;
}

.search-bar {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: minmax(120px, 277px) minmax(220px, 363px) minmax(80px, 117px) minmax(60px, 117px) minmax(100px, 142px);
  grid-auto-columns: 1fr;
  margin-bottom: 28px;
  display: grid;
}

.search-bar.pending-payments {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  grid-template-columns: 1.25fr 1.25fr 2fr .5fr;
  min-width: 1024px;
}

.search-bar.pending-payments.width-auto {
  min-width: auto;
}

.search-bar.customers {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  grid-template-columns: minmax(140px, 277px) minmax(180px, 253px) minmax(120px, 363px) minmax(132px, 142px);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.search-bar.transaction-history {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-columns: minmax(120px, 277px) minmax(220px, 363px) minmax(80px, 120px) minmax(60px, 120px) minmax(100px, 142px);
  min-width: 1024px;
}

.search-bar.paid-payments {
  grid-template-columns: minmax(120px, 270px) minmax(240px, 382px) minmax(80px, 117px) minmax(60px, 100px) minmax(100px, 142px);
  min-width: 1024px;
}

.global-container {
  max-width: 1151px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 45px;
  padding-right: 45px;
}

.customer-search-field {
  color: #272e35;
  letter-spacing: .2px;
  background-image: url('../images/Search-Glass.svg');
  background-position: 12px;
  background-repeat: no-repeat;
  background-size: 18px;
  border: 2px solid #6792f4;
  border-radius: 6px;
  min-width: 148px;
  height: 41px;
  margin-bottom: 0;
  padding-left: 40px;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.customer-search-field:hover {
  border-color: #6792f4;
}

.customer-search-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.customer-search-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.input-group {
  justify-content: space-between;
  display: flex;
  position: relative;
}

.time-select-field {
  background-color: var(--color);
  color: var(--dashboard--primary);
  border: 0 #000;
  min-width: 90px;
  max-width: 116px;
  margin-bottom: 0;
  padding-left: 10px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24;
}

.time-select-field.less-width {
  max-width: 110px;
}

.paid-time {
  color: var(--dashboard--primary);
  background-image: url('../images/Main-Icon.svg'), url('../images/20-calendar.svg');
  background-position: 99%, 12px;
  background-repeat: no-repeat, no-repeat;
  background-size: auto, auto;
  border: 0 solid #000;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  flex: 0 auto;
  padding-left: 42px;
  padding-right: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24;
}

.paid-time:focus {
  outline-offset: 0px;
  border-style: none;
  border-width: 0 0 0 2px;
  outline: 3px #1c1a1f;
}

.paid-time::placeholder {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.paid-time.reports {
  color: var(--dashboard--primary);
  min-width: 205px;
  height: 37px;
  padding-top: 10px;
}

.paid-time.reports::placeholder {
  color: #7e8b99;
}

.paid-time.date-range {
  min-width: 248px;
  height: 36px;
}

.date-time-field {
  border: 2px solid #6792f4;
  border-radius: 6px;
  height: 41px;
  display: flex;
}

.date-time-field.paid {
  max-width: 370px;
}

.date-time-field.report {
  max-width: 443px;
}

.multi-select-field {
  background-color: var(--color);
  color: #7e8b99;
  letter-spacing: .2px;
  border: 0 solid #000;
  max-width: 493px;
  margin-bottom: 0;
  padding-top: 10px;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.multi-select-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.multi-select-field.method {
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 10px;
}

.multi-select-field.method.hide {
  display: none;
}

.download-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  letter-spacing: .2px;
  background-color: #3062d480;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-width: 142px;
  height: 40px;
  padding-left: 12px;
  padding-right: 10px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: background-color .3s;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.download-button:hover {
  background-color: #3062d4cc;
}

.download-button.is-pdf {
  padding-left: 16px;
}

.select-wrap {
  border: 2px solid #6792f4;
  border-radius: 6px;
  justify-content: space-between;
  min-width: 112px;
  height: 40px;
  padding-right: 8px;
  display: flex;
}

.select-wrap:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.button-group {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  justify-content: flex-end;
  display: flex;
}

.button-group.refund {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  padding-top: 14px;
  padding-bottom: 14px;
}

.button-group.mobile-view {
  justify-content: space-between;
}

.resend-button {
  letter-spacing: .2px;
  background-color: #0a1219e0;
  border-radius: 6px;
  padding: 4px 12px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.edit-button {
  color: var(--body-text);
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  transition: border .3s;
  display: flex;
}

.edit-button:hover {
  border-color: #727577;
}

.delete-button {
  color: var(--white);
  background-color: #c53434;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  display: flex;
}

.delete-button.left-auto {
  margin-left: auto;
}

.popup-wrapper {
  z-index: 9999;
  justify-content: center;
  align-items: center;
  padding-top: 40px;
  padding-bottom: 40px;
  display: block;
}

.delete-popup-card {
  background-color: var(--white);
  border-radius: 6px;
  width: 100%;
  max-width: 480px;
  padding: 24px;
  box-shadow: 0 2px 2px -1px #1b242c0a, 0 16px 24px -6px #1b242c29;
}

.modal_top-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  margin-bottom: 24px;
}

.modal_top-block.margin-none {
  margin-bottom: 0;
}

.popup-text-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  display: flex;
}

.popup-text-block.top {
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 95%;
}

.modal_heading-text {
  letter-spacing: .1px;
  font-size: 18px;
  font-weight: 600;
  line-height: 32px;
}

.popup-button-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-end;
  display: flex;
}

.button {
  background-color: var(--color);
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  min-height: 40px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  box-shadow: 0 1px 2px #1b242c1f;
}

.button.outline {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  transition: border .3s;
}

.button.outline:hover {
  border-color: #a9afb4;
}

.button.primary {
  color: var(--white);
  background-color: #3062d4;
  border-radius: 6px;
  align-items: center;
  transition: background-color .3s;
  display: flex;
}

.button.primary:hover {
  background-color: #113997;
}

.button.primary.minimum-width {
  justify-content: center;
  align-items: center;
  min-width: 96px;
}

.button.back {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  background-color: #1d7c4d80;
  border-radius: 6px;
  justify-content: flex-start;
  align-items: center;
  min-width: 94px;
  transition: background-color .3s;
  display: flex;
}

.button.back:hover {
  background-color: #1d7c4dcc;
}

.button.refund {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #c53434;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  align-items: center;
  padding-right: 10px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.button.close {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  transition: border .3s;
  display: none;
}

.button.close:hover {
  border-color: #a9afb4;
}

.button.delete {
  color: var(--white);
  background-color: #c53434;
  border-radius: 6px;
  margin-left: auto;
}

.button.delete.left-align {
  margin-left: 0;
}

.nav-right-block {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  display: flex;
}

.summury-left {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.summury-left.edit-page {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
}

.payment-path {
  flex-direction: column;
  display: flex;
}

.payment-path-text {
  color: #000;
  letter-spacing: .2px;
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
}

.payment-amount-card {
  background-color: #f5f8ff;
  border: 1px solid #cdddff;
  border-radius: 6px;
  flex-direction: column-reverse;
  justify-content: center;
  min-width: 424px;
  height: 102px;
  padding-left: 20px;
  padding-right: 30px;
  display: flex;
}

.input-view-field {
  color: #272e35;
  letter-spacing: .2px;
  border: 0 #000;
  border-radius: 6px;
  height: 24px;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.input-view-field:hover {
  border-color: #6792f4;
}

.input-view-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.input-view-field::placeholder {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.input-view-field.is-flex {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  display: flex;
}

.input-tittle {
  color: #7e8b99;
  text-align: justify;
  text-transform: uppercase;
  margin-bottom: 0;
  font-size: 10px;
  font-weight: 600;
  line-height: 16px;
}

.input-tittle.view {
  margin-bottom: 8px;
}

.input-tittle.price {
  text-align: right;
}

.payment-data-heading {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  border-bottom: 3px solid #bbb;
  grid-template-rows: auto;
  grid-template-columns: 1fr 8fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  padding-top: 24px;
  padding-bottom: 24px;
  display: grid;
}

.payment-data-body {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  border-bottom: 1px solid #bbb;
  grid-template-rows: auto;
  grid-template-columns: 1fr 8fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  padding-top: 24px;
  padding-bottom: 24px;
  display: grid;
}

.payment-details-right {
  grid-column-gap: 13px;
  grid-row-gap: 13px;
  flex: none;
  grid-template-rows: auto auto auto auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  min-width: 260px;
  display: grid;
}

.payment-data-footer {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  border-bottom: 3px solid #bbb;
  grid-template-rows: auto;
  grid-template-columns: 1fr 8fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  padding-top: 24px;
  padding-bottom: 24px;
  display: grid;
}

.total-payemnt-block {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.single-divider {
  background-color: #bbb;
  width: 100%;
  height: 1px;
}

.refund-popup-card {
  background-color: var(--white);
  min-width: 0;
  padding: 24px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c29;
}

.popup-heading {
  letter-spacing: .1px;
  font-size: 18px;
  font-weight: 600;
  line-height: 32px;
}

.refund-form-block {
  margin-bottom: 24px;
}

.refund-description {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  min-height: 162px;
}

.refund-description::placeholder {
  color: #7e8b99;
  font-size: 14px;
  line-height: 24px;
}

.refund-button-group {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-direction: row;
  justify-content: flex-start;
  display: flex;
}

.hero-animate-block {
  z-index: 100;
  flex-direction: column;
  align-items: center;
  margin-top: -110px;
  display: flex;
  position: relative;
}

.received-card {
  min-width: 301px;
  position: absolute;
}

.received-card.second, .received-card.third, .received-card.fourth {
  display: none;
}

.success-message {
  background-color: var(--font-colors--secondary);
  color: var(--white);
  border-radius: 8px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 16px;
  font-weight: 500;
}

.error-message {
  color: var(--white);
  text-align: center;
  background-color: #ff6f6f;
  border-radius: 8px;
  font-weight: 500;
}

.customer-menu-link {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: var(--color);
  color: #4a545e;
  text-align: center;
  letter-spacing: .2px;
  white-space: nowrap;
  justify-content: center;
  align-items: center;
  padding: 12px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.customer-menu-link.w--current {
  background-color: var(--color);
  color: #3062d4;
  letter-spacing: .1px;
  border-bottom: 2px solid #3062d4;
  font-weight: 600;
}

.customer-menu-link.set-width.is-small {
  min-width: 100px;
}

.customer-menu-link.set-width.small-xs {
  min-width: 125px;
}

.menu-button-block {
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.add-menu-button {
  grid-column-gap: 8px;
  color: var(--white);
  letter-spacing: -.2px;
  background-color: #113997;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  min-height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: background-color .3s;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.add-menu-button:hover {
  background-color: #1e50c0;
}

.modal_summary-block {
  margin-bottom: 24px;
}

.modal_summary-block.less-margin {
  margin-bottom: 14px;
}

.modal_summary-text {
  color: #555f6d;
  letter-spacing: .2px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.trush-bin {
  color: var(--white);
  background-color: #c53434;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  display: flex;
}

.modal_main-block {
  z-index: 9999;
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  background-color: #00000036;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  padding-top: 60px;
  padding-bottom: 60px;
  display: none;
  position: fixed;
  inset: 0%;
  overflow: auto;
}

.archive-button {
  letter-spacing: .2px;
  background-color: #9ea8b3;
  border-radius: 6px;
  padding: 4px 12px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: background-color .3s;
}

.archive-button:hover {
  background-color: #3e90eb;
}

.archive-popup-card {
  background-color: var(--white);
  border-radius: 6px;
  width: 100%;
  max-width: 480px;
  padding: 24px;
  box-shadow: 0 2px 2px -1px #1b242c0a, 0 16px 24px -6px #1b242c29;
}

.archive-icon {
  margin-top: 8px;
}

.intarective-text {
  letter-spacing: .1px;
  font-size: 18px;
  font-weight: 600;
  line-height: 32px;
  display: none;
}

.date-block {
  position: relative;
}

.date-field {
  color: #272e35;
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  width: 100%;
  max-width: 493px;
  min-height: 40px;
  margin-bottom: 0;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.date-field:hover {
  border-color: #6792f4;
}

.date-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.date-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.calender-icon {
  display: flex;
  position: absolute;
  inset: auto 10px 10px auto;
}

.time-and-date-divider {
  background-color: #6792f4;
  width: 2px;
  height: 100%;
  margin-left: 10px;
}

.customer-modal {
  background-color: var(--white);
  width: 100%;
  max-width: 480px;
  padding: 24px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c1f;
}

.ignore-form-block {
  margin-bottom: 0;
}

.ignore-form-block.input {
  color: var(--dashboard--primary);
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  min-height: 40px;
  padding-left: 45px;
  box-shadow: 0 1px 2px #1b242c1f;
}

.modal-field-label {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.modal-input-field {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  height: 40px;
  margin-bottom: 0;
  padding-left: 16px;
  padding-right: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24;
}

.modal-input-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.input-single-block {
  margin-bottom: 24px;
}

.input-single-block.padding-none, .input-single-block.margin-none {
  margin-bottom: 0;
}

.input-note {
  color: #555f6d;
  letter-spacing: .2px;
  margin-top: 8px;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
}

.checkbox-modal-field {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  align-items: center;
  margin-bottom: 0;
  padding-left: 14px;
  display: flex;
}

.checkbox-modal-text {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.modal_button-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.modal_button-block.space-between {
  justify-content: space-between;
}

.modal-input-bottom {
  padding-bottom: 20px;
}

.modal-input-top {
  padding-bottom: 24px;
}

.modal-area-field {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  max-width: 389px;
  min-height: 103px;
  margin-bottom: 0;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.modal-area-field::placeholder {
  color: #7e8b99;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.sidebar-footer-block {
  background-color: #fbfcfd;
  margin-top: auto;
  padding-top: 16px;
  position: sticky;
  bottom: 0;
}

.description-field {
  color: #272e35;
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  min-height: 40px;
  margin-bottom: 0;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.description-field:hover {
  border-color: #6792f4;
}

.description-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.description-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.unit-price-field {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  background-image: url('../images/Euro.svg');
  background-position: 8px;
  background-repeat: no-repeat;
  background-size: auto;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  min-height: 40px;
  margin-bottom: 0;
  padding-bottom: 10px;
  padding-left: 40px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.unit-price-field:hover {
  border-color: #6792f4;
}

.unit-price-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.unit-price-field::placeholder {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.unit-price-field.disable {
  opacity: .5;
  pointer-events: none;
}

.vat-select-field {
  background-color: var(--white);
  color: var(--dashboard--primary);
  border: 0 #000;
  border-radius: 4px;
  height: 37px;
  margin-bottom: 0;
  margin-left: 1px;
  padding-top: 9px;
  padding-left: 16px;
  line-height: 24px;
}

.vat-select-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.vat-single-block {
  background-color: var(--white);
  color: #272e35;
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  width: 106px;
  height: 40px;
  margin-bottom: 0;
  padding-right: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.vat-single-block:hover {
  border-color: #6792f4;
}

.vat-single-block:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.vat-single-block::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.total-price-field {
  color: #272e35;
  letter-spacing: .2px;
  background-image: url('../images/Euro.svg');
  background-position: 8px;
  background-repeat: no-repeat;
  background-size: auto;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  min-height: 40px;
  margin-bottom: 0;
  padding-bottom: 10px;
  padding-left: 40px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.total-price-field:hover {
  border-color: #6792f4;
}

.total-price-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.total-price-field::placeholder {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.metrics-card {
  border: 1px solid #10284817;
  border-radius: 6px;
  padding: 24px 24px 13px;
  box-shadow: 0 2px 8px -1px #1b242c14;
}

.archive-file-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  letter-spacing: .2px;
  background-color: #9ea8b3;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.archive-flex-block {
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 36px;
  display: flex;
}

.wallet-circle {
  border: 1px solid #cfd6dd;
  border-radius: 100%;
  flex-flow: row;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  display: flex;
}

.metrics-card-text-block {
  padding-top: 24px;
  padding-bottom: 18px;
}

.metrics-sm-text {
  color: #555f6d;
  letter-spacing: .2px;
  margin-bottom: 4px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.metrics-card-amount {
  letter-spacing: .1px;
  font-size: 24px;
  font-weight: 600;
  line-height: 36px;
}

.metrics-card-amount.text-sm {
  font-size: 18px;
  line-height: 32px;
}

.metrics-card-amount.test-xsm {
  font-size: 16px;
  line-height: 32px;
}

.metrics-card-bottom {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.due-das {
  background-color: var(--dashboard--primary);
  width: 12px;
  height: 2px;
}

.due-amount {
  color: var(--dashboard--primary);
  letter-spacing: .1px;
  font-weight: 600;
}

.due-amount-text {
  color: #555f6d;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.button-block {
  display: flex;
}

.button-block.right {
  justify-content: flex-end;
  align-items: center;
  position: relative;
}

.button-block.right.margin-bottom {
  margin-bottom: 26px;
}

.button-block.space {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
}

.button-block.top-padding {
  padding-top: 30px;
}

.update-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  letter-spacing: .2px;
  background-color: #113997;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.tabel-buttom-group {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.pdf-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  background-color: #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-width: 76px;
  height: 32px;
  padding-left: 8px;
  padding-right: 12px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.delete-contact-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  letter-spacing: .2px;
  background-color: #c53434;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
  position: fixed;
  bottom: 50px;
  box-shadow: 0 1px 2px #1b242c1f;
}

.product-text-block {
  padding-top: 24px;
  padding-bottom: 40px;
}

.secondary-text {
  color: #4a545e;
  letter-spacing: .2px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.secondary-text.add-margin {
  margin-bottom: 14px;
}

.secondary-text.add-size {
  font-size: 16px;
  font-weight: 400;
  line-height: 28px;
}

.secondary-text.margin-bottom {
  margin-bottom: 16px;
}

.product-sub-menu {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 28px;
  display: flex;
}

.product-search-field {
  color: #272e35;
  letter-spacing: .2px;
  background-image: url('../images/Search-Glass.svg');
  background-position: 12px;
  background-repeat: no-repeat;
  background-size: 18px;
  border: 2px solid #6792f4;
  border-radius: 6px;
  min-width: 410px;
  height: 40px;
  margin-bottom: 0;
  padding-left: 40px;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.product-search-field:hover {
  border-color: #6792f4;
}

.product-search-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.product-search-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.product-btn-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.result-select-field {
  background-color: var(--color);
  color: #4a545e;
  border: 0 solid #000;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 4px;
  font-weight: 500;
}

.product-add-modal {
  background-color: var(--white);
  width: 437px;
  max-width: 437px;
  padding: 24px 24px 32px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c1f;
}

.product-modal-grid {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.modal-price-field {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  background-image: url('../images/Euro.svg');
  background-position: 8px;
  background-repeat: no-repeat;
  background-size: auto;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  min-height: 40px;
  margin-bottom: 0;
  padding-bottom: 10px;
  padding-left: 40px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.modal-price-field:hover {
  border-color: #6792f4;
}

.modal-price-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.modal-price-field::placeholder {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.modal-price-field.disable {
  opacity: .5;
  pointer-events: none;
}

.modal-vat-select-field {
  background-color: var(--white);
  color: #272e35;
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  height: 40px;
  margin-bottom: 0;
  padding-right: 10px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.modal-vat-select-field:hover {
  border-color: #6792f4;
}

.modal-vat-select-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.modal-vat-select-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.reports-menu {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: minmax(300px, 1fr) minmax(424px, 1fr) minmax(140px, 1fr) minmax(115px, 1fr);
  grid-auto-columns: 1fr;
  margin-bottom: 28px;
  display: grid;
}

.reports-main-block {
  grid-column-gap: 28px;
  grid-row-gap: 28px;
  margin-bottom: 32px;
  display: flex;
}

.report-card-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  flex: none;
  width: 236px;
  display: flex;
}

.report-diagram {
  object-fit: scale-down;
}

.report-metrics-card {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  border: 1px solid #10284817;
  border-radius: 6px;
  padding: 10px 24px;
  display: flex;
  box-shadow: 0 2px 2px -1px #1b242c0a, 0 2px 8px -1px #1b242c14;
}

.excel-file-block {
  justify-content: flex-end;
  align-items: center;
  margin-top: 40px;
  padding-right: 30px;
  display: flex;
}

.excel-popup-card {
  background-color: #1d7c4d;
  border-radius: 6px;
  justify-content: space-between;
  align-items: center;
  width: 347px;
  height: 48px;
  padding-left: 12px;
  padding-right: 14px;
  display: flex;
}

.excel-popup-text-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  letter-spacing: .2px;
  justify-content: flex-start;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.popup-close-block {
  color: var(--white);
  cursor: pointer;
}

.dropdown-toggle {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  min-width: 120px;
  height: 37px;
  padding: 1px 4px 0 12px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.dropdown-toggle.right-padding {
  padding-top: 1px;
  padding-right: 10px;
}

.dropdown-icon {
  margin-top: 0;
  margin-bottom: 0;
}

.dropdown-list {
  background-color: var(--white);
  border: 1px solid #10284817;
  border-radius: 6px;
  min-width: 180px;
  margin-top: 0;
  padding-top: 8px;
  padding-bottom: 8px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c1f;
}

.dropdown-list.w--open {
  margin-top: 4px;
}

.dropdown-list-item {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  justify-content: flex-start;
  align-items: center;
  height: 36px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.dropdown-wrap {
  border: 2px solid #6792f4;
  border-radius: 6px;
  justify-content: space-between;
  width: 100%;
  min-width: 120px;
  height: 41px;
  display: flex;
}

.dropdown-wrap:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.dropdown-short-list {
  background-color: var(--white);
  border: 1px solid #10284817;
  border-radius: 6px;
  padding-top: 8px;
  padding-bottom: 8px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c1f;
}

.note-heading {
  color: #4a545e;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.input-toggle {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 40px;
  padding: 0 10px 0 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.input-dropdwon {
  display: block;
}

.input-dropdown-list.w--open {
  background-color: var(--white);
  border-radius: 6px;
  padding-top: 12px;
  padding-bottom: 12px;
  box-shadow: 0 8px 16px -2px #1b242c1f;
}

.input-dropdown-link {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  justify-content: flex-start;
  align-items: center;
  height: 40px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.user-invite-menu {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  display: flex;
}

.invite-user-button {
  grid-column-gap: 12px;
  color: var(--white);
  letter-spacing: -.2px;
  background-color: #113997;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: background-color .3s;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.invite-user-button:hover {
  background-color: #1e50c0;
}

.resend-invite-button {
  background-color: var(--white);
  color: #4a545e;
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  max-width: 117px;
  height: 32px;
  padding: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.switcher-dot {
  background-color: var(--white);
  border: 1px solid #10284817;
  border-radius: 100%;
  width: 15px;
  height: 15px;
  box-shadow: 0 1px 2px #1b242c1f;
}

.active-switcer {
  cursor: pointer;
  background-color: #9ea8b3;
  border-radius: 100px;
  justify-content: flex-start;
  align-items: center;
  width: 36px;
  min-height: 21px;
  padding-left: 2px;
  display: flex;
}

.user-invite-modal {
  background-color: var(--white);
  border-radius: 6px;
  width: 100%;
  max-width: 480px;
  padding: 24px;
  box-shadow: 0 2px 2px -1px #1b242c0a, 0 16px 24px -6px #1b242c29;
}

.hero-text-block {
  max-width: 600px;
  padding-bottom: 32px;
}

.payment-gateway-wrap {
  padding-top: 20px;
  padding-bottom: 20px;
}

.gateway-grid {
  grid-column-gap: 34px;
  grid-row-gap: 34px;
  grid-template-rows: auto;
  grid-template-columns: minmax(200px, 470px) 1fr;
}

.gateway-grid.failed {
  grid-column-gap: 34px;
  grid-row-gap: 14px;
  grid-template-rows: auto auto;
}

.payment-getways-card {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: #f4fbf7;
  border-top: 1px solid #c2ebd5;
  border-left: 1px solid #c2ebd5;
  border-right: 1px solid #c2ebd5;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  padding: 20px;
  display: flex;
}

.payment-getways-card.failed {
  background-color: #fff5eb;
  border-top-color: #ffd4a8;
  border-left-color: #ffd4a8;
  border-right-color: #ffd4a8;
}

.card-right-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.card-top-block {
  justify-content: space-between;
  display: flex;
}

.card-top-block.center {
  justify-content: space-between;
  align-items: center;
}

.card-bottom-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.getways-button {
  background-color: var(--white);
  color: #4a545e;
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: flex-start;
  align-items: center;
  height: 32px;
  padding: 0 12px;
  font-size: 14px;
  line-height: 24px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.getways-button.border-none {
  box-shadow: none;
  border-style: none;
}

.payment-success-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #272e35;
  border: 1px solid #cfd6dd;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
  justify-content: flex-start;
  align-items: center;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 8px;
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.gateways-link-block {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  padding-bottom: 8px;
  display: flex;
}

.payment-gateways-link {
  color: var(--black);
  letter-spacing: .1px;
  font-size: 18px;
  font-weight: 600;
  line-height: 32px;
  display: block;
}

.gateway-link-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #4a545e;
  letter-spacing: .2px;
  justify-content: flex-start;
  align-items: center;
  height: 32px;
  padding-left: 12px;
  padding-right: 12px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.gateway-description-text {
  color: #555f6d;
  max-width: 379px;
  margin-bottom: 14px;
  font-size: 14px;
  line-height: 24px;
}

.gateway-form-field {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  max-width: 436px;
  display: flex;
}

.submit-mail-button {
  letter-spacing: .2px;
  background-color: #3062d4;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 40px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.empty-space {
  min-height: 112px;
}

.empty-space.medium {
  min-height: 64px;
}

.payment-note {
  color: #555f6d;
  letter-spacing: .2px;
  margin-bottom: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
}

.payment-note.padding-left {
  padding-left: 24px;
}

.getways-note-block {
  max-width: 895px;
}

.section-divider {
  background-color: #e9ecef;
  width: 100%;
  height: 1px;
  margin-top: 32px;
  margin-bottom: 18px;
}

.company-info {
  grid-column-gap: 24px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 620px;
  max-width: 620px;
  display: grid;
}

.company-info.company-details {
  grid-column-gap: 44px;
  width: 700px;
  max-width: 700px;
}

.input-fix-width {
  max-width: 320px;
  margin-bottom: 15px;
}

.input-fix-width.add-space {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 0;
  display: flex;
}

.tax-rate-block {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 8px;
  display: flex;
}

.tax-rate-block.last {
  margin-bottom: 0;
}

.tax-rate-block.less-gap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
}

.cross-wrap {
  color: var(--body-text);
  cursor: pointer;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: flex;
}

.section-block.margin-bottom {
  margin-bottom: 30px;
}

.date_formate-block {
  flex-flow: row;
  display: flex;
}

.date_formate-block.add-space {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  display: none;
}

.date_formate-block.add-gap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
}

.radio-date-formate {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  letter-spacing: .2px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 0;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 10px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
}

.radio-date-formate.less-space {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  padding-left: 16px;
}

.formate-radio-button {
  border-width: 2px;
  border-color: #cfd6dd;
  flex: none;
  width: 16px;
  min-width: 16px;
  height: 16px;
  min-height: 16px;
  margin-top: 0;
}

.formate-radio-button.w--redirected-checked {
  border-width: 5px;
  border-color: #3062d4;
}

.formate-radio-button.w--redirected-focus {
  box-shadow: none;
}

.account-icon-block {
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  display: flex;
  position: relative;
}

.horizontal-line {
  background-color: #4a545e;
  width: 12px;
  height: 2px;
}

.vertical-line {
  background-color: #4a545e;
  width: 2px;
  height: 12px;
  position: absolute;
}

.brand-main-block {
  padding-top: 20px;
}

.brand-export-block {
  grid-column-gap: 45px;
  grid-row-gap: 45px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.brand-left-block {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  display: flex;
}

.brand-icon-block {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.icon-export-block {
  border: 1px dashed #cfd6dd;
  border-radius: 100%;
  justify-content: center;
  align-items: center;
  width: 96px;
  height: 96px;
  display: flex;
}

.logo-export-block {
  border: 1px dashed #cfd6dd;
  border-radius: 5px;
  justify-content: center;
  align-items: center;
  min-width: 259px;
  height: 96px;
  display: flex;
}

.brand-color-block {
  grid-column-gap: 16px;
  grid-row-gap: 0px;
  flex-flow: column;
  align-items: stretch;
  display: flex;
}

.color-single-block.is-full {
  flex: 1;
}

.color-grid-block {
  grid-column-gap: 13px;
  grid-row-gap: 13px;
  grid-template-rows: auto;
  grid-template-columns: .55fr .6fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.color-grid-block.large {
  grid-template-columns: .3fr .7fr;
}

.color-name {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.color-input-block {
  position: relative;
}

.color-plate {
  background-color: #071836;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  width: 40px;
  height: 40px;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.color-plate.primary {
  background-color: #6792f4;
}

.color-plate.is-white {
  background-color: var(--white);
  border-right: 1px solid #1b242c1f;
  width: 38px;
  height: 40px;
  margin-left: 2px;
}

.color-name-label {
  color: var(--black);
  margin-bottom: 0;
  font-weight: 500;
}

.check-box-block {
  padding-top: 24px;
  padding-bottom: 26px;
}

.underline-link {
  color: #555f6d;
  text-decoration: underline;
}

.brand-side-panel {
  background-color: var(--white);
  border-bottom: 1px solid #10284817;
  border-left: 1px solid #10284817;
  border-right: 1px solid #10284817;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c1f;
}

.panel-header-wrap {
  justify-content: space-between;
  align-items: center;
  padding-bottom: 24px;
  display: flex;
}

.panel-header-wrap.add-padding {
  padding-bottom: 26px;
}

.tab-panel {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  background-color: #f5f7f9;
  flex-flow: row;
  justify-content: center;
  align-items: flex-end;
  min-height: 652px;
  display: flex;
  position: relative;
}

.tab-panel.vertical-align {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  min-height: 930px;
  padding-top: 24px;
  padding-left: 24px;
  padding-right: 18px;
}

.brand-panel-card {
  background-color: var(--white);
  text-align: center;
  background-image: url('../images/Right-bottom-shape.svg'), url('../images/Left-Top-shape.svg'), url('../images/Right--Shape.svg'), url('../images/Left--Shape.svg'), url('../images/Bg-Shape.svg'), url('../images/Rectangle-117.svg');
  background-position: 100% 10%, 0 0, 100% 0, 0 0, 0 68px, 50% -24%;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
  background-size: auto, auto, auto, auto, contain, auto;
  width: 100%;
  max-width: 600px;
  min-height: 575px;
  max-height: 575px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 54px;
  padding-left: 42px;
  padding-right: 42px;
}

.sticky-checkbox {
  position: absolute;
  inset: 16px auto auto 24px;
}

.responsive-switcher {
  background-color: var(--white);
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  height: 40px;
  display: flex;
}

.small-device {
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 100%;
  display: flex;
}

.switcher-divider {
  background-color: #cfd6dd;
  width: 1px;
  height: 100%;
}

.panel-card-top {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-bottom: 14px;
  display: flex;
}

.brand-logo {
  background-color: var(--white);
  border-radius: 5px;
  justify-content: center;
  align-items: center;
  width: 82px;
  height: 82px;
  display: flex;
  box-shadow: 0 4px 4px #0000000d;
}

.panel-card-price {
  color: #4a545e;
  font-size: 48px;
  font-weight: 400;
  line-height: 64px;
}

.panel-card-price.top-margin {
  margin-top: 14px;
}

.panel-mail-block {
  padding-top: 18px;
  padding-bottom: 32px;
}

.panel-footer-button {
  background-color: #3062d4;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 48px;
  padding-top: 0;
  padding-bottom: 0;
  font-size: 16px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.panel-footer-text {
  color: var(--black);
  text-align: left;
  justify-content: space-between;
  padding-top: 28px;
  padding-bottom: 24px;
  font-size: 16px;
  line-height: 28px;
  display: flex;
}

.brand-logo-name {
  color: var(--black);
  font-size: 24px;
  line-height: 36px;
}

.payment-complete-text {
  color: var(--black);
  margin-top: 28px;
  font-size: 32px;
  line-height: 44px;
}

.invoice-receipt-card {
  background-color: var(--white);
  text-align: center;
  width: 100%;
  max-width: 600px;
  min-height: 575px;
  max-height: 575px;
  margin-left: auto;
  margin-right: auto;
}

.panel-tab-menu {
  margin-bottom: 26px;
}

.browser-block {
  text-align: center;
  background-color: #fdc100;
  background-image: url('../images/Browser-top-shape.svg');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  min-height: 575px;
  max-height: 575px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 154px;
}

.collapse-flex-block {
  flex-flow: column;
  display: flex;
}

.tippy {
  padding-left: 16px;
  padding-right: 16px;
  display: none;
}

.brand-navbar {
  z-index: 999;
  background-color: var(--white);
  border-bottom: 1px solid #e9ecef;
  flex: 1;
  justify-content: space-between;
  align-items: center;
  min-height: 70px;
  padding-left: 25px;
  padding-right: 45px;
  display: flex;
  position: fixed;
  inset: 0% 0% auto;
}

.brand-content-block {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: row;
  padding: 24px;
  display: flex;
}

.drag-_drop-area {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  cursor: pointer;
  border: 1px dashed #cfd6dd;
  border-radius: 6px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  max-width: 600px;
  min-height: 136px;
  display: flex;
}

.uploader-content-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.choose-file {
  color: #3062d4;
}

.logo-uploaded-block {
  max-width: 600px;
}

.uploaded-area {
  background-image: url('../images/Uploaded-Bg.svg');
  background-position: 0 0;
  background-size: auto;
  justify-content: center;
  align-items: center;
  min-height: 200px;
  margin-bottom: 20px;
  display: flex;
}

.action-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.note-main-block {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  display: flex;
}

.note-main-block.less-space {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
}

.tip-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.menu-button-group {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.brand-top-contents.fix-width {
  max-width: 984px;
}

.brand-top-contents.is-flex {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  display: flex;
}

.brand-top-contents.margin-bottom {
  margin-bottom: 16px;
}

.logo-resize-block {
  grid-column-gap: 45px;
  grid-row-gap: 45px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.logo-resize-block.less-gap {
  grid-column-gap: 26px;
  grid-row-gap: 26px;
  flex-flow: wrap;
  justify-content: space-between;
}

.color-code-block {
  border: 0 #000;
  margin-bottom: 0;
}

.color-code-block.input {
  outline-offset: 0px;
  color: var(--dashboard--primary);
  border-radius: 6px;
  outline: 1px solid #cfd6dd;
  min-height: 40px;
  padding-left: 45px;
  box-shadow: 0 1px 2px #1b242c1f;
}

.color-code-block.input.width-auto {
  max-width: none;
}

.color-code-block.single-input {
  outline-offset: 0px;
  color: var(--dashboard--primary);
  border-radius: 6px;
  outline: 1px solid #cfd6dd;
  max-width: 120px;
  min-height: 40px;
  padding-left: 45px;
  box-shadow: 0 1px 2px #1b242c1f;
}

.panel-heading {
  color: var(--black);
  letter-spacing: .1px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.77778;
}

.logo-width-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.logo-width-wrap.less-space {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
}

.logo-progress-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex: 1;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.progress-gray-line {
  background-color: #f0f3f5;
  border-radius: 16px;
  flex: 1;
  min-width: 190px;
  height: 4px;
  position: relative;
}

.progress-gray-line.small {
  min-width: 120px;
}

.progress-gray-line.small.xs {
  min-width: 90px;
}

.active-progress-line {
  background-color: #3062d4;
  border-radius: 16px;
  width: 50%;
  height: 4px;
  position: absolute;
  inset: 0%;
}

.active-progress-line.small {
  width: 65px;
}

.active-progress-line.small.xs {
  width: 45px;
}

.active-circle {
  background-color: #3062d4;
  border-radius: 100%;
  width: 12px;
  height: 12px;
  position: absolute;
  inset: -4px 0% 0% auto;
}

.template-panel {
  background-color: #f5f7f9;
  border-radius: 10px;
  flex: 1;
  padding: 24px;
}

.save-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  pointer-events: none;
  color: var(--white);
  letter-spacing: .2px;
  background-color: #113997;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 80%;
  height: 40px;
  margin-top: auto;
  margin-left: auto;
  margin-right: auto;
  padding-left: 12px;
  padding-right: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
  position: sticky;
  bottom: 20px;
  box-shadow: 0 1px 2px #1b242c1f;
}

.panel-body {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  background-color: #f5f7f9;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  padding: 1.5rem;
  display: flex;
  position: relative;
}

.panel-body.add-padding {
  padding-top: 2rem;
}

.panel-body.qr-panel {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.brand-modal {
  z-index: 9999;
  background-color: var(--white);
  width: 100%;
  min-height: 1300px;
  display: none;
  position: absolute;
  inset: 0%;
}

.modal-brand-main {
  height: 100%;
}

.brand-modal-tabs {
  height: 100%;
  padding-top: 70px;
  padding-left: 8px;
  display: flex;
}

.brand-tab-menu {
  background-color: var(--white);
  border-bottom: 2px solid #eaedf0;
  flex-flow: row;
  justify-content: flex-start;
  align-items: stretch;
  margin-bottom: 2px;
  padding-left: 10px;
  display: flex;
}

.brand-tab-content {
  flex: 1;
}

.brand-section {
  background-color: var(--white);
}

.brand-logo-text {
  color: #9747ff;
  letter-spacing: .1px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.5;
}

.note-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.note-block.switch-note {
  display: none;
}

.screen-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #4a545e;
  cursor: pointer;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  display: flex;
}

.page-color-block {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  display: flex;
}

.switcher {
  background-color: var(--white);
  outline-offset: 0px;
  border-radius: 6px;
  outline: 1px solid #cfd6dd;
  min-width: 150px;
  height: 40px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.switcher-left {
  background-color: #cfd6dd;
  justify-content: center;
  align-items: center;
  width: 50%;
  height: 100%;
  display: flex;
}

.switcher-right {
  justify-content: center;
  align-items: center;
  width: 50%;
  height: 100%;
  display: flex;
}

.color-secetor-inline {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  display: flex;
}

.color-secetor-inline.vertical-aline {
  flex-flow: column;
}

.panel-header-right {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  display: flex;
}

.brand-button-grid {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: .8fr .8fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.page-input-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.page-input-block.margin-bottom {
  margin-bottom: 16px;
}

.input-items-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.input-single-grid {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  grid-template-rows: auto;
  grid-template-columns: minmax(40px, 100px) 1fr;
  grid-auto-columns: 1fr;
  place-items: center start;
}

.input-single-grid.font {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.button-with-icon {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #4a545e;
  cursor: pointer;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  display: flex;
}

.payment-qr-block {
  position: relative;
}

.syon-mobile-mockup {
  position: absolute;
  top: 16px;
  bottom: 0%;
  left: 18px;
}

.brand-modal-wrap {
  z-index: 9999;
  background-color: #e2e1e180;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.qr-modal {
  background-color: var(--white);
  border: 1px solid #10284817;
  border-radius: 15px;
  width: 100%;
  max-width: 379px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c1f;
}

.qr-modal-top {
  padding-top: 32px;
  padding-left: 24px;
  padding-right: 24px;
}

.modal-close-block {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  display: flex;
}

.qr-modal-body {
  justify-content: center;
  align-items: center;
  padding-top: 20px;
  padding-bottom: 20px;
  display: flex;
}

.qr-modal-text {
  letter-spacing: .1px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}

.page-switch-text {
  display: inline;
}

.switcher-image-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: none;
}

.image-buttons-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex: 1;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.choose-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  letter-spacing: .2px;
  background-color: #113997;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.image-button-group {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-end;
  display: flex;
}

.image-progress-block {
  flex: 1;
}

.image-color-plate {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.brand-delete-modal {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  margin-bottom: 24px;
  display: flex;
}

.delete-modal-wrap {
  z-index: 99999;
  background-color: #e2e1e180;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.delete-modal-close {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  display: flex;
}

.product-block {
  grid-column-gap: 26px;
  grid-row-gap: 26px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.product-block.less-padding {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex: 1;
}

.add-product-modal {
  background-color: var(--white);
  width: 862px;
  max-width: 862px;
  padding: 24px 24px 32px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c1f;
}

.product-input-block {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  padding-bottom: 24px;
  display: flex;
}

.product-input-grid {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex: 1;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.product-left-block {
  min-width: 440px;
}

.product-description {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  min-height: 190px;
  margin-bottom: 0;
}

.product-uploader-block {
  max-width: 620px;
}

.product-uploader {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  cursor: pointer;
  border: 1px dashed #cfd6dd;
  border-radius: 6px;
  flex-flow: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  max-width: 320px;
  min-height: 136px;
  display: flex;
}

.product-uploded-image {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.product-flex-block {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  margin-bottom: 24px;
  display: flex;
}

.edit-action-block {
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.edit-product-modal {
  background-color: var(--white);
  width: 862px;
  max-width: 862px;
  padding: 24px 24px 32px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c1f;
}

.link-text {
  text-decoration: underline;
}

.link-text.secondary-text {
  color: #555f6d;
}

.preview-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #4a545e;
  cursor: pointer;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  display: flex;
}

.section-link-block {
  padding-bottom: 26px;
}

.payment-link-main {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  margin-bottom: 30px;
  display: flex;
}

.payment-single-link {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.active-link-text {
  color: #9747ff;
  letter-spacing: .1px;
  font-size: 16px;
  font-weight: 600;
  line-height: 28px;
}

.payment-link-field {
  color: #272e35;
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  width: 120px;
  min-height: 40px;
  margin-bottom: 0;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.payment-link-field:hover {
  border-color: #6792f4;
}

.payment-link-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.payment-link-field::placeholder {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.open-link-button, .copy-link-button {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #4a545e;
  cursor: pointer;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  display: flex;
}

.payment-description-block {
  padding-top: 14px;
}

.section_heading-block {
  margin-bottom: 12px;
}

.payment-connect-main {
  background-color: #f5f7f9;
  border-radius: 5px;
  max-width: 848px;
  padding: 32px 36px 42px;
}

.payment-connect-lists {
  padding-top: 24px;
  padding-bottom: 20px;
}

.steps-tittle {
  color: #4a545e;
  letter-spacing: .2px;
  margin-bottom: 20px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.payment-input-block {
  background-color: #e4e4e4;
  border-radius: 5px;
  max-width: 567px;
  margin-bottom: 30px;
  padding: 16px 20px;
}

.payment-field-block {
  grid-column-gap: 45px;
  grid-row-gap: 8px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1.25fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.input-field-single {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.input-field-single.more-gap {
  grid-column-gap: 38px;
  grid-row-gap: 38px;
  justify-content: flex-end;
  align-items: center;
}

.input-llt-field {
  background-color: var(--white);
  color: var(--dashboard--primary);
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  flex: 1;
  justify-content: flex-start;
  align-items: center;
  min-width: 137px;
  min-height: 40px;
  margin-bottom: 0;
  padding-left: 12px;
  padding-right: 12px;
  display: flex;
}

.input-llt-field::placeholder {
  color: var(--dashboard--primary);
}

.input-llt-field.less-width {
  min-width: 40px;
  max-width: 72px;
}

.input-llt-field.width-xl {
  min-width: 110px;
  max-width: 130px;
}

.branded-input-block {
  max-width: 565px;
}

.branded-flex {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.payment-cta-block {
  background-color: #c2ebd5;
  border-radius: 5px;
  max-width: 848px;
  margin-bottom: 20px;
  padding: 24px 38px;
}

.message-success-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.message-success-block.margin-top {
  margin-top: 24px;
}

.currency-heading-block {
  margin-bottom: 30px;
}

.add-url-block {
  max-width: 565px;
  padding-top: 20px;
}

.add-url-block.is-wider {
  max-width: 600px;
}

.company-terms-modal {
  background-color: var(--white);
  width: 700px;
  max-width: 700px;
  padding: 24px;
  box-shadow: 0 2px 2px -1px #1b232c0a, 0 8px 16px -2px #1b242c1f;
}

.company-terms-filed {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  min-height: 370px;
}

.terms-input-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.workspace-toggle {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  padding: 12px 12px 12px 20px;
  transition: background-color .3s;
  display: flex;
}

.workspace-toggle:hover {
  background-color: #f0f3f5;
}

.workspace-dropdown {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.workspace-content-block {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.workspace-list.w--open {
  z-index: 9999;
  background-color: var(--color);
  position: fixed;
}

.workspace-item-block {
  background-color: var(--white);
  border-radius: 16px;
  width: 236px;
  margin-left: 20px;
  padding: 10px;
  box-shadow: 0 2px 5px #0003;
}

.single-color-plate {
  display: flex;
}

.bg-content-top {
  grid-column-gap: 28px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: flex-start;
}

.support-form-block {
  max-width: 600px;
}

.support-field {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  min-height: 40px;
  margin-bottom: 0;
  padding-left: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.support-field:hover {
  border-color: #6792f4;
}

.support-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.support-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.support-single-input {
  margin-bottom: 20px;
}

.support-single-input.margin-none {
  margin-bottom: 0;
}

.support-message-field {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  max-width: 1060px;
  min-height: 218px;
}

.brand-single-plate {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  align-items: center;
  display: grid;
}

.font-select-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  grid-template-rows: auto;
  grid-template-columns: 376px;
  grid-auto-columns: 1fr;
  display: flex;
}

.font-dropdown {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  width: 100%;
  display: block;
}

.font-select-toggle {
  color: #7e8b99;
  justify-content: space-between;
  align-items: center;
  height: 40px;
  padding: 0 12px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.select-block {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.font-select-list.w--open {
  background-color: var(--white);
  border-radius: 6px;
  box-shadow: 0 2px 5px #0003;
}

.product-main-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.menu-btn-block.mobile-view {
  display: none;
}

.service-item {
  display: flex;
}

.mobile-footer {
  background-color: var(--white);
  display: none;
}

.footer-item-grid {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.calender-dropdown {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  width: 100%;
  display: none;
}

.days-select-toggle {
  color: #7e8b99;
  justify-content: space-between;
  align-items: center;
  height: 40px;
  padding: 0 12px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.toggle-heading {
  cursor: pointer;
  justify-content: space-between;
  margin-bottom: 15px;
  display: flex;
}

.toggles-block {
  display: none;
}

.toggle-heading-text {
  color: var(--black);
  letter-spacing: .1px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.77778;
}

.toggle-heading-text.light {
  color: #555f6d;
  font-size: 16px;
  line-height: 28px;
}

.customer-optional-toggle {
  padding-top: 20px;
}

.cart-items-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.cart-button-block {
  justify-content: flex-start;
  align-items: center;
  padding-top: 10px;
  display: flex;
}

.payment-items-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.payment-items-toggle {
  display: none;
}

.toggle-divider {
  background-color: #e9ecef;
  width: 100%;
  height: 1px;
  margin-top: 10px;
  margin-bottom: 10px;
  display: none;
}

.empty-block {
  width: 0;
}

.table-block {
  overflow: auto;
}

.table-block.mobile-view {
  display: none;
  overflow: visible;
}

.table_cell {
  color: var(--dashboard--primary);
  padding-top: 16px;
  padding-bottom: 16px;
  padding-right: 8px;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.table_cell.left-padding {
  padding-left: 8px;
}

.table_cell.left-padding.small-cell {
  min-width: 60px;
}

.table_cell.left-padding.padding-none {
  padding-top: 0;
  padding-bottom: 0;
}

.table_cell.left-padding.fix-width {
  width: 270px;
  min-width: 270px;
  max-width: 270px;
}

.table_cell.left-padding.id-block {
  width: 60px;
  min-width: 60px;
  max-width: 60px;
}

.table_cell.price {
  text-align: right;
  padding-right: 20px;
}

.table_cell.center {
  padding-left: 40px;
}

.table_cell.center.small-cell {
  min-width: 40px;
  max-width: 80px;
}

.table_cell.xl-cell {
  min-width: 300px;
  padding-left: 8px;
}

.table_cell.xl-cell.padding-none {
  min-width: 390px;
  padding-top: 0;
  padding-bottom: 0;
}

.table_cell.xl-cell.my-shop {
  min-width: 360px;
  padding-top: 0;
  padding-bottom: 0;
}

.table_cell.is-button {
  padding-left: 8px;
}

.table_cell.is-small {
  min-width: 110px;
}

.table_cell.date-cell {
  min-width: 120px;
  padding-left: 8px;
}

.table_cell.date-cell.is-wider {
  min-width: 140px;
}

.table_cell.is-medium {
  min-width: 148px;
  padding-left: 8px;
}

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

.table_row {
  border-bottom: 1px solid #e9ecef;
}

.table_row.border-none {
  border-bottom-style: none;
}

.table_header {
  color: var(--dashboard--primary);
  text-align: left;
  letter-spacing: .1px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
}

.table_header.left-padding {
  padding-left: 8px;
}

.table_header.left-padding.small {
  width: 60px;
  min-width: 60px;
  max-width: 60px;
}

.table_header.left-padding.name-large {
  width: 260px;
  min-width: 260px;
  max-width: 260px;
}

.table_header.left-padding.xs {
  min-width: 80px;
}

.table_header.price {
  text-align: right;
  padding-right: 20px;
}

.table_header.price.cell-width {
  width: 120px;
  min-width: 120px;
  max-width: 120px;
}

.table_header.center {
  padding-left: 40px;
}

.table_header.is-medium {
  padding-left: 8px;
}

.table_head {
  background-color: #f5f7f9;
  border-bottom: 1px solid #e9ecef;
}

.table_head.border-none {
  border-bottom-style: none;
}

.table_component {
  width: 100%;
}

.table_component.set-width {
  min-width: 1024px;
}

.table-content-wrap {
  letter-spacing: .2px;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
}

.table-content-wrap.fix-width, .table-content-wrap.big {
  min-width: 200px;
}

.table-wrap {
  margin-bottom: 20px;
}

.table-wrap.hide-on-mobile.add-width, .table-wrap.set-width {
  min-width: 1024px;
}

.table-wrap.margin-none {
  margin-bottom: 0;
}

.inner-search-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.left-align {
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.notify-pill {
  color: var(--dashboard--primary);
  background-color: #ffe8d1;
  border-radius: 16px;
  justify-content: flex-start;
  align-items: center;
  height: 20px;
  padding-left: 6px;
  padding-right: 6px;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  display: flex;
}

.notify-pill.light {
  background-color: #e5eeff;
}

.notify-pill.gray {
  background-color: #e9ecef;
}

.notify-pill.transparent {
  background-color: var(--color);
  outline-offset: 0px;
  outline: 1px solid #cfd6dd;
}

.notify-pill.light-alert {
  background-color: #fee6e6;
}

.search-filter-block {
  border-bottom: 1px solid #eaedf0;
  padding-bottom: 16px;
  display: none;
}

.filter-toggle {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.filter-icon-block {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  cursor: pointer;
  padding-left: 10px;
  font-size: 16px;
  line-height: 28px;
  display: flex;
}

.search-field {
  color: #272e35;
  letter-spacing: .2px;
  background-image: url('../images/Search-Glass.svg');
  background-position: 12px;
  background-repeat: no-repeat;
  background-size: 18px;
  border: 2px solid #6792f4;
  border-radius: 6px;
  flex: 1;
  min-width: 148px;
  height: 40px;
  margin-bottom: 0;
  padding-bottom: 9px;
  padding-left: 40px;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.search-field:hover {
  border-color: #6792f4;
}

.search-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.search-field::placeholder {
  color: #7e8b99;
  letter-spacing: .2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.filter-body {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  flex-flow: column;
  padding-top: 14px;
  display: flex;
}

.single-table-block {
  border-bottom: 1px solid #eaedf0;
  padding-top: 20px;
  padding-bottom: 20px;
}

.table-left {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.collapse-circle {
  cursor: pointer;
  background-color: #fee6e6;
  border-radius: 100%;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  display: flex;
}

.table-single-item.flex {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.table-single-item.flex.grow {
  flex: 1;
  justify-content: space-between;
}

.table-collapse-items {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.table-top-block {
  justify-content: space-between;
  padding-bottom: 20px;
  display: flex;
}

.button-flex-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  display: flex;
}

.qr-code-popup {
  z-index: 999999;
  background-color: #0000001a;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.close-qr-block {
  background-color: var(--white);
  cursor: pointer;
  border-radius: 100%;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  display: flex;
  position: absolute;
  inset: 32px 32px auto auto;
}

.table-collapse-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.table-title-block {
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  display: flex;
}

.shop-table-content {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.shop-table-block {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  justify-content: space-between;
  padding-bottom: 20px;
  display: flex;
}

.shop-item.mobile {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.product-accordion-block {
  padding-top: 24px;
  padding-bottom: 40px;
  display: none;
}

.product-text-toggle {
  justify-content: space-between;
  display: flex;
}

.brand-tabs {
  flex-flow: column;
  height: 100%;
  display: flex;
}

.header-full {
  flex: 1;
  justify-content: space-between;
  align-items: center;
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 25px;
  padding-right: 45px;
  display: flex;
}

.sub-menu-text {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}

.back-button-block {
  justify-content: space-between;
  align-items: center;
  display: none;
}

.edit-logo-text {
  color: #9747ff;
  letter-spacing: .1px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.5;
}

.archive-button-block {
  justify-content: space-between;
  align-items: center;
  display: none;
}

.top-horizontal-line {
  z-index: 9991;
  background-color: #e9ecef;
  width: 100%;
  height: 1px;
  position: absolute;
  top: 70px;
}

.small-logo.mobile-view {
  display: none;
}

.collapse-icon {
  display: flex;
}

.container-large {
  flex: 1;
  justify-content: space-between;
  align-items: center;
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 45px;
  padding-right: 45px;
}

.container-large.payment-send {
  max-width: 1151px;
}

.header-content-block {
  flex: 1;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.primary-icon, .nav-icon {
  display: flex;
}

.tooltip {
  z-index: 999999;
  color: #fff;
  background-color: #27272a;
  border-radius: .25rem;
  padding: 5px;
  font-size: .75rem;
  display: none;
  position: fixed;
}

.menu-icon {
  display: flex;
}

.collapse-and-logo {
  display: none;
}

.cancel-icon, .menu-btn-icon {
  display: flex;
}

.llt-input-group {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex: 1;
  display: flex;
}

.close-icon {
  display: flex;
}

.text-inline-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.tip-left {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.note-left {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.width-progress-block {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  display: flex;
}

.bg-color-block {
  grid-column-gap: 16px;
  grid-row-gap: 0px;
  flex-flow: column;
  align-items: stretch;
  display: flex;
}

.bg-single-plate {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: row;
  flex: none;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  place-items: center stretch;
  display: grid;
}

.bg-single-plate.is-text {
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
}

.bg-color-inline {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.bg-color-inline.vertical-aline {
  flex-flow: column;
}

.bg-header-block {
  grid-column-gap: 16px;
  grid-row-gap: 0px;
  flex-flow: column;
  align-items: stretch;
  display: flex;
}

.switcher-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  place-items: center stretch;
  margin-bottom: 10px;
  display: grid;
}

.brand-menu-link {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: var(--white);
  color: var(--body-text);
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  padding: .625rem 1rem;
  line-height: 20px;
  transition: color .3s, background-color .3s;
  display: flex;
  position: relative;
}

.brand-menu-link.w--current {
  background-color: var(--white);
  color: var(--action--primary);
}

.brand-menu-link.disable {
  pointer-events: none;
}

.brand-menu-link.disable.brand-link, .brand-menu-link.brand-link {
  background-color: var(--white);
}

.brand-menu-link.brand-link.w--current {
  color: var(--dashboard--primary);
  background-color: #10284817;
}

.brand-menu-link.active {
  background-color: var(--active--background-color);
  color: var(--action--primary);
}

.brand_sub-menu-link {
  background-color: var(--white);
  padding: .625rem 1rem;
}

.brand_sub-menu-link.w--current {
  background-color: var(--white);
  color: var(--action--primary);
}

.active-item-line {
  border-bottom: 2px solid #1e50c0;
  border-radius: 4px;
  position: absolute;
  inset: auto 0% -2px;
}

.input-label {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}

.input-label.active {
  color: #3062d4;
}

.input-label.label {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  margin-bottom: 8px;
}

.input-label.text-light {
  color: #4a545e;
}

.input-label.text-bold {
  color: var(--black);
  font-weight: 600;
}

.input-label.date {
  color: var(--black);
}

.input-label.add-margin {
  margin-bottom: 8px;
}

.input-label.text-black {
  color: #000;
  line-height: 24px;
}

.input-label.text-gray {
  color: #555f6d;
  margin-bottom: 0;
}

.input-label.text-large {
  color: #1e183a;
  font-size: 16px;
  line-height: 28px;
  display: block;
}

.input-label.price {
  text-align: right;
}

.input-label.bold {
  color: var(--black);
  letter-spacing: .1px;
  margin-bottom: 14px;
  font-weight: 600;
}

.input-label.bold.margin-none {
  margin-bottom: 0;
}

.input-label.grow {
  flex: none;
  margin-bottom: 0;
}

.input-label.light {
  color: #555f6d;
  font-size: 12px;
  line-height: 20px;
}

.logo-content-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  max-width: 380px;
  display: flex;
}

.title-text {
  color: var(--black);
  letter-spacing: .1px;
  font-weight: 600;
  line-height: 20px;
}

.title-text.active {
  color: #3062d4;
}

.title-text.label {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  margin-bottom: 8px;
}

.title-text.text-light {
  color: #4a545e;
}

.title-text.text-bold {
  color: var(--black);
  font-weight: 600;
}

.title-text.date {
  color: var(--black);
}

.title-text.add-margin {
  margin-bottom: 8px;
}

.title-text.text-black {
  color: #000;
  line-height: 24px;
}

.title-text.text-gray {
  color: #555f6d;
  margin-bottom: 0;
}

.title-text.text-large {
  color: #1e183a;
  font-size: 16px;
  line-height: 28px;
  display: block;
}

.title-text.price {
  text-align: right;
}

.title-text.bold {
  color: var(--black);
  letter-spacing: .1px;
  margin-bottom: 14px;
  font-weight: 600;
}

.title-text.bold.margin-none {
  margin-bottom: 0;
}

.title-text.grow {
  flex: none;
  margin-bottom: 0;
}

.title-text.light {
  color: #555f6d;
  font-size: 12px;
  line-height: 20px;
}

.title-text.margin-regular {
  margin-bottom: 10px;
}

.title-text.margin-medium {
  margin-bottom: 1.25rem;
}

.title-text.is-primary {
  color: #272e35;
  font-size: 16px;
  line-height: 1.75;
}

.title-text.is-primary.margin-xstiny {
  margin-bottom: 4px;
}

.brand_left-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  width: 380px;
  max-width: 380px;
  display: flex;
}

.brand_sub-tab-menu {
  border-bottom: 2px solid #eaedf0;
  margin-bottom: 2px;
  padding-left: 10px;
}

.content-divider {
  background-color: #eaedf0;
  width: 100%;
  height: 1px;
}

.content-divider.margin-small {
  margin-bottom: 14px;
}

.bg-colors-wrap {
  grid-column-gap: 28px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: flex-start;
}

.switcher-color-block {
  grid-column-gap: 16px;
  grid-row-gap: 0px;
  flex-flow: column;
  align-items: stretch;
  display: flex;
}

.choose-image-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  letter-spacing: .2px;
  background-color: #113997;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 40px;
  padding-left: 12px;
  padding-right: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.uploaded-img-block {
  background-image: url('../images/checker-bg.png');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 4px;
  min-height: 200px;
}

.bg-image-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.uploader-modal {
  background-color: var(--white);
  border-radius: 15px;
  flex-flow: column;
  width: 100%;
  max-width: 860px;
  padding: 2rem;
  display: flex;
  box-shadow: 0 16px 24px -6px #1b242c29, 0 2px 4px -1px #1b242c0a;
}

.modal-heading-block.margin-regular {
  margin-bottom: 10px;
}

.modal-heading {
  color: #333;
  letter-spacing: .1px;
  margin-top: 0;
  font-size: 24px;
  font-weight: 600;
}

.modal-heading-text {
  color: #333;
  font-size: 12px;
  line-height: 20px;
}

.modal-tab-menu {
  border-bottom: 2px solid #eaedf0;
  margin-bottom: 10px;
}

.modal-tabs {
  flex: 1;
}

.uploader-content-wrapper {
  background-color: #f3f3f3;
  border-radius: 8px;
  padding: 10px 20px 20px;
}

.text-tiny {
  color: var(--dashboard--primary);
  font-size: 12px;
  line-height: 20px;
}

.text-tiny.is-uploader {
  color: #5b5b7b;
  font-weight: 600;
}

.margin-regular {
  margin-bottom: 10px;
}

.uploader-wrap {
  background-color: #fafbfd;
  border-radius: 8px;
  padding: 1rem;
}

.image-uploader {
  cursor: pointer;
  background-color: #fff;
  border: 2px dashed #c2cdda;
  border-radius: 14px;
  justify-content: center;
  align-items: center;
  min-height: 45vh;
  display: flex;
}

.uploader-inner-contents {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  text-align: center;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.uploader-option-text {
  color: #90a0bc;
  line-height: 1;
}

.uploader-btn {
  color: var(--white);
  background-color: #113997;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-width: 115px;
  min-height: 40px;
  padding: .5rem 1rem;
  display: flex;
}

.small-view, .large-view {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 100%;
  display: flex;
}

.preview-frame {
  flex-flow: row;
  justify-content: center;
  align-items: stretch;
  width: 100%;
  max-width: 584px;
  max-height: 560px;
  display: flex;
  overflow: hidden;
}

.main-container {
  transform-origin: 50% 0;
  flex: none;
  width: 1060px;
  transition: max-width .3s;
  transform: scale(.55);
}

.browser-top-bar {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-color: #e3e3e3;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  justify-content: space-between;
  align-items: center;
  height: 40px;
  padding: 8px 1rem;
  display: flex;
}

.browser-action-btns {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  display: flex;
}

.browser-action-btn {
  border-radius: 100%;
  width: 10px;
  height: 10px;
}

.browser-action-btn.is-red {
  background-color: #ed6a5e;
}

.browser-action-btn.is-yellow {
  background-color: #f4bf4f;
}

.browser-action-btn.is-green {
  background-color: #61c554;
}

.three-dots-block {
  color: #7e8b99;
  cursor: pointer;
}

.mobile-icon, .desktop-icon {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 100%;
  display: flex;
}

.browser-url-field {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  background-color: var(--white);
  color: #373737;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 22px;
  font-size: 10px;
  font-weight: 400;
  line-height: 1;
  display: flex;
}

.email-template {
  justify-content: center;
  align-items: center;
  display: flex;
}

.screen-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #4a545e;
  cursor: pointer;
  border-right: 1px solid #cfd6dd;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 100%;
  display: none;
}

.page-wrapper.add-backgorund {
  background-color: #fefaf5;
}

.user-header {
  z-index: 100;
  background-color: var(--white);
  border-bottom: 1px solid #eaedf0;
  justify-content: center;
  align-items: center;
  height: 64px;
  display: flex;
  position: fixed;
  inset: 0% 0% auto;
}

.user-empty-header {
  height: 64px;
}

.user-main {
  justify-content: flex-start;
  align-items: center;
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
  display: flex;
}

.user-main.top-align {
  justify-content: flex-start;
  align-items: flex-start;
}

.user-container {
  width: 100%;
  max-width: 1040px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.user-content-grid {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  place-items: center stretch;
  display: grid;
}

.form_ignore-block {
  margin-bottom: 0;
}

.user-secondary-text {
  color: #4e5055;
  font-size: 1rem;
  line-height: 1.75;
}

.user-secondary-text.is-medium {
  letter-spacing: -.2px;
}

.user-secondary-text.is-tiny {
  font-size: 12px;
  line-height: 1.66667;
}

.login-google-btn {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  color: #111827;
  letter-spacing: -.2px;
  background-color: #fff;
  border: 0 solid #0000;
  border-radius: .5rem;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  margin-bottom: 0;
  padding: .625rem .875rem;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.25;
  display: flex;
  box-shadow: 0 2px 5px #3b3c4014, 0 0 0 1px #3b3c4029, 0 1px 1px #0000001f;
}

.login-google-btn:focus-visible, .login-google-btn[data-wf-focus-visible] {
  background-color: #f4f5f5;
}

.login-google-btn::placeholder {
  color: #bdbec2;
  font-size: 1rem;
  line-height: 1.25;
}

.reset-pass-link {
  color: #1e50c0;
  letter-spacing: .1px;
  font-weight: 600;
}

.login-separator-block {
  grid-column-gap: 1.25rem;
  grid-row-gap: 1.25rem;
  color: #76787f;
  justify-content: space-between;
  align-items: center;
  min-height: 20px;
  display: flex;
}

.user_input-field {
  color: var(--dashboard--primary);
  background-color: #fff;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  height: 40px;
  margin-bottom: 0;
  padding: .5rem 1rem;
  font-weight: 500;
}

.user_input-field:focus {
  border-color: #cfd6dd;
}

.user_input-field::placeholder {
  color: #7e8b99;
}

.login-btn-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.user-switcher {
  background-color: #fff;
  border: 1px solid #cfd6dd;
  border-radius: .625rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  max-width: 228px;
  margin-bottom: 1.5rem;
  display: grid;
  box-shadow: 0 1px 2px #1b242c1f;
}

.switcher-btn {
  color: #4a545e;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  display: flex;
}

.switcher-btn.is-login {
  color: #3a424a;
  background-color: #022f520f;
  border-right: 1px solid #cfd6dd;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

.switcher-btn.sign-up {
  color: #3a424a;
  background-color: #022f520f;
  border-left: 1px solid #cfd6dd;
  border-radius: 0 6px 6px 0;
}

.divider-vertical-line {
  background-color: #d7d8da;
  flex: 1;
  height: 1px;
}

.form-input-message {
  justify-content: flex-start;
  align-items: center;
  min-height: 20px;
  margin-top: 8px;
  font-size: 12px;
  display: flex;
}

.form-input-message.success {
  color: var(--text-success);
}

.form-input-message.error {
  color: var(--text-error);
}

.user-primary-btn {
  color: #fff;
  background-color: #113997;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-height: 2.5rem;
  padding: .5rem 1rem;
  font-weight: 500;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.user-primary-btn.is-disable {
  opacity: .5;
  pointer-events: none;
}

.project-logo-wrap {
  margin-bottom: 4rem;
}

.requird-icon {
  color: #eb4932;
  margin-left: 4px;
}

.fim-icon {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  display: flex;
}

.margin-large {
  margin-bottom: 1.5rem;
}

.user_field-label {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  margin-bottom: .5rem;
  font-weight: 500;
}

.user_field-label.margin-none {
  margin-bottom: 0;
}

.input-itmes-wrap {
  grid-column-gap: 1.25rem;
  grid-row-gap: 1.25rem;
  flex-flow: column;
  display: flex;
}

.input-itmes-wrap.gap-small {
  grid-column-gap: .875rem;
  grid-row-gap: .875rem;
}

.margin-tiny {
  margin-bottom: .375rem;
}

.fim-text {
  line-height: 19px;
}

.resset-pass-block {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  color: var(--user-primary);
  justify-content: center;
  align-items: center;
  min-height: 2.5rem;
  display: flex;
}

.user-content-wrapper {
  width: 100%;
  max-width: 440px;
}

.user-heading {
  color: var(--user-primary);
  letter-spacing: .1px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-weight: 600;
}

.margin-medium {
  margin-bottom: 1.25rem;
}

.password_icon {
  position: absolute;
  inset: 10px 12px auto auto;
}

.password_field-wrap {
  position: relative;
}

.user-thumbnail-wrap {
  justify-content: center;
  align-items: center;
  height: 100%;
  display: flex;
}

.user-secondary-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: var(--white);
  color: var(--body-text);
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-height: 2.5rem;
  padding: .5rem 1rem;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.user-secondary-btn.is-disable {
  opacity: .5;
  pointer-events: none;
}

.google-icon {
  display: flex;
}

.terms-and-policy-wrap {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  color: var(--user-primary);
  text-align: center;
  justify-content: center;
  align-items: center;
  min-height: 2.5rem;
  margin-top: 10px;
  display: flex;
}

.user-link-text {
  color: #1e50c0;
  font-weight: 600;
}

.user-privvacy-text {
  max-width: 40ch;
  margin-left: auto;
  margin-right: auto;
}

.pageload-content-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.pageload-icon {
  display: flex;
}

.form-input-grid {
  grid-column-gap: 6px;
  grid-row-gap: 0px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.form-input-grid.is-5 {
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.input-field-2 {
  color: #111827;
  letter-spacing: -.2px;
  background-color: #fff;
  border: 0 solid #0000;
  border-radius: .5rem;
  min-height: 40px;
  margin-bottom: 0;
  padding: .625rem .875rem;
  font-size: 1rem;
  line-height: 1.25;
  box-shadow: 0 2px 5px #3b3c4014, 0 0 0 1px #3b3c4029, 0 1px 1px #0000001f;
}

.input-field-2:focus-visible, .input-field-2[data-wf-focus-visible] {
  background-color: #f4f5f5;
}

.input-field-2::placeholder {
  color: #bdbec2;
  font-size: 1rem;
  line-height: 1.25;
}

.input-field-2.margin-top {
  margin-top: .875rem;
}

.form-input-message-2 {
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 8px;
  font-size: 12px;
  display: flex;
}

.arrow-selecte-icon {
  color: #111827;
  display: flex;
  position: absolute;
  top: 12px;
  left: auto;
  right: 12px;
}

.field-label {
  color: var(--dashboard--primary);
}

.user-select-wrap {
  flex: 1;
  margin-bottom: 10px;
  position: relative;
}

.user-select-wrap.margin-none {
  margin-bottom: 0;
}

.short-tips {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: row;
  display: flex;
}

.body-text {
  color: var(--body-text);
}

.body-text.is-link {
  text-decoration: underline;
}

.dashboard_link-block {
  margin-bottom: 8px;
  padding-left: 8px;
  padding-right: 8px;
}

.dashboard_main {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 25px;
  padding-right: 45px;
}

.dashboard_heading {
  color: var(--dashboard--primary);
  letter-spacing: .1px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.5;
}

.dashboard_heading.margin-tiny {
  margin-bottom: 4px;
}

.dashboard_heading-text {
  color: #555f6d;
  font-size: 16px;
  line-height: 1.75;
}

.dashboard_metrics-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.dashboard_metrics-wrap.margin-medium.is-hide {
  display: none;
}

.dashboard_metrics-card {
  color: var(--dashboard--primary);
  border: 1px solid #eaedf0;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
  display: flex;
}

.metrics-title {
  letter-spacing: .1px;
  margin-bottom: 4px;
  font-weight: 600;
}

.metrics-value {
  letter-spacing: .1px;
  font-size: 24px;
  font-weight: 600;
  line-height: 36px;
}

.metrics-small-text {
  color: #555f6d;
  font-size: 12px;
  line-height: 20px;
}

.metrics-badge {
  color: var(--white);
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  display: flex;
}

.metrics-badge.pending {
  background-color: #1e50c0;
  flex: none;
}

.metrics-badge.paid {
  background-color: #55a555;
}

.metrics-badge.customer {
  background-color: #917ef1;
}

.metrics-badge.draft {
  background-color: #7e8b99;
}

.dashboard_content-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.quick_action-block {
  border: 1px solid #eaedf0;
  border-radius: 10px;
  padding: 12px 16px;
}

.quick_action-block.margin-medium.show-smaller-view {
  display: none;
}

.block_inner-heading {
  color: var(--dashboard--primary);
  letter-spacing: .1px;
  margin-top: 0;
  margin-bottom: 16px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.77778;
}

.block_inner-heading.add-margin {
  margin-bottom: 12px;
}

.quick_action-btns {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.action-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #0a1219e0;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 40px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.action-btn.payment-link {
  background-color: #e5eeff;
}

.action-btn.add-customers {
  background-color: #d8f8e7;
}

.action-btn.shop-items {
  background-color: #eeebff;
}

.action-btn.qr-code {
  background-color: #ebebeb;
}

.payment-stauts-block {
  border: 1px solid #eaedf0;
  border-radius: 10px;
  padding: 12px 16px;
  display: block;
}

.recent_payment-block {
  border: 1px solid #eaedf0;
  border-radius: 10px;
  padding: 12px 16px;
}

.recent_payment-items {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto auto auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.recent_payment-item {
  background-color: #fbfcfd;
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  display: flex;
}

.cart-wrapper {
  background-color: #f4fbf7;
  border-radius: 6px;
  margin-bottom: 10px;
  padding: 22px 16px;
  box-shadow: 0 0 0 1px #c2ebd5;
}

.form-input-group {
  grid-column-gap: 10px;
  grid-row-gap: 0px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: flex;
}

.form-input-group.is-5 {
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.cart-subtittle-wrap {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.payment-item_left {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.payment-item_right {
  text-align: right;
}

.payment_user-badge {
  color: var(--white);
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  font-size: 12px;
  line-height: 20px;
  display: flex;
}

.payment_user-badge.is-grey {
  background-color: #555f6d;
}

.payment_user-badge.is-pink {
  background-color: #c466db;
}

.payment_user-badge.is-greenish {
  background-color: #3da497;
}

.payment_user-badge.is-teal {
  background-color: #4f9eba;
}

.payment_user-badge.is-cyan {
  background-color: #5699dc;
}

.payment_user-badge.is-violet {
  background-color: #917ef1;
}

.payment_user-name {
  color: var(--dashboard--primary);
  letter-spacing: .1px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.75;
}

.payment_user-mail {
  color: #555f6d;
  font-size: 12px;
  line-height: 20px;
}

.payment_value {
  color: var(--dashboard--primary);
  letter-spacing: .1px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.75;
}

.payment_pill {
  border-radius: 6px;
  padding-left: 8px;
  padding-right: 8px;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  display: inline-block;
}

.payment_pill.paid {
  color: #062d1b;
  background-color: #c6f1da;
}

.payment_pill.pending {
  color: #482909;
  background-color: #fcdec0;
}

.payment_pill.draft {
  background-color: #e9ecef;
}

.payment_time {
  color: #555f6d;
  font-size: 12px;
  line-height: 20px;
}

.payment_details-wrap {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.payment_view-btn {
  color: #1e50c0;
  background-color: #edf2ff;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 40px;
  display: flex;
}

.charts-container {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.chart-card {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.chart-canvas {
  width: 150px;
  height: 150px;
}

.chart-title {
  color: var(--dashboard--primary);
  font-weight: 600;
}

.refund_content-main {
  justify-content: center;
  align-items: center;
  min-height: 55vh;
  display: flex;
}

.content-center {
  text-align: center;
}

.content-block.medium-width {
  max-width: 480px;
}

.content-block.regular-width {
  width: 100%;
  max-width: 400px;
}

.margin_xstiny {
  margin-bottom: .25rem;
}

.billing_content-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  display: flex;
}

.flex-block {
  display: flex;
}

.flex-block.gap-tiny {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  justify-content: flex-start;
  align-items: center;
}

.invoice_pagination {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.invoice_pagination.width-auto, .invoice_pagination.desktop-auto {
  min-width: auto;
}

.billing-table {
  width: 100%;
}

.billing-table.set-width, .billing_table-wrap.hide-on-mobile.add-width, .billing_table-wrap.set-width {
  min-width: 1024px;
}

.billing_table-wrap.margin-none {
  margin-bottom: 0;
}

.input-grid {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.input-grid.gap-regular {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
}

.billing_list-title {
  color: #555f6d;
  margin-bottom: 8px;
}

.pricing_block.space-between {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.pricing-card {
  flex-flow: column;
  display: flex;
}

.pricing_plan-block.flex-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
}

.pricing_plan-title {
  color: var(--user-primary);
  letter-spacing: .1px;
  font-size: 18px;
  font-weight: 600;
  line-height: 32px;
}

.pricing_plan-tag {
  color: #1b242c;
  background-color: #ffe8d1;
  border-radius: 6px;
  padding: 2px 10px;
}

.pricing_amount-monthly {
  color: #1e2706;
  font-size: 32px;
  line-height: 1.375;
}

.pricing_amount-tag {
  font-size: 16px;
  line-height: 1.75;
}

.pricing_list-items {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  display: flex;
}

.pricing_list-item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--dashboard--primary);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.pricing_content-wrap {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  display: flex;
}

.pricing_switcher-wrapper {
  display: flex;
}

.pricing_card-wrapper {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.pricing_btn-block {
  margin-top: auto;
}

.pricing-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: var(--color);
  color: var(--body-text);
  letter-spacing: .2px;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.pricing-btn.outline {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  transition: border .3s;
}

.pricing-btn.outline:hover {
  border-color: #a9afb4;
}

.pricing-btn.outline.is-disable {
  opacity: .5;
  pointer-events: none;
}

.pricing-btn.primary {
  color: var(--white);
  background-color: #3062d4;
  border-radius: 6px;
  align-items: center;
  transition: background-color .3s;
  display: flex;
}

.pricing-btn.primary:hover {
  background-color: #113997;
}

.pricing-btn.primary.minimum-width {
  justify-content: center;
  align-items: center;
  min-width: 96px;
}

.pricing-btn.back {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  background-color: #1d7c4d80;
  border-radius: 6px;
  justify-content: flex-start;
  align-items: center;
  min-width: 94px;
  transition: background-color .3s;
  display: flex;
}

.pricing-btn.back:hover {
  background-color: #1d7c4dcc;
}

.pricing-btn.refund {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #c53434;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  align-items: center;
  padding-right: 10px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.pricing-btn.close {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  transition: border .3s;
  display: none;
}

.pricing-btn.close:hover {
  border-color: #a9afb4;
}

.pricing-btn.delete {
  color: var(--white);
  background-color: #c53434;
  border-radius: 6px;
  margin-left: auto;
}

.pricing-btn.delete.left-align {
  margin-left: 0;
}

.current-amount {
  color: #1e2706;
  font-size: 32px;
  line-height: 1.375;
}

.pricing_amount-yearly {
  color: #1e2706;
  font-size: 32px;
  line-height: 1.375;
  display: none;
}

.pricing_switcher-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.pricing_switcher-text {
  color: var(--user-primary);
  letter-spacing: .1px;
  font-size: 18px;
  font-weight: 600;
  line-height: 32px;
}

.pricing_switcher {
  cursor: pointer;
  background-color: #9ea8b3;
  border-radius: 100px;
  justify-content: flex-start;
  align-items: center;
  width: 36px;
  min-height: 20px;
  padding: 2px;
  display: flex;
}

.pricing_switcher-dot {
  background-color: var(--white);
  border: 1px solid #10284817;
  border-radius: 100%;
  width: 16px;
  height: 16px;
  transition: transform .3s;
  box-shadow: 0 1px 2px #1b242c1f;
}

.invoice_pagination-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr minmax(0, 13px) 1fr 1fr;
  grid-auto-columns: 1fr;
  max-width: 520px;
  display: grid;
}

.excel-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  letter-spacing: .2px;
  background-color: #3062d480;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  min-width: 142px;
  height: 40px;
  padding-left: 12px;
  padding-right: 10px;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  transition: background-color .3s;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.excel-btn:hover {
  background-color: #3062d4cc;
}

.excel-btn.is-pdf {
  padding-left: 16px;
}

.onboarding-main {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  padding-bottom: 2.5rem;
  display: flex;
}

.onboarding-main.top-align {
  justify-content: flex-start;
  align-items: flex-start;
}

.dot-nav-wrap {
  flex-flow: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 44px;
  margin-bottom: 40px;
  display: flex;
}

.dot-nav-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.dot-nav {
  background-color: #10284817;
  border-radius: 10px;
  width: 100%;
  height: 4px;
  display: block;
}

.dot-nav.active {
  background-color: #1e50c0;
}

.onboarding_content-block {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  place-items: center stretch;
}

.label-block {
  margin-bottom: .5rem;
}

.label_sub-text {
  color: var(--dashboard--primary);
  letter-spacing: .2px;
  margin-bottom: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
}

.label_sub-text.margin-none {
  margin-bottom: 0;
}

.address_fields {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.account_setup-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.account_setup-banner {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border-radius: 12px;
  padding: 24px 20px;
  display: flex;
}

.account_setup-banner.is-stripe {
  background-color: #e5eeff;
}

.account_setup-banner.is-localistion {
  background-color: #f2e5ff;
}

.account_setup-banner.is-customisation {
  background-color: #ffe8d1;
}

.account_setup-banner.is-complete {
  background-color: #e6f9ef;
}

.account_setup-number {
  background-color: var(--white);
  color: var(--dashboard--primary);
  letter-spacing: .1px;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  font-size: 16px;
  font-weight: 600;
  display: flex;
}

.account_setup-number.is-complete {
  background-color: var(--text-success);
  color: var(--white);
}

.banner_contents-wrap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex: 1;
  display: flex;
}

.banner_content-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.account_setup-btn {
  color: var(--white);
  background-color: #3062d4;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 120px;
  height: 32px;
  padding: 4px 12px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.account_setup-btn.is-complete {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: var(--white);
  color: var(--text-success);
  flex: none;
  box-shadow: inset 0 0 0 1px #cfd6dd, 0 1px 2px #1b242c1f;
}

.banner_description {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #555f6d;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  line-height: 20px;
  display: flex;
}

.account_secondary-btn {
  color: var(--body-text);
  background-color: #fff;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 120px;
  height: 32px;
  padding: 4px 6px;
  font-size: 14px;
  line-height: 24px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.account_secondary-btn.is-hide, .chart-block.is-hide {
  display: none;
}

.payment_status-empty {
  text-align: center;
  justify-content: center;
  align-items: center;
  padding-top: 3.75rem;
  padding-bottom: 3.75rem;
  display: flex;
}

.payment_status-empty.is-hide {
  display: none;
}

.status_content-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  max-width: 340px;
  display: flex;
}

.status_icon-block {
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: flex;
}

.text-secondary {
  color: #555f6d;
}

.text-secondary.is-tiny {
  font-size: 12px;
  line-height: 20px;
}

.payment_status-btn {
  background-color: var(--white);
  color: var(--body-text);
  letter-spacing: .2px;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 32px;
  padding: 4px 12px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.payment_status-btn.outline {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  transition: border .3s;
}

.payment_status-btn.outline:hover {
  border-color: #a9afb4;
}

.payment_status-btn.primary {
  color: var(--white);
  background-color: #3062d4;
  border-radius: 6px;
  align-items: center;
  transition: background-color .3s;
  display: flex;
}

.payment_status-btn.primary:hover {
  background-color: #113997;
}

.payment_status-btn.primary.minimum-width {
  justify-content: center;
  align-items: center;
  min-width: 96px;
}

.payment_status-btn.back {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--white);
  background-color: #1d7c4d80;
  border-radius: 6px;
  justify-content: flex-start;
  align-items: center;
  min-width: 94px;
  transition: background-color .3s;
  display: flex;
}

.payment_status-btn.back:hover {
  background-color: #1d7c4dcc;
}

.payment_status-btn.refund {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #c53434;
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  align-items: center;
  padding-right: 10px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.payment_status-btn.close {
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  transition: border .3s;
  display: none;
}

.payment_status-btn.close:hover {
  border-color: #a9afb4;
}

.payment_status-btn.delete {
  color: var(--white);
  background-color: #c53434;
  border-radius: 6px;
  margin-left: auto;
}

.payment_status-btn.delete.left-align {
  margin-left: 0;
}

.localisation-modal {
  background-color: var(--white);
  color: var(--dashboard--primary);
  border-radius: 6px;
  width: 100%;
  max-width: 800px;
  box-shadow: 0 2px 2px -1px #1b242c0a, 0 16px 24px -6px #1b242c29;
}

.localization_modal-body {
  padding: 24px;
}

.localisation_content-wrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  display: flex;
}

.localisation_single-item {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1.25fr;
  grid-auto-columns: 1fr;
  place-items: stretch stretch;
  display: grid;
}

.field_label-block {
  padding-top: 8px;
  padding-bottom: 8px;
}

.field_label-block.padding-none {
  padding-top: 0;
  padding-bottom: 0;
}

.new-rate_block {
  justify-content: flex-end;
  padding-right: 48px;
  display: flex;
}

.new-rate-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #3062d4;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.localisation_tax-rate {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1.25fr;
  grid-auto-columns: 1fr;
  place-items: stretch stretch;
  display: grid;
}

.medium-text {
  font-weight: 600;
}

.medium-text.margin-xstiny {
  margin-bottom: 4px;
}

.banner_btn-group {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.user_back-btn {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--body-text);
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: absolute;
  left: 0%;
  right: auto;
}

.user_content-center {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.localisation_modal-footer {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: var(--white);
  padding-bottom: 24px;
  padding-left: 24px;
  padding-right: 24px;
}

.localisation_modal-footer.space-between {
  justify-content: space-between;
}

.localisation_modal-header {
  background-color: var(--white);
  padding-top: 24px;
  padding-left: 24px;
  padding-right: 24px;
}

.modal_foot-note {
  background-color: var(--white);
  color: var(--dashboard--primary);
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  max-width: 412px;
  min-height: 120px;
  margin-bottom: 0;
}

.invoice-template {
  color: var(--body-text);
  letter-spacing: 0;
  background-color: #f7f7f8;
}

.invoice_main {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.invoice_container {
  max-width: 1340px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
}

.invoice_component {
  justify-content: space-between;
  display: flex;
}

.invoice_left {
  background-color: #fff;
  border-radius: 20px;
  width: 100%;
  max-width: 600px;
  padding: 60px 30px;
  box-shadow: 0 1px 2px #0000000d;
}

.invoice_right {
  width: 100%;
  max-width: 622px;
}

.invoice_left-top {
  text-align: center;
}

.invoice_order-info {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-top: 36px;
  padding-bottom: 20px;
  display: flex;
}

.invoice_order-number {
  color: var(--body-text);
  letter-spacing: -.4px;
  font-size: 23px;
  font-weight: 400;
  line-height: 32px;
}

.invoice_product-price {
  color: var(--body-text);
  font-size: 48px;
  font-weight: 400;
  line-height: 58px;
}

.invoice_gretings {
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
}

.invoice_content-divider {
  background-color: #ddd;
  width: 100%;
  height: 1px;
  margin-top: 15px;
  margin-bottom: 15px;
}

.invoice_single-item {
  justify-content: space-between;
  align-items: flex-start;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
}

.invoice_product-block {
  width: 100%;
  max-width: 365px;
}

.invoice-text {
  font-weight: 400;
}

.invoice-text.is-product {
  color: var(--black);
  max-width: 38ch;
}

.invoice-text.is-product.is-bold {
  font-weight: 600;
}

.invoice-text.is-price {
  color: var(--black);
  text-align: right;
  font-weight: 500;
}

.invoice-text.is-price.is-bold {
  font-weight: 600;
}

.invoice_price-block {
  text-align: right;
}

.invoice_items {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  display: flex;
}

.invoice_form-title {
  color: var(--black);
  letter-spacing: .1px;
  margin-bottom: 28px;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
}

.invoice_input-items {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  flex-flow: column;
  display: flex;
}

.invoice_input-field {
  background-color: var(--white);
  color: var(--dashboard--primary);
  border: 1px solid #cfd6dd;
  border-radius: 6px;
  height: 40px;
  margin-bottom: 0;
  padding: 8px 12px 8px 16px;
  font-size: 14px;
  line-height: 24px;
  transition: box-shadow .3s, border .3s;
}

.invoice_input-field:hover {
  border-color: #6792f4;
}

.invoice_input-field:focus {
  box-shadow: inset 0 0 0 2px #6792f4;
}

.invoice_input-field.is-textarea {
  height: auto;
  min-height: 120px;
  padding-top: 14px;
  padding-bottom: 14px;
}

.invoice_btn-block {
  margin-top: 40px;
}

.invoice_generate-btn {
  color: var(--white);
  letter-spacing: .2px;
  background-color: #3062d4;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  height: 48px;
  padding: 10px 16px;
  font-size: 16px;
  font-weight: 500;
  line-height: 28px;
  display: flex;
  box-shadow: 0 1px 2px #1b242c1f;
}

.custom-checkbox-field {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  align-items: center;
  margin-bottom: 0;
  padding-left: 14px;
  display: flex;
}

@media screen and (min-width: 1920px) {
  .qr-code-popup {
    display: none;
  }
}

@media screen and (max-width: 991px) {
  li {
    margin-bottom: 8px;
  }

  .header {
    padding-top: 24px;
    padding-bottom: 24px;
  }

  .nav-link {
    text-align: center;
    margin-bottom: 20px;
  }

  .nav-button-group {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    justify-content: center;
    margin-top: 40px;
  }

  .nav-menu {
    background-color: var(--white);
    flex-direction: row;
    justify-content: center;
    padding: 140px 28px;
  }

  .brand-logo-wrap.mobile-view {
    display: block;
  }

  .hero-main-wrap {
    background-position: 100% 100%;
    border-radius: 24px;
    min-height: 600px;
    padding-left: 32px;
    display: flex;
  }

  .hero-grid {
    grid-template-columns: 3fr 3fr;
  }

  .hero-left-block {
    padding-top: 40px;
  }

  .hero-sub-tittle {
    margin-bottom: 24px;
    font-size: 14px;
    line-height: 1.6;
  }

  .hero-heading {
    font-size: 40px;
  }

  .hero-text {
    line-height: 1.6;
  }

  .arrow-icon {
    display: none;
  }

  .section-tittle {
    margin-bottom: 16px;
    font-size: 30px;
  }

  .section-sub-text {
    font-size: 16px;
  }

  .large-space {
    min-height: 72px;
  }

  .large-space.multi-form {
    min-height: 48px;
  }

  .process-grid {
    grid-template-columns: 1fr 1fr;
  }

  .payment-method-text {
    max-width: 60%;
    font-size: 28px;
  }

  .features-block {
    padding-left: 24px;
  }

  .features-left-text {
    font-size: 20px;
  }

  .active-text {
    font-size: 28px;
  }

  .features-text {
    font-size: 17px;
  }

  .payment-form-block {
    margin-top: -170px;
  }

  .card-tittle {
    font-size: 24px;
  }

  .card-list {
    margin-bottom: 36px;
    font-size: 16px;
  }

  .invoice-button-wrap {
    margin-bottom: 54px;
  }

  .invoice-wrap {
    min-height: 600px;
  }

  .invoice-sub-tittle {
    margin-bottom: 32px;
    font-size: 18px;
  }

  .payment-process-text {
    margin-bottom: 28px;
    font-size: 15px;
  }

  .business-section-tittle {
    max-width: 75%;
    min-height: 140px;
    margin-bottom: 20px;
  }

  .business-grid {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-columns: 1fr 1fr 1fr;
  }

  .business-tittle {
    font-size: 15px;
  }

  .business-type-text {
    margin-bottom: 0;
    font-size: 21px;
  }

  .cta-heading {
    font-size: 26px;
  }

  .cta-content-wrap {
    padding-left: 10px;
    padding-right: 10px;
  }

  .brand-logos-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .footer-grid {
    grid-column-gap: 66px;
    grid-row-gap: 66px;
  }

  .footer-text {
    max-width: 88%;
    margin-bottom: 60px;
  }

  .copyright-text-wrap {
    margin-top: 20px;
  }

  .menu-button, .menu-button.w--open {
    background-color: var(--color);
  }

  .icon {
    color: var(--font-colors--primary);
    font-size: 32px;
  }

  .planet-circle-wrap {
    padding-left: 16px;
    padding-right: 16px;
  }

  .planet-circle {
    width: 650px;
    height: 650px;
  }

  .planet-circle.medium {
    width: 480px;
    height: 480px;
  }

  .planet-circle.small {
    width: 300px;
    height: 300px;
  }

  .planet-block {
    min-height: 700px;
  }

  .planet-center-text {
    font-size: 26px;
  }

  .user-review-block.right-mid {
    bottom: 144px;
    right: -134px;
  }

  .user-review-block.image-top {
    right: 184px;
  }

  .reviewer {
    font-size: 14px;
  }

  .reviewer-image {
    width: 44px;
    height: 44px;
  }

  .user-content-block {
    width: 145px;
    max-width: 130px;
    min-height: 59px;
  }

  .check-circle {
    width: 54px;
    height: 54px;
    bottom: 160px;
    left: -20px;
  }

  .thumbs-circle {
    width: 54px;
    height: 54px;
    right: 36px;
  }

  .tab-menu {
    font-size: 24px;
  }

  .tabs-menu-holder {
    margin-bottom: 24px;
  }

  .tab-content-wrap, .accordion-content-wrap {
    padding-left: 32px;
    padding-right: 32px;
  }

  .dashboard-wrapper {
    display: block;
  }

  .sidebar-nav {
    display: none;
    transform: translate(-100%);
  }

  .sidebar-nav.mobile-view {
    z-index: 9999;
    width: 260px;
    display: block;
    position: fixed;
    transform: none;
  }

  .sidebar-nav.sidebar, .doshboard-main {
    display: block;
  }

  .doshboard-main.test {
    padding-left: 0;
  }

  .logo-text.mobile-view {
    margin-bottom: 20px;
    display: block;
  }

  .navbar-flex {
    padding-left: 30px;
    padding-right: 30px;
  }

  .navbar-flex.payment-send {
    padding-top: 0;
    padding-left: 30px;
    padding-right: 30px;
  }

  .dashboard-content.branding {
    padding-bottom: 0;
  }

  .dashboard-container {
    padding-left: 30px;
    padding-right: 30px;
  }

  .customer-info, .customer-info.customer {
    width: auto;
    max-width: none;
  }

  .input-field.qty {
    min-width: auto;
    max-width: none;
  }

  .input-field.vat {
    max-width: none;
  }

  .input-field.page-text {
    min-height: 140px;
  }

  .input-field.is-full {
    max-width: none;
  }

  .customer-details-block {
    flex-flow: column;
  }

  .grid-divider {
    width: 100%;
    height: 1px;
    margin: 20px 0;
  }

  .cart-block {
    grid-template-rows: auto;
    grid-template-columns: minmax(10px, 24px) minmax(40px, 74px) 1fr 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
  }

  .single-cart.unit-price {
    max-width: 100px;
  }

  .cart-summary-block {
    flex-flow: column;
    justify-content: flex-start;
    align-items: stretch;
  }

  .claim-link-button {
    padding-left: 24px;
    padding-right: 24px;
    font-size: 16px;
  }

  .hero-link-field {
    padding-bottom: 12px;
    padding-left: 16px;
    font-size: 18px;
  }

  .hero-link-field::placeholder {
    font-size: 18px;
  }

  .content-tab-menu.is-five-grid {
    overflow: auto;
  }

  .content-tab-menu.is-six-grid {
    grid-template-columns: 1fr .9fr .8fr 1fr 1fr;
    overflow: auto;
  }

  .content-tab-menu.is-six-grid.less-m-argin {
    grid-template-columns: 1fr .9fr .8fr 1fr 1fr;
  }

  .pagination-main.width-auto, .pagination-main.desktop-auto {
    min-width: 1024px;
  }

  .pagination-main.desktop-auto.width-auto {
    min-width: auto;
  }

  .search-bar {
    grid-template-columns: 1fr 2fr .75fr minmax(0, 0) .8fr;
    min-width: 1024px;
  }

  .search-bar.pending-payments {
    grid-template-columns: .75fr .75fr 1.25fr .7fr;
  }

  .search-bar.customers {
    grid-template-columns: 1fr 1fr .75fr .75fr;
    min-width: auto;
  }

  .search-bar.transaction-history {
    grid-template-columns: 1fr 2fr .75fr .75fr .8fr;
  }

  .global-container {
    padding-left: 30px;
    padding-right: 30px;
  }

  .customer-search-field {
    min-width: auto;
  }

  .time-select-field {
    max-width: 140px;
  }

  .paid-time.reports {
    min-width: 260px;
  }

  .paid-time.date-range {
    min-width: 250px;
  }

  .date-time-field, .date-time-field.paid {
    max-width: none;
  }

  .download-button {
    padding-left: 8px;
    padding-right: 6px;
    font-size: 12px;
    line-height: 20px;
  }

  .button-group {
    min-width: 140px;
  }

  .button.back.is-hide, .nav-right-block.is-hide {
    display: none;
  }

  .input-tittle.price {
    white-space: nowrap;
  }

  .modal_main-block {
    padding-left: 20px;
    padding-right: 20px;
  }

  .date-block {
    max-width: 493px;
  }

  .date-block.is-full, .date-field.is-full {
    max-width: none;
  }

  .vat-single-block, .total-price-field {
    width: 100%;
  }

  .archive-flex-block.is-hide, .update-button.is-hide {
    display: none;
  }

  .product-text-block {
    padding-top: 16px;
    padding-bottom: 32px;
  }

  .secondary-text.is-width {
    max-width: 282px;
  }

  .product-sub-menu {
    min-width: 1024px;
  }

  .product-sub-menu.is-invoice, .product-sub-menu.is-product {
    min-width: auto;
  }

  .reports-menu.hide-tablet-view {
    display: none;
  }

  .reports-main-block {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
    flex-flow: column;
  }

  .report-card-block {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: row;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    width: auto;
    display: grid;
  }

  .diagram-image-block {
    order: -1;
  }

  .report-metrics-card {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .dropdown-wrap {
    height: 40px;
  }

  .gateway-grid {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    grid-template-columns: minmax(200px, 1fr);
  }

  .gateway-grid.failed {
    grid-row-gap: 12px;
    grid-template-columns: minmax(200px, 1fr);
  }

  .gateway-description-text {
    max-width: none;
  }

  .gateway-description-text.margin-none {
    margin-bottom: 0;
  }

  .gateway-form-field {
    max-width: none;
  }

  .empty-space {
    min-height: 80px;
  }

  .empty-space.medium {
    min-height: 48px;
  }

  .brand-color-block {
    width: 100%;
  }

  .color-grid-block, .color-grid-block.large {
    grid-template-columns: 1fr 1.5fr;
  }

  .brand-side-panel {
    min-height: auto;
    padding: 16px;
  }

  .panel-header-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }

  .tip-block {
    justify-content: flex-start;
    align-items: flex-start;
  }

  .brand-top-contents.is-flex {
    flex-flow: column;
  }

  .logo-resize-block {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: wrap;
  }

  .color-code-block.input, .color-code-block.single-input {
    max-width: none;
  }

  .panel-heading {
    font-size: 16px;
  }

  .logo-width-wrap.less-space {
    flex-flow: wrap;
  }

  .logo-width-wrap.is-flex {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: wrap;
  }

  .template-panel {
    padding: 10px;
  }

  .panel-body {
    padding: 24px 10px;
  }

  .panel-body.qr-panel {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .brand-tab-menu {
    margin-bottom: 0;
    padding-left: 0;
    overflow: auto;
  }

  .screen-block {
    min-width: 140px;
  }

  .color-secetor-inline {
    flex-flow: column;
    width: 100%;
  }

  .panel-header-right {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    flex: 1;
    justify-content: flex-end;
  }

  .brand-button-grid {
    grid-template-columns: 1fr;
  }

  .page-input-block {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-columns: 1fr;
  }

  .page-input-block.margin-bottom {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-columns: 1fr;
  }

  .input-single-grid {
    grid-template-columns: 1fr 1.5fr;
  }

  .describe-input-block {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1.5fr;
    grid-auto-columns: 1fr;
  }

  .add-product-modal, .edit-product-modal {
    width: auto;
  }

  .preview-button {
    display: flex;
  }

  .bg-content-top {
    grid-row-gap: 20px;
    flex-flow: column;
  }

  .brand-single-plate {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1.5fr;
    grid-auto-columns: 1fr;
    justify-content: space-between;
    display: grid;
  }

  .brand-single-plate.is-brand {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1.5fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .font-select-block {
    grid-template-columns: 1fr;
  }

  .menu-btn-block {
    justify-content: center;
    align-items: center;
    width: 2.25rem;
    height: 2.25rem;
    display: flex;
  }

  .menu-btn-block.mobile-view {
    display: block;
  }

  .logo-link, .menu-button-hide, .menu-icon.is-hide {
    display: none;
  }

  .table_cell.xl-cell {
    min-width: 200px;
  }

  .table_cell.xl-cell.my-shop {
    min-width: 380px;
  }

  .table_component {
    min-width: 1024px;
  }

  .table_component.margin-medium.width-auto {
    min-width: auto;
  }

  .table-content-wrap.big {
    min-width: 210px;
  }

  .table-wrap {
    min-width: 1024px;
  }

  .table-wrap.margin-none.width-auto {
    min-width: auto;
  }

  .search-filter-block.show-tablet {
    border-bottom-style: none;
    padding-bottom: 24px;
    display: block;
  }

  .search-field {
    min-width: auto;
  }

  .header-full {
    padding-left: 30px;
    padding-right: 30px;
  }

  .back-button-block, .archive-button-block {
    padding-bottom: 20px;
    display: flex;
  }

  .small-logo.mobile-view {
    display: block;
  }

  .container-large {
    padding-left: 30px;
    padding-right: 30px;
  }

  .container-large.payment-send {
    padding-top: 0;
    padding-left: 30px;
    padding-right: 30px;
  }

  .collapse-and-logo {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .menu-btn-icon {
    transform: rotate(180deg);
  }

  .text-inline-block {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    display: flex;
  }

  .width-progress-block {
    flex: 1;
  }

  .bg-color-block {
    width: 100%;
  }

  .bg-single-plate {
    justify-content: space-between;
    align-items: center;
  }

  .bg-color-inline {
    flex-flow: column;
    width: 100%;
  }

  .bg-header-block {
    width: 100%;
  }

  .brand-menu-link {
    flex: none;
  }

  .active-item-line {
    bottom: 0;
  }

  .brand_left-block {
    width: 320px;
    max-width: none;
  }

  .brand_sub-tab-menu {
    margin-bottom: 0;
    padding-left: 0;
  }

  .bg-colors-wrap {
    grid-row-gap: 20px;
    flex-flow: column;
  }

  .switcher-color-block {
    width: 100%;
  }

  .preview-frame {
    max-width: 404px;
    max-height: 400px;
  }

  .main-container {
    transform: scale(.38);
  }

  .email-template {
    justify-content: center;
    align-items: center;
  }

  .user-content-grid {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .login-google-btn::placeholder, .user_input-field::placeholder {
    letter-spacing: -.2px;
  }

  .form-input-message.success {
    justify-content: flex-start;
    align-items: center;
  }

  .project-logo-wrap {
    margin-bottom: 2.5rem;
  }

  .input-field-2::placeholder {
    letter-spacing: -.2px;
  }

  .short-tips {
    justify-content: flex-start;
    align-items: flex-start;
  }

  .dashboard_main {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 30px;
    padding-right: 30px;
  }

  .dashboard_metrics-wrap {
    grid-template-columns: 1fr 1fr;
  }

  .dashboard_content-wrap {
    grid-template-columns: 1fr;
  }

  .quick_action-block.margin-medium.hide-smaller-view {
    display: none;
  }

  .quick_action-block.margin-medium.show-smaller-view {
    display: block;
  }

  .quick_action-btns {
    grid-template-columns: 1fr 1fr;
  }

  .form-input-group {
    grid-column-gap: 10px;
    grid-row-gap: 0px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .cart-subtittle-wrap {
    flex-flow: column;
    justify-content: flex-start;
    align-items: stretch;
  }

  .invoice_pagination.width-auto, .invoice_pagination.desktop-auto {
    min-width: 1024px;
  }

  .invoice_pagination.desktop-auto.width-auto, .billing-table.margin-medium.width-auto, .billing_table-wrap.margin-none.width-auto {
    min-width: auto;
  }

  .pricing-btn.back.is-hide {
    display: none;
  }

  .excel-btn {
    padding-left: 8px;
    padding-right: 6px;
    font-size: 12px;
    line-height: 20px;
  }

  .onboarding_content-block {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .payment_status-btn.back.is-hide {
    display: none;
  }

  .localization_modal-body {
    max-height: 68vh;
    overflow: auto;
  }

  .localisation_single-item {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-columns: 1fr 1fr;
  }

  .localisation_single-item.is-date {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-columns: 1fr;
  }

  .field_label-block.landscape-padding-none {
    padding-top: 0;
    padding-bottom: 0;
  }

  .localisation_tax-rate {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-columns: 1fr 1fr;
  }

  .invoice_main {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .invoice_component {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .invoice_left {
    padding: 44px 24px;
  }

  .invoice_single-item {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }
}

@media screen and (max-width: 767px) {
  .header {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .nav-menu {
    background-color: var(--white);
  }

  .hero-main-wrap {
    background-color: #f1e6fe;
    border-radius: 24px;
    padding-bottom: 30px;
  }

  .hero-grid {
    grid-template-columns: 3fr;
  }

  .hero-left-block {
    padding-top: 32px;
  }

  .hero-sub-tittle {
    margin-bottom: 20px;
    font-size: 13px;
    line-height: 1.6;
  }

  .section-tittle {
    margin-bottom: 14px;
    font-size: 28px;
  }

  .large-space.hide {
    display: none;
  }

  .process-card {
    text-align: center;
  }

  .process-card.step-three {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .payment-method-text {
    max-width: 80%;
    font-size: 22px;
  }

  .section-tittle-block {
    margin-bottom: 26px;
    padding-left: 16px;
    padding-right: 16px;
  }

  .features-block {
    padding-top: 20px;
    padding-left: 24px;
  }

  .features-left-text {
    font-size: 18px;
  }

  .active-text {
    font-size: 22px;
  }

  .features-text {
    font-size: 14px;
  }

  .payment-form-block {
    margin-top: -220px;
  }

  .payment-from-grid {
    grid-template-columns: 1fr;
  }

  .card-tittle {
    margin-bottom: 16px;
    font-size: 20px;
  }

  .invoice-wrap {
    background-color: #e6edf2;
    border-radius: 8px;
    min-height: 560px;
    padding-left: 16px;
    padding-right: 16px;
  }

  .invoice-sub-tittle {
    margin-bottom: 24px;
  }

  .invoice-logo-wrap {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    margin-bottom: 30px;
  }

  .business-main-wrap {
    padding-left: 0;
    padding-right: 0;
  }

  .business-section-tittle {
    max-width: 90%;
  }

  .business-grid {
    grid-template-columns: 1fr 1fr;
  }

  .section-cta {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .cta-content-wrap {
    padding-left: 20px;
    padding-right: 20px;
  }

  .cta-text {
    margin-bottom: 32px;
  }

  .brand-logos-wrap {
    grid-column-gap: 28px;
    grid-row-gap: 24px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    padding-left: 64px;
    padding-right: 64px;
  }

  .footer-grid {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
    grid-template-columns: 2.75fr 1.5fr 1.5fr;
  }

  .footer-text {
    max-width: 100%;
  }

  .footer-link-list {
    margin-bottom: 4px;
  }

  .menu-button {
    background-color: var(--color);
  }

  .menu-button.w--open {
    background-color: var(--white);
  }

  .icon {
    color: var(--font-colors--primary);
  }

  .section-planet {
    display: none;
  }

  .planet-circle {
    width: 520px;
    height: 520px;
    margin-left: auto;
    margin-right: auto;
  }

  .planet-circle.medium {
    width: 380px;
    height: 380px;
  }

  .planet-circle.small {
    width: 220px;
    height: 220px;
  }

  .planet-block {
    min-height: 650px;
  }

  .planet-center-text {
    margin-bottom: 0;
    font-size: 18px;
  }

  .user-review-block.right {
    top: 267px;
  }

  .user-review-block.right.left-top {
    top: -28px;
  }

  .user-review-block.right.left-bottom {
    bottom: 36px;
    left: -90px;
  }

  .user-review-block.right-corner {
    bottom: 10px;
  }

  .user-review-block.right-mid {
    bottom: 236px;
    right: -121px;
  }

  .user-review-block.large-circle {
    top: 223px;
    left: -22px;
  }

  .user-review-block.image-top {
    right: 136px;
  }

  .user-review-block.image-bottom {
    right: 66px;
  }

  .reviewer-image {
    width: 42px;
    height: 42px;
  }

  .user-content-block {
    width: 130px;
  }

  .check-circle {
    width: 50px;
    height: 50px;
    bottom: 250px;
    left: -12px;
  }

  .thumbs-circle {
    width: 50px;
    height: 50px;
    top: 61px;
  }

  .input-check-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 15px;
    text-align: center;
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center;
  }

  .tabs-block {
    display: none;
  }

  .tabs {
    flex-direction: column;
  }

  .tabs-menu {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    width: auto;
    max-width: 100%;
    margin-bottom: 24px;
  }

  .tabs-content {
    border-radius: 8px;
  }

  .tab-content-wrap {
    display: none;
  }

  .accordion-main-wrap {
    padding-left: 0;
    padding-right: 0;
    display: block;
  }

  .accordion-toggle.top {
    padding: 20px;
  }

  .accordion-body {
    padding: 20px;
    display: none;
  }

  .accordion-tittle {
    font-size: 24px;
  }

  .accordion-content-wrap {
    padding-left: 0;
    padding-right: 0;
  }

  .form-block {
    margin-bottom: 0;
  }

  .sidebar-nav.mobile-view {
    z-index: 9999;
    min-height: 100vh;
    position: fixed;
  }

  .logo-wrapper {
    padding-left: 20px;
  }

  .link-item.disable.brand-link {
    display: none;
  }

  .link-item.brand-link {
    justify-content: center;
    align-items: center;
    min-width: 200px;
    min-height: auto;
  }

  .collapse-link-wrap {
    min-width: 140px;
  }

  .collapse-link-wrap.margin-top {
    justify-content: center;
    align-items: center;
    height: auto;
    margin-top: 0;
    padding-left: 0;
  }

  .collapse-link-wrap.brand-link {
    justify-content: center;
    align-items: center;
    height: auto;
    padding-left: 0;
  }

  .primary-text.currency {
    font-size: 18px;
    line-height: 32px;
  }

  .doshboard-main {
    padding-bottom: 0;
  }

  .logo-text.mobile-view {
    margin-bottom: 20px;
  }

  .dashboard-content {
    min-height: 90vh;
  }

  .section-heading-wrap {
    display: none;
  }

  .customer-full-details {
    flex: 1;
    margin-bottom: 0;
    display: block;
  }

  .customer-full-details.add-padding {
    margin-bottom: 24px;
  }

  .customer-info {
    display: none;
  }

  .customer-info.view-payment {
    grid-column-gap: 24px;
    grid-row-gap: 0px;
    grid-template-rows: auto;
    grid-template-columns: 1.25fr 1fr;
    grid-auto-columns: 1fr;
    justify-content: space-between;
    width: auto;
    display: grid;
  }

  .customer-info.input-fields {
    grid-row-gap: 24px;
    flex-flow: column;
    width: auto;
    display: flex;
  }

  .input-field {
    max-width: none;
  }

  .input-field.qty {
    min-width: 60px;
    max-width: 64px;
  }

  .optional {
    font-weight: 500;
  }

  .grid-divider {
    margin-top: 30px;
    margin-bottom: 10px;
  }

  .summary-block {
    order: -1;
  }

  .cart-block {
    grid-template-columns: minmax(10px, 24px) minmax(40px, 74px) 1fr;
    display: none;
  }

  .single-cart.is-full {
    flex: 1;
  }

  .cart-summary-block {
    display: none;
  }

  .payment-amount {
    flex-flow: column;
    min-width: auto;
    min-height: auto;
    padding: 10px 20px;
    display: block;
  }

  .amout-content-block {
    flex-flow: row;
    justify-content: space-between;
  }

  .amount-single-block {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    flex-flow: column;
  }

  .content-tab-menu.is-four-grid {
    overflow: auto;
  }

  .content-tab-menu.is-five-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }

  .content-tab-menu.is-six-grid {
    overflow: auto;
  }

  .pagination-main {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    display: flex;
  }

  .pagination-main.hide-on-mobile {
    display: none;
  }

  .result-view {
    margin-bottom: 0;
  }

  .pagination-block {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex: none;
    grid-template-columns: .5fr 1fr minmax(0, 13px) 1fr .5fr;
    min-width: 532px;
    max-width: none;
  }

  .prev-link {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    padding-left: 4px;
    padding-right: 10px;
    font-size: 12px;
  }

  .next-link {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    padding-left: 10px;
    padding-right: 4px;
  }

  .paginate-number-block.is-center {
    justify-content: center;
    align-items: center;
  }

  .search-bar {
    grid-template-columns: 1fr 2fr 1fr 1fr;
  }

  .search-bar.customers {
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
  }

  .input-group.grow {
    flex: 1;
  }

  .time-select-field {
    max-width: 140px;
  }

  .date-time-field, .date-time-field.paid {
    max-width: none;
  }

  .download-button {
    max-width: 142px;
  }

  .download-button.is-icon {
    min-width: auto;
    padding-left: 12px;
    padding-right: 12px;
  }

  .select-wrap {
    flex: 1;
  }

  .button.delete {
    display: block;
  }

  .payment-data-heading, .payment-data-body, .payment-data-footer {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-columns: 1fr 6fr 2fr 2fr 2fr;
  }

  .customer-menu-link {
    font-size: 13px;
    line-height: 20px;
  }

  .add-menu-button.is-icon {
    min-width: auto;
    padding-right: 12px;
  }

  .date-block {
    flex: none;
  }

  .calender-icon {
    bottom: 12px;
  }

  .ignore-form-block.is-full {
    flex: 1;
  }

  .vat-single-block {
    min-width: 110px;
  }

  .metrics-card {
    width: auto;
  }

  .button-block.right.margin-bottom {
    min-width: auto;
  }

  .update-button.on-header {
    width: 40px;
    padding-left: 0;
    padding-right: 0;
  }

  .delete-contact-button {
    bottom: 84px;
    right: 10px;
  }

  .product-text-block {
    padding-top: 0;
    padding-bottom: 20px;
    display: none;
  }

  .secondary-text.is-width {
    flex: 1;
  }

  .product-sub-menu {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .product-search-field {
    min-width: auto;
  }

  .reports-menu.hide-on-mobile, .reports-menu.hide-tablet-view {
    display: none;
  }

  .reports-main-block {
    flex-flow: column;
    min-width: auto;
  }

  .report-card-block {
    flex-flow: column;
    width: auto;
    display: flex;
  }

  .report-metrics-card {
    justify-content: flex-start;
    align-items: center;
    min-height: 120px;
  }

  .excel-file-block {
    min-width: auto;
  }

  .user-invite-menu {
    margin-bottom: 14px;
  }

  .resend-invite-button {
    width: 100%;
  }

  .gateway-grid {
    grid-column-gap: 0px;
    grid-row-gap: 24px;
    grid-template-columns: minmax(200px, auto);
  }

  .gateway-description-text.margin-none {
    margin-bottom: 0;
  }

  .gateway-form-field {
    max-width: none;
  }

  .submit-mail-button {
    max-width: 130px;
    font-size: 13px;
  }

  .empty-space {
    min-height: 60px;
  }

  .empty-space.medium {
    min-height: 32px;
  }

  .company-details-block {
    flex: 1;
  }

  .company-info.company-details {
    grid-column-gap: 0px;
    grid-row-gap: 24px;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .input-fix-width {
    max-width: none;
  }

  .tax-rate-block.last {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    flex-flow: wrap;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    justify-items: start;
    display: flex;
  }

  .color-single-block {
    width: 100%;
  }

  .color-input-block {
    flex: 1;
  }

  .brand-side-panel {
    min-height: auto;
  }

  .panel-header-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    padding-bottom: 20px;
  }

  .responsive-switcher {
    height: 36px;
  }

  .brand-content-block {
    flex-flow: column;
    padding: 16px;
  }

  .tip-block {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
  }

  .brand-top-contents.margin-bottom {
    margin-bottom: 0;
  }

  .logo-resize-block.less-gap {
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
  }

  .logo-width-wrap {
    width: 100%;
  }

  .template-panel {
    padding: 10px;
  }

  .panel-body {
    padding: 1.25rem 0 1.25rem 1.25rem;
  }

  .modal-brand-main {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .modal-brand-main.brand {
    padding-top: 0;
  }

  .brand-tab-menu {
    flex-flow: row;
    width: auto;
    padding-top: 0;
    padding-bottom: 0;
    overflow: auto;
  }

  .note-block {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .screen-block {
    width: 36px;
    min-width: auto;
    height: 36px;
    min-height: auto;
    padding-left: 0;
    padding-right: 0;
  }

  .screen-block.hide-smaller-view {
    display: none;
  }

  .panel-header-right {
    width: 100%;
  }

  .brand-button-grid {
    grid-template-columns: 1fr;
  }

  .page-input-block, .page-input-block.margin-bottom {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-columns: 1fr;
  }

  .button-with-icon {
    width: 36px;
    height: 36px;
    min-height: auto;
    padding-left: 0;
    padding-right: 0;
  }

  .switcher-image-block {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }

  .add-product-modal {
    width: auto;
  }

  .product-input-block {
    display: block;
  }

  .product-left-block {
    margin-bottom: 16px;
  }

  .product-uploader {
    max-width: none;
    margin-bottom: 16px;
  }

  .product-flex-block {
    display: block;
  }

  .preview-button {
    width: 36px;
    height: 36px;
    min-height: auto;
    padding-left: 0;
    padding-right: 0;
  }

  .payment-link-main {
    flex-flow: column;
    margin-bottom: 24px;
  }

  .payment-connect-main {
    padding: 24px 28px 32px;
  }

  .payment-field-block {
    grid-column-gap: 24px;
    grid-template-columns: 1fr;
  }

  .input-field-single.more-gap {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    justify-content: space-between;
    align-items: center;
  }

  .input-llt-field.less-width, .input-llt-field.width-xl {
    max-width: none;
  }

  .message-success-block {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
  }

  .message-success-block.margin-top {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    flex-flow: row;
    justify-content: flex-start;
    align-items: center;
  }

  .brand-single-plate {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1.5fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .font-select-block {
    grid-template-columns: 1fr;
  }

  .page-header {
    justify-content: space-between;
    align-items: center;
    padding: 20px 28px;
    display: flex;
  }

  .menu-btn-block.mobile-view {
    display: block;
  }

  .ppayment-service-wrap {
    padding-top: 32px;
    padding-left: 25px;
    padding-right: 25px;
  }

  .service-item-block {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    flex-flow: column;
    display: flex;
  }

  .service-item {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    background-color: #f1e6fe;
    border-radius: 20px;
    justify-content: flex-start;
    align-items: center;
    height: 140px;
    padding-left: 30px;
    display: flex;
  }

  .service-item.right-content {
    padding-left: 0;
  }

  .service-item.right-content.is-qr {
    background-color: #d8d8d8;
  }

  .service-item.is-history {
    background-color: #fdc100;
    padding-left: 0;
  }

  .service-item.is-link {
    background-color: #fcddec;
  }

  .service-heading-block {
    width: 50%;
  }

  .service-heading {
    letter-spacing: .32px;
    margin-top: 0;
    margin-bottom: 0;
    font-family: Ppagrandir, sans-serif;
    font-size: 31px;
    line-height: 33.2px;
  }

  .service-image-block {
    width: 40%;
  }

  .space-medium {
    min-height: 60px;
  }

  .mobile-footer {
    background-color: #f9f9f9;
    display: block;
    position: sticky;
    inset: auto 0% 0%;
  }

  .mobile-footer.top-border {
    border-top: 1px solid #cfd6dd;
  }

  .footer-item-grid {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .footer-item {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    color: #4a545e;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    padding-top: 16px;
    padding-bottom: 16px;
    font-size: 12px;
    line-height: 20px;
    transition: background-color .3s;
    display: flex;
  }

  .footer-item:hover, .footer-item.w--current {
    background-color: #ffebeb;
  }

  .footer-link-block {
    border-top: 1px solid #cfd6dd;
  }

  .footer-amount-block {
    background-color: var(--white);
    padding: 10px;
  }

  .calender-dropdown {
    display: block;
  }

  .calender-items {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .toggles-block, .toggle-heading-text, .payment-items-toggle, .toggle-divider {
    display: block;
  }

  .empty-block {
    display: none;
  }

  .table-block.mobile-view {
    display: block;
  }

  .table-block.pending, .table-block.paid-table {
    display: none;
  }

  .table_component {
    min-width: 1024px;
  }

  .table-wrap.hide-on-mobile {
    display: none;
  }

  .search-filter-block, .search-filter-block.show-on-mobile {
    display: block;
  }

  .shop-item.mobile {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }

  .product-accordion-block {
    padding-top: 0;
    padding-bottom: 20px;
    display: block;
  }

  .product-text-body {
    padding-right: 20px;
  }

  .brand-tabs {
    flex-flow: column;
    padding-left: 0;
  }

  .hide-on-mobile {
    display: none;
  }

  .width-progress-block {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    display: flex;
  }

  .bg-single-plate {
    align-items: stretch;
  }

  .brand-menu-link.disable.brand-link {
    display: none;
  }

  .brand-menu-link.brand-link {
    justify-content: center;
    align-items: center;
    min-width: 200px;
    min-height: auto;
  }

  .input-label.currency, .title-text.currency {
    font-size: 18px;
    line-height: 32px;
  }

  .brand_left-block {
    width: auto;
    max-width: none;
  }

  .uploader-modal {
    padding: 24px;
  }

  .modal-heading {
    font-size: 20px;
  }

  .image-uploader {
    min-height: 40vh;
  }

  .preview-frame {
    flex-flow: row;
    justify-content: center;
    align-items: stretch;
    max-height: 400px;
    display: flex;
  }

  .main-container {
    transform-origin: 50% 0;
    flex: none;
    transform: scale(.38);
  }

  .screen-btn {
    display: flex;
  }

  .screen-btn-text {
    display: none;
  }

  .user-main {
    justify-content: flex-start;
    align-items: flex-start;
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .user-main.align-center {
    justify-content: center;
    align-items: center;
  }

  .user-content-grid {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-columns: 1fr;
  }

  .user-right {
    display: none;
  }

  .user-right.show-smaller-view {
    display: block;
  }

  .project-logo-wrap {
    margin-bottom: 3.125rem;
  }

  .user-content-wrapper {
    max-width: none;
  }

  .short-tips {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
  }

  .search_block-wrap {
    display: none;
  }

  .dashboard_metrics-wrap {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }

  .dashboard_metrics-wrap.margin-medium {
    grid-template-columns: 1fr;
  }

  .cart-wrapper {
    display: none;
  }

  .content-block.regular-width {
    margin-left: auto;
    margin-right: auto;
  }

  .invoice_pagination {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
  }

  .invoice_pagination.hide-on-mobile {
    display: none;
  }

  .billing-table {
    min-width: 1024px;
  }

  .billing_table-wrap {
    overflow: auto;
  }

  .billing_table-wrap.hide-on-mobile {
    display: none;
  }

  .pricing-card.add-border {
    border-bottom: 1px solid #eaedf0;
    padding-bottom: 24px;
  }

  .pricing_card-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-columns: 1fr;
  }

  .pricing-btn.delete {
    display: block;
  }

  .invoice_pagination-block {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex: none;
    grid-template-columns: 40px 1fr minmax(0, 13px) 1fr 40px;
    width: 100%;
  }

  .excel-btn {
    min-width: 132px;
    padding-left: 0;
    padding-right: 0;
  }

  .excel-btn.is-icon {
    min-width: auto;
    padding-left: 12px;
    padding-right: 12px;
  }

  .onboarding-main.align-center {
    justify-content: center;
    align-items: center;
  }

  .dot-nav-wrap {
    margin-bottom: 32px;
  }

  .onboarding_content-block {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-columns: 1fr;
  }

  .banner_contents-wrap {
    flex-flow: column;
  }

  .payment_status-btn.delete {
    display: block;
  }

  .localization_modal-body {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .localisation_content-wrap {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }

  .localisation_single-item {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-columns: 1fr;
  }

  .field_label-block {
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .localisation_tax-rate {
    grid-template-columns: 1fr;
  }

  .banner_btn-group {
    flex-flow: row;
  }

  .modal_foot-note {
    max-width: none;
  }

  .invoice_main {
    padding-bottom: 7.5rem;
  }

  .invoice_component {
    flex-flow: column;
  }

  .invoice_left, .invoice_right {
    max-width: none;
  }

  .invoice_single-item {
    flex-flow: column;
  }

  .invoice_btn-block {
    background-color: var(--white);
    margin-top: 0;
    padding: 24px 24px 14px;
    position: fixed;
    inset: auto 0% 0%;
  }

  .action_block.hide-smaller-view {
    display: none;
  }
}

@media screen and (max-width: 479px) {
  .header {
    padding-top: 16px;
    padding-bottom: 16px;
  }

  .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .nav-button-group {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    flex-direction: column;
  }

  .brand-logo-wrap {
    padding-left: 0;
  }

  .primary-button {
    max-height: none;
    padding-left: 24px;
    padding-right: 24px;
  }

  .hero-main-wrap {
    padding-bottom: 40px;
    padding-left: 16px;
    padding-right: 16px;
  }

  .hero-left-block {
    padding-top: 10px;
  }

  .hero-sub-tittle {
    margin-bottom: 20px;
    line-height: 1.6;
  }

  .hero-heading {
    font-size: 40px;
  }

  .hero-text {
    font-size: 17px;
    line-height: 1.6;
  }

  .section-tittle {
    font-size: 24px;
  }

  .section-sub-text {
    line-height: 1.4;
  }

  .large-space {
    min-height: 50px;
  }

  .large-space.footer-space {
    min-height: 40px;
  }

  .process-grid {
    grid-template-columns: 1fr;
  }

  .process-grid.step-three {
    grid-template-columns: 1fr 1fr;
  }

  .process-card {
    text-align: center;
    padding: 32px 24px;
  }

  .payment-method-text {
    max-width: 100%;
  }

  .section-tittle-block {
    padding-left: 16px;
    padding-right: 16px;
  }

  .dark-background-wrap {
    height: auto;
    max-height: none;
  }

  .features-grid {
    grid-row-gap: 32px;
    grid-template-columns: 1fr;
  }

  .payment-form-block {
    margin-top: 40px;
  }

  .payment-from-card {
    padding: 24px;
  }

  .card-list {
    margin-bottom: 30px;
  }

  .invoice-button-wrap {
    margin-bottom: 40px;
  }

  .invoice-button {
    width: 332px;
    min-height: 56px;
    font-size: 15px;
  }

  .invoice-wrap {
    background-color: #e6edf2;
    border-radius: 24px;
    min-height: auto;
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .invoice-sub-tittle {
    line-height: 1.5;
  }

  .invoice-logo-wrap {
    grid-column-gap: 48px;
    grid-row-gap: 24px;
    grid-template-columns: 1fr 1fr 1fr;
    padding-left: 40px;
    padding-right: 40px;
  }

  .payment-process-text {
    font-size: 15px;
  }

  .brand-logo-block {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-direction: column;
    align-items: center;
  }

  .make-it-easy {
    margin-left: auto;
    margin-right: auto;
  }

  .business-section-tittle {
    max-width: 100%;
    min-height: 120px;
    margin-bottom: 24px;
    font-size: 30px;
  }

  .business-grid {
    grid-template-columns: 1fr 1fr;
  }

  .author-info-block {
    align-items: flex-end;
  }

  .business-tittle {
    font-size: 14px;
  }

  .business-type-text {
    font-size: 18px;
  }

  .section-cta {
    padding-top: 54px;
    padding-bottom: 60px;
  }

  .cta-heading {
    font-size: 24px;
  }

  .cta-content-wrap {
    padding-left: 16px;
    padding-right: 16px;
  }

  .cta-text {
    margin-bottom: 32px;
    font-size: 16px;
  }

  .cta-button {
    font-size: 15px;
  }

  .brand-logos-wrap {
    grid-column-gap: 64px;
    grid-row-gap: 24px;
    flex-direction: column;
    grid-template-columns: 1fr 1fr;
    padding-left: 100px;
    padding-right: 100px;
  }

  .footer-main-wrap {
    padding-left: 10px;
    padding-right: 10px;
  }

  .footer-grid {
    grid-column-gap: 40px;
    grid-row-gap: 32px;
    grid-template-columns: 2.75fr;
  }

  .footer-text {
    margin-bottom: 0;
  }

  .social-icon-wrap {
    justify-content: center;
    margin-bottom: 20px;
  }

  .copyright-text-wrap {
    text-align: center;
    margin-top: 40px;
    display: block;
  }

  .planet-circle {
    width: 340px;
    height: 340px;
  }

  .planet-circle.medium {
    width: 220px;
    height: 220px;
  }

  .planet-circle.small {
    width: 140px;
    height: 140px;
  }

  .planet-block {
    min-height: 400px;
  }

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

  .user-review-block.right {
    flex-direction: column;
    top: 220px;
    right: 6px;
  }

  .user-review-block.right.left-top {
    top: -69px;
    left: -65px;
  }

  .user-review-block.right.left-bottom {
    flex-direction: column;
    bottom: 103px;
    left: -52px;
  }

  .user-review-block.right-corner {
    flex-direction: column;
    bottom: 78px;
    right: -47px;
  }

  .user-review-block.right-mid {
    flex-direction: column;
    bottom: 230px;
    right: -52px;
  }

  .user-review-block.large-circle {
    flex-direction: column;
    justify-content: center;
    top: 208px;
    left: -10px;
  }

  .user-review-block.image-top {
    flex-direction: column;
    bottom: -70px;
    right: 72px;
  }

  .user-review-block.image-bottom {
    top: -113px;
  }

  .reviewer {
    margin-bottom: 0;
    font-size: 12px;
  }

  .reviewer-image {
    width: 32px;
    height: 32px;
    right: 0;
  }

  .reviewer-image.right {
    left: 0;
  }

  .reviewer-image.bottom {
    top: 0;
  }

  .user-content-block {
    width: 100px;
    max-width: 100px;
    min-height: 48px;
  }

  .check-circle {
    width: 40px;
    height: 40px;
    bottom: 198px;
    left: 49px;
  }

  .thumbs-circle {
    width: 40px;
    height: 40px;
    top: 56px;
    right: 1px;
  }

  .tabs-main-wrap {
    padding-left: 0;
    padding-right: 0;
  }

  .tab-menu {
    font-size: 20px;
  }

  .tab-content-wrap {
    padding: 32px 24px;
  }

  .accordion-body {
    padding: 24px;
    display: none;
  }

  .accordion-tittle {
    font-size: 23px;
  }

  .accordion-content-wrap {
    padding: 0;
  }

  .link-item.brand-link {
    min-width: 180px;
  }

  .primary-text.bold {
    margin-bottom: 20px;
  }

  .primary-text.hide-mobile {
    display: none;
  }

  .primary-text.is-title {
    margin-bottom: 20px;
  }

  .cancle-block {
    justify-content: center;
    align-items: center;
    width: 2.25rem;
    height: 2.25rem;
    padding-right: 12px;
  }

  .dashboard-container {
    padding-left: 24px;
    padding-right: 24px;
  }

  .customer-info.view-payment {
    grid-column-gap: 14px;
    grid-template-columns: 1fr 1fr;
  }

  .input-field.rate {
    max-width: 136px;
  }

  .input-field.parcent {
    max-width: 86px;
  }

  .input-field.page-text {
    min-height: 140px;
  }

  .checkbox-field.margin-bottom {
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 20px;
  }

  .checkbox {
    margin-top: 4px;
  }

  .single-cart {
    flex: 0 auto;
  }

  .claim-link-button {
    padding-left: 16px;
    padding-right: 16px;
    font-size: 15px;
  }

  .hero-link-field {
    padding-left: 12px;
    font-size: 16px;
  }

  .hero-link-field::placeholder {
    font-size: 16px;
  }

  .content-tab-menu.is-five-grid {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
  }

  .content-tab-menu.is-six-grid {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }

  .result-view {
    min-width: 92px;
  }

  .prev-link.center, .next-link.center {
    justify-content: center;
    align-items: center;
    padding-left: 0;
    padding-right: 0;
  }

  .time-select-field {
    max-width: 94px;
  }

  .paid-time.reports {
    min-width: 215px;
  }

  .download-button.is-pdf {
    max-width: none;
  }

  .button-group.refund {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    width: 100%;
    min-width: auto;
    display: grid;
  }

  .modal_top-block {
    margin-bottom: 16px;
  }

  .modal_heading-text {
    font-size: 16px;
  }

  .button.outline {
    text-align: center;
  }

  .button.primary, .button.refund {
    justify-content: center;
    align-items: center;
  }

  .button.delete {
    text-align: center;
    width: 100%;
  }

  .button.delete.left-align {
    width: auto;
  }

  .payment-data-heading {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    grid-template-columns: .5fr 2fr 1.25fr 1fr 1fr;
  }

  .payment-data-body, .payment-data-footer {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    grid-template-columns: .5fr 2fr 1fr 1fr 1fr;
  }

  .time-and-date-divider {
    width: 3px;
    margin-left: 6px;
  }

  .ignore-form-block.is-full {
    flex: 1;
  }

  .modal_button-block {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .modal_button-block.space-between {
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
  }

  .description-field {
    min-width: auto;
  }

  .button-block.space {
    flex-flow: column;
  }

  .update-button {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    height: 36px;
    padding-left: 10px;
    padding-right: 12px;
  }

  .update-button.on-header {
    width: 36px;
    height: 36px;
    padding-left: 0;
    padding-right: 0;
  }

  .excel-file-block {
    padding-right: 12px;
  }

  .dropdown-toggle.right-padding, .dropdown-wrap {
    min-width: 100px;
  }

  .section-divider {
    margin-top: 24px;
  }

  .cross-wrap {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .date_formate-block {
    flex-flow: column;
  }

  .radio-date-formate.less-space {
    padding-top: 4px;
    padding-bottom: 4px;
  }

  .color-grid-block, .color-grid-block.large {
    grid-template-columns: 1fr 1.5fr;
  }

  .brand-side-panel {
    padding: 10px;
  }

  .panel-header-wrap {
    padding-bottom: 14px;
  }

  .brand-content-block {
    padding: 1rem;
  }

  .form-single-block {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
  }

  .uploaded-area {
    padding: 20px;
  }

  .panel-heading {
    font-size: 16px;
  }

  .logo-width-wrap {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: row;
    width: 100%;
  }

  .logo-width-wrap.is-flex {
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
  }

  .logo-progress-block {
    flex: 1;
    width: 100%;
  }

  .progress-gray-line {
    flex: 1;
  }

  .active-progress-line, .active-progress-line.small {
    width: 50%;
  }

  .template-panel {
    padding: 4px;
  }

  .panel-body {
    padding: 14px 0;
  }

  .panel-body.qr-panel {
    padding: 1.5rem;
  }

  .screen-block {
    width: 40px;
    min-width: auto;
    height: 40px;
    min-height: auto;
    padding-left: 0;
    padding-right: 0;
  }

  .switcher.is-full {
    width: 100%;
  }

  .input-single-grid, .describe-input-block {
    grid-template-columns: 1fr;
  }

  .button-with-icon {
    width: 40px;
    height: 40px;
    min-height: auto;
    padding-left: 0;
    padding-right: 0;
  }

  .syon-mobile-mockup {
    top: 8px;
    left: 8px;
  }

  .image-progress-block, .add-product-modal {
    width: 100%;
  }

  .product-left-block {
    min-width: auto;
  }

  .product-description {
    min-height: 140px;
  }

  .edit-product-modal {
    width: 100%;
  }

  .payment-connect-main {
    padding: 24px;
  }

  .payment-connect-lists {
    padding-top: 10px;
    padding-bottom: 16px;
  }

  .steps-tittle {
    margin-bottom: 10px;
  }

  .input-llt-field, .input-llt-field.width-xl {
    min-width: auto;
  }

  .payment-cta-block {
    padding-left: 24px;
    padding-right: 24px;
  }

  .message-success-block {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }

  .message-success-block.margin-top {
    justify-content: flex-start;
    align-items: flex-start;
  }

  .support-message-field {
    min-height: 140px;
  }

  .brand-single-plate, .brand-single-plate.is-brand {
    grid-template-columns: 1fr 1.5fr;
  }

  .service-item {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    justify-content: flex-start;
  }

  .service-heading-block, .service-image-block {
    width: auto;
  }

  .mobile-footer {
    margin-top: auto;
  }

  .header-full {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .small-logo {
    padding-left: 0;
  }

  .small-logo.mobile-view {
    max-width: 175px;
  }

  .container-large {
    padding-left: 16px;
    padding-right: 16px;
  }

  .collapse-and-logo {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }

  .text-inline-block {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    flex-flow: column;
  }

  .width-progress-block, .switcher-wrapper {
    width: 100%;
  }

  .brand-menu-link.brand-link {
    min-width: 180px;
  }

  .brand_sub-menu-link {
    flex: none;
    justify-content: center;
    align-items: center;
    padding: 8px 14px;
    display: flex;
  }

  .input-label.hide-mobile {
    display: none;
  }

  .logo-content-block {
    max-width: none;
  }

  .title-text.hide-mobile {
    display: none;
  }

  .brand_sub-tab-menu {
    padding-right: 10px;
    display: flex;
    overflow: auto;
  }

  .bg-image-wrapper {
    width: 100%;
  }

  .uploader-modal {
    padding: 16px;
  }

  .modal-heading {
    font-size: 18px;
    line-height: 28px;
  }

  .modal-tab-menu {
    display: flex;
  }

  .uploader-content-wrapper, .uploader-wrap {
    padding: 10px;
  }

  .image-uploader {
    min-height: 37vh;
  }

  .preview-frame {
    max-width: 380px;
    max-height: 300px;
  }

  .main-container {
    transform: scale(.29);
  }

  .screen-btn {
    min-width: auto;
    min-height: auto;
    padding-left: 0;
    padding-right: 0;
  }

  .user-secondary-text.is-medium {
    line-height: 1.55556;
  }

  .login-google-btn::placeholder, .user_input-field::placeholder {
    font-weight: 400;
  }

  .project-logo-wrap {
    margin-bottom: 2.5rem;
  }

  .form-input-grid {
    grid-template-columns: 1fr;
  }

  .input-field-2::placeholder {
    font-weight: 400;
  }

  .dashboard_main {
    padding-left: 16px;
    padding-right: 16px;
  }

  .dashboard_metrics-wrap, .quick_action-btns {
    grid-template-columns: 1fr;
  }

  .recent_payment-block {
    padding-left: 12px;
    padding-right: 12px;
  }

  .form-input-group {
    grid-template-columns: 1fr;
  }

  .product-image {
    flex: 1;
  }

  .payment_user-name {
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 90px;
    overflow: hidden;
  }

  .payment_user-mail {
    text-overflow: ellipsis;
    max-width: 90px;
    overflow: hidden;
  }

  .content-block.regular-width {
    padding-left: 24px;
    padding-right: 24px;
  }

  .billing-table {
    min-width: 720px;
  }

  .pricing_block.space-between {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
  }

  .pricing-btn.outline {
    text-align: center;
  }

  .pricing-btn.primary, .pricing-btn.refund {
    justify-content: center;
    align-items: center;
  }

  .pricing-btn.delete {
    text-align: center;
    width: 100%;
  }

  .pricing-btn.delete.left-align {
    width: auto;
  }

  .excel-btn {
    flex: none;
    width: 40px;
    min-width: auto;
  }

  .excel-btn.is-pdf {
    max-width: none;
  }

  .excel-btn-text {
    display: none;
  }

  .dot-nav-wrap {
    margin-bottom: 20px;
  }

  .account_setup-banner.is-customisation {
    padding: 20px 16px;
  }

  .payment_status-empty {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .payment_status-btn.outline {
    text-align: center;
  }

  .payment_status-btn.primary, .payment_status-btn.refund {
    justify-content: center;
    align-items: center;
  }

  .payment_status-btn.delete {
    text-align: center;
    width: 100%;
  }

  .payment_status-btn.delete.left-align {
    width: auto;
  }

  .localisation_tax-rate {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }

  .user_back-btn {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
  }

  .localisation_modal-footer {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
  }
}

#w-node-f2a4c619-0122-1495-fc50-c19e6a5afbc6-2bfcb1f3, #w-node-ae31c6c9-717b-f172-d2bd-b50cb02fa9ce-2bfcb1f3, #w-node-_0f7168c1-ff85-8c6c-f4f0-ba6a07eceea9-2bfcb1f3, #w-node-_6d777185-11c1-450b-4ae9-8f2616682c37-2bfcb1f3, #w-node-feab17ce-b87f-c7ff-9e14-2c5d1b36f886-2bfcb1f3, #w-node-a5058aea-f36b-ac2e-78d5-abbdc31f9ea7-2bfcb1f3, #w-node-_8d82825a-c308-a432-c178-2dcf5bbc23f2-2bfcb1f3, #w-node-_8d82825a-c308-a432-c178-2dcf5bbc23fb-2bfcb1f3, #w-node-a042b058-e289-3eba-97d6-85e1b6b47678-2bfcb1f3, #w-node-a042b058-e289-3eba-97d6-85e1b6b4767d-2bfcb1f3, #w-node-_86b259f4-dbbf-3212-ac3a-6a325ab5c63f-2bfcb1f3, #w-node-ee74bd4e-7ca8-44b1-e3f2-4404833b2c67-2bfcb1f3, #w-node-_821e159e-b228-5386-dfd2-dec034bb15fa-2bfcb1f3, #w-node-_12f27216-6168-4a42-4324-466e51bcd118-2bfcb1f3, #w-node-_812f61ab-acfe-fbd3-5edb-6ecc4933fdbf-2bfcb1f3, #w-node-_8a993e74-b312-208c-d095-6cdbf680b05e-2bfcb1f3, #w-node-a4746cf0-bdd3-5ee0-f69a-a34723d0a0b0-2bfcb1f3, #w-node-_0e55843c-272e-f207-a652-43b7c5864a25-2bfcb1f3, #w-node-a1a8ba16-91b5-ff0a-29a4-8f05e7b4cbb2-2bfcb1f3, #w-node-_4cce65c9-d081-3c66-044d-5192d35de9ff-2bfcb1f3, #w-node-d910e77d-27d1-6e5d-21ba-8e81dd43b99d-2bfcb1f3, #w-node-c7f5e819-3189-a8ab-aa46-19886a7a9c8e-2bfcb1f3, #w-node-cd5f7cdc-cf0d-5a98-be3a-909f506698ea-2bfcb1f3 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_88a3d326-7059-b5c7-14ee-fb128adfd1ee-2bfcb1f3, #w-node-d9f7a790-421f-83b1-809a-9a31b9ace752-2bfcb1f3, #w-node-_7f2712b5-a9b5-19b2-9c88-21c690a8aeb2-2bfcb1f3, #w-node-_8adb89bf-02ff-24cf-3132-c94f90fb46ee-2bfcb1f3 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  align-self: center;
}

#w-node-_51109713-12b2-fec5-908d-61afc73a56ca-2bfcb1f3, #w-node-c3c7ca49-a28c-a490-7f55-a001112f12fe-2bfcb1f3 {
  justify-self: center;
}

#w-node-_34c10c38-0ade-8993-5d22-a77500217f2a-2bfcb1f3, #w-node-b4d966b7-26b8-f657-9a41-424432dd6685-2bfcb1f3, #w-node-_4d0280df-dc21-327d-fbfb-7c35b41cabec-2bfcb1f3, #w-node-f93ae928-4134-5c09-2d4f-47d3ee689f65-7a1a9c9c, #w-node-_25889a96-0f45-39ee-9787-18835f334edb-7a1a9c9c, #w-node-_5e5e3d97-68a0-66a3-45e8-9a1e1e400aa4-7a1a9c9c, #w-node-_5e5e3d97-68a0-66a3-45e8-9a1e1e400aa5-7a1a9c9c, #w-node-_205ad70d-5f1d-0233-87e4-c39b8d4033fc-7a1a9c9c, #w-node-_8d34e2c6-0d08-482f-4991-059d123b9d31-ce0f37d5, #w-node-_2bcbe12b-13e6-6d9c-e81e-c99c612c7c9f-ce0f37d5, #w-node-_2bcbe12b-13e6-6d9c-e81e-c99c612c7ca1-ce0f37d5, #w-node-_2bcbe12b-13e6-6d9c-e81e-c99c612c7ca5-ce0f37d5, #w-node-_2bcbe12b-13e6-6d9c-e81e-c99c612c7ca8-ce0f37d5, #w-node-_753e970b-dd12-e5cf-485f-659599f876cd-ce0f37d5, #w-node-_0c4065e7-ec29-f5ff-b718-90731c7d1698-ce0f37d5, #w-node-_2bcbe12b-13e6-6d9c-e81e-c99c612c7cf6-ce0f37d5, #w-node-_2bcbe12b-13e6-6d9c-e81e-c99c612c7cfa-ce0f37d5, #w-node-_2bcbe12b-13e6-6d9c-e81e-c99c612c7d04-ce0f37d5, #Method-2.w-node-e31ab235-d8af-4efe-25a2-6298a2f84d02-ce0f37d5, #w-node-defda826-3b6b-56fe-071c-3f97181db7e8-9fb0b28b, #w-node-defda826-3b6b-56fe-071c-3f97181db7e9-9fb0b28b, #w-node-defda826-3b6b-56fe-071c-3f97181db7fb-9fb0b28b, #w-node-defda826-3b6b-56fe-071c-3f97181db7fc-9fb0b28b, #w-node-_328634c4-ad23-509c-a442-c1e411a4d13b-9fb0b28b {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-effcff1c-e97d-4c6d-0abf-c5a8f07283af-557a5e10 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-effcff1c-e97d-4c6d-0abf-c5a8f07283b5-557a5e10, #w-node-effcff1c-e97d-4c6d-0abf-c5a8f07283b6-557a5e10, #w-node-effcff1c-e97d-4c6d-0abf-c5a8f07283c8-557a5e10, #w-node-effcff1c-e97d-4c6d-0abf-c5a8f07283c9-557a5e10 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-a734b8ce-1433-17ab-c968-685d78bdb49c-557a5e10 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-a734b8ce-1433-17ab-c968-685d78bdb49f-557a5e10, #w-node-a734b8ce-1433-17ab-c968-685d78bdb4a0-557a5e10, #w-node-a734b8ce-1433-17ab-c968-685d78bdb4ac-557a5e10, #w-node-a734b8ce-1433-17ab-c968-685d78bdb4ad-557a5e10, #w-node-_9db81378-2601-0792-51b4-9e9a3e87f08a-557a5e10, #w-node-d31a0122-0602-e507-717e-825f8a6c5636-557a5e10, #w-node-_1ca0093e-3842-7c35-6631-9f734fc46760-557a5e10, #w-node-ac6fb924-9fb0-1dd2-c865-acb359f742ed-557a5e10, #w-node-_7fe24945-94e4-dd83-a12c-9091383c5cd9-557a5e10, #w-node-eb095515-ac21-14f5-fb55-d513361f78ec-557a5e10, #w-node-eb095515-ac21-14f5-fb55-d513361f78ef-557a5e10, #w-node-eb095515-ac21-14f5-fb55-d513361f78f2-557a5e10, #w-node-eb095515-ac21-14f5-fb55-d513361f78f5-557a5e10, #w-node-eb095515-ac21-14f5-fb55-d513361f78f8-557a5e10, #w-node-eb5b64a4-62d8-ca82-8270-e0fc0a281cf8-557a5e10, #w-node-eb5b64a4-62d8-ca82-8270-e0fc0a281cfb-557a5e10, #w-node-eb5b64a4-62d8-ca82-8270-e0fc0a281cfe-557a5e10, #w-node-eb5b64a4-62d8-ca82-8270-e0fc0a281d01-557a5e10, #w-node-eb5b64a4-62d8-ca82-8270-e0fc0a281d04-557a5e10, #w-node-_9904f54c-19ca-403a-9b09-439a1d0106b5-557a5e10, #w-node-e670edb1-cd3e-8ced-19fe-31eb7d97e65e-557a5e10, #w-node-f958cfe5-3ed1-720b-515d-f720ef8cb1a9-557a5e10, #w-node-_121cca19-1cad-0a3b-251e-fd870598af4c-557a5e10, #w-node-_94edad1e-acf5-5708-b990-2741c91c76c5-557a5e10, #w-node-_4c5c97cb-31ec-b6e8-f9d1-c84ecd9d72fa-823b7529, #w-node-_300ba449-9c18-9af4-60b5-5ad3208bdee4-823b7529, #w-node-_729067fa-695c-3f8b-5fcd-7976fa31b018-823b7529, #w-node-_62b3bd56-99e1-fb9c-f5f3-21f2d7ce836b-823b7529, #w-node-_36476385-dd56-5037-ce8a-a02b67afc0e5-823b7529, #w-node-_3613680e-a6b6-d928-2524-845e8e44e778-4f9dcf1a {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_2a9c5c6d-daad-04c9-93d2-d7af684de4d8-4f9dcf1a {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-f93ae928-4134-5c09-2d4f-47d3ee689f65-4f9dcf1a, #w-node-_25889a96-0f45-39ee-9787-18835f334edb-4f9dcf1a, #w-node-_5e5e3d97-68a0-66a3-45e8-9a1e1e400aa4-4f9dcf1a, #w-node-_5e5e3d97-68a0-66a3-45e8-9a1e1e400aa5-4f9dcf1a, #w-node-e8059670-c633-8f14-b5ba-53e9f2902e6e-4f9dcf1a, #w-node-e8059670-c633-8f14-b5ba-53e9f2902e71-4f9dcf1a, #w-node-e8059670-c633-8f14-b5ba-53e9f2902e77-4f9dcf1a, #Select-field.w-node-e8059670-c633-8f14-b5ba-53e9f2902e78-4f9dcf1a, #w-node-e8059670-c633-8f14-b5ba-53e9f2902e75-4f9dcf1a, #Field-5.w-node-e8059670-c633-8f14-b5ba-53e9f2902e76-4f9dcf1a, #w-node-e8059670-c633-8f14-b5ba-53e9f2902e79-4f9dcf1a, #w-node-_71287303-74b1-01ad-1491-7d2cbe970829-4f9dcf1a, #w-node-_750882a3-f8e3-7575-d026-ebc136a6f42d-4f9dcf1a, #w-node-bdbe6143-0200-287d-fe40-82f28ef7f694-4f9dcf1a, #w-node-bdbe6143-0200-287d-fe40-82f28ef7f698-4f9dcf1a, #w-node-bdbe6143-0200-287d-fe40-82f28ef7f6a2-4f9dcf1a, #Method-2.w-node-_72ac785c-febc-8f90-3164-9979e7e33d37-4f9dcf1a, #Select-field-2.w-node-_8a26ccae-99c3-5dc4-eab6-40332de3bcaa-4f9dcf1a, #w-node-_5d05e851-8d68-fca8-0f80-ec9b11d99c61-4efeb382, #w-node-_300ba449-9c18-9af4-60b5-5ad3208bdee4-4efeb382, #w-node-_729067fa-695c-3f8b-5fcd-7976fa31b018-4efeb382, #w-node-_62b3bd56-99e1-fb9c-f5f3-21f2d7ce836b-4efeb382, #w-node-_36476385-dd56-5037-ce8a-a02b67afc0e5-4efeb382, #w-node-_5d05e851-8d68-fca8-0f80-ec9b11d99c61-76d838ee, #w-node-_4c5c97cb-31ec-b6e8-f9d1-c84ecd9d72fa-76d838ee, #w-node-cc6eefbb-bc19-1f61-4881-2b70b33acdb8-76d838ee, #w-node-_01b3a9a1-d585-9c36-d0e4-1777212b970c-76d838ee, #w-node-_3b586ea5-c32b-cb2b-e6bd-e651a4c76e8f-76d838ee, #w-node-_3b586ea5-c32b-cb2b-e6bd-e651a4c76e93-76d838ee, #w-node-_3b586ea5-c32b-cb2b-e6bd-e651a4c76e9d-76d838ee {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_09e5d10c-8641-5763-615b-4eeca9fcd807-6988f081 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_09e5d10c-8641-5763-615b-4eeca9fcd80a-6988f081, #w-node-_09e5d10c-8641-5763-615b-4eeca9fcd80b-6988f081, #w-node-_09e5d10c-8641-5763-615b-4eeca9fcd817-6988f081, #w-node-_349fcd7f-753d-42b3-bbb5-2ba1ea8fdcfc-c3943043, #w-node-_349fcd7f-753d-42b3-bbb5-2ba1ea8fdd00-c3943043, #w-node-_349fcd7f-753d-42b3-bbb5-2ba1ea8fdd0a-c3943043, #w-node-_6bb76a1f-d74f-ef0e-0cd8-b26e22a9b2f1-b5d72bdb, #w-node-_09e5d10c-8641-5763-615b-4eeca9fcd80a-efdcffa1, #w-node-_09e5d10c-8641-5763-615b-4eeca9fcd817-efdcffa1, #w-node-_8d34e2c6-0d08-482f-4991-059d123b9d31-e447cfaa, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-e447cfaa, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-e447cfaa, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f21-e447cfaa, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f25-e447cfaa, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f2f-e447cfaa, #w-node-_5d05e851-8d68-fca8-0f80-ec9b11d99c61-b0a69a00, #w-node-_300ba449-9c18-9af4-60b5-5ad3208bdee4-b0a69a00, #w-node-_729067fa-695c-3f8b-5fcd-7976fa31b018-b0a69a00, #w-node-_62b3bd56-99e1-fb9c-f5f3-21f2d7ce836b-b0a69a00, #w-node-_36476385-dd56-5037-ce8a-a02b67afc0e5-b0a69a00, #w-node-_62c52927-f4c3-f57b-4944-e01061d06de8-c51f8c23, #w-node-d6fd08e6-19ef-5c37-3f4b-18a609689880-c51f8c23, #w-node-bfb48b6e-29f7-3f9d-e2fd-107128055a05-c51f8c23, #w-node-f2df9350-cc7b-f97a-d29a-d1f707512d02-ada9fdf2, #w-node-f2df9350-cc7b-f97a-d29a-d1f707512d0d-ada9fdf2 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_6c5d4ebe-9db8-905e-4003-e1f0db9dce82-fcd66546 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_8d34e2c6-0d08-482f-4991-059d123b9d31-b3ed3ba1, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-b3ed3ba1, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-b3ed3ba1, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f21-b3ed3ba1, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f25-b3ed3ba1, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f2f-b3ed3ba1, #w-node-_8d34e2c6-0d08-482f-4991-059d123b9d31-a3ed0f22, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-a3ed0f22, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-a3ed0f22, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f21-a3ed0f22, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f25-a3ed0f22, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f2f-a3ed0f22, #w-node-_8d34e2c6-0d08-482f-4991-059d123b9d31-40a2ae40, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-40a2ae40, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-40a2ae40, #w-node-_8d34e2c6-0d08-482f-4991-059d123b9d31-e5699ecd, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-e5699ecd, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-e5699ecd, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f21-e5699ecd, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f25-e5699ecd, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5f2f-e5699ecd, #w-node-_8d34e2c6-0d08-482f-4991-059d123b9d31-15287589, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-15287589, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-15287589, #w-node-dae483a3-4872-65d9-bee0-1944a9cb174e-93077c1f, #w-node-dae483a3-4872-65d9-bee0-1944a9cb1752-93077c1f, #w-node-dae483a3-4872-65d9-bee0-1944a9cb175c-93077c1f {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

@media screen and (max-width: 991px) {
  #w-node-f2a4c619-0122-1495-fc50-c19e6a5afbc6-2bfcb1f3 {
    align-self: start;
  }

  #w-node-ae31c6c9-717b-f172-d2bd-b50cb02fa9ce-2bfcb1f3 {
    order: 9999;
    place-self: start center;
  }

  #w-node-_9dbd2b9b-1cdf-2848-71e1-cb86e72fc3a6-7a1a9c9c {
    grid-area: span 1 / span 3 / span 1 / span 3;
  }

  #w-node-_00ab8360-4061-f77a-0c36-55e730f8acf6-7a1a9c9c {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_951b0df9-cdfd-224f-6151-40e790991368-7a1a9c9c, #w-node-a75c3edf-447b-fe64-4510-fd94b174ceba-7a1a9c9c {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }

  #w-node-_18242b36-e53a-c4aa-c061-701c090be49d-7a1a9c9c {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-afa80885-7100-3c79-dad3-b04e898d373e-7a1a9c9c {
    grid-area: span 1 / span 3 / span 1 / span 3;
  }

  #w-node-afa80885-7100-3c79-dad3-b04e898d3742-7a1a9c9c {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-afa80885-7100-3c79-dad3-b04e898d3746-7a1a9c9c, #w-node-afa80885-7100-3c79-dad3-b04e898d374b-7a1a9c9c {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }

  #w-node-afa80885-7100-3c79-dad3-b04e898d374f-7a1a9c9c {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-d90a485f-ae79-3167-9178-765439130eed-9fb0b28b {
    grid-area: span 1 / span 3 / span 1 / span 3;
  }

  #w-node-d90a485f-ae79-3167-9178-765439130ef1-9fb0b28b {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-d90a485f-ae79-3167-9178-765439130ef5-9fb0b28b, #w-node-d90a485f-ae79-3167-9178-765439130efa-9fb0b28b {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }

  #w-node-d90a485f-ae79-3167-9178-765439130efe-9fb0b28b {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_535cd1db-f47d-49a3-7c9d-6870e13cb957-9fb0b28b {
    grid-area: span 1 / span 3 / span 1 / span 3;
  }

  #w-node-_535cd1db-f47d-49a3-7c9d-6870e13cb95b-9fb0b28b {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_535cd1db-f47d-49a3-7c9d-6870e13cb95f-9fb0b28b, #w-node-_535cd1db-f47d-49a3-7c9d-6870e13cb964-9fb0b28b {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }

  #w-node-_535cd1db-f47d-49a3-7c9d-6870e13cb968-9fb0b28b, #email-4.w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec0-e447cfaa, #w-node-_6c5d4ebe-9db8-905e-4003-e1f0db9dce25-fcd66546, #w-node-_6c5d4ebe-9db8-905e-4003-e1f0db9dce36-fcd66546, #w-node-_6c5d4ebe-9db8-905e-4003-e1f0db9dce67-fcd66546 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_6c5d4ebe-9db8-905e-4003-e1f0db9dce75-fcd66546 {
    grid-area: span 2 / span 1 / span 2 / span 1;
  }

  #w-node-_6c5d4ebe-9db8-905e-4003-e1f0db9dce82-fcd66546, #email-4.w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec0-a3ed0f22, #email-4.w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec0-40a2ae40, #email-4.w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec0-e5699ecd, #email-4.w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec0-15287589 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }
}

@media screen and (max-width: 767px) {
  #w-node-c31a1d07-83cb-13cb-1967-ec40ba63d26b-2bfcb1f3, #w-node-_0cfadb33-708c-31fd-9f40-b25edbe5c72b-2bfcb1f3 {
    justify-self: center;
  }

  #w-node-_2bcbe12b-13e6-6d9c-e81e-c99c612c7ca8-ce0f37d5, #w-node-_6bb76a1f-d74f-ef0e-0cd8-b26e22a9b0d2-b5d72bdb, #w-node-_09e5d10c-8641-5763-615b-4eeca9fcd80a-efdcffa1, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-e447cfaa, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-e447cfaa, #w-node-_6c5d4ebe-9db8-905e-4003-e1f0db9dce25-fcd66546, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-b3ed3ba1, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-b3ed3ba1, #w-node-_18a9b9ba-54f3-34b3-3a6b-5dcc5a56887a-4f7e1150, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-a3ed0f22, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-a3ed0f22, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-40a2ae40, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-40a2ae40, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-e5699ecd, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-e5699ecd, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec3-15287589, #w-node-_0ede653b-c04e-82d4-6b19-eaf114aa5ec7-15287589 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }
}

@media screen and (max-width: 479px) {
  #w-node-_86b259f4-dbbf-3212-ac3a-6a325ab5c63f-2bfcb1f3, #w-node-_958f6980-19be-db23-ce82-aa65775f72d7-2bfcb1f3 {
    grid-area: span 1 / span 2 / span 1 / span 2;
    justify-self: center;
  }

  #w-node-_6ebd88ff-01dd-cda1-cec5-f66f5f3c61fc-efdcffa1, #w-node-_3a72cd7f-b2b0-4094-e3c6-ed5e090dad7b-b0a69a00, #w-node-_13b6e54e-209e-a168-b79a-b95e4f26fdea-b0a69a00, #w-node-a8c6cec5-4509-8d69-bb37-f52408a48c1f-fcd46d9b {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }
}


@font-face {
  font-family: 'Ppagrandir';
  src: url('../fonts/PPAgrandir-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Ppagrandir';
  src: url('../fonts/PPAgrandir-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}