/**
 * @file
 * Rating element styles.
 *
 * @see /webform/example_elements
 */

html.js .form-webform-rating {
  display: none;
}

div.svg div.rateit-range {
  background: url(../images/rating/star-normal.svg);
}

div.svg div.rateit-hover {
  background: url(../images/rating/star-hover.svg);
}

div.svg div.rateit-selected {
  background: url(../images/rating/star-selected.svg);
}

div.svg div.rateit-preset {
  background: url(../images/rating/star-preset.svg);
}

div.svg button.rateit-reset {
  background: url(../images/rating/reset-normal.svg);
}

div.svg button.rateit-reset:hover {
  background: url(../images/rating/reset-hover.svg);
}

/**
 * Small
 */
div.svg.rateit-small {
  height: 16px;
}

div.svg.rateit-small div.rateit-range,
div.svg.rateit-small div.rateit-hover,
div.svg.rateit-small div.rateit-selected,
div.svg.rateit-small div.rateit-preset {
  background-size: 16px 16px;
}

div.svg.rateit-small button.rateit-reset {
  height: 16px;
  width: 16px;
  background-size: 16px 16px;
}

/**
 * Medium
 */
div.svg.rateit-medium {
  height: 24px;
}

div.svg.rateit-medium div.rateit-range,
div.svg.rateit-medium div.rateit-hover,
div.svg.rateit-medium div.rateit-selected,
div.svg.rateit-medium div.rateit-preset {
  background-size: 24px 24px;
}

div.svg.rateit-medium button.rateit-reset {
  height: 24px;
  width: 24px;
  background-size: 24px 24px;
}

/**
 * Large
 */
div.svg.rateit-large {
  height: 36px;
}

div.svg.rateit-large div.rateit-range,
div.svg.rateit-large div.rateit-hover,
div.svg.rateit-large div.rateit-selected,
div.svg.rateit-large div.rateit-preset {
  background-size: 32px 32px;
}

div.svg.rateit-large button.rateit-reset {
  height: 32px;
  width: 32px;
  background-size: 32px 32px;
}