.public .poll {
  &.with-image {

    @include breakpoint(medium) {
      padding: 0 calc(#{$line-height} / 2) 0 0;
    }

    .image-container img {
      height: 100%;
      max-width: none;
      position: absolute;
    }
  }

  .icon-poll-answer {
    border-top: 0;
    border-bottom: 60px solid transparent;
    height: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 0;

    &.cant-answer::after,
    &.not-logged-in::after,
    &.already-answer::after,
    &.unverified::after {
      font-family: "icons" !important;
      left: 34px;
      position: absolute;
      top: 5px;
    }

    &.cant-answer {
      border-right: 60px solid $alert-bg;

      &::after {
        color: $color-alert;
        content: "\74";
      }
    }

    &.not-logged-in {
      border-right: 60px solid $info-bg;

      &::after {
        color: $color-info;
        content: "\6f";
      }
    }

    &.unverified {
      border-right: 60px solid $warning-bg;

      &::after {
        color: $color-warning;
        content: "\6f";
      }
    }

    &.already-answer {
      border-right: 60px solid $success-bg;

      &::after {
        color: $color-success;
        content: "\59";
      }
    }
  }

  .dates {
    color: $text-medium;
    font-size: $small-font-size;
    margin-bottom: calc(#{$line-height} / 2);
  }

  h4 {
    font-size: rem-calc(30);
    line-height: $line-height * 1.5;

    a {
      color: inherit;
      display: inline-block;
    }
  }
}
