.esriColorPicker {font-family: "Avenir LT W01 65 Medium", Arial, Helvetica, sans-serif; font-size: 12px; color: #4d4d4d; text-shadow: none; width: 195px;}.esriColorPicker .esriSection {margin: 10px 0 8px;}.esriColorPicker .esriSection:last-child {margin-bottom: 0;}.esriColorPicker.esriContainer {border: solid 2px #aaa; display: inline-block; padding: 4px 15px; background-color: #fff; border-radius: 4px;}.esriColorPicker .esriHexInput {display: inline-block; color: #4d4d4d; width: 5.6em; border: 1px solid #aaa; direction: ltr;}.esriColorPicker .esriHexInput .dijitInputInner {text-transform: uppercase;}.esriColorPicker .esriHexInput .dijitInputContainer {height: auto;}.esriColorPicker .esriInputLabel {display: inline-block; vertical-align: middle;}.esriColorPicker .esriSwatch {box-sizing: border-box; vertical-align: middle; height: 15px; width: 15px; display: inline-block; cursor: pointer; margin: 0; border-radius: 0; border-color: transparent; transition: background-color .25s, border-color 0.25s;}.esriColorPicker .esriDisplayNone {display: none;}.esriColorPicker .esriSwatchEmpty:before {display: inline-block; background-color: #f00; position: absolute; height: 1px; bottom: 0; left: 0; width: 200%; transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform-origin: top left; -ms-transform-origin: top left; -webkit-transform-origin: top left; content: "";}.esriColorPicker .esriSwatchEmpty {position: relative; overflow: hidden; border: solid 1px #aaa; background-color: #fff;}.esriColorPicker .esriPaletteOptions {padding: 6px 0 0; position: relative;}.esriColorPicker .esriPaletteOptions .esriSwatchEmpty {margin: 0 10px 0;}.esriColorPicker .esriPaletteOptions .esriPaletteToggle {position: absolute; right: 0; vertical-align: middle; box-shadow: none; border: none; padding: 0;}.dijitRtl .esriColorPicker .esriPaletteOptions .esriPaletteToggle {left: 0; right: auto;}.esriColorPicker .esriMiddle .esriPaletteOptions .dijit.esriPaletteToggle .dijitButtonNode {background: none; box-shadow: none; border: none; padding: 0;}.esriColorPicker .esriPaletteOptions .esriPaletteToggle.dijitChecked {background-color: transparent;}.esriColorPicker .esriLabel {margin: 0 0 4px;}.esriColorPickerLabel.esriDisabled {opacity: 0.6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";}.esriColorPicker .esriSwatchPreview {box-sizing: border-box; margin: 0; vertical-align: middle; display: inline-block; height: 25px; width: 100%;}.esriColorPicker .esriSwatchPreview.esriContainer {position: relative; left: 0; right: 0; display: block; text-align: center;}.esriColorPicker .esriSwatchPreview .esriSwatch {position: absolute; cursor: auto; margin: 0; right: 0; top: 0; bottom: 0; left: 0; height: 25px; width: 100%;}.esriColorPicker .esriSwatchPreview .esriSwatch.esriSwatchEmpty {display: none;}.esriColorPicker .esriSwatchRow {font-size: 0; white-space: nowrap;}.esriColorPicker .esriSwatch.esriSwatchTransparencyBackground {background-image: url("../../images/transparent-bg.png");}.esriColorPicker .esriSwatch.esriSelected,.esriColorPicker .esriSwatchPreview .esriSwatch {border: 1px solid;}.esriColorPicker .esriTransparencySlider {padding-top: 5px;}.esriColorPicker .esriSwatch.esriSelected {-webkit-animation: esriColorPicker-highlight-selection 0.2s ease; animation: esriColorPicker-highlight-selection 0.2s ease;}.esriColorPicker .esriHeader,.esriColorPicker .esriFooter {margin: 8px 0 10px;}.esriColorPicker .dijitRuleContainer {padding: 5px; color: #4d4d4d;}.esriColorPicker .esriPalette.esriContainer.esriAlt .esriPalette {left: -100%;}.esriColorPicker .esriPalette.esriContainer {width: 100%; overflow: hidden; white-space: nowrap;}.esriColorPicker .esriPalette {left: 0; width: 100%; position: relative; display: inline-block; -webkit-transition: left 0.15s, visibility 0.1s; -moz-transition: left 0.15s, visibility 0.1s; -ms-transition: left 0.15s, visibility 0.1s; -o-transition: left 0.15s, visibility 0.1s; transition: left 0.15s, visibility 0.1s;}.esriColorPicker .esriCollapseIcon {display: none;}.esriColorPicker.esriCollapsible {padding: 4px; position: relative; width: auto; border-radius: 0;}.esriColorPicker.esriCollapsible .esriColorControls {top: 40px; left: -2px; right: -2px; position: absolute; border: solid 2px #aaa; padding: 4px 15px; background-color: #fff; width: 195px; z-index: 1;}.esriColorPicker.esriCollapsible .esriHeader {margin: 0; display: inline-block;}.esriColorPicker.esriCollapsible .esriCollapseIcon {display: inline-block;}.esriColorPicker.esriCollapsible .esriSwatchPreview.esriContainer {display: inline-block; width: 25px;}.esriColorPicker.esriCollapsible .esriHeader,.esriColorPicker.esriCollapsible .esriSwatchPreview .esriSwatch {cursor: pointer;}.esriColorPicker.esriCollapsed .esriHeader {margin: 0;}.esriColorPicker.esriCollapsed .esriColorControls {display: none;}.dijitRtl .esriColorPicker .esriPalette {left: auto; right: 0; -webkit-transition-property: right; -moz-transition-property: right; -ms-transition-property: right; -o-transition-property: right; transition-property: right;}.dijitRtl .esriColorPicker .esriPalette.esriContainer.esriAlt .esriPalette {right: -100%; left: 0;}.esriColorPicker .esriSwatch--focused {border: 2px solid; transition: none;}