/*
  Essential classes for the blocks animation on page scroll
  @link : http://tympanus.net/codrops/2013/07/18/on-scroll-effect-layout/
*/
.cbp-so-section {
  position: relative;
}

.cbp-so-section:before,
.cbp-so-section:after {
  content: " ";
  display: table;
}

.cbp-so-section:after {
  clear: both;
}

.cbp-so-side:before,
.cbp-so-side:after {
  content: "";
  display: table;
}

.cbp-so-side:after {
  clear: both;
}

.cbp-so-init .cbp-so-side {
  opacity: 0;
  transition: none;
}
.cbp-so-init .cbp-so-side-left {
  transform: translateX(-80px);
}
.cbp-so-init .cbp-so-side-right {
  transform: translateX(80px);
}
.cbp-so-init .cbp-so-side-bottom {
  transform: translateY(100px);
}
.cbp-so-init .cbp-so-side-top {
  transform: translateY(-100px);
}
.cbp-so-init .cbp-so-side-top1,
.cbp-so-init .cbp-so-side-top2,
.cbp-so-init .cbp-so-side-top3 {
  transform: translateY(-100px);
}

.cbp-so-section.cbp-so-animate .cbp-so-side {
  transition: transform .5s ease .7s, opacity .5s ease .7s;
  transform: translate(0, 0);
  opacity: 1;
}
.cbp-so-section.cbp-so-animate .cbp-so-side.cbp-so-side-top2 {
  transition: transform .5s ease 1.1s, opacity .5s ease 1.1s;
}
.cbp-so-section.cbp-so-animate .cbp-so-side.cbp-so-side-top3 {
  transition: transform .5s ease 1.4s, opacity .5s ease 1.4s;
}
.cbp-so-section.cbp-so-animate .cbp-so-side.cbp-so-side-bottom {
  transition: transform .5s ease 1.7s, opacity .5s ease 1.7s;
}