/*Shapes*/
.divider-top {
overflow: hidden;
position: relative;
}
.divider-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% 90px;
background-position: 50% 100%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
@media (min-width:768px) {
.divider-top::before {
background-size: 100% 90px;
background-position: 50% 100%;
}
}
@media (min-width:1025px) {
.divider-top::before {
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 180px;
background-position: 50% 100%;
}
}
@media (min-width:2100px) {
.divider-top::before {
background-size: 100% calc(2vw + 180px);
}
}
.divider-btm {
overflow: hidden;
position: relative;
}
.divider-btm::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% 90px;
background-position: 50% 0%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
@media (min-width:768px) {
.divider-btm::before {
background-size: 100% 90px;
background-position: 50% 0%;
}
}
@media (min-width:1025px) {
.divider-btm::before {
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 180px;
background-position: 50% 0%;
}
}
@media (min-width:2100px) {
.divider-btm::before {
background-size: 100% calc(2vw + 180px);
}
}
.grey-divider {
overflow: hidden;
position: relative;
}
.grey-divider::before {
content: '';
font-family: 'shape divider from ShapeDividers.com';
position: absolute;
z-index: 3;
/*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% 90px;
background-position: 50% 100%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
@media (min-width:2100px) {
.grey-divider::before {
background-size: 100% calc(2vw + 90px);
}
}
.white-divider {
overflow: hidden;
position: relative;
}
.white-divider::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% 90px;
background-position: 50% 100%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
@media (min-width:2100px) {
.white-divider::before {
background-size: 100% calc(2vw + 90px);
}
}
.blue-div-top {
overflow: hidden;
position: relative;
}
.blue-div-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% 90px;
background-position: 50% 100%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
@media (min-width:768px) {
.blue-div-top::before {
background-size: 100% 90px;
background-position: 50% 100%;
}
}
@media (min-width:1025px) {
.blue-div-top::before {
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 180px;
background-position: 50% 100%;
}
}
@media (min-width:2100px) {
.blue-div-top::before {
background-size: 100% calc(2vw + 180px);
}
}
.blue-div-bottom {
overflow: hidden;
position: relative;
}
.blue-div-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% 90px;
background-position: 50% 0%;
background-image: url('data:image/svg+xml;charset=utf8, ');
}
@media (min-width:768px) {
.blue-div-bottom::before {
background-size: 100% 90px;
background-position: 50% 0%;
}
}
@media (min-width:1025px) {
.blue-div-bottom::before {
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw;
background-size: 100% 180px;
background-position: 50% 0%;
}
}
@media (min-width:2100px) {
.blue-div-bottom::before {
background-size: 100% calc(2vw + 180px);
}
}