/* General styles for all elements. */
.pretty-element {
  margin: 5px;
  float: left;
}

/* Styles for elements in RTL */
[dir=rtl] .pretty-element {
  float: right;
}

/* Initial styles for the unselected elements */
.pretty-element label {
  display: block;
  border: 1px solid #c5c5c5;
  background-color: #f6f6f6;
  color: #454545;
  min-height: 20px;
  padding: 2px 13px;
  margin: 0;
  font-weight: normal;
  border-radius: 3px;
  cursor: pointer;
}

/* Styles for elements onHover state */
.pretty-element label:hover {
  background-color: #ededed;
  color: #2b2b2b;
}

/* Styles for elements onChecked state */
.pretty-element input:checked + label {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}

/* Hide default inputs */
.pretty-element input[type="radio"],
.pretty-element input[type="checkbox"] {
  display: none;
}

/* Show description below the elements */
.field--widget-options-pretty .description,
.field--widget-options-pretty [data-drupal-field-elements="description"] {
  clear: both;
}
