Специалисты по HTML, CSS. Проблема с фотогалереей

Доброго вечера всем!

Есть фотогалерея. На странице сайта в ряд отображаются маленькие копии, а при нажатии открываются оригиналы фотографий.

Вот эти самые маленькие копии получаются какими-то размытыми. С оригиналами все в порядке.

Как только не пробовал уже, ничего не помогает. Не для моих мозгов видимо. :)

Что поменять? Подскажите пожалуйста.

<style type="text/css">

.thumb {

	text-align: center;

}



.thumb figure {

  width: 23%;

  margin: 1%;

  display: inline-block;

}



.thumb img {

  border: 1px solid #55c5e9;

  width: 100%;

}



.thumb figcaption {

  text-align: center;

  font-style: italic;

}

</style>

echo '<div class="thumb">';

    $i     = $ii = 1;

    $start = ($page - 1) * $f + 1;

    $end   = $page * $f;

    if ($cat == "") {

        $photocat = "";

    } else {

        $photocat = "$cat/";

    }

    $arr_pic = readdir_sorted_array(PICTURES . $photocat, $sortCol = DIR_SORT_MTIME, $sortDir = SORT_DESC);

    

    foreach ($arr_pic as $image) {

        if ($ii >= $start && $ii <= $end) {

            if ($i == 1)

            $info_img     = getimagesize(@$image[name]);

            $opisanie_img = getopisanie($cat, @$image[name]);

            $url_img = "$image[name]";

            echo '

		<figure>	

        <a href="pictures/'.$photocat.$url_img.'" class="highslide" onclick="return hs.expand(this)" title="'.$opisanie_img.'"> 

          <img src="pictures/'.$photocat.'thumb/t'.$url_img.'" alt="'.$opisanie_img.'"> 

        </a>

		<figcaption>

         Описание фото

        </figcaption>

		</figure>

		'

		;

            $i++;

        }

        $ii++;

    }

	echo '</div>';