@charset "utf-8";

.vc-chrome { background: rgb(255, 255, 255); border-radius: 2px; box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px, rgba(0, 0, 0, 0.3) 0px 4px 8px; box-sizing: initial; width: 225px; font-family: Menlo; }

.vc-chrome-controls { display: flex; }

.vc-chrome-color-wrap { position: relative; width: 36px; }

.vc-chrome-active-color { position: relative; width: 30px; height: 30px; border-radius: 15px; overflow: hidden; z-index: 1; }

.vc-chrome-color-wrap .vc-checkerboard { width: 30px; height: 30px; border-radius: 15px; background-size: auto; }

.vc-chrome-sliders { flex: 1 1 0%; }

.vc-chrome-fields-wrap { display: flex; padding-top: 16px; }

.vc-chrome-fields { display: flex; margin-left: -6px; flex: 1 1 0%; }

.vc-chrome-field { padding-left: 6px; width: 100%; }

.vc-chrome-toggle-btn { width: 32px; text-align: right; position: relative; }

.vc-chrome-toggle-icon { margin-right: -4px; margin-top: 12px; cursor: pointer; position: relative; z-index: 2; }

.vc-chrome-toggle-icon-highlight { position: absolute; width: 24px; height: 28px; background: rgb(238, 238, 238); border-radius: 4px; top: 10px; left: 12px; }

.vc-chrome-hue-wrap { position: relative; height: 10px; margin-bottom: 8px; }

.vc-chrome-alpha-wrap { position: relative; height: 10px; }

.vc-chrome-hue-wrap .vc-hue { border-radius: 2px; }

.vc-chrome-alpha-wrap .vc-alpha-gradient { border-radius: 2px; }

.vc-chrome-hue-wrap .vc-hue-picker, .vc-chrome-alpha-wrap .vc-alpha-picker { width: 12px; height: 12px; border-radius: 6px; transform: translate(-6px, -2px); background-color: rgb(248, 248, 248); box-shadow: rgba(0, 0, 0, 0.37) 0px 1px 4px 0px; }

.vc-chrome-body { padding: 16px 16px 12px; background-color: rgb(255, 255, 255); }

.vc-chrome-saturation-wrap { width: 100%; padding-bottom: 55%; position: relative; border-radius: 2px 2px 0px 0px; overflow: hidden; }

.vc-chrome-saturation-wrap .vc-saturation-circle { width: 12px; height: 12px; }

.vc-chrome-fields .vc-input__input { font-size: 11px; color: rgb(51, 51, 51); width: 100%; border-radius: 2px; border: none; box-shadow: rgb(218, 218, 218) 0px 0px 0px 1px inset; height: 21px; text-align: center; }

.vc-chrome-fields .vc-input__label { text-transform: uppercase; font-size: 11px; line-height: 11px; color: rgb(150, 150, 150); text-align: center; display: block; margin-top: 12px; }

.vc-chrome__disable-alpha .vc-chrome-active-color { width: 18px; height: 18px; }

.vc-chrome__disable-alpha .vc-chrome-color-wrap { width: 30px; }

.vc-chrome__disable-alpha .vc-chrome-hue-wrap { margin-top: 4px; margin-bottom: 4px; }