.coupon-error {
  color: red
}

.creditelm .coupon-error:empty {
  display: none
}

a.zgh-signup {
  display: none !important
}

.signup-box {
  max-width: 450px
}

.prodect-logo .zwc-wallet-logo {
  max-width: 150px;
}

.creditelm {
  display: none !important;
  max-width: 450px;
  margin: 0 auto;
  width: 100%;
  border-radius: 8px;
  border: 1px solid #d7d7d7;
  background: #FFF;
  padding: 15px 15px 40px
}

.zw-credits {
  border-radius: 8px;
  background: #ededff;
  padding: 15px 24px
}

.zw-credits p {
  color: #1836cc;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.4px;
  margin: 0;
  font-family: var(--primaryfont-semibold)
}

.zw-cdt-wrap {
  padding: 0 25px
}

.body-umain .zwt-form-wrap {
  display: none
}

.zwt-form-wrap {
  border-radius: 8px;
  border: 1px solid #d7d7d7;
  background: #FFF;
  padding: 25px 40px
}

.zwt-form-wrap p {
  font-size: 20px;
  letter-spacing: -0.4px;
  line-height: 28px;
  font-family: var(--zf-primary-semibold);
  margin: 0
}

.menu-icon-help-header {
  display: none
}

li.zdomain span a,
li.zdcdomain p span {
  display: none
}

.menu-icon-help-header .product-title a {
  float: left;
  font-size: 21px;
  color: #000;
  font-family: var(--zf-primary-semibold);
  line-height: 20px;
  padding: 9px 0 12px
}


.request-drop-wrap,
section#block-panels-mini-product-menu {
  display: none
}

.zbanner,
.pro-list,
.ztypes {
  position: relative;
  margin: 20px auto 0;
  border-radius: 20px;
  width: 98%
}

.zbanner {
  background: #f5fffe
}

.zbanner::before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  background: url(/sites/zweb/images/wallet/zwt-header-bg.png) no-repeat;
  background-size: cover;
  z-index: 0;
  border-radius: 20px
}

.zbanner .zw-desk-img {
  vertical-align: bottom;
  position: relative;
  padding-top: 70px;
  margin-left: -65px
}

.cont-wrap h1 {
  font-size: 72px;
  font-family: var(--primaryfont-semibold);
  margin-bottom: 20px;
  letter-spacing: -1.44px;
  line-height: 80px
}

.cont-form-wrap .cont-wrap p {
  max-width: 610px
}

.cont-form-wrap .cont-wrap p.ban-txt {
  max-width: 530px
}

.cont-form-wrap .cont-wrap p span {
  font-family: var(--primaryfont-bold)
}

.wallet-wrap {
  width: 100%;
  max-width: 460px;
}

.credits-wrap {
  padding: 6px;
  border-radius: 12px;
  background: #FFF;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
  text-align: center;
  display: none;
  width: 100%;
  max-width: 410px;
  margin: auto;
}

.credits-cont {
  border-radius: 8px;
  background: linear-gradient(115deg, #158DE4 15.61%, #1E4AE7 93.45%);
  padding: 40px;
}

.credits-cont p {
  color: #FFF;
  font-size: 20px;
  letter-spacing: -0.32px;
  margin: 0;
}

.credits-cont span {
  display: inline-block;
  position: relative;
  color: #fff;
}

.credits-cont .cup-val {
  font-family: var(--primaryfont-bold);
  font-size: 60px;
  letter-spacing: -2.24px;
  /* visibility: hidden; */
}

.credits-cont .zwc-crcy {
  top: -25px;
  font-size: 28px;
  padding-right: 5px;
  font-family: var(--primaryfont-bold);
}

.expiry-cont {
  padding: 30px 0;
}

.expiry-cont p {
  color: #666;
  font-size: 18px;
  letter-spacing: -0.288px;
}

.expiry-cont p .cup-dat {
  color: #000;
}


.zwc-wlt-btn {
  border-radius: 4px;
  background: #DE5547;
  padding: 16px 24px;
  color: #fff;
  display: inline-block;
  font-family: var(--zf-primary-semibold);
  margin: 0;
  border: 1px solid transparent;
  cursor: pointer;
  z-index: 1;
  font-size: 15px;
  text-transform: uppercase;
  position: relative;
  text-align: center;
}

.zreach p {
  font-size: 18px;
  padding: 70px 0 0;
  letter-spacing: -0.288px;
  text-align: center;
  max-width: 420px;
  margin: auto;
}

.zreach span a {
  border-bottom: 1px solid #0A80FD;
  /* display: inline-block; */
  color: #0A80FD;
  font-size: 18px;
  letter-spacing: -0.288px;
}

.zreach {
  display: none;
}

.body-umain .credits-wrap,
.body-umain .zreach {
  display: block;
}


.prodect-logo {
  margin-bottom: 20px
}

.prodect-logo h3 {
  font-size: 30px;
  color: #000;
  margin-bottom: 0
}

.zboudle-wrap {
  padding: 120px 0
}

.cont-form-wrap {
  justify-content: space-between;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.non-umain .cont-form-wrap {
  align-items: flex-start;
}

div.ztilte h2 {
  font-size: 48px;
  line-height: 56px;
  letter-spacing: -0.96px;
  font-family: var(--primaryfont-semibold);
  max-width: 1000px
}

.lang-ar div.ztilte h2 {
  text-align: right;
  padding-right: 0;
  padding-left: 90px
}

.content-wrap>div.zboudle {
  padding: 60px 0 0
}

.zboudle ul {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 60px;
  flex-wrap: wrap
}

.zboudle ul li {
  width: 100%;
  max-width: 200px
}

.lang-ar .zboudle ul li {
  text-align: right;
  padding-right: 0
}

.zboudle ul li:last-child {
  margin-right: 0
}

.zboudle ul li h4 {
  margin-bottom: 10px;
  font-family: var(--primaryfont-semibold)
}

.zboudle ul li span {
  background: var(--product-icons) no-repeat;
  background-size: var(--zp-i-bs);
  width: var(--zp-i-w);
  height: var(--zp-i-h);
  display: block;
  margin-bottom: 20px;
  transform: scale(1.6) translateX(6px)
}

.i18n-ar .zboudle ul li span {
  transform: scale(1.5) translateX(-5px)
}

.zboudle span.crmplus {
  background-position: var(--zp-crmplus-bp)
}

.zboudle span.workplace {
  background-position: var(--zp-workplace-bp)
}

.zboudle span.fplus {
  background-position: var(--zp-fplus-bp)
}

.zboudle span.pplus {
  background-position: var(--zp-pplus-bp)
}

.zboudle span.mplus {
  background-position: var(--zp-mplus-bp)
}

.zboudle ul li p {
  margin: 0 0 10px
}

.zboudle ul li a,
.pro-desc li a {
  border-bottom: 1px solid;
  font-size: 16px;
  color: #0047ff;
  font-family: var(--zf-primary-semibold)
}

.pro-list {
  background-color: #ffd99e;
  padding: 100px 0
}

.quote-txt {
  width: 100%;
  max-width: 620px;
  font-size: 24px;
  margin-bottom: 10px;
  font-family: var(--zf-secondary-medium);
  text-align: center;
  margin: 0 auto 170px
}

.pro-list h2 {
  font-size: 48px;
  max-width: 900px;
  font-family: var(--zf-primary-semibold);
  line-height: 56px;
  letter-spacing: -0.96px
}

.lang-ar .pro-list h2 {
  text-align: right
}

.pro-desc {
  margin-top: 80px;
  display: flex;
  flex-wrap: wrap;
  gap: 62px
}

.pro-desc li {
  width: 30%;
  position: relative;
  padding-left: 100px
}

.pro-desc li h5 {
  font-size: 24px;
  margin-bottom: 7px;
  line-height: 32px;
  letter-spacing: -0.48px;
  font-family: var(--primaryfont-semibold)
}

.pro-desc li p {
  margin-bottom: 5px;
  max-width: 248px;
  font-size: 16px
}

.pro-desc li::before {
  content: '';
  width: 76px;
  height: 76px;
  position: absolute;
  background: #fff;
  border-radius: 8px;
  left: 0
}

.pro-desc li::after {
  content: '';
  background: var(--product-icons) no-repeat;
  background-size: var(--zp-i-bs);
  width: var(--zp-i-w);
  height: var(--zp-i-h);
  position: absolute;
  left: 18px;
  top: 18px
}

.pro-desc li.crm::after {
  background-position: var(--zp-crm-bp)
}

.pro-desc li.marketinghub::after {
  background-position: var(--zp-marketingautomation-bp)
}

.pro-desc li.desk::after {
  background-position: var(--zp-desk-bp)
}

.pro-desc li.project::after {
  background-position: var(--zp-projects-bp)
}

.pro-desc li.analytics::after {
  background-position: var(--zp-analytics-bp)
}

.pro-desc li.books::after {
  background-position: var(--zp-books-bp)
}

.pro-desc li.recruit::after {
  background-position: var(--zp-recruit-bp)
}

.pro-desc li.mail::after {
  background-position: var(--zp-mail-bp)
}

.pro-desc li.workdrive::after {
  background-position: var(--zp-workdrive-bp)
}

.pro-desc li.creator::after {
  background-position: var(--zp-creator-bp)
}


.lang-ar .cont-form-wrap .form-wrap {
  text-align: center
}

.lang-ar .cont-form-wrap .form-wrap iframe {
  float: left
}

.body-umain .cont-form-wrap iframe {
  height: 380px
}

.cont-form-wrap .cont-wrap {
  width: 54%
}

.prodect-logo>a {
  display: inline-block;
  margin-right: 15px
}

.prodect-logo a span {
  color: #000;
  font-size: 22px;
  line-height: 0;
  vertical-align: middle
}

.zsection.zbanner .content-wrap {
  padding: 70px 0 0
}

.zbanner .content-wrap>picture {
  display: block
}

.zbanner .content-wrap>picture img {
  width: 100%;
  max-width: 100%;
  position: relative;
  margin: 0 auto 0;
  bottom: -24px
}

.ztypes {
  background: #272628;
  color: #fff;
  z-index: 1;
  padding: 140px 0 150px
}

.ztype-wrap {
  padding-bottom: 100px
}

.flex-wrap {
  display: flex;
  justify-content: flex-start;
  padding-top: 60px;
  gap: 150px
}

.ztype-wrap>div {
  display: inline-block;
  width: 31.5%;
  margin-right: 2.3%;
  padding: 55px 18px 30px 17px;
  box-sizing: border-box;
  vertical-align: top;
  border: 2px dashed #fff;
  position: relative;
  transition: all .9s ease;
  transform: translateY(60px)
}

.ztype-wrap h3 {
  line-height: 1.1;
  margin-bottom: 100px;
  position: relative
}

.zstepup-wrap h3 {
  margin: 0 auto 30px;
  max-width: 750px;
  font-size: 40px;
  letter-spacing: -0.8px;
  line-height: 48px;
  font-family: var(--primaryfont-semibold)
}

.lang-ar .zstepup-wrap h3,
.lang-ar .zstepup-wrap p {
  text-align: center
}

.zstepup-wrap {
  max-width: 560px;
  margin: 30px auto 0;
  text-align: center
}

.zstepup-wrap p {
  font-size: 20px;
  margin: 0
}

.ztype-wrap h3:after {
  content: "";
  position: absolute;
  bottom: -40px;
  width: 50px;
  height: 4px;
  left: 0
}

.ztype-wrap>div:nth-child(1) {
  background: #277cb4;
  background: -moz-linear-gradient(-45deg, #277cb4 0, #2a98e0 100%);
  background: -webkit-linear-gradient(-45deg, #277cb4 0, #2a98e0 100%);
  background: linear-gradient(135deg, #277cb4 0, #2a98e0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#277cb4', endColorstr='#2a98e0', GradientType=1);
  border: 2px dashed #71bff1
}

.ztype-wrap>div:nth-child(2) {
  background: #26bc65;
  background: -moz-linear-gradient(top, #26bc65 0, #178947 99%);
  background: -webkit-linear-gradient(top, #26bc65 0, #178947 99%);
  background: linear-gradient(to bottom, #26bc65 0, #178947 99%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#26bc65', endColorstr='#178947', GradientType=0);
  border: 2px dashed #6ee09d
}

.ztype-wrap>div:nth-child(3) {
  background: #d62d2d;
  background: -moz-linear-gradient(-45deg, #d62d2d 0, #e24f4f 100%);
  background: -webkit-linear-gradient(-45deg, #d62d2d 0, #e24f4f 100%);
  background: linear-gradient(135deg, #d62d2d 0, #e24f4f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d62d2d', endColorstr='#e24f4f', GradientType=1);
  border: 2px dashed #f38181
}

.ztype-wrap>div:nth-child(1) h3:after {
  background: #0d6096
}

.ztype-wrap>div:nth-child(2) h3:after {
  background: #0b8e42
}

.ztype-wrap>div:nth-child(3) h3:after {
  background: #bc1d1d
}

.ztype-wrap>div:last-child {
  margin-right: 0
}

.zfaq h3 {
  margin-bottom: 30px;
  padding: 0 10px;
  font-size: 27px;
  font-family: var(--primaryfont-semibold)
}

.zfaq .content-wrap {
  max-width: 900px;
  padding: 100px 0
}

.zfaq h3 span {
  position: absolute;
  right: 0
}

.faq-content ul {
  margin: 0 0 30px
}

.faq-content .item-list>ul>li {
  position: relative;
  padding: 0;
  background: #fff;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.06)
}

.item-list ul li {
  margin-bottom: 12px;
  position: relative;
  background: #fafafa;
  border: 1px solid #f3f3f3;
  padding-right: 20px
}

.item-list .field-faq-question {
  font-size: 22px;
  cursor: pointer;
  margin-bottom: 0;
  display: inline-block;
  vertical-align: text-top;
  width: 100%;
  padding: 20px 35px 20px 25px;
  position: relative;
  z-index: 1;
  word-break: break-word
}

.item-list .field-faq-answer {
  display: none;
  margin-bottom: 0;
  padding: 0 25px 15px
}

.closed .vertical {
  transition: all .5s ease-in-out;
  transform: rotate(-90deg)
}

.closed .horizontal {
  transition: all .5s ease-in-out;
  transform: rotate(-90deg);
  opacity: 1
}

.opened {
  opacity: 1
}

.opened .vertical {
  transition: all .5s ease-in-out;
  transform: rotate(90deg)
}

.opened .horizontal {
  transition: all .5s ease-in-out;
  transform: rotate(90deg);
  opacity: 0
}

.circle-plus {
  position: absolute;
  right: 40px;
  top: 45px
}

.circle-plus .circle {
  position: relative
}

.lang-ar .circle-plus {
  position: absolute;
  left: 30px;
  margin-top: 6px
}

.circle-plus .circle .horizontal {
  position: absolute;
  background-color: #000;
  width: 10px;
  height: 2px;
  left: 50%;
  margin-left: -6.5px;
  top: 50%;
  margin-top: -11.2px
}

.lang-ar .circle-plus .circle .horizontal {
  left: 2%
}

.circle-plus .circle .vertical {
  position: absolute;
  background-color: #000;
  width: 2px;
  height: 10px;
  left: 50%;
  margin-left: -2.5px;
  margin-top: -15px
}

.lang-ar .circle-plus .circle .vertical {
  left: 2%
}

[class|="zicon"] {
  background: url(/sites/zweb/images/wallet/zwallet-sprite.png) no-repeat 0 0;
  background-size: 120px auto;
  display: inline-block
}

.zicon-one {
  background-position: 0 0;
  width: 25px;
  height: 26px;
  position: absolute;
  top: -14px;
  transform: rotate(90deg);
  left: 40px
}

.zicon-two {
  background-position: -25px 0;
  width: 26px;
  height: 26px;
  position: absolute;
  bottom: -14px;
  transform: rotate(90deg);
  right: 80px
}

.zicon-three {
  background-position: -51px 0;
  width: 25px;
  height: 26px;
  position: absolute;
  top: 33%;
  right: -14px
}

.zicon-faq {
  background-position: -76px 0;
  width: 44px;
  height: 35px
}


.zp-redeem {
  max-width: 400px;
  width: 100%
}

.zp-redeem ul {
  margin-top: -45px
}

.zp-redeem p.zw-terms {
  font-size: 12px;
  letter-spacing: -0.24px;
  opacity: .9;
  position: relative;
  padding-left: 25px;
  margin: 20px 0
}

.zw-termlink {
  color: #fff;
  text-decoration: underline
}

.zp-redeem p.zw-terms::before {
  content: '';
  width: 4px;
  height: 4px;
  position: absolute;
  left: 10px;
  top: 6px;
  background: #fff;
  border-radius: 50%
}

.head-cont h3 {
  letter-spacing: -1.28px;
  line-height: 78px;
  font-size: 64px;
  font-family: var(--primaryfont-semibold);
  margin: 0
}

.head-cont h3 span {
  display: block
}

.zp-redeem ul li {
  min-width: 400px;
  padding: 10px 30px;
  position: relative;
  transition: .7s ease all;
  border-radius: 10px
}

.zp-redeem ul li.cdts-red::before {
  content: '';
  position: absolute;
  top: -1px;
  z-index: 12;
  border-radius: 100px 100px 0 0;
  transform: rotate(180deg);
  right: 0;
  left: 0;
  margin: auto;
  margin-left: auto;
  margin-right: auto;
  width: 50px;
  height: 20px;
  background-color: #f9b21d
}

.zp-redeem ul li p {
  font-size: 16px;
  margin: 0;
  font-family: var(--primaryfont-semibold)
}

.zp-redeem ul li h4 {
  font-size: 24px;
  letter-spacing: -0.48px;
  line-height: 32px;
  font-family: var(--primaryfont-semibold);
  margin-bottom: 30px
}

.zp-redeem ul li .zlogo {
  text-align: right
}

.zp-redeem ul li.chld-item {
  height: 65px
}

.zp-redeem ul li.cdts-red {
  background: #e02d27;
  padding: 40px 30px 25px;
  z-index: 4
}

.zp-redeem ul li.cdts-gre {
  background: #47ad38;
  transform: translateY(130px);
  z-index: 3
}

.zp-redeem ul li.cdts-blk {
  background: #f9b21d;
  transform: translateY(66px);
  z-index: 3
}

.zwe-op .zp-redeem ul li.cdts-blk {
  transition-delay: .2s;
  transform: translateY(20px)
}

.zwe-op .zp-redeem ul li.cdts-gre {
  transition-delay: .4s;
  transform: translateY(40px)
}

.zp-redeem ul li.cdts-blue {
  background: #226db4;
  transform: translateY(195px);
  z-index: 2
}

.zwe-op .zp-redeem ul li.cdts-blue {
  transition-delay: .6s;
  transform: translateY(60px)
}

.zp-redeem ul li.cdts-yell {
  background: #f9b21d;
  transform: translateY(260px);
  z-index: 1
}

.zwe-op .zp-redeem ul li.cdts-yell {
  transition-delay: .8s;
  transform: translateY(80px)
}

.zp-redeem ul li svg {
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  display: none
}

.zp-redeem ul li h4 span {
  display: block
}

.logins-info {
  max-width: 732px
}

.zwc-btn {
  padding: 13px 30px
}

.logins-info ul {
  position: relative
}

.lang-ar .logins-info ul {
  width: 100%
}

.logins-info li {
  margin-bottom: 55px;
  position: relative;
  padding-left: 100px
}

.logins-info li a {
  color: #fff;
  text-decoration: underline
}

.logins-info li::before,
.logins-info li::after {
  content: '';
  position: absolute
}

.logins-info li::before {
  width: 63px;
  height: 63px;
  left: 0;
  top: 6px;
  background: #fff;
  border-radius: 16px
}

.logins-info li::after {
  width: 30px;
  height: 30px;
  background: url(/sites/zweb/images/wallet/redeem-credits-steps.svg) no-repeat;
  left: 16px;
  top: 22px;
  z-index: 2
}

.logins-info li.z-log::after {
  background-position: 0 0
}

.logins-info li.z-crdt::after {
  background-position: -38px 0;
  width: 33px
}

.logins-info li.z-insights::after {
  background-position: -78px 0;
  width: 33px
}

.logins-info li.z-upgrade::after {
  background-position: -118px 0;
  width: 35px
}

.logins-info li.z-potential::after {
  background-position: 0 -34px;
  width: 35px
}

.logins-info span {
  position: absolute;
  left: 30px;
  top: 70px;
  border-left: 1px dashed #fff;
  height: 80%;
  border-width: 2px
}

.logins-info h4 {
  font-size: 24px;
  letter-spacing: -0.48px;
  line-height: 32px;
  font-family: var(--primaryfont-semibold);
  margin-bottom: 10px
}

.logins-info h6 {
  color: #10dffa;
  font-size: 16px;
  font-family: var(--primaryfont-semibold);
  margin-bottom: 7px;
  text-transform: uppercase
}


.lang-de .cont-wrap h1 {
  font-size: 50px;
  word-break: break-word
}

.lang-vi .cont-wrap h1 {
  font-size: 48px
}

.lang-ar .cont-form-wrap .form-wrap>div {
  margin: 0 auto
}

.i18n-ar .ztermslink .ztermln {
  text-align: center
}

.ztermslink {
  padding: 100px 0 0;
  text-align: center;
  max-width: 750px;
  margin: 0 auto
}

.ztermln {
  border-bottom: 1px solid #0047ff;
  color: #0047ff
}

.i18n-ar .item-list ul li {
  padding-left: 20px;
  padding-right: 0
}

.ztype-wrap>div:nth-child(1) {
  -webkit-transform: translateY(100px);
  -ms-transform: translateY(100px);
  transform: translateY(100px);
  -webkit-transition-delay: 0;
  -o-transition-delay: 0;
  transition-delay: 0
}

.ztype-wrap>div:nth-child(2) {
  -webkit-transform: translateY(200px);
  -ms-transform: translateY(200px);
  transform: translateY(200px);
  -webkit-transition-delay: .2s;
  -o-transition-delay: .2s;
  transition-delay: .2s
}

.ztype-wrap>div:nth-child(3) {
  -webkit-transform: translateY(300px);
  -ms-transform: translateY(300px);
  transform: translateY(300px);
  -webkit-transition-delay: .4s;
  -o-transition-delay: .4s;
  transition-delay: .4s
}

.animated .ztype-wrap>div {
  -webkit-transform: translateY(30px);
  -ms-transform: translateY(30px);
  transform: translateY(30px)
}

.zsocial-share {
  display: none
}

.creditelm #email {
  background: #ececec
}

.creditelm input {
  color: #000;
  padding: 14px 12px;
  border: 1px solid #d5d5d5;
  display: block;
  width: 100%;
  margin: 15px 0 0;
  font-size: 13px;
  background: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  position: relative;
  z-index: 1;
  transition: .5s ease;
  border-radius: 0
}

.creditelm .note {
  font-size: 11px;
  margin: 10px 0 10px;
  text-align: left;
  width: 100%;
  display: inline-block
}

.i18n-ar .creditelm .note {
  text-align: right
}

.creditelm .existingUser {
  font-size: 15px;
  height: 50px;
  padding: 0 30px;
  background: #f0483e;
  text-align: center;
  text-transform: uppercase;
  border: 0;
  color: #fff;
  width: 100%;
  cursor: pointer;
  font-weight: 600;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none
}

.i18n-ar .zfaq h3 span {
  left: 0;
  right: auto
}

.i18n-ar .ztermslink h4 {
  text-align: center
}

.i18n-ar .creditelm {
  float: left
}

.i18n-ar .pro-desc li h5 {
  padding-left: 20px;
  padding-right: 0
}

@media only screen and (max-width: 1440px) {
  .cont-wrap h1 {
      font-size: 56px;
      line-height: 68px
  }

  .zbanner .zw-desk-img {
      margin-left: 0
  }

  .ztypes {
      padding: 90px 0 100px
  }

  .head-cont h3 {
      line-height: 58px;
      font-size: 48px
  }

  .zstepup-wrap h3 {
      font-size: 36px
  }

  .zboudle-wrap,
  .pro-list {
      padding: 80px 0
  }

  .pro-desc {
      margin-top: 65px;
      gap: 50px
  }

  div.ztilte h2,
  .pro-list h2 {
      font-size: 38px;
      line-height: 48px;
      max-width: 755px
  }

  .cont-form-wrap .cont-wrap {
      width: 47%
  }

  .ztermslink {
      padding: 80px 0 0
  }

  .zfaq .content-wrap {
      padding: 80px 0
  }
}

@media only screen and (max-width: 1280px) {
  .flex-wrap {
      gap: 100px
  }
}

@media only screen and (max-width: 1199px) {

  .zbanner,
  .pro-list,
  .ztypes {
      max-width: 100%;
      margin: 0;
      border-radius: 0;
      width: 100%
  }

  .zbanner::before {
      border-radius: 0
  }

  .wallet-wrap {
      /* width: 45%; */
  }

  .cont-wrap h1 {
      font-size: 50px;
      line-height: 60px
  }

  .ztermslink {
      max-width: 620px;
  }

  div.ztilte h2,
  .pro-list h2 {
      font-size: 34px;
      line-height: 44px;
      max-width: 745px
  }

  .pro-desc {
      justify-content: center
  }

  .pro-desc li {
      width: 100%;
      max-width: 440px
  }

  .pro-list .content-wrap {
      max-width: 940px
  }

  .zboudle-wrap .content-wrap {
      max-width: 800px
  }

  .flex-wrap {
      gap: 50px
  }

  .logins-info li {
      margin-bottom: 40px;
      padding-left: 90px
  }
}

@media only screen and (max-width: 1100px) {
  .ztype-wrap>div {
      max-width: 720px;
      width: 100%;
      margin: 20px 0;
      height: auto !important
  }

  .ztype-wrap h3 {
      margin-bottom: 60px
  }

  .ztype-wrap h3:after {
      bottom: -20px;
      right: 0;
      margin: auto;
      width: 140px
  }

  .ztype-wrap {
      padding-bottom: 120px;
      text-align: center
  }
}

@media only screen and (max-width: 1024px) {
  .cont-form-wrap {
      align-items: center;
      flex-direction: column;
      max-width: 720px;
      margin: 0 auto;
      text-align: center;
      gap: 40px
  }

  .verifyheader {
      max-width: 270px;
      margin: 0 auto 10px;
  }

  .credits-wrap,
  .wallet-wrap {
      margin: auto;
  }

  .cont-form-wrap .cont-wrap,
  .wallet-wrap {
      width: 100%
  }


  .cont-form-wrap .cont-wrap p,
  .cont-form-wrap .cont-wrap p.ban-txt {
      max-width: 100%
  }

  .cont-form-wrap .form-wrap {
      margin: auto;
  }

  .zbanner .zw-desk-img {
      padding-top: 60px
  }

  .signup-box {
      margin: auto
  }

  .cont-wrap h1 {
      font-size: 40px;
      line-height: 50px
  }
}

@media only screen and (max-width: 991px) {
  .head-cont h3 {
      line-height: 46px;
      font-size: 38px;
      text-align: center
  }

  .flex-wrap {
      padding-top: 20px;
      flex-direction: column
  }

  .ztypes {
      padding: 80px 0
  }

  .ztypes .content-wrap {
      max-width: 600px
  }

  .zp-redeem {
      margin: auto
  }

  .zstepup-wrap {
      margin: 0 auto
  }

  .pro-desc li::after {
      left: 10px;
      top: 10px;
      transform: scale(.8)
  }

  .pro-desc li::before {
      width: 60px;
      height: 60px
  }

  .lang-vi .cont-wrap h1 {
      font-size: 40px
  }

  .quote-txt {
      font-size: 20px;
      margin: 0 auto 40px;
      text-align: left
  }

  .pro-list h2,
  div.ztilte h2 {
      max-width: 670px
  }

  .zboudle ul {
      gap: 60px 30px
  }

  .i18n-ar div.ztilte h2 {
      margin-left: 0;
      margin-right: 20px
  }

  .pro-list .content-wrap {
      max-width: 720px
  }

  .zboudle ul li {
      padding: 0 20px
  }

  .pro-desc li {
      max-width: 335px;
      padding-left: 85px
  }

  .pro-desc li p {
      max-width: 100%
  }

  .i18n-ar .zfaq h3 {
      padding-left: 60px;
      padding-right: 0
  }
}

@media only screen and (max-width: 767px) {
  .cont-wrap h1 {
      font-size: 34px;
      line-height: 44px;
      max-width: 380px;
      margin: 0 auto 20px
  }

  .zw-credits p {
      font-size: 18px;
      line-height: 26px;
      width: 100%;
      max-width: 280px;
      margin: 0 auto
  }

  .zw-desk-img {
      display: none
  }

  .zsection.zbanner .content-wrap {
      padding: 60px 0
  }

  .ztypes {
      padding: 60px 0
  }

  .head-cont h3 {
      line-height: 38px;
      font-size: 30px
  }

  .logins-info h4 {
      font-size: 20px;
      line-height: 28px
  }

  .zstepup-wrap h3 {
      font-size: 28px;
      margin: 0 auto 20px;
      line-height: 38px
  }


  .zboudle-wrap,
  .pro-list {
      padding: 60px 0
  }

  div.ztilte h2,
  .pro-list h2 {
      font-size: 28px;
      line-height: 38px
  }

  .pro-desc {
      margin-top: 40px
  }

  .pro-desc li {
      max-width: 420px
  }

  .lang-ar .zboudle ul li {
      padding: 0 20px
  }

  .creditelm {
      float: none !important;
      margin: 0 auto 40px
  }

  .cont-form-wrap .form-wrap iframe {
      margin-right: unset
  }

  .zbanner .content-wrap>picture img {
      display: none
  }

  .cont-form-wrap .form-wrap,
  .cont-form-wrap .cont-wrap {
      width: 100%;
      text-align: center;
      max-width: 600px;
      margin-left: auto;
      margin-right: auto;
      overflow: hidden
  }

  .lang-en .zmobile-menu-new-content ul li:nth-child(1),
  .lang-en .zmobile-menu-new-content ul li:nth-child(2),
  .lang-en .zmobile-menu-new-content ul li:nth-child(3),
  .lang-en .zmobile-menu-new-content ul li:nth-child(4),
  .lang-en .zmobile-menu-new-content ul li:nth-child(5),
  .lang-en .zmobile-menu-new-content ul li:nth-child(6),
  .lang-en .zmobile-menu-new-content ul li:nth-child(7) {
      display: none
  }

  .ztypes .ztype-wrap>div {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(10px)
  }

  .zsection.zbanner .content-wrap {
      padding-top: 40px
  }

  .prodect-logo a {
      color: black;
      display: inline-block;
      line-height: 1;
      position: relative
  }

  .prodect-logo .logo-span {
      font-size: 30px;
      line-height: 1;
      display: none
  }


  .ztermslink {
      padding: 70px 0 0;
      max-width: 340px;
  }

  .zfaq .content-wrap {
      padding: 60px 0;
  }

  .item-list .field-faq-question {
      font-size: 18px
  }

  .zboudle ul li {
      width: 50%
  }

  .ztermln {
      display: block;
      border-bottom: 0;
      padding-top: 3px;
  }

  .i18n-ar .prodect-logo,
  .i18n-ar .cont-wrap h1,
  .i18n-ar .cont-wrap p {
      text-align: center
  }

  .logins-info {
      width: 100%;
      max-width: 430px;
      margin: 0 auto 0
  }
}

@media only screen and (max-width: 480px) {

  .zp-redeem ul li h4,
  .cont-wrap h1,
  .head-cont h3,
  .zstepup-wrap h3,
  div.ztilte h2,
  .pro-list h2 {
      letter-spacing: unset
  }

  .prodect-logo .zwc-wallet-logo {
      width: 110px;
  }

  .zw-credits p {
      font-size: 16px;
      line-height: 23px;
      letter-spacing: unset;
      max-width: 210px
  }

  .credits-cont {
      padding: 40px 25px;
  }

  .credits-cont .cup-val {
      font-size: 45px;
  }

  .credits-cont p {
      margin-bottom: 10px;
  }

  .zw-cdt-wrap {
      padding: 0
  }

  .cont-wrap h1 {
      font-size: 28px;
      line-height: 36px;
      max-width: 260px
  }

  .zreach p,
  .expiry-cont p {
      font-size: 16px;
  }

  .zreach p {
      padding: 50px 0 0;
  }

  .cont-form-wrap {
      gap: 20px
  }

  .zwt-form-wrap {
      padding: 25px
  }

  .head-cont h3 {
      line-height: 33px;
      font-size: 26px
  }

  .flex-wrap {
      padding-top: 0;
      gap: 25px
  }

  .zp-redeem ul li svg {
      width: 100%;
      top: -35px
  }

  .zp-redeem ul li {
      min-width: unset;
      padding: 8px 14px
  }

  .logins-info li {
      padding-left: 80px
  }

  .zstepup-wrap h3 {
      font-size: 24px;
      line-height: 32px;
      max-width: 230px
  }

  .zp-redeem ul li p {
      font-size: 13px
  }

  .logins-info li::before,
  .logins-info li::after,
  .logins-info span {
      display: none
  }

  .logins-info li {
      padding-left: 0
  }

  .logins-info {
      max-width: 300px
  }

  .zp-redeem {
      max-width: 288px;
      margin: auto
  }

  .zp-redeem ul li.cdts-red {
      padding: 24px 14px 25px
  }

  .logins-info h4 {
      font-size: 17px;
      line-height: 25px
  }

  div.ztilte h2,
  .pro-list h2 {
      font-size: 25px;
      line-height: 34px
  }

  .ztermslink {
      padding: 50px 0 0
  }

  .zfaq .content-wrap {
      padding: 50px 0 40px
  }

  .zp-redeem ul li .zlogo {
      margin-bottom: 10px
  }

  .zp-redeem ul li h4 {
      font-size: 17px;
      line-height: 24px
  }

  .cont-form-wrap {
      width: 100%
  }

  .cont-form-wrap iframe {
      transform: translateX(-4%)
  }

  .form-wrap .form {
      overflow-y: scroll;
      overflow: hidden
  }

  .zboudle ul li span {
      transform: scale(1.2) translateX(0)
  }

  .pro-desc li span {
      margin-bottom: 5px
  }

  .zboudle-wrap,
  .pro-list {
      padding: 60px 0 40px
  }

  .pro-desc li p {
      max-width: 380px
  }

  .pro-desc {
      gap: 40px
  }

  .pro-desc li {
      padding-left: 75px
  }

  .zstepup-wrap p,
  .pro-desc li a {
      font-size: 16px
  }


  .zstepup-wrap {
      max-width: 320px
  }

  .ztype-wrap {
      padding-bottom: 50px
  }

  .zboudle-wrap .content-wrap,
  .pro-list .content-wrap {
      width: 85%
  }

  .i18n-ar div.ztilte h2 {
      margin-left: 0;
      margin-right: 0
  }

  .lang-ar .zboudle ul li {
      padding-right: 0
  }

  .item-list ul li {
      padding-right: 0
  }

  .item-list .field-faq-question {
      padding: 15px 35px 15px 15px;
      font-size: 16px
  }

  .item-list .field-faq-answer {
      padding: 0 15px 15px
  }

  .zfaq h3 {
      margin-bottom: 20px;
      font-size: 24px
  }

  span.prodect-name {
      display: block
  }

  .circle-plus {
      right: 20px
  }

  .ztypes h2 {
      margin-bottom: 50px
  }

  .zboudle ul li {
      width: 100%;
      max-width: 100%
  }

  .content-wrap>div.zboudle {
      padding: 20px 0 0
  }

  .zboudle ul {
      gap: 40px 30px
  }

  .pro-desc li p {
      font-size: 15px
  }

  .pro-desc li h5 {
      font-size: 20px;
      line-height: 28px
  }


  .prodect-logo h3 {
      font-size: 24px
  }

  .ztermslink h4 {
      font-size: 16px;
      max-width: 280px;
      margin: 0 auto;
  }
}

@media only screen and (max-width: 400px) {
  .cont-form-wrap iframe {
      transform: translateX(-7%) scale(0.9);
      height: 460px
  }

  .body-umain .cont-form-wrap iframe {
      height: 340px
  }
}