div.skew-container{color:#fff;transition:all 1s;}.skew,.skew-md{position:relative;background:#904199;}.skew:after,.skew-md:after{position:absolute;content:'';background:inherit;z-index:-1;}.skew.bottom:after,.skew.top:after,.skew-md.bottom:after,.skew-md.top:after{width:100%;height:60%;}.skew.left:after,.skew.right:after,.skew-md.left:after,.skew-md.right:after{height:100%;width:60%;}.skew.bottom:after{bottom:0;left:0;transform-origin:top left;transform:skewY(22deg);}.skew-md.bottom:after{bottom:0;left:0;transform-origin:top left;transform:skewY(5deg);}.skew.top:after{top:0;left:0;transform-origin:top left;transform:skewY(-22deg);}.skew-md.top:after{top:0;left:0;transform-origin:top left;transform:skewY(-5deg);}.skew.left:after{top:0;left:0;transform-origin:bottom left;transform:skewX(22deg);}.skew-md.left:after{top:0;left:0;transform-origin:bottom left;transform:skewX(5deg);}.skew.right:after{top:0;right:0;transform-origin:bottom right;transform:skewX(-22deg);}.skew-md.right:after{top:0;right:0;transform-origin:bottom right;transform:skewX(-5deg);}.skew.left,.skew-md.left{clear:both;z-index:1;}