
.helpingText{
  opacity: 0;
}
.helpingText.helpingOpacity{
  opacity: 1;
}
.fadeTopAni{
  padding-top: 80px;
  margin-top: -400px;
}

#scrollHorizontal1 {
 transform: translate(-750px, 0);
}
 #scrollHorizontal2 {
   transform: translate(750px, 0);
}
 #scrollHorizontal3 {
   transform: translate(0, 800px);
}


div.helpingReveal {
  opacity: 0;
  /*transition: 0.5s;*/
}
.helpingClientSection .clientsProjectSection .projectWraper{
  max-width: 390px;
  width: 100%;
  min-width: 390px;
}

 #scrollHorizontalBar {
  padding-top: 50px;
   display: flex;
   overflow: hidden;
   align-items: center;
   min-height: 100vh;
   max-width: 100%;
   justify-content: center;
   margin-left: auto !important;
   margin-right: auto !important;
}


.bottoFadeAni{
  padding-top: 170px
}
.helpingClientSection .clientsProjectSection .projectWraper{
  max-width: 390px;
  width: 100%;
  min-width: 390px;
}
.helpingText{
  min-height: 100vh;
  display: flex;
  align-items: center;
}


@media (max-width: 1600px) {
  #scrollHorizontal1 {
   transform: translate(-600px, 0);
  }
   #scrollHorizontal2 {
     transform: translate(600px, 0);
  }
   #scrollHorizontal3 {
     transform: translate(0, 700px);
  }
  .fadeTopAni{
    padding-top: 80px;
    margin-top: -300px;
  }
  .fadeTopAni, .bottoFadeAni{
    padding-top: 0px
  }
}

@media (max-width: 1200px) {
 .helpingClientSection .clientsProjectSection .projectWraper{
    max-width: 300px;
    width: 100%;
    min-width: 300px;
  } 
  .clientsProjectSection .projectWraper a.clientsProject .cover{
    height: 442px;
  }
  .clientsProjectSection .projectWraper:nth-child(2) {
    margin-top: 52px;
  }
  .clientsProjectSection .projectWraper:nth-child(3) {
    margin-top: 104px;
  }
  .fadeTopAni{
    margin-top: -100px;
  }

}

@media (max-width: 991px) {
  .fadeTopAni{
    margin-top: inherit;
  }
 .clientsProjectSection .projectWraper a.clientsProject .cover{
   height:360px;
 }
 .helpingClientSection .clientsProjectSection .projectWraper{
   max-width: 250px;
   width: 100%;
   min-width: 250px;
 } 
 .clientsProjectSection .projectWraper:nth-child(2) {
    margin-top: 35px;
  }
  .clientsProjectSection .projectWraper:nth-child(3) {
    margin-top: 70px;
  }
  #scrollHorizontalBar{
    position: inherit !important;
    overflow: inherit;
    min-height: inherit;
  }
  .scrollmagic-pin-spacer{
    min-height: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin-top: 50px !important;
  }
  #scrollHorizontal1 {
   transform: translate(0) !important;
  }
   #scrollHorizontal2 {
     transform: translate(0) !important;
  }
   #scrollHorizontal3 {
     transform: translate(0) !important;
  }
   #scrollHorizontal4 {
     transform: translate( 0) !important;
  }
   #scrollHorizontal5 {
     transform: translate(0) !important;
  }
   #scrollHorizontal6 {
     transform: translate(0) !important;
  }
  .helpingText{
   min-height: auto;
   display: flex;
   align-items: center;
  }
  .clientsProjectSection{
    margin-top: 0px;
  }
  .cd-section{
    min-height: auto;
  }
}

@media (max-width: 767px) {
  .clientsProjectSection .projectWraper a.clientsProject .cover{
    height:343px;
  }
 .helpingClientSection .clientsProjectSection .projectWraper{
   max-width: 100%;
   width: 100%;
   min-width: 100%;
   margin-top: 0px !important;
   margin-bottom: 60px;
 } 
 .clientsProject{
   max-width: 343px;
   width: 100%;
   min-width: 343px;
   margin-left: auto;
   margin-right: auto;
 }

  .helpingClientSection{
      padding-top: 50px;
      padding-bottom: 0px;
  }
  .helpingClientSection .clientsProjectSection .projectWraper:last-child{
    margin-bottom: 40px;
  }

}
@media (max-width: 360px) {
  .clientsProject{
   max-width: 343px;
   width: 100%;
   min-width: inherit;
   margin-left: auto;
   margin-right: auto;
 }
}