#main2 {
  height: 100%;
  font-size: 16px;
  color: white;
  overflow-x: hidden;
}
#main2:before, #main2:after {
	height: 400px !important;
    content: "";
    position: fixed;
    width: 25%;
    max-width: 677px;
    transform: translateX(-67%);
    right: 0;
    height: 50%;
    z-index: -1;
}
#main2:before {
 top: 370px;
    background-color: #00607c;
    transition: all 0.8s;
}
#main2:after {
	top: 50%;
    background-color: #dedede;
    WIDTH: 424px;
    transform: translateX(-63%);
}
#main2.icon-1-bg:before {
  background: #f4bd89;
}
#main2.icon-2-bg:before {
  background: orange;
}
#main2.icon-3-bg:before {
  background: skyblue;
}


.contain {
  max-width: 1170px;
  margin: 0 auto;
  height: 430px;
}
.contain li {
  position: relative;
  z-index: 2;
  min-height: 525px;
  margin-left: 420px;
  padding: 6em 2em;
}
.contain li:before, .contain li:after {
  content: "";
  position: absolute;
  width: 420px;
  right: 100%;
  z-index: 2;
}
.contain li:before {
  top: 0;
  height: 545px;
  background-repeat: no-repeat;
  background-size: 430px;
}

.contain li h2, .contain li p {
  transform: translate3d(0, 110%, 0);
  opacity: 0;
}
.contain li h2.in-view, .contain li p.in-view {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}
.contain li h2 {
  transition: all 0.5s cubic-bezier(0.66, 0, 0.625, 1.39);
}
.contain li p {
  transition: all 0.5s 0.05s cubic-bezier(0.66, 0, 0.625, 1.39);
}

.icon-1:before {
	background-image: url(/img/ampersand_scroll/ampersandfinalissimo.svg);
    transform: translateX(25%);
    margin-top: 210px;
}


footer {
  height: 50%;
  background: #3e253c;
}