.divider-shape-triangle {
    position: absolute;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}

.divider-shape-triangle svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: var(--triangle-height-large);
}

/* offset arrow */
    .shape-hero-top {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		overflow: hidden;
		line-height: 0;
    }

    .shape-hero-top svg {
		position: relative;
		display: block;
		width: calc(100% + 1.3px);
		height: 49px;
		fill: var(--bg-page);
    }

    .shape-hero-bottom {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		overflow: hidden;
		line-height: 0;
    }

	.shape-hero-bottom svg {
		position: relative;
		display: block;
		width: calc(100% + 1.3px);
		height: 49px;		
        fill: var(--bg-page);
    }

	.shape-footer-top {
		position: relative;
    }

    .shape-footer-top svg {
	fill: var(--bg-footer);
	height: 60px;
	width: 100%;
    }
	
    
/* vertical align */
    .divider-align-bottom {
	bottom: 0px;
	position: relative;
    }
    
    .divider-align-top {
        top: 0;
        left: 0; 
    }
    
/* orientation */    
    .divider-point-up {   /* remove for point down */
        transform: rotate(180deg);
    }

/** mobile devices **/
@media (min-width: 660px) {
    .divider-shape-triangle svg {
        width: calc(100% + 1.3px);
        height: var(--triangle-height-mobile);
    }
	
    .shape-hero-top svg {
		height: 80px;
    }

	.shape-hero-bottom svg {
		height: 80px;		
    }	
	
}