[class$="-10"] {
  --spacing: 10px;
}

[class$="-20"] {
  --spacing: 20px;
}

[class$="-30"] {
  --spacing: 30px;
}

[class$="-40"] {
  --spacing: 40px;
}

[class$="-50"] {
  --spacing: 50px;
}

[class$="-60"] {
  --spacing: 60px;
}

.mgt-30 {
  margin-top: var(--spacing);
}

.mgt-40 {
  margin-top: var(--spacing);
}

.mgt-50 {
  margin-top: var(--spacing);
}

.mgt-60 {
  margin-top: var(--spacing);
}

.pd-30 {
  padding: var(--spacing) 0;
}

.pd-40 {
  padding: var(--spacing) 0;
}

.pd-50 {
  padding: var(--spacing) 0;
}

.pd-60 {
  padding: var(--spacing) 0;
}

.gap-10 {
  gap: var(--spacing) 0;
}

.gap-20 {
  gap: var(--spacing) 0;
}

.gap-30 {
  gap: var(--spacing) 0;
}

.gap-40 {
  gap: var(--spacing) 0;
}

.gap-50 {
  gap: var(--spacing) 0;
}

.gap-60 {
  gap: var(--spacing) 0;
}

.pd-50-0-60 {
  padding: 50px 0 60px;
}