.colorswatch{position:fixed;z-index:99999;top:calc(50% - 124px);left:0;display:block;text-align:center}.colorswatch-inside a{background:#fff;width:30px;height:30px;display:block;border-radius:50%;margin:5px;float:left}.colorswatch-inside.tools{position:absolute;left:-280px;transition:.5s;top:0;width:280px}.colorswatch-btn.js-colorswatch{background:#222;color:#fff;width:40px;height:40px;line-height:40px;font-size:20px;cursor:e-resize}.colorswatch:hover .colorswatch-inside.tools a{box-shadow:0 0 3px #1b1a1c5c}.colorswatch:hover .colorswatch-inside.tools{left:40px}.colorswatch .color-pink{background:#ff6ec7}.colorswatch .color-red{background:#ec4e4f}.colorswatch .color-violet{background:#6936d8}.colorswatch .color-crimson{background:#e62a4e}.colorswatch .color-orange{background:#df6512}.demo-rtl,.demo-ltr{position:fixed;z-index:99999;top:calc(50% - 81px);left:0;display:block;text-align:center;background:#222;width:40px;height:40px;color:#fff!important;line-height:40px;font-weight:700;cursor:pointer}.demo-rtl a,.demo-ltr a{color:#fff}.demo-rtl a:hover,.demo-ltr a:hover{color:#fff!important}.demo-ltr{display:none}.rtl .demo-rtl{display:none}.rtl .demo-ltr{display:block;left:auto;right:0}.rtl .colorswatch{left:auto;right:0}.rtl .colorswatch-inside.tools{left:auto;right:-280px}.rtl .colorswatch:hover .colorswatch-inside.tools{left:auto;right:-40px}.colorswatch .active{border:4px solid #001e57}