/**
 * Star ratings
 */
.star-rating {
	margin-left: auto;
  float: right;
  overflow: visible;
  position: relative;
  font-size: 18px;
  display: block;
  height: 18px;
  overflow: hidden;
  font-family: 'FontAwesome';
  text-align: center;
  width: 70px;
  &:before {
    content: "\f005\f005\f005\f005\f005";
    color: #eee;
    top: 0;
    left: 0;
    float: left;
    position: absolute;
    letter-spacing: 2px;
    font-size: 13px;
    line-height: 1.4em;
  }

  span {
    overflow: hidden;
    float: left;
    top: 0;
    left: 0;
    position: absolute;
    padding-top: 1.5em;
  }

  span:before {
    content: "\f005\f005\f005\f005\f005";
    color: #ccc;
    top: 0;
    position: absolute;
    left: 0;
    letter-spacing: 2px;
    font-size: 13px;
    line-height: 1.4em;
  }
  .rating {
    display: none;
  }
}

.woocommerce-product-rating {
  line-height: 2;
  display: block;

  .star-rating {
    margin: .5em 4px 0 0;
    float: left;
  }
}

.hreview-aggregate {
  .star-rating {
    margin: 10px 0 0 0;
  }
}

#review_form {
  #respond {
    position: static;
    margin: 0;
    width: auto;
    padding: 0 0 0;
    background: transparent none;
    border: 0;

    p {
      margin: 0 0 10px;
    }

    .form-submit {
      input {
        left: auto;
      }
    }

    textarea {
      width: 100%;
    }
  }
}

p.stars {
  position: relative;
  font-size: 1em;

  a {
    display: inline-block;
    font-weight: 700;
    margin-right: 1em;
    text-indent: -9999px;
    position: relative;
    border-bottom: 0 !important;
    outline: 0;
    color: #ccc;

    &:last-child {
      border-right: 0;
    }

    &.star-1,
    &.star-2,
    &.star-3,
    &.star-4,
    &.star-5 {
      border-right: 1px solid #ccc;

      &:after {
        font-family: "FontAwesome";
        text-indent: 0;
        position: absolute;
        letter-spacing: .2em;
        top: 0;
        left: 0;
      }

    }

    &.star-1 {
      width: 2em;

      &:after {
        content: "\f006";
      }

      &:hover:after,
      &.active:after {
        content: "\f005";
        color: #f4cb29;
      }
    }

    &.star-2 {
      width: 3em;

      &:after {
        content: "\f006\f006";
      }

      &:hover:after,
      &.active:after {
        content: "\f005\f005";
        color: #f4cb29;
      }
    }

    &.star-3 {
      width: 4em;

      &:after {
        content: "\f006\f006\f006";
      }

      &:hover:after,
      &.active:after {
        content: "\f005\f005\f005";
        color: #f4cb29;
      }
    }

    &.star-4 {
      width: 5em;

      &:after {
        content: "\f006\f006\f006\f006";
      }

      &:hover:after,
      &.active:after {
        content: "\f005\f005\f005\f005";
        color: #f4cb29;
      }
    }

    &.star-5 {
      width: 6em;
      border: 0;

      &:after {
        content: "\f006\f006\f006\f006\f006";
      }

      &:hover:after,
      &.active:after {
        content: "\f005\f005\f005\f005\f005";
        color: #f4cb29;
      }
    }
  }
}
ol.commentlist {
  margin-left: 0;
}