body {
  background: var(--color-blue);
}

/* Layout System */

@media (min-width: 360px) {
  /* .container-fluid {
    padding-left: 50px;
    padding-right: 50px;
  } */

  /* USIAMO DEFAULT */
}

@media (min-width: 768px) {
  .container-fluid {
    padding-left: var(--space-md);
    padding-right: var(--space-md);
    /* Spaziature di 25px */
  }
}

@media (min-width: 992px) {
  /* .container-fluid {
    padding-left: var(--space-md);
    padding-right: var(--space-md);
  } */

  /* CONTINUA LA MEDEIAQUERY DI 768PX */
}

@media (min-width: 1200px) {
  .container-fluid {
    padding-left: var(--space-xl);
    padding-right: var(--space-xl);

    /* Spaziature di 50px */
  }
}

@media (min-width: 1600px) {
  .container-fluid {
    padding-left: var(--space-xxl);
    padding-right: var(--space-xxl);

    /* Spaziature di 75px */
  }
}

/* svg */

.svg-wrapper {
  width: 100%;
  height: auto;
  display: block;
  position: relative;
  padding-top: 100%;
}

.svg-wrapper > svg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}