:root { --weiss: #f7f8f6; --schwarz: #1c1d1d; --lila: #dfd5e8; --orange: #e95129; --braun: #98643c; --beige: #ecd3b4; --grau: #EBEBEB; --dunkelgrau: #D1D1D1;}.bg-schwarz { background-color: var(--schwarz); }.text-schwarz { color: var(--schwarz); }.border-schwarz { border-color: var(--schwarz); }.outline-schwarz { outline-color: var(--schwarz); }.fill-schwarz { fill: var(--schwarz); }.stroke-schwarz { stroke: var(--schwarz); }.bg-lila { background-color: var(--lila); }.text-lila { color: var(--lila); }.border-lila { border-color: var(--lila); }.outline-lila { outline-color: var(--lila); }.stroke-lila { stroke: var(--lila); }.fill-lila { fill: var(--lila); }.bg-orange { background-color: var(--orange); }.text-orange { color: var(--orange); }.border-orange { border-color: var(--orange); }.outline-orange { outline-color: var(--orange); }.stroke-orange { stroke: var(--orange); }.fill-orange { fill: var(--orange); }.bg-braun { background-color: var(--braun); }.text-braun { color: var(--braun); }.border-braun { border-color: var(--braun); }.outline-braun { outline-color: var(--braun); }.fill-braun { fill: var(--braun); }.stroke-braun { stroke: var(--braun); }.bg-beige { background-color: var(--beige); }.text-beige { color: var(--beige); }.border-beige { border-color: var(--beige); }.outline-beige { outline-color: var(--beige); }.fill-beige { fill: var(--beige); }.stroke-beige { stroke: var(--beige); }.bg-grau { background-color: var(--grau); }.text-grau { color: var(--grau); }.border-grau { border-color: var(--grau); }.outline-grau { outline-color: var(--grau); }