.m4-blog-banner{background:#444;margin:0 auto;max-width:714px;position:relative;width:100%}.m4-blog-banner:after{background:#16a500;bottom:0;clip-path:polygon(100% 8%,0 100%,100% 100%);content:"";height:195px;position:absolute;right:0;width:307px;z-index:0}.m4-blog-banner .m4-blog-banner-container{align-items:center;box-sizing:border-box;display:flex;gap:17px;height:100%;padding:20px;text-align:left;width:100%}.m4-blog-banner .m4-blog-banner-container .m4bbc-title{color:#fff;font-family:DIN-Black,sans-serif;font-size:36px;font-weight:inherit;letter-spacing:-1px;line-height:33px;max-width:368px;text-align:left;text-transform:uppercase;width:100%}.m4-blog-banner .m4-blog-banner-container .block.text{padding-left:20px}.m4-blog-banner.demo .m4-blog-banner-container .block.text{padding-bottom:2px;padding-left:20px;padding-top:14.8px}.m4-blog-banner .block.video img{height:auto;object-fit:contain;position:relative;width:100%;z-index:1}.m4-blog-banner .block.video{max-width:268px;width:100%}.m4-blog-banner .m4-blog-banner-container .m4bbc-button a{background:#16a500;color:#fff;cursor:pointer;display:inline-block;font-family:DIN-Black,sans-serif;font-size:14px;font-weight:inherit;margin-top:14px;padding:9px 30px;text-decoration:none;text-transform:uppercase;transition:.25s}.m4-blog-banner .m4-blog-banner-container .m4bbc-button a:hover{background:#aeaeae;color:#000}.m4-blog-banner.dashboard .m4-blog-banner-container .block.text{padding-top:1px}.m4-blog-banner.dashboard .block.video{max-width:323px;width:100%}.m4-blog-banner.dashboard .block.video img{height:auto;margin-bottom:-19px;object-fit:contain;padding-top:3px;position:relative;width:100%;z-index:1}.m4-blog-banner.dashboard .m4-blog-banner-container .m4bbc-title{max-width:300px}.m4-blog-banner.demo:after{display:none}.m4-blog-banner.demo:before{background:#444 url(https://machinemetrics.com/hubfs/blog-3-bg.svg) no-repeat;content:"";height:311px;position:absolute;right:-171px;top:-24px;width:506px}.m4-blog-banner.demo .m4-blog-banner-container{padding:20px 20px 38px}.m4-blog-banner.tool .m4-blog-banner-container{padding:40px 20px}.m4-blog-banner.demo{overflow:hidden}.m4-blog-banner.demo .m4-blog-banner-container .block.text{z-index:4}.m4-blog-banner.tool{background:#fff;border:1px solid #ccc;overflow:hidden}.m4-blog-banner.tool .block.video img{height:300px;position:absolute;right:-230px;top:-101px}.m4-blog-banner.tool:after{display:none}.m4-blog-banner.tool .m4bbc-title{color:#16a500}@media (max-width:720px){body .m4-blog-banner.tool .m4-blog-banner-container .block.text{margin-top:190px}body .m4-blog-banner.tool .m4-blog-banner-container{gap:0}body .m4-blog-banner.tool .m4-blog-banner-container .m4bbc-title{max-width:100%}body .m4-blog-banner.tool .block.video img{left:0;right:unset}body .m4-blog-banner.watch .m4-blog-banner-container{gap:31px}body .m4-blog-banner.demo .m4-blog-banner-container .block.text{padding:0}body .m4-blog-banner.demo:before{bottom:-63px;height:276px;position:absolute;right:-148px;top:auto;width:448px}body .m4-blog-banner.demo .m4-blog-banner-container{padding:20px 30px 144px}body .m4-blog-banner .m4-blog-banner-container{align-items:baseline;flex-direction:column;gap:27px;padding:20px 30px}body .m4-blog-banner{max-width:357px;width:100%}body .m4-blog-banner .m4-blog-banner-container .m4bbc-title{font-size:35px;max-width:270px}body .m4-blog-banner .m4-blog-banner-container .block.text{padding:0}body .m4-blog-banner .block.video{margin:0 auto;max-width:235px;width:100%}}