@charset "UTF-8";
/*! © JetSloth — SPDX-License-Identifier: GPL-2.0-or-later */
.color-picker-field {
  --cp-default-swatch-color: #f8f8f9;
  --cp-column-spacing: 20px;
  --cp-row-spacing: var(--cp-column-spacing);
  --cp-column-spacing-medium: var(--cp-column-spacing);
  --cp-row-spacing-medium: var(--cp-row-spacing);
  --cp-column-spacing-small: var(--cp-column-spacing);
  --cp-row-spacing-small: var(--cp-row-spacing);
  --cp-width: 100px;
  --cp-height: 100px;
  --cp-width-medium: var(--cp-width);
  --cp-height-medium: var(--cp-height);
  --cp-width-small: var(--cp-width);
  --cp-height-small: var(--cp-height);
  --cp-padding: 0;
  --cp-text-font: Helvetica Neue, Helvetica, Arial, sans-serif;
  --cp-text-weight: normal;
  --cp-text-size: 15px;
  --cp-text-line-height: 1.4;
  --cp-text-color: #121212;
  --cp-selected-text-font: var(--cp-text-font);
  --cp-selected-text-weight: var(--cp-text-weight);
  --cp-selected-text-size: var(--cp-text-size);
  --cp-selected-text-line-height: var(--cp-text-line-height);
  --cp-selected-text-color: var(--cp-text-color);
  --cp-price-font: var(--cp-text-font);
  --cp-price-weight: var(--cp-text-weight);
  --cp-price-size: var(--cp-text-size);
  --cp-price-line-height: var(--cp-text-line-height);
  --cp-price-color: var(--cp-text-color);
  --cp-selected-price-font: var(--cp-price-font);
  --cp-selected-price-weight: var(--cp-price-weight);
  --cp-selected-price-size: var(--cp-price-size);
  --cp-selected-price-line-height: var(--cp-price-line-height);
  --cp-selected-price-color: var(--cp-price-color);
  --cp-prefix-font: var(--cp-text-font);
  --cp-prefix-weight: bold;
  --cp-prefix-size: 13px;
  --cp-prefix-line-height: var(--cp-text-line-height);
  --cp-prefix-color: var(--cp-text-color);
  --cp-selected-prefix-font: var(--cp-prefix-font);
  --cp-selected-prefix-weight: var(--cp-prefix-weight);
  --cp-selected-prefix-size: var(--cp-prefix-size);
  --cp-selected-prefix-line-height: var(--cp-prefix-line-height);
  --cp-selected-prefix-color: var(--cp-prefix-color);
  --cp-suffix-font: var(--cp-text-font);
  --cp-suffix-weight: var(--cp-text-weight);
  --cp-suffix-size: 13px;
  --cp-suffix-line-height: var(--cp-text-line-height);
  --cp-suffix-color: var(--cp-text-color);
  --cp-selected-suffix-font: var(--cp-suffix-font);
  --cp-selected-suffix-weight: var(--cp-suffix-weight);
  --cp-selected-suffix-size: var(--cp-suffix-size);
  --cp-selected-suffix-line-height: var(--cp-suffix-line-height);
  --cp-selected-suffix-color: var(--cp-suffix-color);
  --cp-transition-duration: 0.2s;
  --cp-transition-easing: ease-out;
  --cp-source-icon-tick: url("data:image/svg+xml,%3Csvg width='15' height='12' viewBox='0 0 15 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.78166 11.4512C5.07642 11.7805 5.50218 12 5.92795 12C6.35371 12 6.77948 11.8171 7.07424 11.4512L14.5087 3.14634C15.1638 2.41463 15.1638 1.28049 14.5087 0.54878C13.8537 -0.182927 12.8384 -0.182927 12.1834 0.54878L5.92795 7.57317L2.81659 4.09756C2.16157 3.36585 1.14629 3.36585 0.491266 4.09756C-0.163755 4.82927 -0.163755 5.96341 0.491266 6.69512L4.78166 11.4512Z' fill='white'/%3E%3C/svg%3E%0A");
  --cp-source-icon-cicle-tick: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M20 40C31.0457 40 40 31.0457 40 20C40 8.9543 31.0457 0 20 0C8.9543 0 0 8.9543 0 20C0 31.0457 8.9543 40 20 40ZM19.1423 24.7999C18.8016 24.7999 18.461 24.6243 18.2252 24.3609L14.7929 20.556C14.2689 19.9707 14.2689 19.0634 14.7929 18.478C15.3169 17.8926 16.1292 17.8926 16.6532 18.478L19.1423 21.2585L24.1466 15.639C24.6706 15.0536 25.4829 15.0536 26.0069 15.639C26.5309 16.2243 26.5309 17.1317 26.0069 17.717L20.0593 24.3609C19.8235 24.6536 19.4829 24.7999 19.1423 24.7999Z' fill='%23ffffff'/%3E%3C/svg%3E");
  --cp-source-icon-picker: url("data:image/svg+xml,%3Csvg width='31' height='30' viewBox='0 0 31 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M29.1316 1.36841C27.307 -0.456136 24.3489 -0.456136 22.5243 1.36841L19.2198 4.67285L18.1185 3.5715C17.5103 2.96332 16.5242 2.96332 15.9161 3.5715C15.3079 4.17968 15.3079 5.16574 15.9161 5.77392L24.7258 14.5836C25.334 15.1918 26.32 15.1918 26.9282 14.5836C27.5364 13.9754 27.5364 12.9894 26.9282 12.3812L25.8271 11.2801L29.1316 7.97567C30.9561 6.15113 30.9561 3.19295 29.1316 1.36841Z' fill='%23B1C0CF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.9641 7.9287L3.85073 20.042C2.4123 21.4804 2.10789 23.6234 2.9375 25.3601L0.5 27.7976L2.70243 30L5.13993 27.5625C6.87658 28.3921 9.01959 28.0877 10.458 26.6493L22.5714 14.536L15.9641 7.9287ZM18.1665 14.536L15.9641 12.3335L6.05316 22.2444C5.44497 22.8526 5.44497 23.8387 6.05316 24.4469C6.66134 25.055 7.6474 25.055 8.25559 24.4469L18.1665 14.536Z' fill='%23121212'/%3E%3C/svg%3E%0A");
  --cp-source-icon-select-all: url("data:image/svg+xml,%3Csvg width='23' height='23' viewBox='0 0 23 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.8864 2.44352C3.17038 2.15954 3.55554 2 3.95716 2H15.2715C15.8237 2 16.2715 1.55228 16.2715 1C16.2715 0.447715 15.8237 0 15.2715 0H3.95716C3.02511 0 2.13124 0.370254 1.47218 1.02931C0.813125 1.68837 0.442871 2.58224 0.442871 3.51429V18.6C0.442871 19.5321 0.813125 20.4259 1.47218 21.085C2.13124 21.7441 3.02511 22.1143 3.95716 22.1143H19.0429C19.9749 22.1143 20.8688 21.7441 21.5279 21.085C22.1869 20.4259 22.5572 19.5321 22.5572 18.6V11.0572C22.5572 10.5049 22.1095 10.0572 21.5572 10.0572C21.0049 10.0572 20.5572 10.5049 20.5572 11.0572V18.6C20.5572 19.0016 20.3976 19.3868 20.1137 19.6708C19.8297 19.9548 19.4445 20.1143 19.0429 20.1143H3.95716C3.55555 20.1143 3.17038 19.9548 2.8864 19.6708C2.60241 19.3868 2.44287 19.0016 2.44287 18.6V3.51429C2.44287 3.11267 2.60241 2.72751 2.8864 2.44352ZM22.2644 4.22139C22.6549 3.83086 22.6549 3.1977 22.2644 2.80717C21.8738 2.41665 21.2407 2.41665 20.8501 2.80717L11.5001 12.1572L8.43577 9.09289C8.04525 8.70237 7.41209 8.70237 7.02156 9.09289C6.63104 9.48342 6.63104 10.1166 7.02156 10.5071L10.793 14.2785C11.1835 14.6691 11.8167 14.6691 12.2072 14.2785L22.2644 4.22139Z' fill='%231D1D1F'/%3E%3C/svg%3E%0A");
  --cp-source-icon-deselect-all: url("data:image/svg+xml,%3Csvg width='23' height='22' viewBox='0 0 23 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.5 3.22222C1.5 2.63285 1.73413 2.06762 2.15087 1.65087C2.56762 1.23413 3.13285 1 3.72222 1H19.2778C19.8671 1 20.4324 1.23413 20.8491 1.65087C21.2659 2.06762 21.5 2.63285 21.5 3.22222V18.7778C21.5 19.3671 21.2659 19.9324 20.8491 20.3491C20.4324 20.7659 19.8671 21 19.2778 21H3.72222C3.13285 21 2.56762 20.7659 2.15087 20.3491C1.73413 19.9324 1.5 19.3671 1.5 18.7778V3.22222Z' stroke='%231D1D1F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  --cp-selected-icon: var(--cp-source-icon-cicle-tick);
  --cp-selected-icon-size: 25px;
  --cp-selected-icon-color: #ffffff;
  --cp-selected-icon-color-alt: #121212;
  --cp-picker-icon: var(--cp-source-icon-picker);
  --cp-picker-icon-size: 36px;
  --cp-picker-icon-color: #121212;
  --cp-picker-icon-color-alt: #ffffff;
  --cp-select-all-icon: var(--cp-source-icon-select-all);
  --cp-select-all-toggled-icon: var(--cp-source-icon-deselect-all);
  --cp-select-all-icon-size: var(--cp-picker-icon-size);
  --cp-select-all-icon-color: var(--cp-picker-icon-color);
  --cp-select-all-background-color: var(--cp-default-swatch-color);
  --cp-select-all-toggled-background-color: var(--cp-select-all-background-color);
  --cp-select-all-text-color: var(--cp-text-color);
}

.color-picker-swatch, .color-picker-swatch:before, .color-picker-swatch:after,
.color-picker-swatch *,
.color-picker-swatch *:before,
.color-picker-swatch *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.color-picker-choice {
  position: relative;
}

.color-picker-swatch {
  display: block;
  width: 100%;
}

.color-picker-swatch-color-wrap,
.color-picker-swatch-color {
  font-size: 0;
  line-height: 0;
}

.color-picker-choice .gform-field-label {
  position: relative;
  cursor: pointer;
}

.color-picker-field .ginput_container_text input,
.color-picker-choice input[type=radio],
.color-picker-choice input[type=checkbox],
.color-picker-choice-other input,
.color-picker-choice-other .gchoice_label,
.color-picker-field input[value=gf_other_choice] ~ label {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
}

/*
.color-picker-field:not(.color-picker-show-labels) {
	.color-picker-choice-text,
	.color-picker-choice-price {
		@include accessibility;
	}
}
*/
.color-picker-swatch-color-wrap,
.color-picker-swatch-color,
.color-picker-swatch-text-wrap,
.color-picker-swatch-text-prefix,
.color-picker-swatch-text-suffix,
.color-picker-swatch-text,
.color-picker-swatch-price {
  width: 100%;
  display: block;
}

.color-picker-field[class*=cp-theme--] button {
  border: none;
}
.color-picker-field[class*=cp-theme--] .color-picker-choice {
  display: inline-block;
}
.color-picker-field[class*=cp-theme--] .color-picker-swatch-text-prefix {
  font-family: var(--cp-prefix-font);
  font-weight: var(--cp-prefix-weight);
  font-size: var(--cp-prefix-size);
  line-height: var(--cp-prefix-line-height);
  color: var(--cp-prefix-color);
}
.color-picker-field[class*=cp-theme--] .color-picker-choice-selected .color-picker-swatch-text-prefix {
  font-family: var(--cp-selected-prefix-font);
  font-weight: var(--cp-selected-prefix-weight);
  font-size: var(--cp-selected-prefix-size);
  line-height: var(--cp-selected-prefix-line-height);
  color: var(--cp-selected-prefix-color);
}
.color-picker-field[class*=cp-theme--] .color-picker-swatch-text {
  font-family: var(--cp-text-font);
  font-weight: var(--cp-text-weight);
  font-size: var(--cp-text-size);
  line-height: var(--cp-text-line-height);
  color: var(--cp-text-color);
}
.color-picker-field[class*=cp-theme--] .color-picker-choice-selected .color-picker-swatch-text {
  font-family: var(--cp-selected-text-font);
  font-weight: var(--cp-selected-text-weight);
  font-size: var(--cp-selected-text-size);
  line-height: var(--cp-selected-text-line-height);
  color: var(--cp-selected-text-color);
}
.color-picker-field[class*=cp-theme--] .color-picker-swatch-price {
  font-family: var(--cp-price-font);
  font-weight: var(--cp-price-weight);
  font-size: var(--cp-price-size);
  line-height: var(--cp-price-line-height);
  color: var(--cp-price-color);
}
.color-picker-field[class*=cp-theme--] .color-picker-choice-selected .color-picker-swatch-price {
  font-family: var(--cp-selected-price-font);
  font-weight: var(--cp-selected-price-weight);
  font-size: var(--cp-selected-price-size);
  line-height: var(--cp-selected-price-line-height);
  color: var(--cp-selected-price-color);
}
.color-picker-field[class*=cp-theme--] .color-picker-swatch-text-suffix {
  font-family: var(--cp-suffix-font);
  font-weight: var(--cp-suffix-weight);
  font-size: var(--cp-suffix-size);
  line-height: var(--cp-suffix-line-height);
  color: var(--cp-suffix-color);
}
.color-picker-field[class*=cp-theme--] .color-picker-choice-selected .color-picker-swatch-text-suffix {
  font-family: var(--cp-selected-suffix-font);
  font-weight: var(--cp-selected-suffix-weight);
  font-size: var(--cp-selected-suffix-size);
  line-height: var(--cp-selected-suffix-line-height);
  color: var(--cp-selected-suffix-color);
}
.color-picker-field[class*=cp-theme--] .color-picker-swatches-popup-trigger {
  display: inline-block;
  width: auto;
}
.color-picker-field[class*=cp-theme--] label[id$=select_all],
.color-picker-field[class*=cp-theme--] button[id$=select_all] {
  cursor: pointer;
  background-color: transparent;
  outline: none !important;
}
.color-picker-field[class*=cp-theme--] label[id$=select_all] .color-picker-select-all-icon,
.color-picker-field[class*=cp-theme--] button[id$=select_all] .color-picker-select-all-icon {
  background-color: var(--cp-select-all-background-color);
}
.color-picker-field[class*=cp-theme--] label[id$=select_all] i,
.color-picker-field[class*=cp-theme--] button[id$=select_all] i {
  display: inline-block;
  width: var(--cp-select-all-icon-size);
  height: var(--cp-select-all-icon-size);
  background-color: var(--cp-select-all-icon-color);
  -webkit-mask-image: var(--cp-select-all-icon);
  mask-image: var(--cp-select-all-icon);
  -webkit-mask-position: 50% 50%;
  mask-position: 50% 50%;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.color-picker-field[class*=cp-theme--] label[id$=select_all] .color-picker-select-all-label,
.color-picker-field[class*=cp-theme--] button[id$=select_all] .color-picker-select-all-label {
  text-transform: none;
  letter-spacing: 0;
  font-family: var(--cp-text-font);
  font-weight: var(--cp-text-weight);
  font-size: var(--cp-text-size);
  line-height: var(--cp-text-line-height);
  color: var(--cp-select-all-text-color);
}
.color-picker-field[class*=cp-theme--] label[id$=select_all].is-checked .color-picker-select-all-icon,
.color-picker-field[class*=cp-theme--] button[id$=select_all].is-checked .color-picker-select-all-icon {
  background-color: var(--cp-select-all-toggled-background-color);
}
.color-picker-field[class*=cp-theme--] label[id$=select_all].is-checked i,
.color-picker-field[class*=cp-theme--] button[id$=select_all].is-checked i {
  -webkit-mask-image: var(--cp-select-all-toggled-icon);
  mask-image: var(--cp-select-all-toggled-icon);
}

/* GF theme framework integration / overrides */
.gfield.color-picker-field.color-picker-use-swatches-popup .gfield_checkbox,
.gfield.color-picker-field.color-picker-use-swatches-popup .gfield_radio,
.gform_legacy_markup_wrapper .gfield.color-picker-field.color-picker-use-swatches-popup .gfield_checkbox,
.gform_legacy_markup_wrapper .gfield.color-picker-field.color-picker-use-swatches-popup .gfield_radio,
.gform_wrapper.gravity-theme .gfield.color-picker-field.color-picker-use-swatches-popup .gfield_checkbox,
.gform_wrapper.gravity-theme .gfield.color-picker-field.color-picker-use-swatches-popup .gfield_radio,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.color-picker-use-swatches-popup .gfield_checkbox,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.color-picker-use-swatches-popup .gfield_radio {
  max-width: 97vw;
  max-height: 97vh;
  max-height: 97svh;
  overflow: scroll;
}
.gfield.color-picker-field .ginput_container_text,
.gfield.color-picker-field .gfield_checkbox,
.gfield.color-picker-field .gfield_radio,
.gform_legacy_markup_wrapper .gfield.color-picker-field .ginput_container_text,
.gform_legacy_markup_wrapper .gfield.color-picker-field .gfield_checkbox,
.gform_legacy_markup_wrapper .gfield.color-picker-field .gfield_radio,
.gform_wrapper.gravity-theme .gfield.color-picker-field .ginput_container_text,
.gform_wrapper.gravity-theme .gfield.color-picker-field .gfield_checkbox,
.gform_wrapper.gravity-theme .gfield.color-picker-field .gfield_radio,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field .ginput_container_text,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field .gfield_checkbox,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field .gfield_radio {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-column-gap: var(--cp-column-spacing);
  -moz-column-gap: var(--cp-column-spacing);
  column-gap: var(--cp-column-spacing);
  row-gap: var(--cp-row-spacing);
}
.gfield.color-picker-field.cp-align--center .gfield_label, .gfield.color-picker-field.cp-align--right .gfield_label,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--center .gfield_label,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--right .gfield_label,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--center .gfield_label,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--right .gfield_label,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--center .gfield_label,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--right .gfield_label {
  display: block;
  width: 100%;
}
.gfield.color-picker-field.cp-align--center .ginput_container_text,
.gfield.color-picker-field.cp-align--center .gfield_checkbox,
.gfield.color-picker-field.cp-align--center .gfield_radio,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--center .ginput_container_text,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--center .gfield_checkbox,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--center .gfield_radio,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--center .ginput_container_text,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--center .gfield_checkbox,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--center .gfield_radio,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--center .ginput_container_text,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--center .gfield_checkbox,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--center .gfield_radio {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.gfield.color-picker-field.cp-align--center .gfield_label,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--center .gfield_label,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--center .gfield_label,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--center .gfield_label {
  text-align: center;
}
.gfield.color-picker-field.cp-align--center.color-picker-use-swatches-popup,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--center.color-picker-use-swatches-popup,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--center.color-picker-use-swatches-popup,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--center.color-picker-use-swatches-popup {
  display: grid;
}
.gfield.color-picker-field.cp-align--center.color-picker-use-swatches-popup .color-picker-swatches-popup-trigger,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--center.color-picker-use-swatches-popup .color-picker-swatches-popup-trigger,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--center.color-picker-use-swatches-popup .color-picker-swatches-popup-trigger,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--center.color-picker-use-swatches-popup .color-picker-swatches-popup-trigger {
  justify-self: center;
}
.gfield.color-picker-field.cp-align--right .ginput_container_text,
.gfield.color-picker-field.cp-align--right .gfield_checkbox,
.gfield.color-picker-field.cp-align--right .gfield_radio,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--right .ginput_container_text,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--right .gfield_checkbox,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--right .gfield_radio,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--right .ginput_container_text,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--right .gfield_checkbox,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--right .gfield_radio,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--right .ginput_container_text,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--right .gfield_checkbox,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--right .gfield_radio {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.gfield.color-picker-field.cp-align--right .gfield_label,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--right .gfield_label,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--right .gfield_label,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--right .gfield_label {
  text-align: right;
}
.gfield.color-picker-field.cp-align--right.color-picker-use-swatches-popup,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--right.color-picker-use-swatches-popup,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--right.color-picker-use-swatches-popup,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--right.color-picker-use-swatches-popup {
  display: grid;
}
.gfield.color-picker-field.cp-align--right.color-picker-use-swatches-popup .color-picker-swatches-popup-trigger,
.gform_legacy_markup_wrapper .gfield.color-picker-field.cp-align--right.color-picker-use-swatches-popup .color-picker-swatches-popup-trigger,
.gform_wrapper.gravity-theme .gfield.color-picker-field.cp-align--right.color-picker-use-swatches-popup .color-picker-swatches-popup-trigger,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field.cp-align--right.color-picker-use-swatches-popup .color-picker-swatches-popup-trigger {
  justify-self: right;
}
.gfield.color-picker-field .gfield-choice-input + label,
.gfield.color-picker-field .gform-field-label,
.gform_legacy_markup_wrapper .gfield.color-picker-field .gfield-choice-input + label,
.gform_legacy_markup_wrapper .gfield.color-picker-field .gform-field-label,
.gform_wrapper.gravity-theme .gfield.color-picker-field .gfield-choice-input + label,
.gform_wrapper.gravity-theme .gfield.color-picker-field .gform-field-label,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field .gfield-choice-input + label,
.gform_wrapper.gform-theme--framework .gfield.color-picker-field .gform-field-label {
  margin-left: 0;
  max-width: 100%;
}
.gfield.color-picker-field label[id$=select_all],
.gfield.color-picker-field button[id$=select_all],
.gform_legacy_markup_wrapper .gfield.color-picker-field label[id$=select_all],
.gform_legacy_markup_wrapper .gfield.color-picker-field button[id$=select_all],
.gform_wrapper.gravity-theme .gfield.color-picker-field label[id$=select_all],
.gform_wrapper.gravity-theme .gfield.color-picker-field button[id$=select_all],
.gform_wrapper.gform-theme--framework .gfield.color-picker-field label[id$=select_all],
.gform_wrapper.gform-theme--framework .gfield.color-picker-field button[id$=select_all] {
  margin: 0;
}

.gform_legacy_markup_wrapper .color-picker-field .gfield_label.gform-field-label {
  display: block;
}
.gform_legacy_markup_wrapper .color-picker-field ul.gfield_radio li,
.gform_legacy_markup_wrapper .color-picker-field ul.gfield_checkbox li {
  overflow: visible;
}
.gform_legacy_markup_wrapper .color-picker-field .gchoice_select_all input {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
}

*[class*=gfcp_],
*[id*=gfcp_] {
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

#rgbValue, #hslaValue {
  float: right;
}

/*
.container {
	overflow: auto;
}
*/
#showPicker {
  float: left;
}

.colorPicker {
  background: #E8E6E0;
  border: 1px solid #BBB;
  border-radius: 0.3em;
  margin: 1em;
  display: inline-block;
}

.colorPicker .extras {
  float: right;
  margin: 0.5em;
}

.colorPicker .extras .currentColorContainer {
  overflow: hidden;
}

.colorPicker .extras .currentColor {
  float: right;
  width: 65px;
  height: 30px;
  border: 1px solid #BBB;
  border-radius: 0.3em;
}

.colorPicker .extras .colorFields {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

.colorPicker .extras .color {
  text-align: right;
}

.colorPicker .extras .colorFields input {
  width: 40px;
  margin-left: 0.5em;
}

.colorPicker .extras .hex {
  float: right;
}

.colorPicker .extras .hex input {
  width: 60px;
}

.colorPicker .twod {
  float: left;
  margin: 0.5em;
}

/* main dimensions */
.colorPicker .twod, .colorPicker .twod .bg {
  width: 240px;
  height: 240px;
}

.colorPicker .oned, .colorPicker .oned .bg {
  height: 240px;
}

.colorPicker .oned, .colorPicker .oned .bg, .colorPicker .oned .pointer .shape {
  width: 20px;
}

.colorPicker .twod .bg {
  position: absolute;
  /* These seem to cause issues in some browsers, careful!
  border: 1px solid #BBB;
  -moz-border-radius: .3em;
  border-radius: .3em;
  */
}

.colorPicker .twod .pointer {
  position: relative;
  z-index: 2;
  width: 8px;
}

.colorPicker .twod .pointer .shape {
  position: absolute;
}

.colorPicker .twod .pointer .shape1 {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 10px;
  height: 10px;
  border: 2px solid black;
  border-radius: 5px;
}

.colorPicker .twod .pointer .shape2 {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 8px;
  height: 8px;
  border: 2px solid white;
  border-radius: 4px;
}

.colorPicker .oned {
  float: left;
  margin: 0.5em;
}

.colorPicker .oned .bg {
  border: 1px solid #BBB;
  /*
  -moz-border-radius: .3em;
  border-radius: .3em;
  */
}

.colorPicker .oned .pointer {
  position: relative;
  z-index: 2;
}

.colorPicker .oned .pointer .shape {
  position: absolute;
  margin-left: -1px;
  margin-top: -4px;
  height: 5px;
  border: 2px solid black;
  border-radius: 5px;
}

/* gradients, tweak as needed based on which browsers you want to support */
.colorPicker .oned .bg {
  background: -webkit-gradient(linear, left top, left bottom, from(#ff0000), color-stop(17%, #ffff00), color-stop(33%, #00ff00), color-stop(50%, #00ffff), color-stop(66%, #0000ff), color-stop(83%, #ff00ff), to(#ff0000));
  background: linear-gradient(to bottom, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 66%, #ff00ff 83%, #ff0000 100%);
}

.colorPicker .twod .bg1 {
  z-index: 0;
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 1)), to(rgba(255, 255, 255, 0)));
  background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
}

.colorPicker .twod .bg2 {
  z-index: 1;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 1)));
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
}

#hslPicker .twod .bg1 {
  background: -webkit-gradient(linear, left top, right top, from(#ff0000), color-stop(17%, #ffff00), color-stop(33%, #00ff00), color-stop(50%, #00ffff), color-stop(66%, #0000ff), color-stop(83%, #ff00ff), to(#ff0000));
  background: linear-gradient(to right, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 66%, #ff00ff 83%, #ff0000 100%);
}

#hslPicker .twod .bg2 {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(127, 127, 127, 1)));
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(127, 127, 127, 1) 100%);
}

#hslPicker .oned .bg {
  z-index: 1;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 1)), color-stop(50%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 1)));
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 1) 100%);
}

#hslPicker .extras {
  width: 100px;
}

#hslPicker .oned.alpha {
  margin: 0;
}

#hslPicker .oned.alpha .bg {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 1)), to(rgba(0, 0, 0, 1)));
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 1) 100%); /* W3C */
}

.color-picker-use-swatches-popup .color-picker-wrapper {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 99999;
  background: rgba(0, 0, 0, 0.4);
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
.color-picker-use-swatches-popup .color-picker-wrapper:not(.color-picker-active) {
  opacity: 0;
  pointer-events: none;
}
.color-picker-use-swatches-popup .color-picker-wrapper:not(.color-picker-active) .colorPicker {
  opacity: 0;
}
.color-picker-use-swatches-popup .colorPicker {
  position: fixed;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

.colorPicker {
  width: 484px;
  height: auto;
  z-index: 999;
  position: absolute;
  left: -24px;
  top: 0;
}

/* GF 2.5+ */
.editor-sidebar .colorPicker {
  top: 50%;
  left: unset;
  right: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 9999;
}
.editor-sidebar .colorPicker .oned .pointer .shape {
  width: 19px;
  height: 19px;
}
.editor-sidebar .colorPicker .extras a.close {
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
}

.colorPicker {
  --cp-picker-padding: 16px;
  border: none;
  margin: 0;
  background: #fff;
  border-radius: 12px;
  -webkit-box-shadow: 0 14.8636293411px 29.7272586823px 0 rgba(35, 23, 5, 0.26);
  box-shadow: 0 14.8636293411px 29.7272586823px 0 rgba(35, 23, 5, 0.26);
  padding: var(--cp-picker-padding);
  width: 330px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: var(--cp-picker-padding);
}
.colorPicker, .colorPicker:before, .colorPicker:after, .colorPicker *, .colorPicker *:before, .colorPicker *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.colorPicker .twod,
.colorPicker .oned,
.colorPicker .extras {
  width: 100%;
  float: none;
  margin: 0;
}
.colorPicker .twod,
.colorPicker .twod .bg {
  height: 220px;
  border-radius: 8px;
}
.colorPicker .oned,
.colorPicker .oned .bg {
  height: 12px;
}
.colorPicker .oned .bg {
  border: none;
  width: 100%;
  border-radius: 20px;
  background: -webkit-gradient(linear, left top, right top, from(#ff0000), color-stop(17%, #ffff00), color-stop(33%, #00ff00), color-stop(50%, #00ffff), color-stop(66%, #0000ff), color-stop(83%, #ff00ff), to(#ff0000));
  background: linear-gradient(to right, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 66%, #ff00ff 83%, #ff0000 100%);
}
.colorPicker .oned .pointer .shape {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 7px solid #fff;
  margin-left: -14px;
  margin-top: -7px;
  -webkit-box-shadow: 0 0 1px 0 #121212;
  box-shadow: 0 0 1px 0 #121212;
}
.colorPicker .twod .pointer {
  width: 8px;
}
.colorPicker .twod .bg {
  width: calc(100% - var(--cp-picker-padding) * 2);
}
.colorPicker .twod .pointer .shape1,
.colorPicker .twod .pointer .shape2 {
  -webkit-transform: none;
  transform: none;
  border-radius: 50%;
  border: 3px solid #fff;
}
.colorPicker .twod .pointer .shape1 {
  width: 24px;
  height: 24px;
  margin-left: -9px;
  margin-top: -9px;
}
.colorPicker .twod .pointer .shape2 {
  width: 18px;
  height: 18px;
  margin-left: -6px;
  margin-top: -6px;
}
.colorPicker .extras {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  row-gap: var(--cp-picker-padding);
  -webkit-column-gap: 0;
  -moz-column-gap: 0;
  column-gap: 0;
}
.colorPicker .extras .hex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  width: 110px;
}
.colorPicker .extras .hex input[type=text] {
  width: 100%;
}
.colorPicker .extras .colorFields {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  width: calc(100% - 110px);
}
.colorPicker .extras .color {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  width: 33.333%;
  padding-left: 10px;
}
.colorPicker .extras .color input[type=text] {
  width: 100%;
}
.colorPicker .extras .hex,
.colorPicker .extras .color {
  line-height: 1;
}
.colorPicker .extras .currentColor {
  width: 100%;
  height: 30px;
  border-radius: 2px;
  border: none;
}
.colorPicker .extras .currentColorContainer,
.colorPicker .extras a.close {
  margin: 0;
}
.colorPicker .extras .currentColorContainer {
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
}
.colorPicker .extras a.close,
.colorPicker .extras a.cp-clear {
  width: calc(50% - 5px);
}
.colorPicker .extras a.cp-clear {
  margin-left: 10px;
}
.colorPicker .extras div.hex,
.colorPicker .extras div.colorFields {
  float: none;
  margin: 0;
  padding-bottom: 0;
}
.colorPicker .extras label,
.colorPicker .extras input {
  letter-spacing: 0.01em;
  text-transform: uppercase;
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
  display: inline-block !important;
  line-height: 1 !important;
  margin: 0 !important;
}
.colorPicker .extras label {
  padding-right: calc( 20px / 2 );
  padding-left: 5px;
  color: #c3c3c3;
  width: 100%;
  text-align: left;
}
.colorPicker .extras .colorFields input[type=text],
.colorPicker .extras .hex input[type=text],
.colorPicker .extras input[type=text] {
  padding: 2px 5px !important;
  font-size: 12px !important;
  border-radius: 3px;
  border: 1px solid #eaeaea;
  background-color: transparent;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.colorPicker .extras .colorFields input[type=text][type=text],
.colorPicker .extras .hex input[type=text][type=text],
.colorPicker .extras input[type=text][type=text] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: #3f3844;
}
.colorPicker .extras .colorFields input[type=text]:focus,
.colorPicker .extras .hex input[type=text]:focus,
.colorPicker .extras input[type=text]:focus {
  outline: none;
  border-color: #3f3844;
  background-color: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.colorPicker .extras a.close,
.colorPicker .extras a.cp-clear {
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 12px;
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  padding: 10px 20px;
  text-align: center;
  display: block;
  border: 1px solid #cccccc;
  border-radius: 3px;
  outline: none;
}
.colorPicker .extras a.close {
  background-color: black;
  color: white;
  border-color: black;
}
.colorPicker .extras a.cp-clear {
  background-color: #f7f7f7;
  color: black;
}

@media all and (max-width: 641px) {
  .colorPicker {
    width: 100%;
  }
}
.cp-theme--lozenge {
  --cp-padding: 10px;
  --cp-width: 150px;
  --cp-height: 45px;
  --cp-width-medium: var(--cp-width);
  --cp-height-medium: var(--cp-height);
  --cp-width-small: var(--cp-width);
  --cp-height-small: var(--cp-height);
  --cp-text-size: 14px;
  --cp-picker-icon-size: 20px;
}

.cp-theme--lozenge {
  /*
  .color-picker-swatch-text {
  	text-align: center;
  	transition: transform var(--cp-transition-duration) var(--cp-transition-easing);
  }
  .color-picker-choice-selected .color-picker-swatch-text {
  	--local-cp-offset: calc( var(--cp-height) / 2 * -1 );
  	transform: translateX( var(--local-cp-offset) );
  }
  */
}
.cp-theme--lozenge .color-picker-swatch,
.cp-theme--lozenge label[id$=select_all],
.cp-theme--lozenge button[id$=select_all] {
  cursor: pointer;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  position: relative;
  min-width: var(--cp-width);
  max-width: 100%;
  height: var(--cp-height);
  padding: 0;
  border-radius: 5px;
  border: 1px solid #B1C0CF;
  background: #FFF;
}
.cp-theme--lozenge .color-picker-choice .color-picker-swatch,
.cp-theme--lozenge .color-picker-choice .gform-field-label,
.cp-theme--lozenge .color-picker-has-select-all label[id$=select_all],
.cp-theme--lozenge .color-picker-has-select-all button[id$=select_all] {
  width: 100%;
}
.cp-theme--lozenge.cp-cols--fixed .color-picker-choice .color-picker-swatch {
  min-width: var(--cp-width);
}
.cp-theme--lozenge.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
.cp-theme--lozenge.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
  width: var(--cp-width);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--lozenge .color-picker-swatch,
  .cp-theme--lozenge label[id$=select_all],
  .cp-theme--lozenge button[id$=select_all] {
    height: var(--cp-height-medium);
  }
  .cp-theme--lozenge.cp-cols--fixed .color-picker-choice .color-picker-swatch {
    min-width: var(--cp-width-medium);
  }
  .cp-theme--lozenge.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--lozenge.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--lozenge .color-picker-swatch,
  .cp-theme--lozenge label[id$=select_all],
  .cp-theme--lozenge button[id$=select_all] {
    height: var(--cp-height-small);
  }
  .cp-theme--lozenge.cp-cols--fixed .color-picker-choice .color-picker-swatch {
    min-width: var(--cp-width-small);
  }
  .cp-theme--lozenge.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--lozenge.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-small);
  }
}
.cp-theme--lozenge .ginput_container_text .color-picker-swatch {
  width: auto;
}
.cp-theme--lozenge .color-picker-swatch-color-wrap {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--cp-height);
  will-change: width, border-radius;
  -webkit-transition: width var(--cp-transition-duration) var(--cp-transition-easing), border-radius var(--cp-transition-duration) var(--cp-transition-easing);
  transition: width var(--cp-transition-duration) var(--cp-transition-easing), border-radius var(--cp-transition-duration) var(--cp-transition-easing);
  z-index: 0;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--lozenge .color-picker-swatch-color-wrap {
    width: var(--cp-height-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--lozenge .color-picker-swatch-color-wrap {
    width: var(--cp-height-small);
  }
}
.cp-theme--lozenge .color-picker-swatch-color-wrap,
.cp-theme--lozenge .color-picker-swatch-color {
  height: 100%;
  border-radius: 4px 0 0 4px;
}
.cp-theme--lozenge .color-picker-swatch-color {
  will-change: border-radius;
  -webkit-transition: border-radius var(--cp-transition-duration) var(--cp-transition-easing);
  transition: border-radius var(--cp-transition-duration) var(--cp-transition-easing);
}
.cp-theme--lozenge .color-picker-choice-selected .color-picker-swatch-color-wrap {
  width: 100%;
}
.cp-theme--lozenge .color-picker-choice-selected .color-picker-swatch-color-wrap,
.cp-theme--lozenge .color-picker-choice-selected .color-picker-swatch-color {
  border-radius: 4px 4px 4px 4px;
}
.cp-theme--lozenge .color-picker-swatch-color {
  position: relative;
}
.cp-theme--lozenge .color-picker-swatch-color i {
  pointer-events: none;
  display: block;
  position: absolute;
  left: calc(var(--cp-height) / 2);
  top: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.8);
  transform: translate(-50%, -50%) scale(0.8);
  width: var(--cp-selected-icon-size);
  height: var(--cp-selected-icon-size);
  overflow: hidden;
  opacity: 0;
  background-color: var(--cp-selected-icon-color);
  -webkit-mask-image: var(--cp-selected-icon);
  mask-image: var(--cp-selected-icon);
  -webkit-mask-size: var(--cp-selected-icon-size);
  mask-size: var(--cp-selected-icon-size);
  -webkit-mask-position: 50%;
  mask-position: 50%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  will-change: opacity;
  -webkit-transition: opacity var(--cp-transition-duration) var(--cp-transition-easing);
  transition: opacity var(--cp-transition-duration) var(--cp-transition-easing);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--lozenge .color-picker-swatch-color i {
    left: calc(var(--cp-height-medium) / 2);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--lozenge .color-picker-swatch-color i {
    left: calc(var(--cp-height-small) / 2);
  }
}
.cp-theme--lozenge .color-picker-swatch--light .color-picker-swatch-color i {
  background-color: var(--cp-selected-icon-color-alt);
}
.cp-theme--lozenge .color-picker-choice-selected .color-picker-swatch-color i {
  opacity: 1;
}
.cp-theme--lozenge input[type=text] ~ .color-picker-swatch .color-picker-swatch-color,
.cp-theme--lozenge .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color,
.cp-theme--lozenge .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color {
  background-color: var(--cp-default-swatch-color);
}
.cp-theme--lozenge input[type=text] ~ .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--lozenge .color-picker-swatches-popup-trigger .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--lozenge .color-picker-choice-other:not(.color-picker-choice-selected):not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i {
  background-color: #ffffff;
}
.cp-theme--lozenge input[type=text] ~ .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--lozenge .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--lozenge .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color i {
  background-color: var(--cp-picker-icon-color);
  width: var(--cp-picker-icon-size);
  height: var(--cp-picker-icon-size);
  -webkit-mask-image: var(--cp-picker-icon);
  mask-image: var(--cp-picker-icon);
  -webkit-mask-size: var(--cp-picker-icon-size);
  mask-size: var(--cp-picker-icon-size);
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}
.cp-theme--lozenge .color-picker-swatch-text-wrap,
.cp-theme--lozenge label[id$=select_all] .color-picker-select-all-label,
.cp-theme--lozenge button[id$=select_all] .color-picker-select-all-label {
  width: auto;
  height: calc(var(--cp-height) - var(--cp-padding));
  overflow: hidden;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0 var(--cp-padding);
  padding-left: calc(var(--cp-height) + var(--cp-padding));
  z-index: 1;
  position: relative;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--lozenge .color-picker-swatch-text-wrap,
  .cp-theme--lozenge label[id$=select_all] .color-picker-select-all-label,
  .cp-theme--lozenge button[id$=select_all] .color-picker-select-all-label {
    height: calc(var(--cp-height-medium) - var(--cp-padding));
    padding-left: calc(var(--cp-height-medium) + var(--cp-padding));
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--lozenge .color-picker-swatch-text-wrap,
  .cp-theme--lozenge label[id$=select_all] .color-picker-select-all-label,
  .cp-theme--lozenge button[id$=select_all] .color-picker-select-all-label {
    height: calc(var(--cp-height-small) - var(--cp-padding));
    padding-left: calc(var(--cp-height-small) + var(--cp-padding));
  }
}
.cp-theme--lozenge .color-picker-swatch-text-prefix,
.cp-theme--lozenge .color-picker-swatch-text-suffix,
.cp-theme--lozenge .color-picker-swatch-price {
  display: none;
}
.cp-theme--lozenge .color-picker-choice-selected .color-picker-swatch--dark .color-picker-swatch-text-prefix,
.cp-theme--lozenge .color-picker-choice-selected .color-picker-swatch--dark .color-picker-swatch-text-suffix,
.cp-theme--lozenge .color-picker-choice-selected .color-picker-swatch--dark .color-picker-swatch-text,
.cp-theme--lozenge .color-picker-choice-selected .color-picker-swatch--dark .color-picker-swatch-price {
  color: #ffffff;
}
.cp-theme--lozenge .color-picker-choice .gftt-icon {
  top: -13px;
  left: unset;
  right: -15px;
}
.cp-theme--lozenge label[id$=select_all] .color-picker-select-all-label,
.cp-theme--lozenge button[id$=select_all] .color-picker-select-all-label {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.cp-theme--lozenge label[id$=select_all] .color-picker-select-all-icon,
.cp-theme--lozenge button[id$=select_all] .color-picker-select-all-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--cp-height);
  height: 100%;
  border-radius: 4px 0 0 4px;
}
.cp-theme--lozenge label[id$=select_all] i,
.cp-theme--lozenge button[id$=select_all] i {
  display: block;
  position: absolute;
  left: calc(var(--cp-height) / 2);
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  overflow: hidden;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--lozenge label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--lozenge button[id$=select_all] .color-picker-select-all-icon {
    width: var(--cp-height-medium);
  }
  .cp-theme--lozenge label[id$=select_all] i,
  .cp-theme--lozenge button[id$=select_all] i {
    left: calc(var(--cp-height-medium) / 2);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--lozenge label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--lozenge button[id$=select_all] .color-picker-select-all-icon {
    width: var(--cp-height-small);
  }
  .cp-theme--lozenge label[id$=select_all] i,
  .cp-theme--lozenge button[id$=select_all] i {
    left: calc(var(--cp-height-small) / 2);
  }
}

.cp-theme--shadow-box {
  --cp-padding: 15px;
  --cp-width: 170px;
  --cp-height: 180px;
  --cp-width-medium: var(--cp-width);
  --cp-height-medium: var(--cp-height);
  --cp-width-small: var(--cp-width);
  --cp-height-small: var(--cp-height);
  --cp-text-color: #ffffff;
  --cp-selected-icon-size: 54px;
  --cp-select-all-text-color: var(--cp-select-all-icon-color);
}

.cp-theme--shadow-box .color-picker-choice .gform-field-label {
  width: 100%;
}
.cp-theme--shadow-box .color-picker-swatch,
.cp-theme--shadow-box label[id$=select_all],
.cp-theme--shadow-box button[id$=select_all] {
  cursor: pointer;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  position: relative;
  min-height: var(--cp-height);
  padding: 0;
  width: var(--cp-width);
  max-width: 100%;
  border-radius: 3px;
  background-color: #ffffff;
  border: 5px solid #ffffff;
  -webkit-box-shadow: 0 0.4066425264px 1.281370759px 0 rgba(12, 20, 33, 0.01), 0 0.9802988768px 2.142832756px 0 rgba(12, 20, 33, 0.02), 0 1.8589371443px 3.6016907692px 0 rgba(12, 20, 33, 0.02), 0 3.0861260891px 5.9956030846px 0 rgba(12, 20, 33, 0.02), 0 4.7054347992px 9.6622285843px 0 rgba(12, 20, 33, 0.03), 0 6.7604317665px 14.9392242432px 0 rgba(12, 20, 33, 0.03), 0 9.2946853638px 22.1642513275px 0 rgba(12, 20, 33, 0.04);
  box-shadow: 0 0.4066425264px 1.281370759px 0 rgba(12, 20, 33, 0.01), 0 0.9802988768px 2.142832756px 0 rgba(12, 20, 33, 0.02), 0 1.8589371443px 3.6016907692px 0 rgba(12, 20, 33, 0.02), 0 3.0861260891px 5.9956030846px 0 rgba(12, 20, 33, 0.02), 0 4.7054347992px 9.6622285843px 0 rgba(12, 20, 33, 0.03), 0 6.7604317665px 14.9392242432px 0 rgba(12, 20, 33, 0.03), 0 9.2946853638px 22.1642513275px 0 rgba(12, 20, 33, 0.04);
}
.cp-theme--shadow-box .color-picker-choice .color-picker-swatch,
.cp-theme--shadow-box .color-picker-has-select-all label[id$=select_all],
.cp-theme--shadow-box .color-picker-has-select-all button[id$=select_all] {
  width: 100%;
}
.cp-theme--shadow-box.cp-cols--fixed .color-picker-choice .color-picker-swatch,
.cp-theme--shadow-box.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
.cp-theme--shadow-box.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
  width: var(--cp-width);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--shadow-box .color-picker-swatch,
  .cp-theme--shadow-box label[id$=select_all],
  .cp-theme--shadow-box button[id$=select_all] {
    min-height: var(--cp-height-medium);
  }
  .cp-theme--shadow-box.cp-cols--fixed .color-picker-choice .color-picker-swatch,
  .cp-theme--shadow-box.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--shadow-box.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--shadow-box .color-picker-swatch,
  .cp-theme--shadow-box label[id$=select_all],
  .cp-theme--shadow-box button[id$=select_all] {
    min-height: var(--cp-height-small);
  }
  .cp-theme--shadow-box.cp-cols--fixed .color-picker-choice .color-picker-swatch,
  .cp-theme--shadow-box.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--shadow-box.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-small);
  }
}
.cp-theme--shadow-box .color-picker-swatch-color i {
  pointer-events: none;
  display: block;
  position: absolute;
  left: 50%;
  top: calc(var(--cp-height) * 0.4);
  -webkit-transform: translate(-50%, -50%) scale(0.8);
  transform: translate(-50%, -50%) scale(0.8);
  width: var(--cp-selected-icon-size);
  height: var(--cp-selected-icon-size);
  overflow: hidden;
  opacity: 0;
  background-color: var(--cp-selected-icon-color);
  -webkit-mask-image: var(--cp-selected-icon);
  mask-image: var(--cp-selected-icon);
  -webkit-mask-size: var(--cp-selected-icon-size);
  mask-size: var(--cp-selected-icon-size);
  -webkit-mask-position: 50%;
  mask-position: 50%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  z-index: 3;
  -webkit-transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: transform;
  -webkit-transition: opacity var(--cp-transition-duration) var(--cp-transition-easing), -webkit-transform var(--cp-transition-duration) var(--cp-transition-easing);
  transition: opacity var(--cp-transition-duration) var(--cp-transition-easing), -webkit-transform var(--cp-transition-duration) var(--cp-transition-easing);
  transition: transform var(--cp-transition-duration) var(--cp-transition-easing), opacity var(--cp-transition-duration) var(--cp-transition-easing);
  transition: transform var(--cp-transition-duration) var(--cp-transition-easing), opacity var(--cp-transition-duration) var(--cp-transition-easing), -webkit-transform var(--cp-transition-duration) var(--cp-transition-easing);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--shadow-box .color-picker-swatch-color i {
    top: calc(var(--cp-height-medium) * 0.4);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--shadow-box .color-picker-swatch-color i {
    top: calc(var(--cp-height-small) * 0.4);
  }
}
.cp-theme--shadow-box .color-picker-swatch--light .color-picker-swatch-color i {
  background-color: var(--cp-selected-icon-color-alt);
}
.cp-theme--shadow-box .color-picker-choice-selected .color-picker-swatch-color i {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
}
.cp-theme--shadow-box .color-picker-swatch-text-prefix,
.cp-theme--shadow-box .color-picker-swatch-text-suffix {
  display: none;
}
.cp-theme--shadow-box .color-picker-swatch-text-wrap {
  margin-top: calc(var(--cp-height) * 0.55);
  text-align: center;
  padding: var(--cp-padding);
  position: relative;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--shadow-box .color-picker-swatch-text-wrap {
    margin-top: calc(var(--cp-height-medium) * 0.55);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--shadow-box .color-picker-swatch-text-wrap {
    margin-top: calc(var(--cp-height-small) * 0.55);
  }
}
.cp-theme--shadow-box:not(.gfield-type--option) .color-picker-swatch-text-wrap {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.cp-theme--shadow-box .color-picker-swatch-color-wrap {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 0;
}
.cp-theme--shadow-box .color-picker-swatch-color {
  width: 100%;
  height: 100%;
  border-radius: 3px;
  position: relative;
}
.cp-theme--shadow-box .color-picker-swatch--light .color-picker-swatch-text-prefix,
.cp-theme--shadow-box .color-picker-swatch--light .color-picker-swatch-text-suffix,
.cp-theme--shadow-box .color-picker-swatch--light .color-picker-swatch-text,
.cp-theme--shadow-box .color-picker-swatch--light .color-picker-swatch-price,
.cp-theme--shadow-box .color-picker-choice-selected .color-picker-swatch--light .color-picker-swatch-text-prefix,
.cp-theme--shadow-box .color-picker-choice-selected .color-picker-swatch--light .color-picker-swatch-text-suffix,
.cp-theme--shadow-box .color-picker-choice-selected .color-picker-swatch--light .color-picker-swatch-text,
.cp-theme--shadow-box .color-picker-choice-selected .color-picker-swatch--light .color-picker-swatch-price {
  color: #121212;
}
.cp-theme--shadow-box input[type=text] ~ .color-picker-swatch:not(.color-picker-swatch--dark) .color-picker-swatch-text,
.cp-theme--shadow-box .color-picker-choice-other .color-picker-swatch:not(.color-picker-swatch--dark) .color-picker-swatch-text {
  color: #121212;
}
.cp-theme--shadow-box input[type=text] ~ .color-picker-swatch .color-picker-swatch-color,
.cp-theme--shadow-box .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color,
.cp-theme--shadow-box .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color {
  background-color: var(--cp-default-swatch-color);
}
.cp-theme--shadow-box input[type=text] ~ .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--shadow-box .color-picker-swatches-popup-trigger .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--shadow-box .color-picker-choice-other:not(.color-picker-choice-selected):not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i {
  background-color: #ffffff;
}
.cp-theme--shadow-box input[type=text] ~ .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--shadow-box .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--shadow-box .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color i {
  background-color: var(--cp-picker-icon-color);
  width: var(--cp-picker-icon-size);
  height: var(--cp-picker-icon-size);
  -webkit-mask-image: var(--cp-picker-icon);
  mask-image: var(--cp-picker-icon);
  -webkit-mask-size: var(--cp-picker-icon-size);
  mask-size: var(--cp-picker-icon-size);
  left: 50%;
  top: calc(var(--cp-height) * 0.4);
  -webkit-transition: none;
  transition: none;
  -webkit-transform: translateX(-50%, -50%);
  transform: translateX(-50%, -50%);
  opacity: 1;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--shadow-box input[type=text] ~ .color-picker-swatch .color-picker-swatch-color i,
  .cp-theme--shadow-box .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color i,
  .cp-theme--shadow-box .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color i {
    top: calc(var(--cp-height-medium) * 0.4);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--shadow-box input[type=text] ~ .color-picker-swatch .color-picker-swatch-color i,
  .cp-theme--shadow-box .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color i,
  .cp-theme--shadow-box .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color i {
    top: calc(var(--cp-height-small) * 0.4);
  }
}
.cp-theme--shadow-box .color-picker-choice .gftt-icon {
  top: calc(var(--cp-padding) / 2);
  left: unset;
  right: calc(var(--cp-padding) / 2);
}
.cp-theme--shadow-box label[id$=select_all],
.cp-theme--shadow-box button[id$=select_all] {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.cp-theme--shadow-box label[id$=select_all] .color-picker-select-all-label,
.cp-theme--shadow-box button[id$=select_all] .color-picker-select-all-label {
  display: block;
  width: 100%;
  z-index: 2;
  padding: var(--cp-padding);
}
.cp-theme--shadow-box label[id$=select_all] .color-picker-select-all-icon,
.cp-theme--shadow-box button[id$=select_all] .color-picker-select-all-icon {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 0;
}
.cp-theme--shadow-box label[id$=select_all] i,
.cp-theme--shadow-box button[id$=select_all] i {
  display: block;
  position: absolute;
  left: 50%;
  top: calc(var(--cp-height) * 0.4);
  -webkit-transform: translate(-50%, -50%) scale(0.8);
  transform: translate(-50%, -50%) scale(0.8);
  overflow: hidden;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--shadow-box label[id$=select_all] i,
  .cp-theme--shadow-box button[id$=select_all] i {
    top: calc(var(--cp-height-medium) * 0.4);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--shadow-box label[id$=select_all] i,
  .cp-theme--shadow-box button[id$=select_all] i {
    top: calc(var(--cp-height-small) * 0.4);
  }
}

.cp-theme--pantone {
  --cp-padding: 20px;
  --cp-width: 175px;
  --cp-height: 160px;
  --cp-width-medium: var(--cp-width);
  --cp-height-medium: var(--cp-height);
  --cp-width-small: var(--cp-width);
  --cp-height-small: var(--cp-height);
}

.cp-theme--pantone .color-picker-choice .gform-field-label {
  width: 100%;
}
.cp-theme--pantone .color-picker-swatch,
.cp-theme--pantone label[id$=select_all],
.cp-theme--pantone button[id$=select_all] {
  cursor: pointer;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  position: relative;
  padding: 0;
  width: var(--cp-width);
  max-width: 100%;
  border-radius: 1px;
  background-color: #ffffff;
  -webkit-box-shadow: 0 9.29469px 22.1643px rgba(12, 20, 33, 0.04), 0 6.76043px 14.9392px rgba(12, 20, 33, 0.032375), 0 4.70543px 9.66223px rgba(12, 20, 33, 0.027), 0 3.08613px 5.9956px rgba(12, 20, 33, 0.023125), 0 1.85894px 3.60169px rgba(12, 20, 33, 0.02), 0 0.980299px 2.14283px rgba(12, 20, 33, 0.016875), 0 0.406643px 1.28137px rgba(12, 20, 33, 0.013);
  box-shadow: 0 9.29469px 22.1643px rgba(12, 20, 33, 0.04), 0 6.76043px 14.9392px rgba(12, 20, 33, 0.032375), 0 4.70543px 9.66223px rgba(12, 20, 33, 0.027), 0 3.08613px 5.9956px rgba(12, 20, 33, 0.023125), 0 1.85894px 3.60169px rgba(12, 20, 33, 0.02), 0 0.980299px 2.14283px rgba(12, 20, 33, 0.016875), 0 0.406643px 1.28137px rgba(12, 20, 33, 0.013);
}
.cp-theme--pantone .color-picker-choice .color-picker-swatch,
.cp-theme--pantone .color-picker-has-select-all label[id$=select_all],
.cp-theme--pantone .color-picker-has-select-all button[id$=select_all] {
  width: 100%;
}
.cp-theme--pantone.cp-cols--fixed .color-picker-choice .color-picker-swatch,
.cp-theme--pantone.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
.cp-theme--pantone.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
  width: var(--cp-width);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--pantone.cp-cols--fixed .color-picker-choice .color-picker-swatch,
  .cp-theme--pantone.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--pantone.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--pantone.cp-cols--fixed .color-picker-choice .color-picker-swatch,
  .cp-theme--pantone.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--pantone.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-small);
  }
}
.cp-theme--pantone .color-picker-swatch-text-suffix {
  display: none;
}
.cp-theme--pantone .color-picker-swatch-text-wrap {
  padding: var(--cp-padding);
}
.cp-theme--pantone .color-picker-swatch-text-prefix {
  text-transform: uppercase;
  padding-right: var(--cp-padding);
}
.cp-theme--pantone .color-picker-swatch-color-wrap {
  width: 100%;
  height: var(--cp-height);
  position: relative;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--pantone .color-picker-swatch-color-wrap {
    height: var(--cp-height-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--pantone .color-picker-swatch-color-wrap {
    height: var(--cp-height-small);
  }
}
.cp-theme--pantone .color-picker-swatch-color i {
  pointer-events: none;
  display: block;
  position: absolute;
  right: 20px;
  bottom: 20px;
  width: var(--cp-selected-icon-size);
  height: var(--cp-selected-icon-size);
  overflow: hidden;
  opacity: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  background-color: var(--cp-selected-icon-color);
  -webkit-mask-image: var(--cp-selected-icon);
  mask-image: var(--cp-selected-icon);
  -webkit-mask-size: var(--cp-selected-icon-size);
  mask-size: var(--cp-selected-icon-size);
  -webkit-mask-position: 50%;
  mask-position: 50%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  z-index: 3;
  -webkit-transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: transform;
  -webkit-transition: opacity var(--cp-transition-duration) var(--cp-transition-easing), -webkit-transform var(--cp-transition-duration) var(--cp-transition-easing);
  transition: opacity var(--cp-transition-duration) var(--cp-transition-easing), -webkit-transform var(--cp-transition-duration) var(--cp-transition-easing);
  transition: transform var(--cp-transition-duration) var(--cp-transition-easing), opacity var(--cp-transition-duration) var(--cp-transition-easing);
  transition: transform var(--cp-transition-duration) var(--cp-transition-easing), opacity var(--cp-transition-duration) var(--cp-transition-easing), -webkit-transform var(--cp-transition-duration) var(--cp-transition-easing);
}
.cp-theme--pantone .color-picker-swatch--light .color-picker-swatch-color i {
  background-color: var(--cp-selected-icon-color-alt);
}
.cp-theme--pantone .color-picker-choice-selected .color-picker-swatch-color i {
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}
.cp-theme--pantone .color-picker-swatch-color {
  width: 100%;
  height: 100%;
  -webkit-box-shadow: inset 0 0 0 5px #ffffff;
  box-shadow: inset 0 0 0 5px #ffffff;
  -webkit-transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: width, height;
  -webkit-transition: -webkit-box-shadow var(--cp-transition-duration) var(--cp-transition-easing);
  transition: -webkit-box-shadow var(--cp-transition-duration) var(--cp-transition-easing);
  transition: box-shadow var(--cp-transition-duration) var(--cp-transition-easing);
  transition: box-shadow var(--cp-transition-duration) var(--cp-transition-easing), -webkit-box-shadow var(--cp-transition-duration) var(--cp-transition-easing);
}
.cp-theme--pantone input[type=text] ~ .color-picker-swatch .color-picker-swatch-color:not([style^="background-color:"]),
.cp-theme--pantone .color-picker-choice:not(.color-picker-choice-selected) .color-picker-swatch-color {
  -webkit-box-shadow: inset 0 0 0 0 #ffffff;
  box-shadow: inset 0 0 0 0 #ffffff;
}
.cp-theme--pantone input[type=text] ~ .color-picker-swatch .color-picker-swatch-color,
.cp-theme--pantone .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color,
.cp-theme--pantone .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color {
  background-color: var(--cp-default-swatch-color);
}
.cp-theme--pantone input[type=text] ~ .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--pantone .color-picker-swatches-popup-trigger .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--pantone .color-picker-choice-other:not(.color-picker-choice-selected):not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i {
  background-color: #ffffff;
}
.cp-theme--pantone input[type=text] ~ .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--pantone .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--pantone .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color i {
  background-color: var(--cp-picker-icon-color);
  width: var(--cp-picker-icon-size);
  height: var(--cp-picker-icon-size);
  -webkit-mask-image: var(--cp-picker-icon);
  mask-image: var(--cp-picker-icon);
  -webkit-mask-size: var(--cp-picker-icon-size);
  mask-size: var(--cp-picker-icon-size);
  right: 50%;
  bottom: 50%;
  -webkit-transition: none;
  transition: none;
  -webkit-transform: translate(50%, 50%);
  transform: translate(50%, 50%);
  opacity: 1;
}
.cp-theme--pantone .color-picker-choice .gftt-icon {
  top: calc(var(--cp-height) + var(--cp-padding) - 7px);
  left: unset;
  right: calc(var(--cp-padding) - 7px);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--pantone .color-picker-choice .gftt-icon {
    top: calc(var(--cp-height-medium) + var(--cp-padding) - 7px);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--pantone .color-picker-choice .gftt-icon {
    top: calc(var(--cp-height-small) + var(--cp-padding) - 7px);
  }
}
.cp-theme--pantone label[id$=select_all] .color-picker-select-all-label,
.cp-theme--pantone button[id$=select_all] .color-picker-select-all-label {
  padding: var(--cp-padding);
  display: block;
  width: 100%;
  text-align: left;
}
.cp-theme--pantone label[id$=select_all] .color-picker-select-all-icon,
.cp-theme--pantone button[id$=select_all] .color-picker-select-all-icon {
  width: 100%;
  height: var(--cp-height);
  position: relative;
}
.cp-theme--pantone label[id$=select_all] i,
.cp-theme--pantone button[id$=select_all] i {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  overflow: hidden;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--pantone label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--pantone button[id$=select_all] .color-picker-select-all-icon {
    height: var(--cp-height-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--pantone label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--pantone button[id$=select_all] .color-picker-select-all-icon {
    height: var(--cp-height-small);
  }
}

.cp-theme--circle {
  --cp-height: 100px;
  --cp-width: var(--cp-height);
  --cp-height-medium: var(--cp-height);
  --cp-width-medium: var(--cp-height-medium);
  --cp-height-small: var(--cp-height);
  --cp-width-small: var(--cp-height-small);
  --cp-selected-icon-size: 40px;
  --cp-picker-icon-size: 32px;
}

.cp-theme--circle .color-picker-choice .gform-field-label {
  width: auto;
  min-width: var(--cp-width);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--circle .color-picker-choice .gform-field-label {
    min-width: var(--cp-width-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--circle .color-picker-choice .gform-field-label {
    min-width: var(--cp-width-small);
  }
}
.cp-theme--circle .color-picker-swatch,
.cp-theme--circle label[id$=select_all],
.cp-theme--circle button[id$=select_all] {
  cursor: pointer;
  padding: 0;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  position: relative;
}
.cp-theme--circle .ginput_container_text .color-picker-swatch {
  width: auto;
}
.cp-theme--circle .color-picker-swatch-color-wrap,
.cp-theme--circle label[id$=select_all] .color-picker-select-all-icon,
.cp-theme--circle button[id$=select_all] .color-picker-select-all-icon {
  width: var(--cp-height);
  height: var(--cp-height);
  margin: 0 auto 10px;
  border-radius: 50%;
  overflow: hidden;
  border: 5px solid #ffffff;
  background-color: #ffffff;
  -webkit-box-shadow: 0 0.4066425264px 1.281370759px 0 rgba(12, 20, 33, 0.01), 0 0.9802988768px 2.142832756px 0 rgba(12, 20, 33, 0.02), 0 1.8589371443px 3.6016907692px 0 rgba(12, 20, 33, 0.02), 0 3.0861260891px 5.9956030846px 0 rgba(12, 20, 33, 0.02), 0 4.7054347992px 9.6622285843px 0 rgba(12, 20, 33, 0.03), 0 6.7604317665px 14.9392242432px 0 rgba(12, 20, 33, 0.03), 0 9.2946853638px 22.1642513275px 0 rgba(12, 20, 33, 0.04);
  box-shadow: 0 0.4066425264px 1.281370759px 0 rgba(12, 20, 33, 0.01), 0 0.9802988768px 2.142832756px 0 rgba(12, 20, 33, 0.02), 0 1.8589371443px 3.6016907692px 0 rgba(12, 20, 33, 0.02), 0 3.0861260891px 5.9956030846px 0 rgba(12, 20, 33, 0.02), 0 4.7054347992px 9.6622285843px 0 rgba(12, 20, 33, 0.03), 0 6.7604317665px 14.9392242432px 0 rgba(12, 20, 33, 0.03), 0 9.2946853638px 22.1642513275px 0 rgba(12, 20, 33, 0.04);
}
.cp-theme--circle .color-picker-choice-other .color-picker-swatch-text-wrap {
  width: var(--cp-width);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--circle .color-picker-swatch-color-wrap,
  .cp-theme--circle label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--circle button[id$=select_all] .color-picker-select-all-icon {
    width: var(--cp-height-medium);
    height: var(--cp-height-medium);
  }
  .cp-theme--circle .color-picker-choice-other .color-picker-swatch-text-wrap {
    width: var(--cp-width-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--circle .color-picker-swatch-color-wrap,
  .cp-theme--circle label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--circle button[id$=select_all] .color-picker-select-all-icon {
    width: var(--cp-height-small);
    height: var(--cp-height-small);
  }
  .cp-theme--circle .color-picker-choice-other .color-picker-swatch-text-wrap {
    width: var(--cp-width-small);
  }
}
.cp-theme--circle .color-picker-swatch-color {
  background-color: var(--cp-default-swatch-color);
  width: 100%;
  height: 100%;
  position: relative;
}
.cp-theme--circle .color-picker-swatch-color i {
  pointer-events: none;
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.8);
  transform: translate(-50%, -50%) scale(0.8);
  width: var(--cp-selected-icon-size);
  height: var(--cp-selected-icon-size);
  overflow: hidden;
  opacity: 0;
  background-color: var(--cp-selected-icon-color);
  -webkit-mask-image: var(--cp-selected-icon);
  mask-image: var(--cp-selected-icon);
  -webkit-mask-size: var(--cp-selected-icon-size);
  mask-size: var(--cp-selected-icon-size);
  -webkit-mask-position: 50%;
  mask-position: 50%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  z-index: 3;
  -webkit-transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: transform;
  -webkit-transition: opacity var(--cp-transition-duration) var(--cp-transition-easing), -webkit-transform var(--cp-transition-duration) var(--cp-transition-easing);
  transition: opacity var(--cp-transition-duration) var(--cp-transition-easing), -webkit-transform var(--cp-transition-duration) var(--cp-transition-easing);
  transition: transform var(--cp-transition-duration) var(--cp-transition-easing), opacity var(--cp-transition-duration) var(--cp-transition-easing);
  transition: transform var(--cp-transition-duration) var(--cp-transition-easing), opacity var(--cp-transition-duration) var(--cp-transition-easing), -webkit-transform var(--cp-transition-duration) var(--cp-transition-easing);
}
.cp-theme--circle .color-picker-swatch--light .color-picker-swatch-color i {
  background-color: var(--cp-selected-icon-color-alt);
}
.cp-theme--circle .color-picker-choice-selected .color-picker-swatch-color i {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
}
.cp-theme--circle input[type=text] ~ .color-picker-swatch .color-picker-swatch-color,
.cp-theme--circle .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color,
.cp-theme--circle .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color {
  background-color: var(--cp-default-swatch-color);
}
.cp-theme--circle input[type=text] ~ .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--circle .color-picker-swatches-popup-trigger .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--circle .color-picker-choice-other:not(.color-picker-choice-selected):not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i {
  background-color: #ffffff;
}
.cp-theme--circle input[type=text] ~ .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--circle .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--circle .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color i {
  background-color: var(--cp-picker-icon-color);
  width: var(--cp-picker-icon-size);
  height: var(--cp-picker-icon-size);
  -webkit-mask-image: var(--cp-picker-icon);
  mask-image: var(--cp-picker-icon);
  -webkit-mask-size: var(--cp-picker-icon-size);
  mask-size: var(--cp-picker-icon-size);
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}
.cp-theme--circle .color-picker-swatch-text-wrap {
  text-align: center;
}
.cp-theme--circle .color-picker-swatch-text-prefix,
.cp-theme--circle .color-picker-swatch-text-suffix {
  display: none;
}
.cp-theme--circle .color-picker-choice .gftt-icon {
  top: 0;
  right: unset;
  left: calc(var(--cp-width) - 7px);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--circle .color-picker-choice .gftt-icon {
    left: calc(var(--cp-width-medium) - 7px);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--circle .color-picker-choice .gftt-icon {
    left: calc(var(--cp-small-medium) - 7px);
  }
}
.cp-theme--circle.cp-align--center .color-picker-choice {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.cp-theme--circle.cp-align--center .color-picker-choice .gftt-icon {
  right: unset;
  left: calc(50% + var(--cp-width) / 2 - 7px);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--circle.cp-align--center .color-picker-choice .gftt-icon {
    left: calc(50% + var(--cp-width-medium) / 2 - 7px);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--circle.cp-align--center .color-picker-choice .gftt-icon {
    left: calc(50% + var(--cp-width-small) / 2 - 7px);
  }
}
.cp-theme--circle.cp-align--right .color-picker-choice {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.cp-theme--circle.cp-align--right .color-picker-choice .gftt-icon {
  left: unset;
  right: -10px;
}
.cp-theme--circle label[id$=select_all],
.cp-theme--circle button[id$=select_all] {
  cursor: pointer;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.cp-theme--circle label[id$=select_all] .color-picker-select-all-icon,
.cp-theme--circle button[id$=select_all] .color-picker-select-all-icon {
  position: relative;
}
.cp-theme--circle label[id$=select_all] .color-picker-select-all-label,
.cp-theme--circle button[id$=select_all] .color-picker-select-all-label {
  display: block;
  width: var(--cp-width);
  position: relative;
}
.cp-theme--circle label[id$=select_all] i,
.cp-theme--circle button[id$=select_all] i {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.8);
  transform: translate(-50%, -50%) scale(0.8);
  overflow: hidden;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--circle label[id$=select_all] .color-picker-select-all-label,
  .cp-theme--circle button[id$=select_all] .color-picker-select-all-label {
    width: var(--cp-width-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--circle label[id$=select_all] .color-picker-select-all-label,
  .cp-theme--circle button[id$=select_all] .color-picker-select-all-label {
    width: var(--cp-width-small);
  }
}

.cp-theme--compact-button {
  --cp-padding: 5px;
  --cp-width: 120px;
  --cp-height: 40px;
  --cp-width-medium: var(--cp-width);
  --cp-height-medium: var(--cp-height);
  --cp-width-small: var(--cp-width);
  --cp-height-small: var(--cp-height);
  --cp-text-size: 11px;
  --cp-selected-icon: var(--cp-source-icon-tick);
  --cp-selected-icon-size: 15px;
  --cp-picker-icon-size: 16px;
}

.cp-theme--compact-button .color-picker-swatch,
.cp-theme--compact-button label[id$=select_all],
.cp-theme--compact-button button[id$=select_all] {
  cursor: pointer;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  min-width: var(--cp-width);
  max-width: 100%;
  height: var(--cp-height);
  border-radius: 15px;
  background: #FFF;
  padding: var(--cp-padding);
  -webkit-box-shadow: 0 0.4066425264px 1.281370759px 0 rgba(12, 20, 33, 0.01), 0 0.9802988768px 2.142832756px 0 rgba(12, 20, 33, 0.02), 0 1.8589371443px 3.6016907692px 0 rgba(12, 20, 33, 0.02), 0 3.0861260891px 5.9956030846px 0 rgba(12, 20, 33, 0.02), 0 4.7054347992px 9.6622285843px 0 rgba(12, 20, 33, 0.03), 0 6.7604317665px 14.9392242432px 0 rgba(12, 20, 33, 0.03), 0 9.2946853638px 22.1642513275px 0 rgba(12, 20, 33, 0.04);
  box-shadow: 0 0.4066425264px 1.281370759px 0 rgba(12, 20, 33, 0.01), 0 0.9802988768px 2.142832756px 0 rgba(12, 20, 33, 0.02), 0 1.8589371443px 3.6016907692px 0 rgba(12, 20, 33, 0.02), 0 3.0861260891px 5.9956030846px 0 rgba(12, 20, 33, 0.02), 0 4.7054347992px 9.6622285843px 0 rgba(12, 20, 33, 0.03), 0 6.7604317665px 14.9392242432px 0 rgba(12, 20, 33, 0.03), 0 9.2946853638px 22.1642513275px 0 rgba(12, 20, 33, 0.04);
}
.cp-theme--compact-button .color-picker-choice .color-picker-swatch,
.cp-theme--compact-button .color-picker-choice .gform-field-label,
.cp-theme--compact-button .color-picker-has-select-all label[id$=select_all],
.cp-theme--compact-button .color-picker-has-select-all button[id$=select_all] {
  width: 100%;
}
.cp-theme--compact-button.cp-cols--fixed .color-picker-choice .color-picker-swatch {
  min-width: var(--cp-width);
}
.cp-theme--compact-button.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
.cp-theme--compact-button.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
  width: var(--cp-width);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--compact-button .color-picker-swatch,
  .cp-theme--compact-button label[id$=select_all],
  .cp-theme--compact-button button[id$=select_all] {
    height: var(--cp-height-medium);
  }
  .cp-theme--compact-button.cp-cols--fixed .color-picker-choice .color-picker-swatch {
    min-width: var(--cp-width-medium);
  }
  .cp-theme--compact-button.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--compact-button.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--compact-button .color-picker-swatch,
  .cp-theme--compact-button label[id$=select_all],
  .cp-theme--compact-button button[id$=select_all] {
    height: var(--cp-height-small);
  }
  .cp-theme--compact-button.cp-cols--fixed .color-picker-choice .color-picker-swatch {
    min-width: var(--cp-width-small);
  }
  .cp-theme--compact-button.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--compact-button.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-small);
  }
}
.cp-theme--compact-button .ginput_container_text .color-picker-swatch {
  width: auto;
}
.cp-theme--compact-button .color-picker-swatches-popup-trigger {
  min-width: var(--cp-width);
  max-width: 100%;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--compact-button .color-picker-swatches-popup-trigger {
    min-width: var(--cp-width-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--compact-button .color-picker-swatches-popup-trigger {
    min-width: var(--cp-width-small);
  }
}
.cp-theme--compact-button .color-picker-swatch-color-wrap,
.cp-theme--compact-button label[id$=select_all] .color-picker-select-all-icon,
.cp-theme--compact-button button[id$=select_all] .color-picker-select-all-icon {
  width: calc(var(--cp-height) - var(--cp-padding) * 2);
  height: calc(var(--cp-height) - var(--cp-padding) * 2);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--compact-button .color-picker-swatch-color-wrap,
  .cp-theme--compact-button label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--compact-button button[id$=select_all] .color-picker-select-all-icon {
    width: calc(var(--cp-height-medium) - var(--cp-padding) * 2);
    height: calc(var(--cp-height-medium) - var(--cp-padding) * 2);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--compact-button .color-picker-swatch-color-wrap,
  .cp-theme--compact-button label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--compact-button button[id$=select_all] .color-picker-select-all-icon {
    width: calc(var(--cp-height-small) - var(--cp-padding) * 2);
    height: calc(var(--cp-height-small) - var(--cp-padding) * 2);
  }
}
.cp-theme--compact-button .color-picker-swatch-color-wrap,
.cp-theme--compact-button .color-picker-swatch-color,
.cp-theme--compact-button label[id$=select_all] .color-picker-select-all-icon,
.cp-theme--compact-button button[id$=select_all] .color-picker-select-all-icon {
  border-radius: 10px;
}
.cp-theme--compact-button .color-picker-swatch-color {
  height: 100%;
}
.cp-theme--compact-button .color-picker-swatch-color {
  position: relative;
}
.cp-theme--compact-button .color-picker-swatch-color i {
  pointer-events: none;
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.8);
  transform: translate(-50%, -50%) scale(0.8);
  width: var(--cp-selected-icon-size);
  height: var(--cp-selected-icon-size);
  overflow: hidden;
  opacity: 0;
  background-color: var(--cp-selected-icon-color);
  -webkit-mask-image: var(--cp-selected-icon);
  mask-image: var(--cp-selected-icon);
  -webkit-mask-size: var(--cp-selected-icon-size);
  mask-size: var(--cp-selected-icon-size);
  -webkit-mask-position: 50%;
  mask-position: 50%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  will-change: opacity;
  -webkit-transition: opacity var(--cp-transition-duration) var(--cp-transition-easing);
  transition: opacity var(--cp-transition-duration) var(--cp-transition-easing);
}
.cp-theme--compact-button .color-picker-swatch--light .color-picker-swatch-color i {
  background-color: var(--cp-selected-icon-color-alt);
}
.cp-theme--compact-button .color-picker-choice-selected .color-picker-swatch-color i {
  opacity: 1;
}
.cp-theme--compact-button input[type=text] ~ .color-picker-swatch .color-picker-swatch-color,
.cp-theme--compact-button .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color,
.cp-theme--compact-button .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color {
  background-color: var(--cp-default-swatch-color);
}
.cp-theme--compact-button input[type=text] ~ .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--compact-button .color-picker-swatches-popup-trigger .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--compact-button .color-picker-choice-other:not(.color-picker-choice-selected):not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i {
  background-color: #ffffff;
}
.cp-theme--compact-button input[type=text] ~ .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--compact-button .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--compact-button .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color i {
  background-color: var(--cp-picker-icon-color);
  width: var(--cp-picker-icon-size);
  height: var(--cp-picker-icon-size);
  -webkit-mask-image: var(--cp-picker-icon);
  mask-image: var(--cp-picker-icon);
  -webkit-mask-size: var(--cp-picker-icon-size);
  mask-size: var(--cp-picker-icon-size);
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}
.cp-theme--compact-button .color-picker-swatch-text-wrap,
.cp-theme--compact-button label[id$=select_all] .color-picker-select-all-label,
.cp-theme--compact-button button[id$=select_all] .color-picker-select-all-label {
  width: auto;
  height: calc(var(--cp-height) - var(--cp-padding));
  overflow: hidden;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0 var(--cp-padding);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--compact-button .color-picker-swatch-text-wrap,
  .cp-theme--compact-button label[id$=select_all] .color-picker-select-all-label,
  .cp-theme--compact-button button[id$=select_all] .color-picker-select-all-label {
    height: calc(var(--cp-height-medium) - var(--cp-padding));
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--compact-button .color-picker-swatch-text-wrap,
  .cp-theme--compact-button label[id$=select_all] .color-picker-select-all-label,
  .cp-theme--compact-button button[id$=select_all] .color-picker-select-all-label {
    height: calc(var(--cp-height-small) - var(--cp-padding));
  }
}
.cp-theme--compact-button .color-picker-swatch-text-prefix,
.cp-theme--compact-button .color-picker-swatch-text-suffix,
.cp-theme--compact-button .color-picker-swatch-price {
  display: none;
}
.cp-theme--compact-button .color-picker-choice .gftt-icon {
  top: -13px;
  left: unset;
  right: -15px;
}
.cp-theme--compact-button label[id$=select_all] .color-picker-select-all-icon,
.cp-theme--compact-button button[id$=select_all] .color-picker-select-all-icon {
  position: relative;
}
.cp-theme--compact-button label[id$=select_all] .color-picker-select-all-label,
.cp-theme--compact-button button[id$=select_all] .color-picker-select-all-label {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.cp-theme--compact-button label[id$=select_all] i,
.cp-theme--compact-button button[id$=select_all] i {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  overflow: hidden;
}

.cp-theme--horizontal-bar {
  --cp-padding: 20px;
  --cp-width: 190px;
  --cp-height: 64px;
  --cp-width-medium: var(--cp-width);
  --cp-height-medium: var(--cp-height);
  --cp-width-small: var(--cp-width);
  --cp-height-small: var(--cp-height);
  --cp-selected-icon: var(--cp-source-icon-tick);
  --cp-selected-icon-size: 20px;
  --cp-picker-icon-size: 24px;
}

.cp-theme--horizontal-bar .color-picker-swatch,
.cp-theme--horizontal-bar label[id$=select_all],
.cp-theme--horizontal-bar button[id$=select_all] {
  cursor: pointer;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  min-width: var(--cp-width);
  max-width: 100%;
  height: var(--cp-height);
  padding: 0;
  border-radius: 5px;
  border: 2px solid #B1C0CF;
  background: #FFF;
  -webkit-box-shadow: 0 0.5687500238px 1.7921874523px 0 rgba(12, 20, 33, 0.01), 0 1.37109375px 2.9970703125px 0 rgba(12, 20, 33, 0.02), 0 2.5999999046px 5.0374999046px 0 rgba(12, 20, 33, 0.02), 0 4.31640625px 8.3857421875px 0 rgba(12, 20, 33, 0.02), 0 6.5812501907px 13.5140628815px 0 rgba(12, 20, 33, 0.03), 0 9.4554691315px 20.8947257996px 0 rgba(12, 20, 33, 0.03), 0 13px 31px 0 rgba(12, 20, 33, 0.04);
  box-shadow: 0 0.5687500238px 1.7921874523px 0 rgba(12, 20, 33, 0.01), 0 1.37109375px 2.9970703125px 0 rgba(12, 20, 33, 0.02), 0 2.5999999046px 5.0374999046px 0 rgba(12, 20, 33, 0.02), 0 4.31640625px 8.3857421875px 0 rgba(12, 20, 33, 0.02), 0 6.5812501907px 13.5140628815px 0 rgba(12, 20, 33, 0.03), 0 9.4554691315px 20.8947257996px 0 rgba(12, 20, 33, 0.03), 0 13px 31px 0 rgba(12, 20, 33, 0.04);
}
.cp-theme--horizontal-bar .color-picker-choice .color-picker-swatch,
.cp-theme--horizontal-bar .color-picker-choice .gform-field-label,
.cp-theme--horizontal-bar .color-picker-has-select-all label[id$=select_all],
.cp-theme--horizontal-bar .color-picker-has-select-all button[id$=select_all] {
  width: 100%;
}
.cp-theme--horizontal-bar.cp-cols--fixed .color-picker-choice .color-picker-swatch {
  min-width: var(--cp-width);
}
.cp-theme--horizontal-bar.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
.cp-theme--horizontal-bar.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
  width: var(--cp-width);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--horizontal-bar .color-picker-swatch,
  .cp-theme--horizontal-bar label[id$=select_all],
  .cp-theme--horizontal-bar button[id$=select_all] {
    height: var(--cp-height-medium);
  }
  .cp-theme--horizontal-bar.cp-cols--fixed .color-picker-choice .color-picker-swatch {
    min-width: var(--cp-width-medium);
  }
  .cp-theme--horizontal-bar.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--horizontal-bar.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--horizontal-bar .color-picker-swatch,
  .cp-theme--horizontal-bar label[id$=select_all],
  .cp-theme--horizontal-bar button[id$=select_all] {
    height: var(--cp-height-small);
  }
  .cp-theme--horizontal-bar.cp-cols--fixed .color-picker-choice .color-picker-swatch {
    min-width: var(--cp-width-small);
  }
  .cp-theme--horizontal-bar.cp-cols--fixed .color-picker-has-select-all label[id$=select_all],
  .cp-theme--horizontal-bar.cp-cols--fixed .color-picker-has-select-all button[id$=select_all] {
    width: var(--cp-width-small);
  }
}
.cp-theme--horizontal-bar .ginput_container_text .color-picker-swatch {
  width: auto;
}
.cp-theme--horizontal-bar .color-picker-swatch-color-wrap {
  width: var(--cp-height);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--horizontal-bar .color-picker-swatch-color-wrap {
    width: var(--cp-height-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--horizontal-bar .color-picker-swatch-color-wrap {
    width: var(--cp-height-small);
  }
}
.cp-theme--horizontal-bar .color-picker-swatch-color-wrap,
.cp-theme--horizontal-bar .color-picker-swatch-color {
  height: 100%;
  border-radius: 0 3px 3px 0;
}
.cp-theme--horizontal-bar .color-picker-swatch-color {
  position: relative;
}
.cp-theme--horizontal-bar .color-picker-swatch-color i {
  pointer-events: none;
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.8);
  transform: translate(-50%, -50%) scale(0.8);
  width: var(--cp-selected-icon-size);
  height: var(--cp-selected-icon-size);
  overflow: hidden;
  opacity: 0;
  background-color: var(--cp-selected-icon-color);
  -webkit-mask-image: var(--cp-selected-icon);
  mask-image: var(--cp-selected-icon);
  -webkit-mask-size: var(--cp-selected-icon-size);
  mask-size: var(--cp-selected-icon-size);
  -webkit-mask-position: 50%;
  mask-position: 50%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  will-change: opacity;
  -webkit-transition: opacity var(--cp-transition-duration) var(--cp-transition-easing);
  transition: opacity var(--cp-transition-duration) var(--cp-transition-easing);
}
.cp-theme--horizontal-bar .color-picker-swatch--light .color-picker-swatch-color i {
  background-color: var(--cp-selected-icon-color-alt);
}
.cp-theme--horizontal-bar .color-picker-choice-selected .color-picker-swatch-color i {
  opacity: 1;
}
.cp-theme--horizontal-bar input[type=text] ~ .color-picker-swatch .color-picker-swatch-color,
.cp-theme--horizontal-bar .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color,
.cp-theme--horizontal-bar .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color {
  background-color: var(--cp-default-swatch-color);
}
.cp-theme--horizontal-bar input[type=text] ~ .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--horizontal-bar .color-picker-swatches-popup-trigger .color-picker-swatch:not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i,
.cp-theme--horizontal-bar .color-picker-choice-other:not(.color-picker-choice-selected):not(.color-picker-swatch--light) .color-picker-swatch-color[style^="background-color:"] i {
  background-color: #ffffff;
}
.cp-theme--horizontal-bar input[type=text] ~ .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--horizontal-bar .color-picker-swatches-popup-trigger .color-picker-swatch .color-picker-swatch-color i,
.cp-theme--horizontal-bar .color-picker-choice-other:not(.color-picker-choice-selected) .color-picker-swatch-color i {
  background-color: var(--cp-picker-icon-color);
  width: var(--cp-picker-icon-size);
  height: var(--cp-picker-icon-size);
  -webkit-mask-image: var(--cp-picker-icon);
  mask-image: var(--cp-picker-icon);
  -webkit-mask-size: var(--cp-picker-icon-size);
  mask-size: var(--cp-picker-icon-size);
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}
.cp-theme--horizontal-bar .color-picker-swatch-text-wrap {
  width: auto;
  height: calc(var(--cp-height) - var(--cp-padding));
  overflow: hidden;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0 var(--cp-padding);
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--horizontal-bar .color-picker-swatch-text-wrap {
    height: calc(var(--cp-height-medium) - var(--cp-padding));
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--horizontal-bar .color-picker-swatch-text-wrap {
    height: calc(var(--cp-height-small) - var(--cp-padding));
  }
}
.cp-theme--horizontal-bar .color-picker-swatch-text-prefix,
.cp-theme--horizontal-bar .color-picker-swatch-text-suffix,
.cp-theme--horizontal-bar .color-picker-swatch-price {
  display: none;
}
.cp-theme--horizontal-bar .color-picker-choice .gftt-icon {
  left: unset;
  right: 70px;
  top: 2px;
}
.cp-theme--horizontal-bar label[id$=select_all] .color-picker-select-all-label,
.cp-theme--horizontal-bar button[id$=select_all] .color-picker-select-all-label {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding-left: var(--cp-padding);
  text-align: left;
}
.cp-theme--horizontal-bar label[id$=select_all] .color-picker-select-all-icon,
.cp-theme--horizontal-bar button[id$=select_all] .color-picker-select-all-icon {
  width: var(--cp-height);
  height: 100%;
  position: relative;
  border-radius: 0 3px 3px 0;
}
.cp-theme--horizontal-bar label[id$=select_all] i,
.cp-theme--horizontal-bar button[id$=select_all] i {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  overflow: hidden;
}
@media only screen and (min-width: 480px) and (max-width: 1079px) {
  .cp-theme--horizontal-bar label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--horizontal-bar button[id$=select_all] .color-picker-select-all-icon {
    width: var(--cp-height-medium);
  }
}
@media only screen and (max-width: 479px) {
  .cp-theme--horizontal-bar label[id$=select_all] .color-picker-select-all-icon,
  .cp-theme--horizontal-bar button[id$=select_all] .color-picker-select-all-icon {
    width: var(--cp-height-small);
  }
}

@media only screen and (min-width: 1080px) {
  .gfield.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_checkbox,
  .gfield.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_radio,
  .gform_legacy_markup_wrapper .gfield.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_checkbox,
  .gform_legacy_markup_wrapper .gfield.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_radio,
  .gform_wrapper.gravity-theme .gfield--type-choice.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_checkbox,
  .gform_wrapper.gravity-theme .gfield--type-choice.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_radio,
  .gform_wrapper.gform-theme--framework .gfield--type-choice.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_checkbox,
  .gform_wrapper.gform-theme--framework .gfield--type-choice.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_radio,
  .gform_wrapper.gravity-theme .gfield--type-multi_choice.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_checkbox,
  .gform_wrapper.gravity-theme .gfield--type-multi_choice.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_radio,
  .gform_wrapper.gform-theme--framework .gfield--type-multi_choice.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_checkbox,
  .gform_wrapper.gform-theme--framework .gfield--type-multi_choice.color-picker-field.cp-cols--auto:not(.color-picker-use-swatches-popup) .gfield_radio {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  }
  .cp-cols--12 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--12 .gchoice_select_all,
  .cp-cols--12 button[id$=select_all] {
    width: calc(8.333% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--11 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--11 .gchoice_select_all,
  .cp-cols--11 button[id$=select_all] {
    width: calc(9.09% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--10 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--10 .gchoice_select_all,
  .cp-cols--10 button[id$=select_all] {
    width: calc(10% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--9 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--9 .gchoice_select_all,
  .cp-cols--9 button[id$=select_all] {
    width: calc(11.111% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--8 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--8 .gchoice_select_all,
  .cp-cols--8 button[id$=select_all] {
    width: calc(12.5% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--7 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--7 .gchoice_select_all,
  .cp-cols--7 button[id$=select_all] {
    width: calc(14.285% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--6 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--6 .gchoice_select_all,
  .cp-cols--6 button[id$=select_all] {
    width: calc(16.666% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--5 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--5 .gchoice_select_all,
  .cp-cols--5 button[id$=select_all] {
    width: calc(20% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--4 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--4 .gchoice_select_all,
  .cp-cols--4 button[id$=select_all] {
    width: calc(25% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--3 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--3 .gchoice_select_all,
  .cp-cols--3 button[id$=select_all] {
    width: calc(33.333% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--2 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--2 .gchoice_select_all,
  .cp-cols--2 button[id$=select_all] {
    width: calc(50% - var(--cp-column-spacing) / 2);
  }
  .cp-cols--1 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols--1 .gchoice_select_all,
  .cp-cols--1 button[id$=select_all] {
    width: calc(100% - var(--cp-column-spacing) / 2);
  }
}
@media only screen and (min-width: 640px) and (max-width: 1079px) {
  .cp-cols-md--auto .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--auto .gchoice_select_all,
  .cp-cols-md--auto button[id$=select_all] {
    width: calc(33.333% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--12 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--12 .gchoice_select_all,
  .cp-cols-md--12 button[id$=select_all] {
    width: calc(8.333% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--11 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--11 .gchoice_select_all,
  .cp-cols-md--11 button[id$=select_all] {
    width: calc(9.09% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--10 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--10 .gchoice_select_all,
  .cp-cols-md--10 button[id$=select_all] {
    width: calc(10% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--9 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--9 .gchoice_select_all,
  .cp-cols-md--9 button[id$=select_all] {
    width: calc(11.111% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--8 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--8 .gchoice_select_all,
  .cp-cols-md--8 button[id$=select_all] {
    width: calc(12.5% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--7 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--7 .gchoice_select_all,
  .cp-cols-md--7 button[id$=select_all] {
    width: calc(14.285% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--6 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--6 .gchoice_select_all,
  .cp-cols-md--6 button[id$=select_all] {
    width: calc(16.666% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--5 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--5 .gchoice_select_all,
  .cp-cols-md--5 button[id$=select_all] {
    width: calc(20% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--4 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--4 .gchoice_select_all,
  .cp-cols-md--4 button[id$=select_all] {
    width: calc(25% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--3 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--3 .gchoice_select_all,
  .cp-cols-md--3 button[id$=select_all] {
    width: calc(33.333% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--2 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--2 .gchoice_select_all,
  .cp-cols-md--2 button[id$=select_all] {
    width: calc(50% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-md--1 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-md--1 .gchoice_select_all,
  .cp-cols-md--1 button[id$=select_all] {
    width: calc(100% - var(--cp-column-spacing) / 2);
  }
}
@media only screen and (max-width: 639px) {
  .cp-cols-sm--auto .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--auto .gchoice_select_all,
  .cp-cols-sm--auto button[id$=select_all] {
    width: calc(100% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--12 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--12 .gchoice_select_all,
  .cp-cols-sm--12 button[id$=select_all] {
    width: calc(8.333% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--11 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--11 .gchoice_select_all,
  .cp-cols-sm--11 button[id$=select_all] {
    width: calc(9.09% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--10 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--10 .gchoice_select_all,
  .cp-cols-sm--10 button[id$=select_all] {
    width: calc(10% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--9 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--9 .gchoice_select_all,
  .cp-cols-sm--9 button[id$=select_all] {
    width: calc(11.111% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--8 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--8 .gchoice_select_all,
  .cp-cols-sm--8 button[id$=select_all] {
    width: calc(12.5% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--7 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--7 .gchoice_select_all,
  .cp-cols-sm--7 button[id$=select_all] {
    width: calc(14.285% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--6 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--6 .gchoice_select_all,
  .cp-cols-sm--6 button[id$=select_all] {
    width: calc(16.666% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--5 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--5 .gchoice_select_all,
  .cp-cols-sm--5 button[id$=select_all] {
    width: calc(20% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--4 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--4 .gchoice_select_all,
  .cp-cols-sm--4 button[id$=select_all] {
    width: calc(25% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--3 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--3 .gchoice_select_all,
  .cp-cols-sm--3 button[id$=select_all] {
    width: calc(33.333% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--2 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--2 .gchoice_select_all,
  .cp-cols-sm--2 button[id$=select_all] {
    width: calc(50% - var(--cp-column-spacing) / 2);
  }
  .cp-cols-sm--1 .color-picker-choice,
  .gform_legacy_markup_wrapper .cp-cols-sm--1 .gchoice_select_all,
  .cp-cols-sm--1 button[id$=select_all] {
    width: calc(100% - var(--cp-column-spacing) / 2);
  }
}
.color-picker-use-swatches-popup .ginput_container {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 99999;
  margin: 0 !important;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  background: rgba(0, 0, 0, 0.4);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.color-picker-use-swatches-popup .ginput_container .gfield_radio,
.color-picker-use-swatches-popup .ginput_container .gfield_checkbox {
  padding: 40px 30px 30px;
  background: #fff;
  border: 1px solid #eaeaea;
  -webkit-box-shadow: 0 0 40px 0 rgba(63, 56, 68, 0.3);
  box-shadow: 0 0 40px 0 rgba(63, 56, 68, 0.3);
  border-radius: 3px;
  z-index: 997;
  width: auto !important;
  -webkit-transition: opacity 0.3s, top 0.3s;
  transition: opacity 0.3s, top 0.3s;
  margin: 0;
  position: relative;
}
.color-picker-use-swatches-popup .ginput_container:not(.color-picker-active) {
  opacity: 0;
  pointer-events: none;
}
.color-picker-use-swatches-popup .ginput_container:not(.color-picker-active) .gfield_radio,
.color-picker-use-swatches-popup .ginput_container:not(.color-picker-active) .gfield_checkbox, .color-picker-use-swatches-popup .ginput_container.color-picker-picking .gfield_radio,
.color-picker-use-swatches-popup .ginput_container.color-picker-picking .gfield_checkbox {
  opacity: 0;
}

.color-picker-swatches-popup-close {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  overflow: hidden;
  display: inline-block;
  border: 2px solid black;
  background: white;
  color: black;
  position: absolute;
  right: 4px;
  top: 4px;
  padding: 0;
  margin: 0 !important;
}
.color-picker-swatches-popup-close:before, .color-picker-swatches-popup-close:after {
  content: "";
  width: 12px;
  height: 2px;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  display: inline-block;
  background: black;
  -webkit-transform-origin: 50%;
  transform-origin: 50%;
  position: absolute;
  left: 6px;
  top: 11px;
}
.color-picker-swatches-popup-close:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.color-picker-swatches-popup-close:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.color-picker-swatches-popup-close:hover {
  color: white;
  background: black;
}
.color-picker-swatches-popup-close:hover:before, .color-picker-swatches-popup-close:hover:after {
  background: white;
}
.color-picker-swatches-popup-close span {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
}