* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body {
  font-family: var(--zf-primary-regular), sans-serif;
  font-size: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;

}

body {
  font-size: 18px;
  margin: 0;
  padding: 0;
  background-color: #000000;
  /* Prevent horizontal overflow */

}

.zs-smsng-firstFold,
.zs-smsng-fifthFold {
  overflow: hidden;
}

section.zs-smsng-firstFold,
div.zs-smsng-firstFoldInner {
  padding-top: 0px;
}

button,
input,
select,
textarea {
  font-family: var(--zf-primary-regular), sans-serif;
}

a {
  text-decoration: none;
  outline: 0;
  transition: color ease .2s;
}

ol ol,
ol ul,
ul ol,
ul ul {
  margin: 0;
}

nav ul,
nav ol {
  list-style: none;
  list-style-image: none;
}

img {
  border: 0;
  max-width: 100%;
  height: auto;
  width: auto;
  vertical-align: middle;
  position: relative;
}

/**** Styling ****/

p,
pre {
  margin: 1.5em 0;
}

h1 {
  font-family: var(--zf-primary-bold), sans-serif;
}

h2,
h3,
h4,
h5,
h6 {
  font-family: var(--zf-primary-semibold), sans-serif;
  font-weight: normal;
  color: #222;
}

h6,
p {
  font-family: var(--zf-primary-regular), sans-serif;
  margin: 1em 0;
}

h1 {

  font-size: 44px;
  line-height: 1.2em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

h2 {
  font-size: 36px;
  line-height: 1.3em;
  margin-top: 0.5em;
  margin-bottom: 0.75em;
}

h3 {
  font-size: 28px;
  line-height: 1.25em;
  margin-top: 0.75em;
  margin-bottom: 0.75em;
}

h4 {
  font-size: 20px;
  line-height: 1.5em;
  margin-top: 1em;
  margin-bottom: 1em;
}

h5 {
  font-size: 18px;
  line-height: 1.25em;
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}

h6 {
  font-size: 16px;
  line-height: 1.25em;
}

p {
  font-family: var(--zf-primary-regular), sans-serif;
  line-height: 1.5em;
  font-size: 18px;
}

.zs-padding_null {
  padding: 0;
}

.zs-margin_null {
  margin: 0;
}

.zs-paddingtop {
  padding-top: 15px;
}

.zs-margintop {
  margin-top: 15px;
}

.zs-paddingbottom {
  padding-bottom: 15px;
}

.zs-marginbottom {
  margin-bottom: 15px;
}

.zs-paddingtopbottom {
  padding: 15px 0;
}

.zs-margintopbottom {
  margin: 15px 0;
}

.zs-paddingtop-small {
  padding-top: 30px;
}

.zs-paddingbottom-small {
  padding-bottom: 30px;
}

.zs-margintop-small {
  margin-top: 30px;
}

.zs-marginbottom-small {
  margin-bottom: 30px;
}

.zs-paddingtopbottom-small {
  padding: 30px 0;
}

.zs-margintopbottom-small {
  margin: 30px 0;
}

.zs-paddingtop-large {
  padding-top: 50px;
}

.zs-paddingbottom-large {
  padding-bottom: 50px;
}

.zs-margintop-large {
  margin-top: 50px;
}

.zs-marginbottom-large {
  margin-bottom: 50px;
}

.zs-paddingtopbottom-large {
  padding: 50px 0;
}

.zs-margintopbottom-large {
  margin: 50px 0;
}

.mB40 {
  margin-bottom: 40px;
}

.mB50 {
  margin-bottom: 50px;
}

.zs_center {
  text-align: center;
}

.zs_flex {
  display: flex;
  align-items: center;
}

.zs_tablecell {
  display: table-cell;
  vertical-align: middle;
  position: relative;
}

.zs_inlineblock {
  display: inline-block;
  vertical-align: middle;
}

.zs_block {
  display: block;
}

.zs_table {
  display: table;
  table-layout: fixed;
  width: 100%;
}

.zs_hidden {
  display: none;
}

.zs_alignright {
  text-align: right;
}

.zs_alignleft {
  text-align: left;
}

.sectioncontainer {
  max-width: 1620px !important;
}

.zs_sectioncontainer {
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

section {
  position: relative;
}

.zs-compSearchArea {
  margin-bottom: 80px;
}

.zs-videoBlock-parent {
  padding-bottom: 100px;
}

.zs-smsng-w-100 {
  width: 100%;
}

.zs-smsng-d-flex {
  display: flex;
}

.zs-smsng-py-5px {
  padding: 5px 0px;
}

.zs-smsng-align-start {
  align-items: start;
}

.zs-smsng-align-end {
  align-items: end;
}

.zs-smsng-justify-center {
  justify-content: center;
}

.zs-smsng-justify-start {
  justify-content: start;
}

.zs-smsng-justify-end {
  justify-content: end;
}

.zs-smsng-align-center {
  align-items: center;
}

.zs-smsng-flex-col {
  flex-direction: column;
}

.zs-smsng-flex-wrap {
  flex-wrap: wrap;
}

.zs-smsng-h-100 {
  height: 100%;
}

.zs-smsng-position-rel {
  position: relative;
}

.zs-smsng-position-abs {
  position: absolute;
}

.zs-smsng-sectionHeader {
  text-align: center;
  color: #fff;

}

.zs-smsng-firstFold figure {
  display: inline-block;
  transform: translate(0%, 26%);
  margin: 0 10px 0 0;
}

.zs-smsng-fifthFold figure svg {
  height: 88px;
}

.zs-smsng-d-none {
  display: none;
}



.zs-smsng-swapVideoTwo {
  z-index: 4;
}

.zs-smsng-swapVideoOne {
  z-index: 9;
}

.zs-smsng-sectionHeader h1 {
  font-size: 44px;
}

.zs-video-container video {
  width: 70%;
}

.zs-smsng-sectionHeader p {
  max-width: 60%;
  margin-top: 0px;
}

.zs_download_app_btn img {
  border: 1px solid #fff;
  border-radius: 10px;
  max-width: 150px;
  max-height: 51px;
}

.zs-containerPlay:hover .fake-player {
  opacity: 1;
}

.zs-smsng-play {
  position: relative;
}
.zs-swapContainer .zs-smsng-swapVideoOne .fake-player {
    bottom: 18%;
    right: 0%;
}
.video-toggle-btn {
    position: absolute;
    bottom: 10px;
    right: 10px;
    width: 35px;
    height: 35px;
    border-radius: 50px;
    border: 0;
    cursor: pointer;
    background-image: url('/sites/zweb/images/show/zs-smsng-pause.svg');
    z-index: 99;
}

.video-toggle-btn[aria-pressed="false"] {
    background-image: url('/sites/zweb/images/show/zs-smsng-play.svg')
}
.swap-vid-btn {
     left: -5%;
    bottom: 0%;
}
.swap-video-btn {
  right: -5%;
}
.video-fold-btn {
     right: 15%;
    bottom: 5%;
}
.display-thumb-btn{
    right: 5%;
    bottom: 13%;
}
.multitask-video-btn {
     right: -6%;
    bottom: 3%;
}
.fake-player {
  position: absolute;
  bottom: 9%;
  right: 20%;
  opacity: 0;
}

.fake-player.hidden .zs-smsng-play::before {
  opacity: 0;
}

.fake-player.hidden .zs-smsng-pause::before {
  opacity: 1;
}

.zs-smsng-play::before {

  content: url('/sites/zweb/images/show/zs-smsng-play.svg');
  position: absolute;
  width: 40px;
  height: 40px;
  opacity: 1;
}

.zs-smsng-pause::before {
  content: url('/sites/zweb/images/show/zs-smsng-pause.svg');
  position: absolute;
  width: 40px;
  height: 40px;
  opacity: 0;
}

section.zs-smsng-second .zs-containerTwo h2 {
  margin-bottom: 0px
}

.zs-smsng-secondFoldInner,
.zs-smsng-fourthFoldInner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.zs-swapContainer {
  width: 50%;
  color: #fff;
}

.zs-centerBlock {
  width: 85%;
  position: relative;
  margin-bottom: 60px;
}

.zs-centerImg {
  width: 100%;
}

.zs-centerBlock .zs-pblsh-firstFoldLeft {
  left: -21%;
  bottom: -18%;
  display: flex;
  align-items: end;
}

.zs-centerBlock .zs-pblsh-firstFoldRight {
  right: -21%;
  bottom: -17%;
}

.zs-textConatainerIcon img {
  width: 52px;
  height: 55px;
}

.zs-centerImg {
  transform: translate(0px, 200px);
  opacity: 0;
  transition: all 1.8s ease;
}

.zs-pblsh-firstFoldLeft img {
  transform: translate(0px, 200px);
  opacity: 0;
  width: 100%;
  height: 100%;
}

.zs-pblsh-firstFoldLeft img:nth-child(1) {
  transition: all 0.2s ease-out;
}

.zs-pblsh-firstFoldLeft img:nth-child(2) {
  transition: all 0.2s ease-out;
}

.zs-smsng-mobile {
  margin-left: -40%;
  margin-top: -50%;
}

.zs-pblsh-firstFoldLeft .zs-smsng-watch {
  z-index: 99;
  width: 70%;
}

.zs-smsng-sectionHeader figure svg {
  height: 88px;
  margin: 0px 10px;
  max-width: 260px;
}

.zs-smsng-thirdFold {
  padding-bottom: 0px;
}

.zs-smsng-thirdFoldInner {
  transition: all 0.4s ease-in;
}

.zs-pblsh-firstFoldRight img:nth-child(1) {
  transform: translate(0px, 200px);
  opacity: 0;
  transition: all 0.4s ease;
  transition-delay: 1s;
  width: 100%;
  height: 100%;
}

.zs-firstFoldAnim .zs-centerImg,
.zs-firstFoldAnim .zs-pblsh-firstFoldLeft img,
.zs-firstFoldAnim .zs-pblsh-firstFoldRight img:nth-child(1) {
  transform: unset;
  opacity: 1;
}

.zs-firstFoldAnim .zs-pblsh-firstFoldRight .zs-tabPencil img {
  transform: translate(-20%, -20px) rotate(20.71667deg);
  opacity: 1;
  transition-delay: 1.5s;
}

.zs-swapContainer h2,
.zs-smsng-thirdFoldInner h2 {
  color: #fff;
  width: 90%;
  line-height: 60px;
  margin-bottom: 10px;
}

.zs-smsng-thirdFoldInner {
  opacity: 0;
  transition: all 0.5s ease;

}

.zs-smsng-activeDotArea {
  right: -8%;
  height: 50vh;
  justify-content: center;
  gap: 20px;
  width: 5%;
  align-items: end;
}

.zs-smsng-fourthFoldWrap .fake-player {
  right: 5%
}

.zs-smsng-fourthFoldWrapTwo .fake-player {
  right: -3%
}

.zs-smsng-dot {
  width: 5px;
  height: 10px;
  border-radius: 10px;
  background-color: grey;
  transition: 0.6s ease;
  margin: 0 0.1rem;
}

.zs-smsng-dot.active {
  height: 120px;
  width: 5px;
  border-radius: 10px;

}

.zs-smsng-activeScrollDot {
  width: 5px;
  border-radius: 10px;
  height: 0%;
  transition: all 0.1s linear;
}

.zs-smsng-secondFold .zs-smsng-dot.active .zs-smsng-activeScrollDot {
  background-color: #e42527;
}

.zs-smsng-fourthFold .zs-smsng-dot {
  background-color: #b1b1b1b8;
}

.zs-smsng-fourthFold .zs-smsng-dot.active .zs-smsng-activeScrollDot {
  background-color: #000000;
}

section div.zs-centerBlock {
  width: 75%;
}

.zs-smsng-thirdFoldInner.active {
  transform: unset;
  opacity: 1;
}

.zs-smsng-secondFold.zs_fadeInUp .zs-swapContainer:nth-child(3) {
  width: 35%;
  justify-content: center;
}

.zs-smsng-fifthFold {
  padding-bottom: 150px;
}

.zs-smsng-fifthFoldInner {
  justify-content: space-between;
  background-color: #2A2A2A;
  border-radius: 50px;
  margin: auto;
  overflow: hidden;
}

.zs-footerctaText {
  text-align: left;
  margin-right: auto;
}

.zs-footerctaText h2 {
  color: #fff;
  font-size: 36px;
  width: 92%;
  margin-bottom: 48px;
}

.zs-fifthfoldRightImgLeft,
.zs-fifthfoldRightImgRight {
  width: 40%;
  height: 40%;
  transition: all .8s ease 0s;
}

.zs-smsng-fifthWrap {
  display: flex;
  justify-content: center;
}

.zs-smsng-fifthFoldInnerFold {
  width: 50%;

}

.zs-smsng-fifthFoldInner .zs-smsng-fifthFoldInnerFold:nth-child(1) {
  padding: 20px 0px 20px 120px;
}

.zs-smsng-fifthFoldInnerRight {
  padding: 40px 60px 100px 60px
}

.zs-smsng-thirdFoldWrap p {
  margin-top: 20px;
}

.zs-smsng-fourthFoldWrapTwo .zs-smsng-videoTwo {
  height: calc(100% - 13px);
  border-radius: 24px;
}

.zs-tabPencil {
  left: 85%;
  rotate: -4deg;
  height: 100%;
  bottom: 15%;
  width: 4%;

}

.zs-tabPencil img {
  height: 100%;
  width: 80%;
  transform: translate(-19%, 200%) rotate(-8.71667deg);
  transition: all 1.8s ease;


}

@keyframes dash {
  100% {
    stroke-dashoffset: 0;
    opacity: 1;
  }
}

.zs-firstFoldAnim .smsngpathSvg {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: dash 1s linear forwards;
  animation-iteration-count: 1;
}

.zs-smsng-fourthFoldWrap h2 {
  margin: 20px 0px;
}

.zs-swapContainer {
  position: relative;
  opacity: 0;
  transition: all 0.8s ease;
  z-index: 0;
}

.zs-swapContainer:nth-child(1) {
  position: relative;
  transform: translateX(-40%);
  transition-delay: 0.4s;
  padding: 0px;
  z-index: 99;
}


.zs-swapContainer:nth-child(2) {
  position: relative;
  transform: translateY(100%);
  opacity: 0;
  transition: all 0.8s ease 0s;
  padding: 40px 80px;
  z-index: 9;
}

.zs-swapContainer:nth-child(3) {
  position: relative;
  transform: translate3d(0, 80px, 0);
  opacity: 0;
  transition: all 0.5s ease 0s;
  padding: 40px 0px;
  z-index: 99;
}


.zs-swapContainer.active {
  opacity: 1;
  transition-delay: 0s;
}



#zs-smsng-thirdFold {
  width: 100%;
  position: relative;
}

.zs-video-container {
  width: 100%;
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: black;
  padding: 20px;
  margin-top: -15px;
}

/* Make sure the video fills its container */
video {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.zs-swapContainer:nth-child(1) {
  position: relative;
  transform: translateX(-30%);
  transition: all .8s ease 0s;
  z-index: 99;

}

.zs-swapContainer:nth-child(2) {
  position: relative;
  transform: translateY(100%);
  opacity: 0;
  transition: all .8s linear 0s;
  z-index: 9;
  padding: 40px 80px;

}

.zs-textContainer {
  display: flex;
  flex-direction: column;
}


.zs-smsng-secondFoldInner .zs-containerTwo .words::before {
  background-image: url("/sites/zweb/images/show/zs-smsng-touchfreeline.svg");
}

.zs-smsng-thirdFoldInner .words::before {
  background-image: url("/sites/zweb/images/show/zs-smsng-unfoldline.svg");
}

.zs-smsng-secondFoldInner .zs-containerThree .words::before {
  background-image: url("/sites/zweb/images/show/zs-smsng-controlline.svg");
}

.zs-smsng-fourthFoldWrap .words::before {
  background-image: url("/sites/zweb/images/show/zs-smsng-largerline.svg");
}

.zs-smsng-fourthFoldWrapTwo .words::before {
  background-image: url("/sites/zweb/images/show/zs-smsng-multitaskline.svg");
}

.zs-containerPlay {
  position: relative;
}

.zs-swapContainer.zs-containerThree.active {
  opacity: 0;
}

.zs_fadeInLeft .zs-swapContainer:nth-child(1) {
  opacity: 1;
  transform: translateX(0);
}

.zs_fadeInLeft .zs-swapContainer:nth-child(2) {
  opacity: 1;
  transform: translateX(0);
}

.zs-smsng-fourthFold {
  margin-top: -4%;
}

.zs-smsng-fourthFold.zs-blackTheme {
  background-color: #fff;
}

.zs-smsng-fourthFold.zs-blackTheme .zs-swapContainer h2,
.zs-smsng-fourthFold.zs-blackTheme .zs-swapContainer p {
  color: #000;
}


@keyframes slideInDown {
  from {
    transform: translate3d(0%, -150%, 0);
    opacity: 0.3;
  }

  100% {
    transform: translate(0%, 0%);
    opacity: 1;
  }
}

@keyframes slideInUp {
  from {
    transform: translate(25%, 120%);
    opacity: 0.3;
  }

  100% {
    transform: translate(25%, 20%);
    opacity: 1;
    z-index: 10;
  }
}


.zs-fifthfoldRightImgLeft {
  left: -10%;
  transform: translate3d(-15%, 120%, 0);


}

.zs-fifthfoldRightImgRight {
  right: 0px;
  transform: translate3d(20%, -200%, 0);
  opacity: 0;

}

.zs-pblsh-firstFoldLeft {
  width: 20%;
  transition: transform 0.2s ease-out;
  /* Smooth transition */
}

.zs-pblsh-firstFoldRight {
  width: 50%;
  transition: transform 0.2s ease-out;
  /* Smooth transition */
}

/* Apply the hover animation */
.zs-smsng-fifthFoldInner.active .zs-fifthfoldRightImgLeft {
  animation: slideInUp 1.6s ease 1;
  animation-fill-mode: forwards;
}

.zs-smsng-fifthFoldInner.active .zs-fifthfoldRightImgRight {
  animation: slideInDown 1.6s ease 1;
  animation-fill-mode: forwards;
}

/* Smooth transitions for non-hover states */
.zs-smsng-fifthFoldInner .zs-fifthfoldRightImgLeft,
.zs-smsng-fifthFoldInner .zs-fifthfoldRightImgRight {
  transition: transform 1s ease;
}

.blob {
  filter: blur(40px);
  position: absolute;
  z-index: -1;
  top: 0;
  opacity: 0;
  left: 0;
  width: 650px;
  height: 650px;
  border-radius: 50%;
  background: rgb(160 153 153 / 50%);
  transition: all 300ms ease-in-out;
}

.fakeblob {
  display: hidden;
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 17%;
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

.foldWrap {
  border-radius: 50px;
  padding: 3px;
  background: #2A2A2A;
  backdrop-filter: blur(80px);
  transition: all 300ms ease-in-out;
  margin: auto;
  width: 85%;
  overflow: hidden;
}


.zs-smsng-fifthFoldInner {
  border-radius: 50px;
  transition: all 300ms ease-in-out;
}



.foldWrap:hover>.zs-smsng-fifthFoldInner {
  background: rgba(17, 16, 16, 0.91);
  backdrop-filter: blur(80px);
}

.zs-containerOne {
  transition: transform 0.4s ease-out;
}

.zs-smsng-secondFold .zs-containerTwo,
.zs-smsng-secondFold .zs-containerThree {
  margin-top: 80px
}

.zs-containerTwo,
.zs-containerThree {
  transition: transform 0.1s ease-out;
}

.zs_fadeInUp .zs-swapContainer:nth-child(3) {
  position: absolute;
  width: 38%;

}

.words {
  position: relative;
  display: inline-flex;
}

.words::before {
  content: "";
  position: absolute;
  background-size: contain;
  background-position: right;
  transition: background-size .8s;
  background-repeat: no-repeat;
  bottom: -22px;
  width: 0%;
  bottom: -10px;
  background-position: right;
  transition-delay: 2s;
  height: 15px;
  transition: width 1s linear, height 1s linear, bottom 1s linear;
  z-index: 99
}

@keyframes shiftBackground {

  100% {
    width: 100%;
  }
}

.words.active::before {

  animation: shiftBackground 0.4s linear 1s forwards;
}

.zs-smsng-thirdFoldInner {
  position: relative;
  width: 100%;
  height: 100%;
}

.zs-smsng-fourthFoldWrap p {
  color: #000;
}

.zs-smsng-fourthFoldWrapTwo,
.zs-smsng-fourthFoldWrap {
  margin: 100px 40px;

}

.zs-smsng-fourthFoldWrapTwo h2 {
  margin: 20px 0px;
}

.zs-smsng-fourthFoldWrapTwo {
  justify-content: space-between;
}

.zs-smsng-fourthFoldWrapTwo .zs-textContainer {
  width: 40%;
  justify-content: center;
}

.zs-smsng-fourthFoldWrapTwo .zs-swapContainerBottom {
  width: 55%;
}

.zs-smsng-thirdFoldWrap {
  overflow: hidden;
  width: 100%;
}

.zs-smsng-secondFoldInner {
  position: sticky;
  top: 120px;
  padding: 150px 0px;


}

body .zs-smsng-fourthFold,
body .zs-smsng-fifthFold {
  transition: all .3s ease;
}

body.zs-blackTheme .zs-smsng-fourthFold,
body.zs-blackTheme .zs-smsng-fifthFold {
  background-color: #000;
}

.zs-smsng-fifthFold {
  background-color: #fff;
}

.zs-smsng-secondFoldInner {
  height: 70vh;
}

.zs-smsng-fourthFoldWrap .videoContainer {
  width: 95%;
}

.zs-smsng-secondFold {
  height: 250vh;
  position: relative;
  transition: all .3s linear;
  padding: 130px 0px;
}

.cursor-glow {
  position: absolute;
  z-index: 99999;
  width: 12px;
  height: 12px;
  background: rgb(195, 184, 189);
  background: -moz-radial-gradient(circle, rgba(255, 255, 255, 0.8) 0%, rgba(238, 174, 202, 0.2) 100%);
  box-shadow: 0px 0px 20px rgb(255, 255, 255);
  background: radial-gradient(circle, rgba(240, 236, 238, 0.8) 0%, rgba(238, 174, 202, 0.2) 100%);
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: none;
  /* Ensures cursor doesn't interfere with other elements */
  transition: transform 0.1s ease-in-out;
}

.i18n-ar .zs_alignright {
  text-align: left;
}

.i18n-ar .zs_alignleft {
  text-align: right;
}

.i18n-ar .zs_sectioncontainer {
  margin-left: auto;
  margin-right: auto;
}

.i18n-ar .zs-smsng-firstFold figure {
  transform: translate(0, 26%);
  margin: 0 0 0 10px;
}

.i18n-ar .fake-player {
  left: 20%;
  right: unset;
}

.i18n-ar .zs-centerBlock .zs-pblsh-firstFoldLeft {
  right: -21%;
  left: unset;
}

.i18n-ar .zs-centerBlock .zs-pblsh-firstFoldRight {
  left: -21%;
  right: unset;
}

.i18n-ar .zs-smsng-mobile {
  margin-right: -40%;
  margin-left: unset;
}

.i18n-ar .zs-firstFoldAnim .zs-pblsh-firstFoldRight .zs-tabPencil img {
  transform: translate(20%, -20px) rotate(20.71667deg);
}

.i18n-ar .zs-smsng-activeDotArea {
  left: -8%;
  right: unset;
}

.i18n-ar .zs-smsng-fourthFoldWrap .fake-player {
  left: 5%;
  right: unset;
}

.i18n-ar .zs-smsng-fourthFoldWrapTwo .fake-player {
  left: -3%;
  right: unset;
}

.i18n-ar .zs-footerctaText {
  text-align: right;
  margin-left: auto;
  margin-right: unset;
}

.i18n-ar .zs-smsng-fifthFoldInner .zs-smsng-fifthFoldInnerFold:nth-child(1) {
  padding: 20px 120px 20px 0;
}

.i18n-ar .zs-smsng-fifthFoldInnerRight {
  padding: 40px 60px 100px 60px;
}

.i18n-ar .zs-tabPencil {
  right: 85%;
  left: unset;
}

.i18n-ar .zs-tabPencil img {
  transform: translate(19%, 200%) rotate(-8.71667deg);
}

.i18n-ar .zs-swapContainer:nth-child(1) {
  transform: translateX(40%);
}

.i18n-ar .zs-swapContainer:nth-child(3) {
  transform: translate3d(0, 80px, 0);
}

.i18n-ar .zs-swapContainer:nth-child(1) {
  transform: translateX(30%);
}

.i18n-ar .zs_fadeInLeft .zs-swapContainer:nth-child(1) {
  transform: translateX(0);
}

.i18n-ar .zs_fadeInLeft .zs-swapContainer:nth-child(2) {
  transform: translateX(0);
}

.i18n-ar .zs-fifthfoldRightImgLeft {
  transform: translate3d(-15%, 120%, 0);
  right: -10%;
  left: unset;
}

.i18n-ar .zs-fifthfoldRightImgRight {
  transform: translate3d(20%, -200%, 0);
  left: 0;
  right: unset;
}

.i18n-ar .blob {
  right: 0;
  left: unset;
}

.i18n-ar .fakeblob {
  right: 17%;
  left: unset;
}

.i18n-ar .zs_center,
.i18n-ar .zs-smsng-sectionHeader {
  text-align: center;
}

.i18n-ar .zs_center *,
.i18n-ar .zs-smsng-sectionHeader * {
  text-align: center;
}

.i18n-ar .zs-smsng-fifthFoldInner.active .zs-fifthfoldRightImgLeft {
  animation: slideInUp-ar 1.6s ease 1;
  animation-fill-mode: forwards
}

@keyframes slideInUp-ar {
  from {
    transform: translate(-25%, 120%);
    opacity: .3
  }

  100% {
    transform: translate(-25%, 20%);
    opacity: 1;
    z-index: 10
  }
}




@media only screen and (max-width: 1340px) {
  .zs-containerThree {
    margin-left: 50px;
  }

  .i18n-ar .zs-containerThree {
    margin-right: 50px;
    margin-left: unset;
  }
}

@media only screen and (max-width: 1250px) {
  div.zs-smsng-fifthFoldInnerRight {
    padding: 40px 60px 100px 20px;
  }

  span.zs-fifthfoldRightImgLeft,
  span.zs-fifthfoldRightImgRight {
    width: 60%;
    height: 50%;
  }

  section.zs-smsng-secondFold .zs-containerTwo,
  section.zs-smsng-secondFold .zs-containerThree {
    margin-top: 0px;
  }

  h1,
  .zs-smsng-sectionHeader h1 {
    font-size: 38px
  }

  .zs-smsng-sectionHeader h1 figure {
    margin: 0px;
  }

  .zs-smsng-sectionHeader figure svg {
    width: fit-content;
  }

  h2 {
    font-size: 34px
  }

  h3 {
    font-size: 28px
  }

  p {
    font-size: 16px
  }

  .i18n-ar div.zs-smsng-fifthFoldInnerRight {
    padding: 40px 20px 100px 60px;
  }

  .i18n-ar .zs-smsng-sectionHeader h1 figure {
    margin: 0;
  }
}

@media only screen and (max-width: 1100px) {

  div.zs-footerctaText h2 {
    font-size: 28px;
    width: 100%;
  }

  div.zs-swapContainer h2 {
    margin-bottom: 10px;
    width: 95%;
  }

  h1,
  .zs-smsng-sectionHeader h1 {
    font-size: 34px
  }

  h2 {
    font-size: 32px
  }
}

@media only screen and (max-width: 980px) {
  section.zs-smsng-fifthFold {
    background-color: #000;
    padding-bottom: 50px
  }

  section.zs-smsng-secondFold .zs-smsng-swapVideoOne {
    margin-left: 0px;
  }

  div.zs-swapContainer:nth-child(2) {
    padding: 40px 10px;
  }

  .zs-smsng-fourthFoldWrap span.words::before {
    bottom: -30px;
  }

  div.zs-smsng-secondFoldInner {
    margin-left: 0px;
  }

  div.zs-swapContainer {
    width: 50%;
  }

  .zs-smsng-fourthFoldInner .zs-smsng-sectionHeader p {
    max-width: 60%;
  }

  .zs-smsng-fifthFoldInner .zs-smsng-fifthFoldInnerFold:nth-child(1) {
    padding-left: 0px;
  }

  div.zs-footerctaText {
    align-items: center;
  }

  div.zs-smsng-fourthFoldWrapTwo,
  div.zs-smsng-fourthFoldWrap {
    margin: 60px 40px;
  }

  div.zs-smsng-fourthFoldWrap .videoContainer {
    width: 100%;
  }

  .zs-smsng-fourthFoldWrapTwo {
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
  }

  div.zs-smsng-fourthFoldWrapTwo .zs-textContainer {
    width: 85%;
    margin-bottom: 50px;
  }

  div.zs-smsng-fourthFoldWrapTwo .zs-swapContainerBottom {
    width: 85%;
  }

  div.zs-smsng-secondFoldInner {
    height: 100%;
  }

  section div.zs-centerBlock {
    width: 65%;
  }

  section.zs-smsng-secondFold .zs-smsng-secondFoldInner .zs-swapContainer:nth-child(3) {
    width: 80%;
  }

  span.words::before {
    height: 50px;
    width: 100%;
    bottom: -25px;
    rotate: 2deg;
    animation: shiftBackground .4s linear 1s forwards;
  }

  div.zs-smsng-activeDotArea {
    display: none;
  }

  @keyframes slideInDown {
    from {
      transform: translate3d(0, -40%, 0);
      opacity: .3
    }

    100% {
      transform: translate(0, 0);
      opacity: 1
    }
  }

  @keyframes slideInUp {
    from {
      transform: translate(25%, 40%);
      opacity: .3
    }

    100% {
      transform: translate(25%, 20%);
      opacity: 1;
      z-index: 10
    }
  }

  div.zs-smsng-secondFoldInner,
  div.zs-smsng-fourthFoldInner {
    padding: 0px
  }

  div.zs-smsng-thirdFoldInner {
    height: 100%;
  }

  div.zs-swapContainer video {
    height: 95%
  }

  div.zs-swapContainer {
    opacity: 1 !important;
    transform: unset !important;
    transition: unset !important;
  }

  h1,
  .zs-smsng-sectionHeader h1 {
    font-size: 30px
  }

  h2 {
    font-size: 30px
  }

  h3 {
    font-size: 24px
  }

  p {
    font-size: 15px
  }

  section .zs-swapContainer:nth-child(1) {
    transform: unset !important;
  }

  div.zs-smsng-fifthFoldInnerFold {
    width: 80%;
  }

  .zs-footerctaText h2 {
    font-size: 24px;
    text-align: center;
  }

  .zs-smsng-fifthFoldInner {
    flex-direction: column;
    align-items: center;
  }

  .zs-smsng-videoOne.zs-smsng-swapVideoTwo {
    display: none;
    position: relative;
  }

  .zs-smsng-videoOne.zs-smsng-swapVideoOne {
    position: relative;
    opacity: 1 !important;
  }

  .zs-swapContainer.zs-containeFour {
    display: block;
  }

  section .zs-swapContainer:nth-child(1) {
    transform: unset;
    opacity: 1;
  }

  section .zs-swapContainer:nth-child(2) {
    transform: unset;
    opacity: 1;
  }

  .zs-smsng-secondFold,
  .zs-smsng-fourthFold {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .zs-smsng-secondFold,
  .zs-smsng-fourthFold {
    height: 100%;
  }

  .zs-smsng-secondFoldInner,
  .zs-smsng-fourthFoldInner {
    width: 100%;
    justify-content: center;
    height: 100%;
    padding: 0px;
  }

  div.zs-smsng-fourthFoldInner {
    position: unset;
    height: 100%;
    padding: 40px 0px;
  }

  div.zs-containerTwo {
    order: -4;
  }

  div.zs-containerOne {
    order: -2;
  }

  div.zs-containerFour {
    order: 2;
  }

  section.zs-smsng-secondFold .zs-smsng-secondFoldInner div.zs-containerThree,
  section.zs-smsng-fourthFold .zs-smsng-fourthFoldInner div.zs-containerThree {
    position: relative;
    opacity: 1;
    width: 80%;
    transform: unset;
    padding: 40px 10px;
    margin-left: 0px;
  }

  section div.zs-swapContainer {
    width: 80%;
    /* transform: translateX(0);
  opacity: 1; */
  }

  div.zs-video-container {
    height: 50%;
  }

  section.zs-smsng-fourthFold {
    height: 100%;
  }

  .i18n-ar section.zs-smsng-secondFold .zs-smsng-swapVideoOne {
    margin-right: 0;
    margin-left: unset;
  }

  .i18n-ar div.zs-swapContainer:nth-child(2) {
    padding: 40px 10px;
  }

  .i18n-ar div.zs-smsng-secondFoldInner {
    margin-right: 0;
    margin-left: unset;
  }

  .i18n-ar .zs-smsng-fifthFoldInner .zs-smsng-fifthFoldInnerFold:nth-child(1) {
    padding-right: 0;
    padding-left: unset;
  }

  .i18n-ar div.zs-smsng-fourthFoldWrapTwo,
  .i18n-ar div.zs-smsng-fourthFoldWrap {
    margin: 60px 40px;
  }

  .i18n-ar div.zs-smsng-secondFoldInner,
  .i18n-ar div.zs-smsng-fourthFoldInner {
    padding: 0;
  }

  .i18n-ar .zs-footerctaText h2 {
    text-align: center;
  }

  .i18n-ar .zs-smsng-secondFoldInner,
  .i18n-ar .zs-smsng-fourthFoldInner {
    padding: 0;
  }

  .i18n-ar div.zs-smsng-fourthFoldInner {
    padding: 40px 0;
  }

  .i18n-ar section.zs-smsng-secondFold .zs-smsng-secondFoldInner div.zs-containerThree,
  .i18n-ar section.zs-smsng-fourthFold .zs-smsng-fourthFoldInner div.zs-containerThree {
    padding: 40px 10px;
    margin-right: 0;
    margin-left: unset;
  }
}
@media only screen and (max-width: 1280px) {
  .zs-smsng-secondFoldInner {
    padding: 130px 0;
  }
  .zs-smsng-secondFold {
    padding: 0px 0px;
  }
}
@media only screen and (max-width: 768px) {
  .zs-smsng-fourthFoldWrapTwo .fake-player {
    right: 0%;
    bottom: 1%;
  }

  div.zs-smsng-fourthFoldWrapTwo,
  div.zs-smsng-fourthFoldWrap {
    margin: 60px 0px;
  }

  div.zs-video-container video {
    width: 90%;
  }

  div.zs-smsng-sectionHeader p {
    max-width: 80%
  }

  .zs-smsng-secondFold.zs_fadeInUp .zs-swapContainer:nth-child(3) {
    width: 80%;
  }

  section.zs-smsng-firstFold,
  div.zs-smsng-firstFoldInner {
    padding-bottom: 0px;
  }

  .zs-smsng-fifthFoldInner .zs-smsng-fifthFoldInnerFold:nth-child(1) {
    padding: 20px 10px;
  }

  div.zs-smsng-fifthFoldInnerFold {
    width: 70%;
  }

  h3 {
    font-size: 26px
  }

  section.zs-smsng-secondFold .zs-smsng-secondFoldInner div.zs-swapContainer,
  section.zs-smsng-fourthFold .zs-smsng-fourthFoldInner div.zs-swapContainer {
    padding: 20px 0px;
  }

  section div.zs-centerBlock {
    width: 65%;
  }

  section.zs-smsng-secondFold,
  div.zs-smsng-fourthFoldInner {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  div.zs-swapContainer {
    align-items: start;
  }

  div.zs-swapContainer h2,
  div.zs-swapContainer p {
    text-align: left;

  }

  div.zs-swapContainer p {
    width: 90%;
  }

  div.zs-swapContainer h2 {
    width: 100%;
  }

  .zs-smsng-fifthFoldInnerImg .zs-fifthfoldRightImgLeft {
    display: none;
  }

  .zs-smsng-fifthFoldInnerImg .zs-fifthfoldRightImgRight {
    width: 100%;
    position: relative;
    height: calc(100% - 60px);
  }

  .zs-smsng-fifthFoldInnerFold {
    padding: 60px 25px;
  }

  .i18n-ar div.zs-swapContainer h2,
  .i18n-ar div.zs-swapContainer p {
    text-align: right;
  }

  section.zs-smsng-secondFold,
  div.zs-smsng-fourthFoldInner {
    margin: 110px 0 0 0;
  }

  .fake-player {
    right: 10%;
  }
}



@media only screen and (max-width: 480px) {
  section.zs-smsng-fifthFold {
    background-color: #000;
  }

  div.zs-smsng-fifthFoldInner {
    border-radius: 11px;
    padding-bottom: 0px;
  }

  div.foldWrap {
    border-radius: 13px;
  }

  .zs-fifthfoldRightImgLeft {
    display: none;
  }

  span.zs-fifthfoldRightImgRight {
    width: 100%;
    height: 384px;
    overflow: hidden;
  }

  .zs-fifthfoldRightImgRight img {
    width: 100%;
    height: 630px;
  }

  .zs-video-container-two {
    width: 90%;
    margin: auto;
  }

  div.fake-player {
    height: 8px;
  }

  section.zs-smsng-fourthFold .zs-smsng-fourthFoldInner div.zs-containerThree {
    width: 90%;
  }

  .zs-smsng-sectionHeader h1 figure {
    margin-bottom: 20px;
  }

  div.zs-video-container video {
    width: 100%;
  }

  section.zs-smsng-secondFold .zs-smsng-secondFoldInner .zs-swapContainer:nth-child(3) {
    width: 90%;
  }

  .zs-smsng-secondFold.zs_fadeInUp .zs-swapContainer:nth-child(3) {
    width: 90%;
  }

  section div.zs-swapContainer {
    width: 90%
  }

  div.zs-smsng-fifthFoldInnerFold {
    width: 100%;
    padding-bottom: 0px;
    padding-right: 20px;
  }

  h1,
  .zs-smsng-sectionHeader h1 {
    font-size: 30px;
    width: 85%;
  }

  h2 {
    font-size: 26px
  }

  p {
    font-size: 16px
  }

  div.zs-smsng-secondFoldInner {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .zs-smsng-secondFold .zs-swapContainer.zs-containerTwo h2 {
    line-height: 55px;
  }

  .zs-swapContainer h2,
  .zs-smsng-thirdFoldInner h2 {
    line-height: 40px;
  }

  div.zs-smsng-sectionHeader p {
    max-width: 90%;
  }

  section.zs-smsng-thirdFold {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .i18n-ar .zs-video-container-two {
    margin: auto;
  }

  .i18n-ar div.zs-smsng-fifthFoldInnerFold {
    padding-left: 20px;
    padding-right: unset;
  }
}

@media only screen and (max-height: 820px) {

  .zs-smsng-secondFoldInner,
  .zs-smsng-fourthFoldInner {
    top: 0px;
  }
}

@media only screen and (min-width: 1600px) {
  .zs-smsng-secondFold {
    padding-top: 0px;
  }

  .zs-smsng-activeScrollDot {
    width: 5px !important;
  }
}

@media only screen and (max-width: 1600px) {
  .zs-smsng-secondFoldInner {
    height: 100vh;
    top: 0px;
  }

  div.zs-smsng-dot {
    height: 5px;
    width: 10px;
  }

  .zs-smsng-dot.active {
    width: 120px;
    height: 5px;
  }

  .zs-smsng-activeDotArea {
    position: unset;
    flex-direction: row;
    height: 100px;
    width: 100%;
  }

  .zs-smsng-dot.active .zs-smsng-activeScrollDot {
    height: 5px !important;
    width: 0%;
  }
}

@media only screen and (max-width: 1400px) {

  .zs-smsng-fourthFoldInner,
  .zs-smsng-secondFoldInner {
    overflow: hidden;

  }
  .zs-smsng-fourthFoldWrapTwo .zs-swapContainerBottom {
    margin: 0 auto;
  }
}

@media only screen and (max-width: 1570px) {
  .zs-smsng-secondFold .zs-smsng-swapVideoOne {
    margin-left: 25px;
  }

  section div.zs-centerBlock {
    width: 65%;
  }

  div.zs-swapContainer {
    width: 48%;
  }

  .zs-swapContainer:nth-child(2) {
    padding: 40px 35px;
  }

  .i18n-ar .zs-video-container-two {
    margin: auto;
  }

  .i18n-ar div.zs-smsng-fifthFoldInnerFold {
    padding-left: 20px;
    padding-right: unset;
  }
}
@media only screen and (max-width: 1080px) {
  .zs-smsng-secondFoldInner {
    height: auto;
  }
  .zs-smsng-activeDotArea {
    align-items: center;
  }
  .zs-smsng-secondFold {
    padding: 130px 0 0 0;
  }
}
@media only screen and (max-width: 580px) {
  .zs-smsng-fourthFoldWrap .fake-player {
          right: 7%;
   }
  .zs-smsng-fourthFoldWrapTwo .zs-smsng-videoTwo {
    border-radius: 0;
  }
  div.zs-smsng-fourthFoldWrapTwo .zs-swapContainerBottom {
    width: 80%;
  }
  div.zs-smsng-fourthFoldInner {
    margin: 0;
  }
  .zs-smsng-fourthFoldInner .zs-smsng-sectionHeader p {
    max-width: 90%;
  }
}