.divider {
width: 100%;
height: 70px;
overflow: hidden;
position: relative;
}
.divider.white-waves-top::before {
content: '';
font-family: 'shape divider from ShapeDividers.com';
position: absolute;
z-index: 3;
pointer-events: none;
background-repeat: no-repeat;
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 70px;
background-position: 50% 0%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
.divider.white-waves-bottom::before {
content: '';
font-family: 'shape divider from ShapeDividers.com';
position: absolute;
z-index: 3;
pointer-events: none;
background-repeat: no-repeat;
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 70px;
background-position: 50% 100%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
.divider.blue-waves-top::before {
content: '';
font-family: 'shape divider from ShapeDividers.com';
position: absolute;
z-index: 3;
pointer-events: none;
background-repeat: no-repeat;
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 70px;
background-position: 50% 0%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
.divider.blue-waves-bottom::before {
content: '';
font-family: 'shape divider from ShapeDividers.com';
position: absolute;
z-index: 3;
pointer-events: none;
background-repeat: no-repeat;
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 70px;
background-position: 50% 100%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
.divider.green-waves-top::before {
content: '';
font-family: 'shape divider from ShapeDividers.com';
position: absolute;
z-index: 3;
pointer-events: none;
background-repeat: no-repeat;
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 70px;
background-position: 50% 0%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
.divider.green-waves-bottom::before {
content: '';
font-family: 'shape divider from ShapeDividers.com';
position: absolute;
z-index: 3;
pointer-events: none;
background-repeat: no-repeat;
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 70px;
background-position: 50% 100%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
@media (min-width:2100px) {
.divider::before {
background-size: 100% calc(2vw + 70px);
}
}
.big-photo .divider {
position: absolute;
bottom: 0;
}