
/* =========================
  top 
=========================*/


/* =========================
  section
=========================*/
.shapedividers_diagonal-opacity-top {
  overflow: hidden;
  position: relative;
}
.shapedividers_diagonal-opacity-top::before {
  content: "";
  font-family: "shape divider from ShapeDividers.com";
  position: absolute;
  bottom: -1px;
  left: -1px;
  right: -1px;
  top: -1px;
  z-index: 3;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: 100% 40px;
  background-position: 50% 0%;
  transform: rotateY(180deg);
  background-image: url('data:image/svg+xml;charset=utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35.278 3.62" preserveAspectRatio="none"><path d="M35.278.092S8.238.267 0 3.62V.092z" opacity=".2" fill="%23ffffff"/><path d="M35.278.092S8.238.246 0 3.194V.092z" opacity=".2" fill="%23ffffff"/><path d="M35.278.092S8.238.223 0 2.738V.092zM35.278.092H0V0h35.278z" fill="%23ffffff"/></svg>');
}

@media (min-width: 768px) {
  .shapedividers_diagonal-opacity-top::before {
    background-size: 100% 74px;
    background-position: 50% 0%;
    transform: rotateY(180deg);
  }
}

@media (min-width: 1025px) {
  .shapedividers_diagonal-opacity-top::before {
    bottom: -0.1vw;
    left: -0.1vw;
    right: -0.1vw;
    top: -0.1vw;
    background-size: 100% 90px;
    background-position: 50% 0%;
    transform: rotateY(180deg);
  }
}
@media (min-width: 2100px) {
  .shapedividers_diagonal-opacity-top::before {
    background-size: 100% calc(2vw + 90px);
  }
}

.shapedividers_diagonal-opacity-bottom{
  overflow:hidden;
  position:relative;
  }
  .shapedividers_diagonal-opacity-bottom::before{
  content:'';
  font-family:'shape divider from ShapeDividers.com';
  position: absolute;
  bottom: -1px;
  left: -1px;
  right: -1px;
  top: -1px;
  z-index: 3;
  pointer-events: none;
  background-repeat: no-repeat; 
  background-size: 100% 40px;
  background-position: 50% 100%;    
  transform: rotateY(180deg);
  background-image: url('data:image/svg+xml;charset=utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35.278 3.52" preserveAspectRatio="none"><path d="M0 3.528S27.04 3.352 35.278 0v3.528z" opacity=".2" fill="%23ffffff"/><path d="M0 3.528S27.04 3.374 35.278.425v3.103z" opacity=".2" fill="%23ffffff"/><path d="M0 3.528S27.04 3.396 35.278.882v2.646z" fill="%23ffffff"/><path d="M0 3.527h35.278v.092H0z" fill="%23ffffff"/></svg>'); 
  }
  
  @media (min-width:768px){
  .shapedividers_diagonal-opacity-bottom::before{
  background-size: 100% 74px;
  background-position: 50% 100%;  
  transform: rotateY(180deg); 
  }  
  }
   
  @media (min-width:1025px){
  .shapedividers_diagonal-opacity-bottom::before{ 
  bottom: -0.1vw;
  left: -0.1vw;
  right: -0.1vw;
  top: -0.1vw; 
  background-size: 100% 90px;
  background-position: 50% 100%; 
  transform: rotateY(180deg); 
  }
  }
  @media (min-width:2100px){
  .shapedividers_diagonal-opacity-bottom::before{
  background-size: 100% calc(2vw + 90px);
  }
  }
   