.is-flex-basis-40p {
    flex-basis: 40%;
}

.is-flex-basis-60p {
    flex-basis: 60%;
}

.is-flex-gap-5px {
    gap: 5px;
}

.is-flex-gap-10px {
    gap: 10px;
}

.is-flex-gap-20px {
    gap: 20px;
}

.is-flex-gap-50px {
    gap: 50px;
}

.is-flex-gap-10p {
    gap: 10%;
}

.is-flex-basis-0 {
    flex-basis: 0;
}

.is-flex-shrink-1 {
    flex-shrink: 1;
}

.is-flex-grow-1 {
    flex-grow: 1;
}

/* Base classes are typically mobile-first, applying to all sizes unless overridden */
.is-order-0 { order: 0; }
.is-order-1 { order: 1; }
.is-order-2 { order: 2; }
.is-order-3 { order: 3; }
.is-order-4 { order: 4; }

/* Tablet */
@media (min-width: 769px) {
    .is-order-0-tablet { order: 0; }
    .is-order-1-tablet { order: 1; }
    .is-order-2-tablet { order: 2; }
    .is-order-3-tablet { order: 3; }
    .is-order-4-tablet { order: 4; }
}

/* Desktop */
@media (min-width: 1024px) {
    .is-order-0-desktop { order: 0; }
    .is-order-1-desktop { order: 1; }
    .is-order-2-desktop { order: 2; }
    .is-order-3-desktop { order: 3; }
    .is-order-4-desktop { order: 4; }
}

/* Widescreen */
@media (min-width: 1216px) {
    .is-order-0-widescreen { order: 0; }
    .is-order-1-widescreen { order: 1; }
    .is-order-2-widescreen { order: 2; }
    .is-order-3-widescreen { order: 3; }
    .is-order-4-widescreen { order: 4; }
}

/* FullHD */
@media (min-width: 1408px) {
    .is-order-0-fullhd { order: 0; }
    .is-order-1-fullhd { order: 1; }
    .is-order-2-fullhd { order: 2; }
    .is-order-3-fullhd { order: 3; }
    .is-order-4-fullhd { order: 4; }
}

/* Mobile */
@media (max-width: 768px) {
  .is-flex-direction-row-mobile { flex-direction: row !important; }
  .is-flex-direction-row-reverse-mobile { flex-direction: row-reverse !important; }
  .is-flex-direction-column-mobile { flex-direction: column !important; }
  .is-flex-direction-column-reverse-mobile { flex-direction: column-reverse !important; }
}

/* Tablet */
@media (min-width: 769px) {
  .is-flex-direction-row-tablet { flex-direction: row !important; }
  .is-flex-direction-row-reverse-tablet { flex-direction: row-reverse !important; }
  .is-flex-direction-column-tablet { flex-direction: column !important; }
  .is-flex-direction-column-reverse-tablet { flex-direction: column-reverse !important; }
}

/* Desktop */
@media (min-width: 1024px) {
  .is-flex-direction-row-desktop { flex-direction: row !important; }
  .is-flex-direction-row-reverse-desktop { flex-direction: row-reverse !important; }
  .is-flex-direction-column-desktop { flex-direction: column !important; }
  .is-flex-direction-column-reverse-desktop { flex-direction: column-reverse !important; }
}

/* Widescreen */
@media (min-width: 1216px) {
  .is-flex-direction-row-widescreen { flex-direction: row !important; }
  .is-flex-direction-row-reverse-widescreen { flex-direction: row-reverse !important; }
  .is-flex-direction-column-widescreen { flex-direction: column !important; }
  .is-flex-direction-column-reverse-widescreen { flex-direction: column-reverse !important; }
}

/* FullHD */
@media (min-width: 1408px) {
  .is-flex-direction-row-fullhd { flex-direction: row !important; }
  .is-flex-direction-row-reverse-fullhd { flex-direction: row-reverse !important; }
  .is-flex-direction-column-fullhd { flex-direction: column !important; }
  .is-flex-direction-column-reverse-fullhd { flex-direction: column-reverse !important; }
}
