body.wp-customizer .wp-picker-container .wp-color-result.button{ box-sizing:border-box; padding:0 0 0 40px; box-shadow:inset 0 0 1px rgba(0,0,0,.5)!important; -webkit-box-shadow:inset 0 0 1px rgba(0,0,0,.5)!important; border:none; height:30px; border-radius:4px; margin:0 } body.wp-customizer .wp-color-result-text{ background: #f7f7f7; color: #555; height:28px; line-height:28px; border:none; box-shadow:none; font-size:12px; border-radius:0 4px 4px 0; padding:0 15px; border: 1px solid #ccc; } body.wp-customizer .wp-picker-container { max-width: 255px } body.wp-customizer .wp-picker-container .iris-picker { margin: 15px 0 0; border-bottom: none } body.wp-customizer .wp-picker-container, body.wp-customizer .wp-picker-input-wrap { width: 100%; border-radius: 4px; overflow: hidden } body.wp-customizer .wp-picker-open+.wp-picker-input-wrap { width: 100% } body.wp-customizer .wp-picker-container .wp-picker-input-wrap>label, body.wp-customizer.wp-core-ui .wp-picker-clear, body.wp-customizer.wp-core-ui .wp-picker-default { width: 48%; vertical-align: bottom; margin-top: 10px } body.wp-customizer.wp-core-ui .wp-picker-clear, body.wp-customizer.wp-core-ui .wp-picker-default { margin-left: 10% } body.wp-customizer .wp-picker-input-wrap input[type=text].wp-color-picker.alpha-color-control { float: left; width: 100% } body.wp-customizer .wp-picker-input-wrap .button { margin-left: 0; float: right } body.wp-customizer .wp-picker-container .wp-picker-open~.wp-picker-holder .alpha-color-picker-container { display: block } body.wp-customizer .alpha-color-picker-container { border: 1px solid #dfdfdf; border-top: none; display: none; background: #fff; padding: 0 11px 10px; position: relative } body.wp-customizer .alpha-color-picker-container .ui-widget-content, body.wp-customizer .alpha-color-picker-container .ui-widget-header, body.wp-customizer .alpha-color-picker-wrap .ui-state-focus { background: 0 0; border: none } body.wp-customizer .alpha-color-picker-wrap a.iris-square-value:focus { -webkit-box-shadow: none; box-shadow: none } body.wp-customizer .alpha-color-picker-container .ui-slider { position: relative; z-index: 1; height: 24px; text-align: center; margin: 0 auto; width: 88%; width: calc(100% - 28px) } body.wp-customizer .alpha-color-picker-container .ui-slider-handle, body.wp-customizer .alpha-color-picker-container .ui-widget-content .ui-state-default { color: #777; background-color: #fff; text-shadow: 0 1px 0 #fff; text-decoration: none; position: absolute; z-index: 2; box-shadow: 0 1px 2px rgba(0, 0, 0, .2); border: 1px solid #aaa; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-top: -2px; top: 0; height: 26px; width: 26px; cursor: ew-resize; font-size: 0; padding: 0; line-height: 27px; margin-left: -14px } body.wp-customizer .alpha-color-picker-container .ui-slider-handle.show-opacity { font-size: 12px } body.wp-customizer .alpha-color-picker-container .click-zone { width: 14px; height: 24px; display: block; position: absolute; left: 10px } body.wp-customizer .alpha-color-picker-container .max-click-zone { right: 10px; left: auto } body.wp-customizer .alpha-color-picker-container .transparency { height: 24px; width: 100%; background-color: #fff; background-image: url(../../assets/img/transparency-grid.png); box-shadow: 0 0 5px rgba(0, 0, 0, .4) inset; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; padding: 0; margin-top: -24px } @media only screen and (max-width:640px) { body.wp-customizer .wp-picker-input-wrap input[type=text].wp-color-picker.alpha-color-control { height: 33px } }