.page-designer .bright360-drag-compare{color:#fff;padding-bottom:96px;margin:0;position:relative;overflow:hidden;--x: 50%}.page-designer .bright360-drag-compare .wrapper{max-width:2048px;margin-left:auto;margin-right:auto;padding:0 30px}@media(min-width: 1024px){.page-designer .bright360-drag-compare .wrapper{padding:0 40px}}@media(min-width: 1440px){.page-designer .bright360-drag-compare .wrapper{padding:0 70px}}.page-designer .bright360-drag-compare .grid-container{align-items:center;display:grid;grid-template-columns:repeat(4, calc((100% - 72px) / 4));grid-template-rows:auto;grid-column-gap:24px;-webkit-column-gap:24px;-moz-column-gap:24px;column-gap:24px}@media(min-width: 576px){.page-designer .bright360-drag-compare .grid-container{grid-template-columns:repeat(12, calc((100% - 264px) / 12))}}.page-designer .bright360-drag-compare .compare-title{margin-bottom:32px}.page-designer .bright360-drag-compare .compare-text{grid-column:1/5;text-align:center;margin-bottom:40px;font-size:2rem}.page-designer .bright360-drag-compare .comparison-container{position:relative;font-size:0;line-height:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.page-designer .bright360-drag-compare .comparison-container h6{position:absolute;bottom:16px;right:16px}.page-designer .bright360-drag-compare .comparison-container img{-webkit-user-select:none;-moz-user-select:none;user-select:none}.page-designer .bright360-drag-compare .left-section{position:absolute;width:100%;height:100%;z-index:1;-webkit-clip-path:polygon(0% 0%, 50% 0%, 50% 100%, 0% 100%);clip-path:polygon(0% 0%, 50% 0%, 50% 100%, 0% 100%);-webkit-clip-path:polygon(0% 0%, var(--x) 0%, var(--x) 100%, 0% 100%);clip-path:polygon(0% 0%, var(--x) 0%, var(--x) 100%, 0% 100%)}.page-designer .bright360-drag-compare .left-section h6{right:auto;left:16px}.page-designer .bright360-drag-compare .left-section,.page-designer .bright360-drag-compare .right-section,.page-designer .bright360-drag-compare .comparison-controls{pointer-events:none}.page-designer .bright360-drag-compare .comparison-controls{position:absolute;z-index:2;width:6px;height:100%;top:0;left:calc(50% - 3px);left:calc(var(--x) - 3px);background-color:#fff}.page-designer .bright360-drag-compare .drag-circle{position:absolute;width:32px;left:calc(50% - 16px);top:calc(50% - 16px)}.page-designer .bright360-drag-compare .comparison-range{position:absolute;width:0;height:0;opacity:0}@media screen and (max-width: 576px){.page-designer .bright360-drag-compare .comparison-wrapper{padding:0}.page-designer .bright360-drag-compare .comparison-container h6{right:30px}.page-designer .bright360-drag-compare .left-section h6{left:30px}.page-designer .bright360-drag-compare h6{font-size:14px;line-height:21px}}@media screen and (min-width: 641px){.page-designer .bright360-drag-compare{padding-bottom:120px;margin-top:-1px}.page-designer .bright360-drag-compare .compare-text{grid-column:2/8}.page-designer .bright360-drag-compare .drag-circle{width:64px;left:calc(50% - 32px);top:calc(50% - 32px)}}@media screen and (min-width: 1025px){.page-designer .bright360-drag-compare{margin-top:0}.page-designer .bright360-drag-compare .compare-text{grid-column:3/11}.page-designer .bright360-drag-compare .compare-title{margin-bottom:24px}}
