.icon-svg {
  stroke-width: 1.1;
}

.icon-8 {
  width: 8px;
  aspect-ratio: 1;
}

.icon-10 {
  width: 10px;
  aspect-ratio: 1;
}

.icon-12 {
  width: 12px;
  aspect-ratio: 1;
}

.icon-15 {
  width: 15px;
  aspect-ratio: 1;
}

.icon-20 {
  width: 20px;
  aspect-ratio: 1;
}

.icon-25 {
  width: 25px;
  aspect-ratio: 1;
}

.icon-30 {
  width: 30px;
  aspect-ratio: 1;
}

.icon-50 {
  width: 50px;
  aspect-ratio: 1;
}

.icon-100 {
  width: 100px;
  aspect-ratio: 1;
}

.icon-100p {
  width: 100%;
}

.icon-align-vertical {
  vertical-align: sub;
}

.icon-filled {
  fill: var(--color);
}

.icon-unfilled {
  fill-opacity: 0;
}

.strocke-2-5 {
  stroke-width: 2.5;
}

@keyframes shake {
  0% {
    transform: rotate(0);
  }

  10%,
  90% {
    transform: rotate(-5deg);
  }

  20%,
  80% {
    transform: rotate(5deg);
  }

  30%,
  50%,
  70% {
    transform: rotate(-3deg);
  }

  40%,
  60% {
    transform: rotate(3deg);
  }

  100% {
    transform: rotate(0);
  }
}

.shake {
  animation: shake 4s ease infinite;
}

/* desktop styles sc650 */
@media only screen and (min-width: 650px) {
  .icon-sc650-10 {
    width: 10px;
    aspect-ratio: 1;
  }
}

/* desktop styles md */
@media only screen and (min-width: 720px) {
  .icon-20-md {
    width: 20px;
    aspect-ratio: 1;
  }

  .icon-16-md {
    width: 16px;
    aspect-ratio: 1;
  }

  .icon-500-md {
    width: 500px;
  }

}

/* desktop styles lg */
@media only screen and (min-width: 900px) {
  .icon-16-lg {
    width: 16px;
    aspect-ratio: 1;
  }

  .card-minimize-formations .icon-16-lg {
    width: 10px;
    aspect-ratio: 1;
  }
}