//
// Section Dividers //
//
[class*='section-divider-'] {
	position: relative;
	overflow: hidden;
	&:before {
		content: '';
		position: absolute;
	}
}
.section-divider-waves-top {
	&:before {
		top: -1px;
		left: 0;
		@include transform(rotate(180deg));
		background-image: url(../../assets/svg/waves.svg);
		background-size: 100% 100%;
		width: 100%;
		height: 70px;
	}
}
.section-divider-waves-bottom {
	&:before {
		bottom: -1px;
		left: 0;
		background-image: url(../../assets/svg/waves.svg);
		background-size: 100% 100%;
		width: 100%;
		height: 70px;
	}
}
.section-divider-wavesOpacity-top {
	&:before {
		top: -1px;
		left: -5%;
		background-image: url(../../assets/svg/wavesOpacity.svg);
		background-size: 100% 100%;
		width: 110%;
		height: 70px;
	}
}
.section-divider-wavesOpacity-bottom {
	&:before {
		bottom: -1px;
		left: -5%;
		@include transform(rotate(180deg));
		background-image: url(../../assets/svg/wavesOpacity.svg);
		background-size: 100% 100%;
		width: 110%;
		height: 70px;
	}
}
.section-divider-curve-top {
	&:before {
		top: 0;
		left: -5%;
		@include transform(rotate(180deg));
		background-image: url(../../assets/svg/curve.svg);
		background-size: 100% 100%;
		width: 110%;
		height: 60px;
	}
}
.section-divider-curve-bottom {
	&:before {
		bottom: 0;
		left: -5%;
		background-image: url(../../assets/svg/curve.svg);
		background-size: 100% 100%;
		width: 110%;
		height: 60px;
	}
}
@include breakpoint-less(md) {
	.section-divider-waves-top, 
	.section-divider-waves-bottom {
		&:before {
			left: -20%;
			width: 140%;
			height: 50px;
		}
	}
	.section-divider-wavesOpacity-top, 
	.section-divider-wavesOpacity-bottom {
		&:before {
			left: -25%;
			width: 150%;
			height: 50px;
		}
	}
	.section-divider-curve-top, 
	.section-divider-curve-bottom {
		&:before {
			height: 50px;
		}
	}
}