/* Atomic Styles */

/* ///////////////////// */

/* Font Colors */

.fcolor--white {
  color: var(--color_white);
}

.fcolor--grey {
  color: var(--color_grey);
}

.fcolor--purple {
  color: var(--color_purple);
}

/* Font Styles */

.fweight--light,
.fweight--light * {
  font-weight: 300;
}

.fweight--medium,
.fweight--medium * {
  font-weight: 600;
}

.fsize--large,
.fsize--large * {
  font-size: 5rem;
}

.fsize--marginal,
.fsize--marginal * {
  font-size: var(--fsize_m);
}

/* BG Colors*/

.bg--black {
  background: var(--color_black);
}

.bg--grey {
  background: var(--color_grey);
}

.bg--white {
  background: var(--color_white);
}

.bg--purple {
  background: var(--color_purple);
}

.bg--magenta {
  background: var(--color_magenta);
}

.bg--blue {
  background: var(--color_blue);
}

/* Fill Colors */

.fill--purple {
  fill: var(--color_purple);
}

.fill--magenta {
  fill: var(--color_magenta);
}

.fill--blue {
  fill: var(--color_blue);
}

/* Borders */

.border--rounded {
  border-radius: 1rem;
}

/* Overflows */

.overflow--hidden {
  overflow: hidden;
}