Verschachtelung auflösen

[Bio-logisch]

Hallo,
ich habe folgenden Quelltext:
----------------------------------------------
<div class="ro">
  <div class="lo">
    <div class="ru">
      <div class="lu">
        <div class="inhalt">
          <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed...
          </p>
        </div>
      </div>
    </div>
  </div>
</div>
------------------------------------------------------------------------
(Runde Boxen aus selfhtml aktuell http://aktuell.de.selfhtml.org/artikel/css/runde_ecken/

Und in der CSS-Datei steht:
---------------------------------------------------------------
.ro {
background:url(roundedbox_ro.gif) top right no-repeat;
}
.lo {
background:url(roundedbox_lo.gif) top left no-repeat;
}
.ru {
background:url(roundedbox_ru.gif) bottom right no-repeat;
}
.lu {
background:url(roundedbox_lu.gif) bottom left no-repeat;
}
-----------------------------------------------------------------

Gibt es nun eine Möglichkeit diese div-Verschachtelung aufzulösen?
Die Einzelbilder müssen erhalten bleiben!

Vielen Dank!

Bio-logisch