/* ZS PXL Dividers - CSS */
.pxl-row-divider-curved-bottom .pxl-row-angle path { fill-rule: evenodd; }

.pxl-divider { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; }

/* Default */
.pxl-divider.horizontal .pxl-divider-separator { border-top: 1px solid rgba(17, 17, 17, .15); width: 100%; }
.pxl-divider.vertical .pxl-divider-separator { border-left: 1px solid rgba(17, 17, 17, .15); height: 200px; }

/* Animation */
.pxl-divider.animated .pxl-divider-separator {
  transform: scaleX(0);
  transform-origin: 0 100%;
  transition: transform 2s cubic-bezier(0.77, 0, 0.175, 1);
}
.pxl-divider.animated.reversal .pxl-divider-separator { transform-origin: 100% 100%; }
.pxl-divider.animated.slow .pxl-divider-separator { transition: transform 2.5s cubic-bezier(0.77, 0, 0.175, 1); }
.pxl-divider.animated.normal .pxl-divider-separator { transition: transform 1.8s cubic-bezier(0.77, 0, 0.175, 1); }
.pxl-divider.animated.fast .pxl-divider-separator { transition: transform 1s cubic-bezier(0.77, 0, 0.175, 1); }
.pxl-divider.animated.pxl-animated .pxl-divider-separator { transform: scale(1); }

.zs-pxl-divider-wrap { width: 100%; }
.zs-pxl-overlay { width: 100%; height: 100%; }

/* Vertical grids */
.pxl-row-divider-vertical1 .pxl-divider-vertical,
.pxl-row-divider-vertical2 .pxl-divider-vertical-two,
.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle{
  position:absolute; top:0; left:0; right:0; width:100%; height:100%;
  margin:0 auto;
}
.pxl-row-divider-vertical1 .pxl-divider-vertical{ max-width:1150px; }
.pxl-row-divider-vertical2 .pxl-divider-vertical-two{ max-width:1290px; }
.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle{ max-width:1150px; }

.pxl-row-divider-vertical1 .pxl-divider-vertical > div,
.pxl-row-divider-vertical2 .pxl-divider-vertical-two > div,
.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle > div{
  background-color:#303233; position:absolute; width:1px; height:100%; top:0;
}

.pxl-row-divider-vertical1 .pxl-divider-vertical > div:nth-child(2):before,
.pxl-row-divider-vertical1 .pxl-divider-vertical > div:nth-child(4):before,
.pxl-row-divider-vertical2 .pxl-divider-vertical-two > div:nth-child(2):before,
.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle > div:nth-child(2):before,
.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle > div:nth-child(4):before{
  -webkit-animation-delay:1s; animation-delay:1s;
}

.pxl-row-divider-vertical1 .pxl-divider-vertical > div:before,
.pxl-row-divider-vertical2 .pxl-divider-vertical-two > div:before,
.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle > div:before{
  content:''; position:absolute; top:0; left:0; width:1px; height:60px;
  background: linear-gradient(0deg, rgba(255,255,255,.3) 0%, rgba(255,255,255,-7) 100%);
  -webkit-animation:pxl_grid_fall 5s linear infinite;
  animation:pxl_grid_fall 5s linear infinite;
}

.pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line1{ left:0; }
.pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line2{ left:33.33%; }
.pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line3{ left:66.66%; }
.pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line4{ left:100%; }

.pxl-row-divider-vertical2 .pxl-divider-vertical-two .pxl-section-line1{ left:0; }
.pxl-row-divider-vertical2 .pxl-divider-vertical-two .pxl-section-line2{ left:50%; }
.pxl-row-divider-vertical2 .pxl-divider-vertical-two .pxl-section-line3{ left:100%; }

.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle .pxl-section-line1{ left:0; }
.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle .pxl-section-line2{ left:33.33%; }
.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle .pxl-section-line3{ left:66.66%; }
.pxl-row-divider-vertical1-circle .pxl-divider-vertical-circle .pxl-section-line4{ left:100%; }

.pxl-row-divider-vertical1-circle .pxl-divider-circle{
  position:absolute; display:flex; top:0; left:0; right:0; width:100%; height:100%;
}
.pxl-row-divider-vertical1-circle .pxl-divider-circle > div{
  flex:1; height:100%; border-radius:50%; border:1px solid rgba(255,255,255,.15);
}
@media (max-width:767px){ .pxl-row-divider-vertical1-circle .pxl-divider-circle .pxl-section-circle2{ display:none; } }
@media (max-width:1024px){ .pxl-row-divider-vertical1-circle .pxl-divider-circle .pxl-section-circle3{ display:none; } }

@keyframes pxl_grid_fall{
  0%{ transform:translateY(-80px); opacity:0; }
  10%{ opacity:1; }
  90%{ opacity:1; }
  100%{ transform:translateY(calc(100vh + 80px)); opacity:0; }
}

.pxl-row-divider-vertical1,
.pxl-row-divider-vertical2,
.pxl-row-divider-vertical1-circle{
  position:absolute; inset:0; width:100%; height:100%;
}