[CSS] ustawienie miniaturek, jak przez css sformatowac wyglad Opcje

[c4ash]

Problem z ktorym juz nie wiem jak sobie poradzic.
Przyznaje, mam zadanie i potrzebuje rozwiazania.

Zadanie polega na umiejetnym spreparowaniu kodu css do gotowego kodu html, przy czym w kodzie html nie mozna dokonac zadnych zmian. A wynik jaki mam osiagnac mam na zdjeciu.

Utknalem na punkcie, gdzie 4 zdjecia mam ustawic w sposob: 2 na gorze obok siebie, 2 analogicznie w drugiej linijce.

Kod HTML:

Kod

<section>
          <h2>Galeria</h2>
          <ul class="sidebar-gallery">
            <li><a class="colorbox" rel="bieszczady" href="img/photo1.jpg"><img src="img/thumb1.jpg" alt="" /></a></li>
            <li><a class="colorbox" rel="bieszczady" href="img/photo2.jpg"><img src="img/thumb2.jpg" alt="" /></a></li>
            <li><a class="colorbox" rel="bieszczady" href="img/photo3.jpg"><img src="img/thumb3.jpg" alt="" /></a></li>
            <li><a class="colorbox" rel="bieszczady" href="img/photo4.jpg"><img src="img/thumb4.jpg" alt="" /></a></li>
          </ul>
        </section>

Co proponujecie dac, aby byly obrazki jak wyzej opisywalem, manipulujac jedynie CSS?