.page-wrapper * {
  box-sizing: border-box;
}

h1 {
  font-size: 50px;
}

.page-wrapper .content-wrap {
  max-width: 1170px;
}

.flex-wrap {
  display: flex;
  align-items: center;
}

.flex-item {
  width: 50%;
  position: relative
}

.banner-wrap {
  padding: 140px 0 60px;
}

h1,
h2,
h3,
h4 {
  font-family: var(--zf-secondary-bold);
}

.banner-wrap .flex-wrap {
  align-items: flex-start;
}

.banner-wrap .flex-item:first-child {
  width: 55%;
  padding-right: 50px;
  top: -60px;
}

.banner-wrap .flex-item:nth-child(2) {
  width: 50%;
}

.title-desc {
  color: #084bc5;
  background: #fcf0eb;
  font-family: var(--zf-secondary-regular);
  display: inline-block;
  padding: 15px 30px;
  border-radius: 30px;
}

.banner-wrap img {
  vertical-align: bottom;
}

.tb-list {
  width: 70%;
  display: table;
}

.testi-video {
  width: 29%;
  font-size: 16px;
  padding: 0 0px 0 40px;
}

.tb-list span {
  display: inline-block;
  vertical-align: middle;
  margin: 20px 30px 10px 30px;
}

.tb-list span:after {
  margin: 20px 0 20px 0
}

.tb-list span:nth-child(9):after,
.tb-list span:nth-child(10):after,
.tb-list span:nth-child(11):after {
  margin-bottom: 0px;
}

.tb-list span:after {
  content: '';
  display: inline-block;
  background: url(/sites/zweb/images/commonroot/zp-trust-brands-sprite.png) no-repeat;
  background-size: 1200px auto;
}

.tb-list .tb-transtema:after {
  background-position: -5px -1204px;
  width: 180px;
  height: 35px;
}

.tb-list .tb-intraway:after {
  background-position: -192px -1198px;
  width: 163px;
  height: 47px;
}

.tb-list .tb-unicsoft:after {
  background-position: -533px -1201px;
  width: 152px;
  height: 41px;
}

.tb-list .tb-tfl:after {
  background-position: -359px -1204px;
  width: 115px;
  height: 46px;
}

.tb-list .tb-a1:after {
  background-position: -841px -1271px;
  width: 115px;
  height: 57px;
}

.tb-list .tb-ea:after {
  background-position: -1030px -1129px;
  width: 53px;
  height: 53px;
}

.tb-list .tb-flatrock:after {
  background-position: -939px -1129px;
  width: 83px;
  height: 53px;
}

.tb-list .tb-oneplus:after {
  background-position: -584px -544px;
  width: 141px;
  height: 39px;
}

.tb-oneplus {
  transform: scale(1.2);
}

.testi-video p,
.testi-video div {
  font-size: 18px;
  margin-bottom: 7px;
  display: inline-block;
  position: relative;
}

.icon:before {
  content: '';
  background: url(/sites/zweb/images/recruit/industries/manufacturing-sprite.png) no-repeat;
  background-size: 900px auto;
  display: inline-block;
}

.icon-testimonial:before {
  width: 201px;
  height: 112px;
  background-position: -209px -222px;
}

.customers .customer-wrap {
  max-width: 1360px;
  background: #fcf0eb;
  margin: auto;
  border-radius: 60px;
  padding: 100px 0px;
}

span.cust-name {
  display: block;
  color: #084bc5;
  font-weight: 600;
  margin-top: 5px;
}

span.cust-detail {
  font-size: 14px;
}

span.zplay-icon {
  position: absolute;
  left: 28px;
  bottom: 10px;
  transform: translate(-50%, -50%);
  border: 1px solid #fff;
  width: 25px;
  height: 25px;
  border-radius: 50%;
}

.zplay-icon:after {
  position: absolute;
  content: '';
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.zplay-icon:after {
  position: absolute;
  content: '';
  left: 55%;
  top: 53%;
  transform: translate(-50%, -50%);
  border-left: 8px solid #fff;
  border-bottom: 6px solid transparent;
  border-top: 5px solid transparent;
}

.zcpopup-controller {
  cursor: pointer;
}

.features {
  margin: 120px auto 0;
  overflow: hidden;
  display: flex;
  width: 100%;
  flex-flow: row wrap;
  max-width: 1170px;
}

.feature-item {
  width: 50%;
  padding: 50px 92px;
}

.feature-cont {
  padding: 30px 50px 0 10px;
  max-width: 400px;
}

.feature-cont p {
  font-size: 20px;
}

span.special-word {
  color: #084bc5;
  font-weight: 600;
}

img.supportimg1 {
  position: absolute;
  max-width: 200px;
  right: -80px;
  top: 50px;
}

/*reviews*/
.recruit-leads-section {
  margin: 60px 0 120px 0
}

.recruit-leads-section h3 {
  text-align: center;
  text-transform: uppercase;
  font-size: 14px;
  font-family: var(--zf-primary-light);
  letter-spacing: 2px
}

.recruit-leads-section h3 span {
  padding-bottom: 2px;
  border-bottom: 1px solid;
  color: #000
}

.recruit-leads-section ul {
  max-width: 980px;
  margin: 50px auto 0;
  display: flex;
  justify-content: space-between
}

.recruit-leads-section ul li .img-leads {
  width: 100px;
  height: 100px;
  background-image: url(/sites/zweb/images/recruit/sprite-ico-logo.png);
  background-size: 600px auto;
  background-repeat: no-repeat;
  background-position: left 0;
  display: block;
  margin: 0 auto 15px
}

.recruit-leads-section ul li:nth-child(2) .img-leads {
  background-position: -100px 0
}

.recruit-leads-section ul li:nth-child(3) .img-leads {
  background-position: -200px 0
}

.recruit-leads-section ul li:nth-child(4) .img-leads {
  background-position: -300px 0
}

.recruit-leads-section ul li:nth-child(5) .img-leads {
  background-position: -400px 0
}

.recruit-leads-section ul li:nth-child(6) .img-leads {
  background-position: -500px 0
}

.recruit-app-cont {
  padding: 0 10px
}

.recruit-app-cont p a {
  font-size: 14px;
  display: block;
  margin: 10px 0 0;
  text-transform: uppercase;
  color: #000;
  text-decoration: underline;
  text-underline-position: under
}

.stars-container {
  position: relative;
  display: inline-block;
  color: transparent;
  font-size: 22px;
  letter-spacing: 2px
}

.stars-container:before {
  position: absolute;
  top: 0;
  left: 0;
  content: '★★★★★';
  color: #d0d0d0
}

.stars-container:after {
  position: absolute;
  top: 0;
  left: 0;
  content: '★★★★★';
  color: #f9a825;
  overflow: hidden
}

.stars-90:after {
  width: 90%
}

.counter-star {
  display: block;
  text-align: center;
  color: #444
}

span.current-value {
  font-size: 28px;
  color: #000
}

/*reviews*/


.bottom-cta .content-wrap {
  padding: 70px 0;
  text-align: center;
  background: #474c55;
  color: #fff;
  margin: 90px auto 120px;
}

.bottom-cta p {
  max-width: 500px;
  margin: 0 auto 25px;
}



/* Code for arabic styles */

.i18n-ar .banner-wrap .flex-item:nth-child(2) {
  width: 40%;
  padding-left: 0;
}

.banner-wrap .flex-item:first-child {
  padding-right: 0;
  max-width: 500px;
}

.i18n-ar .banner-wrap .flex-wrap {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.i18n-ar .stars-container:after {
  left: 11px;
}

.i18n-ar .bottom-cta h2,
.i18n-ar .bottom-cta p {
  text-align: center;
}

/* End of code for arabic styles */

@media all and (min-width:1200px) {
  h1 {
      font-size: 50px;
  }

  h2 {
      font-size: 50px;
  }

  .tb-list .tb-westminster:after,
  .tb-list .tb-schinder:after {
      transform: scale(1.1) translate(10px, 0px);
  }

  .banner-wrap .flex-item:nth-child(2) {
      padding-left: 20px;
  }
}

@media all and (min-width:1360px) {
  h1 {
      font-size: 70px;
      margin: 15px 0 15px 0;
  }

  .act-btn {
      padding: 12px 40px;
      margin-top: 20px;
  }
}

@media all and (min-width:1280px) and (max-width:1360px) {
  .customers .customer-wrap {
      border-radius: 0px;
  }

  .banner-wrap .flex-item:nth-child(2) {
      width: 45%;
      left: -50px;
  }

  .title-desc {
      padding: 10px 30px;
  }
}

@media all and (min-width:1280px) and (max-width:1440px) {
  .title-desc {
      font-family: var(--zf-secondary-medium);
      font-size: 16px;
  }

  h1 {
      font-size: 60px;
  }

  p {
      font-size: 16px;
  }

  .banner-wrap .flex-item:first-child {
      top: -60px;
  }

  .feature-cont p {
      font-size: 18px;
  }

  .feature-item {
      padding: 50px 110px;
  }

  .tb-list span:after {
      transform: scale(.9);
  }

  .customers .customer-wrap {
      padding: 80px 0px;
  }

  .testi-video p {
      font-size: 16px;
  }

  .testi-video {
      width: 28%;
  }

  .customers .customer-wrap {
      max-width: 1310px;
  }

  .banner-wrap {
      padding: 120px 0 40px;
  }
}

@keyframes roate {
  from {
      transform: rotate(0deg)
  }

  to {
      transform: rotate(360deg)
  }
}

@media all and (min-width:992px) and (max-width:1199px) {
  .feature-item {
      padding: 50px 65px;
  }

  .feature-cont {
      padding: 30px 10px 0 10px;
  }

  .feature-cont p {
      font-size: 18px;
  }

  .features {
      margin: 60px auto 0;
  }

  .customers .customer-wrap {
      padding: 70px 0;
  }

}

@media all and (max-width:991px) {
  h1 {
      font-size: 46px
  }

  h2 {
      font-size: 36px
  }

  .banner-wrap {
      padding: 60px 0 0;
  }

  .banner-wrap .flex-wrap {
      flex-flow: column;
      text-align: center;
  }

  .banner-wrap .flex-item {
      margin: auto
  }

  .banner-wrap .flex-item:first-child {
      width: 80%;
      top: 0;
      padding-right: 0px;
  }

  .banner-wrap .flex-item:nth-child(2) {
      margin: 40px auto 0px;
      width: 55%;
      max-width: 400px;
  }

  .testi-video {
      width: 45%;
      padding: 0;
  }

  .customers .customer-wrap {
      padding: 50px 0px;
  }

  .tb-list {
      display: block
  }

  .tb-list span {
      transform: scale(.9);
      width: auto;
  }

  .features {
      display: block;
      margin: 60px auto 0;
  }

  .feature-cont p {
      font-size: 18px;
  }

  .feature-item {
      width: 100%;
      max-width: 400px;
      margin: 0 auto 60px;
      ;
      padding: 0;
  }

  .bottom-cta .content-wrap {
      padding: 60px 20px;
      margin: 0px auto 60px;
  }

  .feature-cont {
      max-width: 400px;
  }

  .customers .customer-wrap {
      border-radius: 0px;
  }

  .feature-cont p {
      font-size: 18px;
  }

  .recruit-leads-section ul {
      flex-flow: row wrap;
      text-align: center;
  }

  .recruit-leads-section ul li {
      width: 32%;
      margin: 0px 0 60px;
  }

  .recruit-leads-section ul li:nth-last-child(-n+3) {
      margin-bottom: 0px;
  }

  /* code for arabic style */
  .i18n-ar .banner-wrap h1,
  .i18n-ar .banner-wrap p,
  .i18n-ar div,
  .i18n-ar p,
  .i18n-ar span {
      text-align: center;
  }

  /* end of code for arabic style */

}

@media all and (max-width:767px) {
  h1 {
      font-size: 36px;
  }

  .title-desc {
      font-size: 14px;
      border-radius: 30px;
      margin-bottom: 10px;
  }

  img.supportimg1 {
      max-width: 90px;
      right: -16px;
      top: 35px;
  }

  .tb-list span:after {
      margin-bottom: 0px;
      margin-top: 0;
  }

  .banner-wrap .flex-item:first-child {
      width: 95%;
  }

  .banner-wrap .flex-item:nth-child(2) {
      widtH: 80%;
  }

  .customers .flex-wrap {
      flex-flow: column wrap;
  }

  .tb-list {
      width: 100%;
      text-align: center;
  }

  .customers .tb-list span {
      margin-bottom: 10px;
  }

  .tb-list span {
      transform: scale(.6);
      margin: -10px -10px 0px -10px;
  }

  .tb-list span:after {
      vertical-align: middle;
  }

  .testi-video {
      width: 90%;
      margin: 70px auto 0;
      text-align: center;
  }

  .feature-cont {
      padding: 0;
  }

  .features {
      width: 85%;
  }

  .bottom-cta .content-wrap {
      border-radius: 0px;
  }

  .tb-list span {
      margin: 0px -5px 0px -5px;
      width: auto;
  }

  span.zplay-icon {
      left: 50%;
      bottom: 30%;
  }

  .recruit-leads-section h3 {
      letter-spacing: 1px;
      line-height: 1.9;
      font-size: 12px;
  }

  .recruit-leads-section ul li {
      width: 50%;
      margin: 0px 0 60px;
  }

  .recruit-leads-section ul li:nth-last-child(-n+2) {
      margin-bottom: 0px;
  }

  .i18n-ar .banner-wrap .flex-item:nth-child(2) {
      width: 80%;
  }
}