Problem Making a modified Compact album Template

I have made a copy of my working album-compact.php and named it album-compactLx4, and edited it to reference the new style names

?>

	<div class="ngg-album-compactLx4">

		<div class="ngg-album-compactboxLx4">
			<div class="ngg-album-link">
				<a href="<?=$new_page_link; ?>"><img class="Thumb" alt="<?=$gallery->title ?>" src="<?=$gallery->previewurl; ?>"/></a>
			</div>
		</div>
        <?

In my main style.css I have added the following:

.ngg-album-compactLx4 {
	height: auto !important;
	padding: 14px 14px 0 14px !important;
	margin: 0 10px 10px 0 !important;
	width: auto !important;
	border: 1px solid #a5d17c !important;
}

.ngg-album-compactboxLx4 .Thumb {
	padding: 0 !important;
	margin: 0 !important;
	width: 160px !important;
	height: 107px !important;
	border: none !important;
}

But now for some reason the grid is lost and each box is on a line of its own. This happens as soon as I reference the copy of .ngg-album-compact{..}, even if I have made no changes to it.

Messed up album view

I am novice at CSS and I cannot work out why this does not work. Any pointer would much appreciated.

thanks

http://ww.wp.xz.cn/extend/plugins/nextgen-gallery/