@charset "UTF-8";
/**
 *   Farbengrundtöne
 */
/*
  * Farben verwendung
  */
/**
  *   Schriften
  */
/**
  *  Schriftgrößen
  */
/**
  * grid
  */
@media (min-width: 48rem) {
  .row.rautetextabstand {
    flex-wrap: nowrap; } }
.row.rautetextabstand .hraute {
  padding: 1.5rem 2rem;
  position: relative;
  color: #fff;
  display: inline-flex;
  justify-content: center;
  margin-right: 2.5rem; }
  .row.rautetextabstand .hraute span {
    position: relative;
    z-index: 1; }
  .row.rautetextabstand .hraute:before {
    content: "";
    position: absolute;
    top: 0;
    display: block;
    background: var(--cifarbe1);
    width: 100%;
    height: 100%;
    z-index: 0;
    transform: skew(20deg); }
.row.rautetextabstand .rautencontainer {
  display: inline-flex; }
  @media (max-width: 47.95rem) {
    .row.rautetextabstand .rautencontainer {
      margin-left: 9.5%; } }
@media (min-width: 48rem) {
  .row.rautetextabstand .textcontainer {
    max-width: calc(70%);
    text-align: right; } }
  @media (min-width: 48rem) and (min-width: 60.063em) {
    .row.rautetextabstand .textcontainer {
      min-width: 31rem; } }

  @media (min-width: 48rem) and (min-width: 60.063em) and (max-width: 87.5rem) {
    .row.rautetextabstand .textcontainer {
      max-width: calc(50%); } }

@media (max-width: 47.95rem) {
  .row.rautetextabstand .textcontainer {
    margin: 2rem 1rem 0; } }

.background1 {
  color: #fff; }
  .background1 .rautetextabstand .hraute {
    color: var(--cifarbe1); }
    .background1 .rautetextabstand .hraute:before {
      background: #fff; }

/*# sourceMappingURL=rautetext.css.map */