/* CLASSI HELPER PER GESTIRE I MARGINI SUI VARI DISPOSITIVI */

:root {
  --gd-margin-large: 64px;
  --gd-margin-medium: 32px;
  --gd-margin-small: 16px;
  --gd-margin-extra-small: 8px;
  --gd-margin-extra-extra-small: 4px;
  --gd-margin-null: 0px;
}

/* DESKTOP */
#page .gd-margin-l-large {
  margin-bottom: var(--gd-margin-large);
}
#page .gd-margin-l-medium {
  margin-bottom: var(--gd-margin-medium);
}
#page .gd-margin-l-small {
  margin-bottom: var(--gd-margin-small);
}
#page .gd-margin-l-extra-small {
  margin-bottom: var(--gd-margin-extra-small);
}
#page .gd-margin-l-extra-extra-small {
  margin-bottom: var(--gd-margin-extra-extra-small);
}
#page .gd-margin-l-null {
  margin-bottom: var(--gd-margin-null);
}

/* TABLET */
@media screen and (max-width: 960px) {
  #page .gd-margin-m-large {
    margin-bottom: var(--gd-margin-large);
  }
  #page .gd-margin-m-medium {
    margin-bottom: var(--gd-margin-medium);
  }
  #page .gd-margin-m-small {
    margin-bottom: var(--gd-margin-small);
  }
  #page .gd-margin-m-extra-small {
    margin-bottom: var(--gd-margin-extra-small);
  }
  #page .gd-margin-m-extra-extra-small {
    margin-bottom: var(--gd-margin-extra-extra-small);
  }
  #page .gd-margin-m-null {
    margin-bottom: var(--gd-margin-null);
  }
}

/* MOBILE */
@media screen and (max-width: 640px) {
  #page .gd-margin-s-large {
    margin-bottom: var(--gd-margin-large);
  }
  #page .gd-margin-s-medium {
    margin-bottom: var(--gd-margin-medium);
  }
  #page .gd-margin-s-small {
    margin-bottom: var(--gd-margin-small);
  }
  #page .gd-margin-s-extra-small {
    margin-bottom: var(--gd-margin-extra-small);
  }
  #page .gd-margin-s-extra-extra-small {
    margin-bottom: var(--gd-margin-extra-extra-small);
  }
  #page .gd-margin-s-null {
    margin-bottom: var(--gd-margin-null);
  }
}
