.zsection {
  padding: 120px 0 0
}

.og-context-node-6180.node-type-features .main-container-wrapper:before,
.header-top {
  background: #e8f6ff
}

#feat2 img {
  max-width: 300px
}

.zw-product-header {
background: #e8f6ff;
}

.header-top {
  padding: 90px 0 60px
}

.header-top .content-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center
}

.header-top .cont-part {
  width: 49%
}

.header-top .img-part {
  width: 45%
}

.header-top h1 {
  font-size: 60px
}

.header-top .cont-part p {
  margin-bottom: 30px
}

.feature-item .content-wrap {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-width: 970px;
  flex-wrap: wrap
}

.feature-list-inner .feature-item {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-around;
  flex-wrap: wrap;
  color: #fff;
  margin: 0 0 160px 0
}

section.bottom-cta-wrap .content-wrap h2 {
  margin: 0 0 15px;
  font-size: 50px;
  font-family: var(--zf-primary-bold)
}

.bottom-cta-wrap .content-wrap {
  max-width: 800px
}

section.bottom-cta-wrap .content-wrap p {
  max-width: 520px
}

section.zsection.bottom-cta-wrap {
  text-align: left;
  padding: 120px 0
}

.feature-item .cont-part {
  width: 48%
}

.feature-list-inner .feature-item .cont-part {
  width: 38%;
  padding-left: 6%
}

.feature-item h2 {
  font-size: 50px
}

.feature-col h4,
.feature-item h2 {
  font-family: var(--zf-primary-bold)
}

.feature-list-inner .feature-item .img-part {
  width: 42%
}

.feature-item .img-part img {
  max-width: 80%;
  width: 100%;
}

.zsection h2 {
  font-size: 46px;
  margin-bottom: 30px
}

.feature-list-inner .feature-item:last-child {
  margin: 0
}

.img-part-inner {
  padding: 80px 80px;
  font-size: 26px;
  max-width: 390px;
  text-align: left;
  background: #e8f6ff;
  border-bottom-right-radius: 80px
}

.img-part-inner span {
  color: #0078ec
}

.feature-list-inner .feature-item .img-part img {
  transform: translateY(150px)
}

.feature-list-inner.in-view .feature-item .img-part img {
  transform: translateY(0)
}

.feature-list-inner .content-wrap {
  padding: 160px 0;
  max-width: 1400px;
  background: url(/sites/zweb/images/recruit/designcareersbg.jpg);
  border-radius: 60px;
  background-size: 22px auto;
  background-color: #3a3a3a
}
.act-btn{
padding: 15px 40px;
}

.feature-list-inner.in-view .feature-item#feat-item1 .img-part img {
  transition: .5s ease
}

.feature-list-inner.in-view .feature-item#feat-item2 .img-part img {
  transition: 1s ease
}

.feature-list-inner.in-view .feature-item#feat-item3 .img-part img {
  transition: 1.5s ease
}

.feature-list-inner.in-view .feature-item#feat-item4 .img-part img {
  transition: 2s ease
}

.feature-list-inner.in-view .feature-item#feat-item5 .img-part img {
  transition: 2.5s ease
}

.feature-list-inner.in-view .feature-item#feat-item6 .img-part img {
  transition: 3s ease
}




.accwrap {
 padding: 100px 0 30px;
}


.z-accordianwrap {
 max-width: 760px;
 margin: 0 auto;
}

.z-accordianBox {
 border-bottom: 1px solid #ccc;
}


.z-accordianBox li {
 position: relative;
 padding-left: 30px;
 margin-bottom: 10px;
 font-size: 16px;
 line-height: 1.7;
}

.z-accordianBox ul {
 padding-bottom: 30px;
}

.z-accordianBox li:before {
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  border-left: 2px solid #000;
  width: 13px;
  height: 5px;
  border-bottom: 2px solid #000;
  transform: rotate(-45deg);
}

.z-accordianBox .z-accordianBox-head:before {
 content: '+';
 position: absolute;
 top: -1px;
 right: 6px;
 bottom: 0;
 font-size: 18px;
 font-family: var(--zf-primary-semibold);
 height: 25px;
 margin: auto;
}
.z-accordianBox .z-accordianBox-head.active:before {
 content: '-';
 right: 6px;
}
.z-accordianBox-head {
 padding: 25px 0 10px;
 cursor: pointer;
 position: relative;
}
.z-accordianBox .z-accordianBoxpara {
 display: none;
 font-size: 18px;
 max-width: 670px;
}



.z-accordianBox-head h5 {
 font-size: 22px;
 padding-right: 20px;
}

.z-accordianwrap h2 {
 font-size: 40px;
 font-family: var(--zf-secondary-bold);
text-align: center;
margin-bottom: 40px;
}


.i18n-ar .img-part-inner span{
    display:inline-block;
}

.i18n-ar .z-accordianBox .z-accordianBox-head:before {
    left: 6px;
    right:unset;
}

.i18n-ar .z-accordianBox .z-accordianBox-head.active:before {
    left: 6px;
    right:unset;
}
.i18n-ar .z-accordianBox li {
    padding-right: 30px;
    padding-left:unset;
}


.i18n-ar .z-accordianBox li:before {
    right: 0;
    left:unset;
}


@media screen and (min-width:1400px) {
  .header-top .cont-part p {
      max-width: 490px;
      font-size: 18px
  }
}

@media screen and (min-width:1200px) {
  .feature-item.right-image .content-wrap>div.cont-part {
      padding-right: 50px
  }
}
@media screen and (min-width:768px) and (max-width:1200px) {
.feature-list-inner .feature-item {
  margin: 0 auto 120px auto;
}
}
@media screen and (min-width:1201px) and (max-width:1366px) {
  .header-top .img-part {
      width: 45%;
      text-align: right
  }

  .header-top .img-part video {
      width: 400px;
      height: 400px
  }

  .header-top {
      padding: 90px 0 120px
  }
}

@media screen and (max-width: 1680px) and (min-width: 768px) {
  #feat2 .img-part {
      width: 40%
  }

  .feature-item .content-wrap {
      width: 88%
  }

}
@media screen and (max-width:1439px) {
.feature-list-inner .content-wrap {
      width: 100%;
      max-width: 100%;
      border-radius: 0;
  }
}
@media screen and (max-width:1200px) {
  section.bottom-cta-wrap .content-wrap h2 {
      font-size: 44px
  }

  .header-top h1 {
      font-size: 50px
  }

  .header-top video {
      max-width: 100%;
      height: auto
  }

  .header-top {
      padding: 90px 0 90px
  }

  .zsection h2 {
      font-size: 36px
  }

  .bottom-cta-wrap .content-wrap {
      padding: 0
  }

  .feature-list-inner .feature-item {
      margin: 0 25px 90px 25px;
  }
.feature-list-inner .feature-item:last-child {
      margin: 0 25px;
  }
  .feature-list-inner .content-wrap {
      padding: 120px 0px
  }

  .header-top .cont-part {
      width: 80%;
      text-align: center;
margin: 0 auto;
  }

  .header-top .img-part {
      width: auto;
      max-width: 80%
  }
}

@media screen and (max-width:991px) {
.header-top .cont-part {
  width: 100%;
}
  .img-part-inner {
      padding: 50px 60px;
      font-size: 23px;
      max-width: 340px
  }

  .zsection h2 {
      font-size: 30px;
      margin-bottom: 30px
  }

  .zsection {
      padding: 90px 0 0
  }

  .feature-list-inner .feature-item .cont-part {
      width: 42%;
      padding-left: 0
  }

  .feature-list-inner .feature-item .img-part {
      width: 48%;
text-align: center;
  }

  section.zsection.bottom-cta-wrap {
      text-align: center;
      padding: 60px 20px
  }

  section.bottom-cta-wrap .content-wrap h2 {
      font-size: 40px
  }

  section.bottom-cta-wrap .content-wrap p {
      max-width: 80%;
      margin: 0 auto
  }
/* Arabic starts */
.i18n-ar .bottom-cta-wrap .content-wrap , .i18n-ar section.bottom-cta-wrap .content-wrap p , .i18n-ar section.bottom-cta-wrap .content-wrap h2{
        text-align:center;
    }

}

@media screen and (max-width: 767px) {
  #feat2 .img-part {
      text-align: center
  }

  #feat2 .img-part img {
      max-width: 80%
  }

  .header-top video {
      display: none
  }

  .zsection.header-top {
      padding: 90px 0 90px
  }

  .feature-item .cont-part {
      width: 100%;
      text-align: center
  }

  .img-part-inner {
      display: none
  }

  .img-part {
      margin: 0 auto
  }

  .feature-list-inner .feature-item .cont-part {
      width: 90%
  }

  .feature-list-inner .content-wrap {
      width: 100%;
      border-radius: 0;
      padding: 90px 0;
  }

  .feature-list-inner .feature-item .img-part {
      width: 100%;
      text-align: center;
      margin: 20px 0 0
  }

  section.bottom-cta-wrap .content-wrap h2 {
      font-size: 36px
  }

  section.zsection.bottom-cta-wrap {
      padding: 60px 0 80px
  }
}

@media screen and (max-width:480px) {
.zsection h2 {
  font-size: 28px;
  margin-bottom: 20px;
}
  .header-top h1 {
      font-size: 36px
  }

  .header-top .cont-part p {
      margin-bottom: 30px;
      padding: 0 20px
  }

  .header-top .cont-part {
      width: 100%
  }

 .z-accordianBox-head h5 {
      font-size: 15px;
  }
}

/* Other Language */
@media screen and (min-width: 1200px){
.other-lang .header-top h1 {
  font-size: 50px;
}
}
@media screen and (max-width: 991px){
.i18n-ar .header-top h1, .i18n-ar .header-top p{
text-align: center;

}
}
@media screen and (max-width: 767px){
.i18n-ar .bottom-cta-wrap .content-wrap a.cta-btn, .i18n-ar section.zsection.bottom-cta-wrap, .i18n-ar .zsection.bottom-cta-wrap .content-wrap {
  text-align: center;
  margin: 0 auto;
}
.i18n-ar section.bottom-cta-wrap .content-wrap p, .i18n-ar .zsection h2 {
  text-align: center;
  margin: 0 auto 10px auto;
}
.i18n-ar .zsection.bottom-cta-wrap .content-wrap h2 {
  margin: 0 auto 10px auto;
  text-align: center;
}
}