.incentives-header {
  height: 135px;
  width: 100%; }

.item-container {
  text-align: center; }
  .item-container .item-icon {
    border: 3px solid transparent;
    border-color: #e9e9e9;
    border-radius: 50%;
    display: inline-block;
    margin: 0px 3% 0px 3%;
    position: relative;
    height: 135px;
    width: 135px; }
    .item-container .item-icon .incentive {
      line-height: 1.5;
      padding: 10px 0px 10px 0px; }
  .item-container .item-icon.selected {
    background-color: silver;
    border-color: #c8c8c8;
    /* The triangle class should be used for the actual positioning of the 
        element*/ }
    .item-container .item-icon.selected .triangle {
      bottom: 2px;
      margin: 0px 0px 0px 30%;
      position: relative;
      pointer-events: none;
      /* top and left needs to be equivalet to the difference of the 
            .triangle-border border-size - .triangle-fill border-size */ }
      .item-container .item-icon.selected .triangle .triangle-border {
        border-left: 23px solid transparent;
        border-right: 23px solid transparent;
        border-bottom: 23px solid #c0bebd;
        height: 0;
        position: absolute;
        width: 0;
        z-index: 99; }
      .item-container .item-icon.selected .triangle .triangle-fill {
        border-left: 22px solid transparent;
        border-right: 22px solid transparent;
        border-bottom: 22px solid #f4f4f4;
        position: absolute;
        height: 0;
        left: 1px;
        top: 1px;
        width: 0;
        z-index: 100; }

.incentive-card {
  background-color: #f4f4f4;
  border-top: 1px solid;
  border-color: #c0bebd;
  display: none;
  height: 428px;
  margin: 30px 0px 0px 0px;
  width: 100%; }
  .incentive-card.selected {
    display: inline-block; }
  .incentive-card .content {
    padding: 0px 12% 0px 12%; }
    .incentive-card .content h3 {
      font-size: 40px;
      font-weight: 300;
      margin-top: 49px; }
    .incentive-card .content h4 {
      line-height: 40px;
      font-size: 20px; }
    .incentive-card .content p {
      font-size: 17px;
      font-weight: 300; }
    .incentive-card .content ul {
      margin: 10px 0px;
      padding-left: 10px; }
    .incentive-card .content .description {
      margin-top: 30px; }
    .incentive-card .content .link {
      margin-top: 21px; }
  .incentive-card .quote-container {
    border-top: 1px solid;
    border-color: #c0bebd;
    padding: 20px 0px 0px 0px; }
    .incentive-card .quote-container .image {
      text-align: center; }
    .incentive-card .quote-container .quote {
      font-size: 0.8em;
      padding: 20px 10% 20px 10%;
      text-align: center; }
    .incentive-card .quote-container .source {
      text-align: center; }
      .incentive-card .quote-container .source .author, .incentive-card .quote-container .source .company {
        display: inline;
        font-size: 0.8em;
        text-align: center; }

.incentive-card-mobile {
  background-color: #f4f4f4;
  border-top: 0px solid;
  display: none;
  height: 100%;
  margin: 0px;
  width: 100%;
  padding-bottom: 10px; }
  .incentive-card-mobile img {
    margin-top: 49px; }
