.sliderOnScreen
{
  overflow:hidden;
}

.sliderOnScreen h2, .sliderOnScreen>div, .titleSliderOnScreen h1
{
  position: relative;
  transition: transform ease 0.3s,opacity ease 0.3s;;
}
.sliderOnScreen h2.left.visible, .sliderOnScreen >div.visible, .titleSliderOnScreen h1.visible
{
  opacity: 100%;
  transform: translateX(0);
}
.sliderOnScreen h2.left.notvisible, .sliderOnScreen >div.notvisible, .titleSliderOnScreen h1.notvisible
{
  opacity: 0%;
  transform: translateX(50%);
}
.sliderOnScreen h2.right.visible
{
  opacity: 100%;
  transform: translateX(0);
}
.sliderOnScreen h2.right.notvisible
{
  opacity: 0%;
  transform: translateX(-50%);
}

.fadeIn 
{
  transition: opacity ease 0.3s;
}

.sliderOnScreen .fadeIn 
{
  transition: opacity ease 0.3s, transform ease 0.3s;
}

.visible.fadeIn, .fadeIn>.visible
{
  opacity: 100%;
}

.notvisible.fadeIn , .fadeIn>.notvisible
{
  opacity: 0%;
}