.esriSymbolStyler {
  width: 236px;
  font-family: "Avenir LT W01 65 Medium", Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #4d4d4d;
  position: relative;
  padding: 20px;
  background-color: #fff;
}

.esriSymbolStyler .esriLink {
  margin: 8px 0;
  display: inline-block;
  cursor: pointer;
  text-decoration: underline;
}

.esriSymbolStyler .esriLink .dijitButtonText {
  padding: 0;
  text-decoration: underline;
}

.esriSymbolStyler .esriSymbolPreview {
  margin: auto auto 10px;
  transition: background-color .25s;
}

.esriSymbolStyler .esriSymbolPreview.esriAlt {
  background-color: #ddd;
  padding: 2px;
}

.esriSymbolStyler .esriMarkerSymbolPicker {
  width: auto;
}

.esriSymbolStyler .esriInlineInput .dijitDisabled + .esriText {
  opacity: 0.5;
}

.esriSymbolStyler .esriColorPicker {
  width: 100%;
}

.esriSymbolStyler .esriColorPicker.esriContainer {
  border: none;
  padding: 0;
}

.esriSymbolStyler .esriColorPicker .esriSwatch {
  width: 18px;
  height: 18px;
}

.esriSymbolStyler .esriColorPicker .esriHeader {
  display: none;
}

.esriSymbolStyler .esriColorPicker .esriFooter {
  margin-bottom: 0;
}

.esriSymbolStyler .esriColorPicker .esriSection:first-child {
  margin-top: 0;
}

.esriSymbolStyler .esriContent {
  height: 100%;
}

.esriSymbolStyler .esriTabBar {
  display: block;
  margin: 10px 0;
  white-space: nowrap;
}

.esriSymbolStyler .esriTabBar .dijitToggleButton {
  background: none;
  color: #4d4d4d;
  font-size: 11px;
  padding: 4px 10px;
  border: none;
  box-shadow: none;
  text-transform: uppercase;
}

.esriSymbolStyler .esriTabBar .dijitDisabled .dijitButtonNode,
.esriSymbolStyler .esriTabBar .dijitDisabled .dijitButtonContents,
.esriSymbolStyler .esriTabBar .dijitDisabled .dijitButtonText {
  cursor: auto;
  color: #c3c3c3;
}

.esriSymbolStyler .esriTabBar .dijitToggleButtonChecked {
  background-color: #CEE7F8;
  border-radius: 4px;
}

.esriSymbolStyler .esriLabel {
  margin: 10px 0 4px;
}

.esriSymbolStyler .esriColorPicker .esriHorizontalSlider .dijitRuleContainer {
  padding: 10px 0 14px;
}

.esriSymbolStyler .esriSymbolSizeInput .esriHorizontalSlider,
.esriSymbolStyler .esriLineWidthInput .esriHorizontalSlider {
  width: 66%;
}

.esriSymbolStyler .esriInlineInput {
  white-space: nowrap;
}

.esriSymbolStyler .esriInlineInput .esriHorizontalSlider,
.esriSymbolStyler .esriInlineInput .dijitTextBox {
  display: inline-block;
}

.esriSymbolStyler .esriInlineInput .dijitTextBox {
  width: 4.4em;
  margin: 0 2px;
  box-sizing: border-box;
}

.esriSymbolStyler .esriIconSelect .dijitButtonContents {
  width: 100%;
  overflow: hidden;
}

.esriSymbolStyler .esriIconSelect {
  box-sizing: border-box;
  margin: 0;
}

.esriSymbolStyler .esriLabel.esriDisabled,
.esriSymbolStyler .esriIconSelect.dijitDisabled {
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
}

.esriSymbolStyler .esriIconSelect .dijitButtonText {
  padding: 0;
}

.esriIconSelectMenu .dijitMenuItemIconCell {
  margin: 0 2px;
}

.esriIconSelectMenu .dijitMenuItemIcon {
  width: 100%;
  display: block;
}

.esriIconSelectMenu .dijitMenuArrowCell,
.esriIconSelectMenu .dijitMenuItemLabel {
  display: none;
}

.esriIconSelectMenu .dijitMenuItemLabel .dijitSelect {
  padding: 0;
  margin: 0 5px;
}

.esriSymbolStyler .esriLinePattern,
.esriIconSelectMenu .esriLinePattern {
  background: url("../images/line-patterns.png") no-repeat;
  height: 15px;
  width: 100%;
}

.esriSymbolStyler .esriArrowPattern,
.esriIconSelectMenu .esriArrowPattern {
  background: url("../images/arrow-patterns.png") no-repeat;
  height: 15px;
  width: 100%;
}

[class*=esriIconSelect] .solid {
  background-position: 0 0;
}

[class*=esriIconSelect] .dot {
  background-position: 0 -15px;
}

[class*=esriIconSelect] .dash {
  background-position: 0 -30px;
}

[class*=esriIconSelect] .dashdot {
  background-position: 0 -45px;
}

[class*=esriIconSelect] .longdashdotdot {
  background-position: 0 -60px;
}

[class*=esriIconSelect] .longdash {
  background-position: 0 -75px;
}

[class*=esriIconSelect] .longdashdot {
  background-position: 0 -90px;
}

[class*=esriIconSelect] .shortdash {
  background-position: 0 -105px;
}

[class*=esriIconSelect] .shortdot {
  background-position: 0 -120px;
}

[class*=esriIconSelect] .shortdashdot {
  background-position: 0 -135px;
}

[class*=esriIconSelect] .shortdashdotdot {
  background-position: 0 -150px;
}

[class*=esriIconSelect] .none {
  background-position: 0 6px;
}

[class*=esriIconSelect] .begin {
  background-position: 0 -14px;
}

[class*=esriIconSelect] .end {
  background-position: 0 -34px;
}

[class*=esriIconSelect] .begin-end {
  background-position: 0 -54px;
}

.esriSymbolStyler .esriSymbolPreviewContainer {
  text-align: center;
}

.esriSymbolStyler .esriTabBar .dijitToggleButton {
  vertical-align: middle;
}

.esriSymbolStyler .esriAddIcon {
  background: url("../images/add.png") no-repeat;
  background-size: 18px;
  height: 18px;
  width: 18px;
}

.esriSymbolStyler .dijitDisabled .addIcon {
  cursor: auto;
}

.esriSymbolStyler .dijitLayoutContainer,
.esriSymbolStyler .dijitContentPane {
  padding: 0;
  overflow: visible;
}

.esriSymbolStyler .esriSymbolPreviewContainer ~ .esriTabBar .dijitButton .dijitButtonNode,
.esriSymbolStyler .esriSymbolPreviewContainer ~ .esriContent .dijitButton .dijitButtonNode,
.esriSymbolStyler .esriSymbolPreviewContainer ~ .dijitContentPane .dijitButton .dijitButtonNode,
.esriSymbolStyler .esriSymbolPreviewContainer ~ .esriTabBar .dijitToggleButton .dijitButtonNode,
.esriSymbolStyler .esriSymbolPreviewContainer ~ .esriContent .dijitToggleButton .dijitButtonNode,
.esriSymbolStyler .esriSymbolPreviewContainer ~ .dijitContentPane .dijitToggleButton .dijitButtonNode {
  box-shadow: none;
  border: none;
  padding: 0;
  background: none;
}

.esriSymbolStyler .esriErrorDisplay {
  padding: 8px 0 4px 0;
}

.esriSymbolStyler .esriShapeImageUrlContainer .esriUrlInput {
  width: 90%;
}

.esriSymbolStyler .esriShapeImageUrlContainer .esriErrorDisplay {
  color: #aaa;
}

.esriSymbolStyler .esriHidden {
  display: none;
}

.esriSymbolStyler .esriColorRampPicker .esriViewport {
  width: 200px;
}

.esriSymbolStyler .dijitCheckBox + .esriLabel {
  margin-left: 4px;
  margin-right: 4px;
  vertical-align: middle;
}