.icons {
  display: grid;
  grid-template-columns: auto;
  padding-bottom: 128px;
  text-align: center;
  grid-gap: 30px; }
  .icons.arrows {
    grid-row-gap: 130px; }
  @media (min-width: 640px) {
    .icons {
      grid-template-columns: repeat(3, 1fr);
      grid-column-gap: 80px; } }
  @media (min-width: 1024px) {
    .icons--3 {
      grid-template-columns: repeat(3, 1fr);
      grid-column-gap: 80px; }
    .icons--4 {
      grid-template-columns: repeat(4, 1fr);
      grid-gap: 20px; }
    .icons--5 {
      grid-template-columns: repeat(5, 1fr);
      grid-gap: 20px; } }

@media (max-width: 640px) {
  .icon {
    position: relative; } }

@media (max-width: 640px) {
  .arrows > .icon::before {
    position: absolute;
    content: "";
    top: 110%;
    left: 50%;
    height: 40%;
    border-left: 1px dashed #fcaa00; } }

@media (max-width: 640px) {
  .arrows > .icon::after {
    position: absolute;
    content: "";
    top: 150%;
    left: -webkit-calc(50% - 6px);
    left: -moz-calc(50% - 6px);
    left: calc(50% - 6px);
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 12px solid #fcaa00; } }

.icon:last-child::before, .icon:last-child::after {
  display: none; }

.icon:last-child .icon__image::before, .icon:last-child .icon__image::after {
  display: none; }

.icon__image {
  position: relative;
  margin: 0 auto 24px; }
  .icon__image img {
    width: 160px;
    display: block;
    margin: 0 auto; }
  @media (min-width: 640px) {
    .arrows > .icon__image::before {
      content: "";
      position: absolute;
      top: -webkit-calc(50% - 1px);
      top: -moz-calc(50% - 1px);
      top: calc(50% - 1px);
      left: 100%;
      width: 30%;
      border-bottom: 1px dashed #fcaa00; } }
  @media (min-width: 1024px) {
    .arrows > .icon__image::before {
      left: 91%;
      width: 40%; } }
  .arrows > .icon__image::after {
    content: "";
    position: absolute;
    top: -webkit-calc(50% - 6px);
    top: -moz-calc(50% - 6px);
    top: calc(50% - 6px);
    left: 130%;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 12px solid #fcaa00; }
    @media (max-width: 640px) {
      .arrows > .icon__image::after {
        border: 0 solid transparent; } }

.icon__title {
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 150%;
  margin-bottom: 1rem; }

.icon__text {
  font-size: 1.4rem; }
  .icon__text a {
    color: #fcaa00;
    -webkit-transition: color .2s;
    -o-transition: color .2s;
    -moz-transition: color .2s;
    transition: color .2s; }
    .icon__text a:hover {
      color: #ffc448; }

/*# sourceMappingURL=block.css.map */
