xdevelx

.grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 20px;
}

.grid > * {
  grid-column: span 3; /* по умолчанию все широкие */
}

.grid > :nth-child(9n + 3),
.grid > :nth-child(9n + 4),
.grid > :nth-child(9n + 8) {
  grid-column: span 2; /* узкие элементы */
}

:root {
  --transition-duration: 2s;
  --animation-duration: 5s;
}

div {
  width: 100px;
  height: 100px;
  background: red;
  opacity: 0;
  transition: opacity var(--transition-duration);
  will-change: transform, opacity;
}
div:hover {
  animation: mymove var(--animation-duration) var(--transition-duration)
    infinite;
  opacity: 1;
}

@keyframes mymove {
  to {
    transform: translateX(200px);
  }
}

:nth-child(5n + 1),
:nth-child(5n + 4) {
}

:nth-child(5n + 2),
:nth-child(5n) {
}

.spoiler-link--active::before {
  transform: rotate(90deg);
}

label:has(+ .field-error) {
  border: 2px solid red;
}

Если просто вставить SVG на страницу и не задавать ему никакие размеры, он отобразится размером 300px на 150px, что не поместилось — обрежется

<svg width="18" height="19"><use xlink:href="#exit"></use></svg>

.sidebar-mini:not(.sidebar-collapse) .nav-treeview .nav-link {
  margin-left: 1rem;
  width: calc(250px - 2rem);
}

.uk-navbar-nav {
  flex-wrap: wrap; 
}

.example {
    /* color: #c4674d; */
    transition: color 0.3s;
}

.example:hover {
    color: #ff8562;
}