:root {
  --color-primary: #003275;
  --color-secondary: #ED1B23;
  --color-white: #FFFFFF;
  --color-black: #111111;
  --color-gray: #EEEEEE;
  --color-border: #DDDDDD;
  --gap10: 10px;
  --gap20: 20px;
  --gap30: 30px;
  --gap40: 40px;
  --gap60: 60px;
  --gap80: 80px;
  --gap100: 100px;
  --gap120: 120px;
  --gap140: 140px;
  --gap200: 200px;
  --font100: 10.0rem;
  --font60: 6.0rem;
  --font44: 4.4rem;
  --font36: 3.6rem;
  --font30: 3.0rem;
  --font26: 2.6rem;
  --font-outfit: "Outfit", sans-serif;
}

.y-10 {
  row-gap: var(--gap10);
}

.y-20 {
  row-gap: var(--gap20);
}

.y-30 {
  row-gap: var(--gap30);
}

.y-40 {
  row-gap: var(--gap40);
}

.y-60 {
  row-gap: var(--gap60);
}

.y-80 {
  row-gap: var(--gap80);
}

.y-100 {
  row-gap: var(--gap100);
}

.y-120 {
  row-gap: var(--gap120);
}

.y-140 {
  row-gap: var(--gap140);
}

.y-200 {
  row-gap: var(--gap200);
}

.padding-10 {
  padding: var(--gap10) 0;
}

.padding-20 {
  padding: var(--gap20) 0;
}

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

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

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

.padding-80 {
  padding: var(--gap80) 0;
}

.padding-100 {
  padding: var(--gap100) 0;
}

.padding-120 {
  padding: var(--gap120) 0;
}

.padding-140 {
  padding: var(--gap140) 0;
}

.padding-200 {
  padding: var(--gap200) 0;
}

@media (max-width: 1600px) {
  :root {
    --font100: 8.4rem;
    --font60: 5.0rem;
    --font44: 4.0rem;
    --font36: 3.2rem;
  }
}
@media (max-width: 1400px) {
  :root {
    --gap140: 100px;
    --gap200: 140px;
    --font100: 7.0rem;
    --font60: 4.4rem;
    --font44: 3.6rem;
  }
}
@media (max-width: 1200px) {
  :root {
    --font100: 5.2rem;
    --font60: 4.0rem;
    --font44: 3.4rem;
  }
}
@media (max-width: 1024px) {
  :root {
    --gap60: 40px;
    --gap80: 50px;
    --gap100: 60px;
    --gap120: 80px;
    --gap140: 80px;
    --gap200: 80px;
    --font100: 4.6rem;
    --font60: 3.4rem;
    --font44: 3.0rem;
    --font36: 2.6rem;
    --font30: 2.4rem;
    --font26: 2.2rem;
  }
}
@media (max-width: 768px) {
  :root {
    --font100: 3.8rem;
    --font60: 3.0rem;
    --font44: 2.8rem;
    --font36: 2.4rem;
    --font30: 2.1rem;
    --font26: 1.9rem;
  }
}
@media (max-width: 640px) {
  :root {
    --font100: 2.8rem;
    --font60: 2.6rem;
    --font44: 2.5rem;
    --font36: 2.2rem;
    --font30: 2.1rem;
    --font26: 1.9rem;
  }
}