/* */
/* Secondary Colors */
/*Neutral Colors */
.pg-header + .mod.separator,
.mod.wp + .mod.separator,
.mod.hero + .mod.separator {
  padding-top: 8vw;
  padding-top: calc(16vw * 9 / 16);
}
.mod.separator.set-on-top {
  z-index: 1;
}
.mod.separator.has-angles {
  position: relative;
}
.angles-wrap {
  position: absolute;
  width: 100%;
}
.mod.angles-align-top .angles-wrap {
  bottom: 100%;
}
.mod.angles-align-bottom .angles-wrap {
  top: 100%;
}
.angles-wrap .angles-inner {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 30vw;
  overflow: hidden;
}
.angles-wrap .angle {
  position: absolute;
  bottom: 0;
  width: 100%;
}
.angles-wrap .angle-inner {
  height: 0;
  position: relative;
  top: -25px;
}
.angles-wrap .left-to-right .angle-inner {
  transform: skew(0, 11deg);
  transform-origin: top right;
}
.angles-wrap .right-to-left .angle-inner {
  transform: skew(0, -11deg);
  transform-origin: top left;
}
.angles-wrap .border {
  height: 3.255vw;
}
@media only screen and (min-width: 768px) {
  .angles-wrap .border {
    height: 25px;
  }
}
.angles-wrap .filler {
  height: 42.35vw;
  min-height: 215px;
}
@media only screen and (min-width: 768px) {
  .angles-wrap .filler {
    height: 24vw;
    min-height: 325px;
  }
}
.angles-wrap .allow-overflow {
  overflow: visible;
}
.angles-wrap .border-translucent .border {
  opacity: 0.7;
}
.angles-wrap .offset-25 .angle-inner,
.angles-wrap .offset-50 .angle-inner {
  top: 0;
}
.angles-wrap .left-to-right.offset-10 {
  right: 10%;
  width: 90%;
}
.angles-wrap .left-to-right.offset-25 {
  right: 20%;
  width: 80%;
}
.angles-wrap .left-to-right.offset-50 {
  right: 45%;
  width: 55%;
}
.angles-wrap .right-to-left.offset-10 {
  left: 10%;
  width: 90%;
}
.angles-wrap .right-to-left.offset-25 {
  left: 20%;
  width: 80%;
}
.angles-wrap .right-to-left.offset-50 {
  left: 45%;
  width: 55%;
}