.polls-results-stats {

  .sidebar {
    border-right: 1px solid $border;

    > ul {
      display: block;
      font-size: rem-calc(20);
      padding: 0;

      ul {
        font-size: rem-calc(15);
        list-style-type: none;
        margin-left: 0.8rem;
        margin-top: 1rem;
      }

      li a {
        color: $link;
        padding: 0;
      }
    }
  }

  h2 {
    border-bottom: 1px solid $border;
  }

  section section {
    clear: both;
    margin-top: rem-calc(30);
    margin-bottom: rem-calc(30);
    overflow: hidden;
  }

  h3 {
    font-size: rem-calc(20);
    margin-bottom: rem-calc(12);
  }

  .participants {
    $background-width: 52px;

    float: left;
    margin-left: $background-width;
    margin-right: rem-calc(22);
    position: relative;

    &::before {
      // TODO: change image and move it to a non-custom folder
      content: image-url("custom/polls/stats_man.png");
      left: -$background-width;
      position: absolute;
    }

    .number {
      display: block;
      font-size: rem-calc(60);
      font-weight: bold;
      line-height: rem-calc(60);
    }

    .info {
      color: $dark-gray;
      font-style: italic;
    }

    &.gender {

      &.male {
        &::before {
          content: image-url("custom/polls/stats_man.png");
        }
      }

      &.female {
        &::before {
          content: image-url("custom/polls/stats_woman.png");
        }
      }
    }
  }

  meter {
    background: none;
    background-color: #ebf0f4;
    border-radius: 0.3rem;
    display: block;
    width: 100%;
  }

  meter::-moz-meter-bar {
    background: #52a4ee;
    border-bottom-left-radius: 0.3rem;
    border-top-left-radius: 0.3rem;
  }

  meter::-webkit-meter-optimum-value {
    background: #52a4ee;
    border-bottom-left-radius: 0.3rem;
    border-top-left-radius: 0.3rem;
  }

  meter::-webkit-meter-bar {
    background: #ebf0f4;
    border-radius: 0.3rem;
  }
}