/*
 * Colors
 */
/*
 * Breakpoints
 */
.icons {
  padding: 32px 10px 40px;
  background: #f2f4f5;
}
@media (min-width: 768px) {
  .icons {
    padding: 66px 32px;
  }
}
@media (min-width: 1200px) {
  .icons {
    padding: 100px 32px;
  }
}
.icons .wrapper {
  padding: 0;
}
@media (min-width: 1200px) {
  .icons .wrapper {
    padding: 0 30px;
  }
}
.icons-list {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
@media (min-width: 768px) {
  .icons-list {
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 20px 0;
    flex-wrap: wrap;
  }
}
.icons-list li {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 4px;
}
@media (min-width: 768px) {
  .icons-list li {
    width: 50%;
  }
}
@media (min-width: 992px) {
  .icons-list li {
    width: 25%;
  }
}
.icons-list li .icons-img {
  margin-bottom: 10px;
}
.icons-list li .icons-img img {
  width: 75px;
  height: 75px;
  -o-object-fit: cover;
     object-fit: cover;
}
.icons-list li p {
  padding: 0px 24px;
  color: #5e6265;
}
.icons-img {
  margin-bottom: 10px;
}
.icons-img .dashicons,
.icons-img i {
  color: var(--accent);
  font-size: 60px;
  width: auto;
  height: 60px;
}
@media (min-width: 576px) {
  .icons-img .dashicons,
  .icons-img i {
    font-size: 60px;
  }
}
.icons--small i {
  font-size: 27px;
  height: 27px;
}
.icons--small h4 {
  font-size: 20px;
  color: #191e22 !important;
}