@media all {
  .ce-type-wf_iconteaser {
    position: relative;

    .background {
      height: 100%;

      &:after {
        display: none;
      }
    }

    .background-divider:nth-child(3) {
      top: -1rem;
    }
  }

  .cb-icon-teaser {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: subgrid;
    grid-auto-flow: column;
    padding-top: 6rem;
    padding-bottom: 6rem;
    /* background: var(--color-orange); */
    background-repeat: no-repeat;
    background-size: cover;
  }

  .cb-icon-teaser__items {
    grid-column: 3 / -3;
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: var(--element-gap);
  }

  .cb-icon-teaser__item {
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    gap: var(--element-gap);
    width: auto;
    background-color: var(--color-white);
    padding: 1rem 1.5rem;
    border-radius: var(--border-radius);
    text-decoration: none;
    color: var(--color-black);
    transition: var(--transition-default);
    &:focus ,
    &:hover {
      transform: translateY(-0.625rem);
      img {
        filter: invert(1);
      }
    }
  }

  .cb-icon-teaser__item-icon {
    img {
      width: 50px;
      height: auto;
    }
  }

  .cb-icon-teaser__item-text {
    font-weight: 600;
    text-align: center;
  }

  .cb-icon-teaser-divider {
    content: "";
    background-color: var(--color-orange);
    height: 8px;
    grid-column: 1 / -1;
  }
}

@media (min-width: 62rem) {
  .cb-icon-teaser__item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--element-gap);
    width: auto;
    background-color: var(--color-white);
    padding: 1.5rem 3rem;
    border-radius: var(--border-radius);
    text-decoration: none;
    color: var(--color-black);
    transition: var(--transition-default);
  }
  .cb-icon-teaser__item-icon {
    img {
      width: 100px;
      height: auto;
    }
  }

  .ce-type-wf_iconteaser {
    .background {
      &:after {
        display: block;
        background-position: 120% 0%;
        background-size: 60%;
      }
    }
  }

  .cb-icon-teaser__items {
    grid-column: 4 / -4;
    flex-direction: row;
  }

  .cb-icon-teaser__item {
    width: 25%;
  }
}
