Template CSS Menu-sprites help please!

<ul id="menu_sprite">
   		 <li id="splet_sprite"><a href="#splet?w=650" rel="splet_popup" class="odprisezam"></a></li>
    	 <li id="oblikovanje_sprite"><a href="#oblikovanje?w=650" rel="oblikovanje_popup" class="odprisezam"></a></li>
   	     <li id="fotografija_sprite"><a href="#fotografija?w=650" rel="fotografija_popup" class="odprisezam"></a></li>
         <li id="tiskovine_sprite"><a href="#tiskovine?w=650" rel="tiskovine_popup" class="odprisezam"></a></li>
         <li id="kontakt_sprite"><a href="#kontakt?w=650" rel="kontakt_popup" class="odprisezam"></a></li>  
         </ul>

<div id="splet_popup" class="popup_block">
    <h2>lorem ipsum</h2>
    [[*content]
</div>

/* CSS MENU SPRITE */

#menu_sprite {
	width:960px;
	height:73px;
	background-color:#E8B422;
	background-image:url(images/menu_sprite.jpg);
	padding:0;
	position:relative;
}
#menu_sprite li {
	margin:0;
	padding:0;
	list-style: none;
	position:absolute;
	top:0;
    height:73px;
	display:block;
}

#menu_sprite a {
	display: block;
	height: 73px;
	background-image:url(images/menu_sprite.jpg);
	background-repeat: no-repeat;	
	position: absolute;
}

#splet_sprite a {
	width: 60px;
	background-position: -68px 0;
	position: absolute;
	left: 68px;
}
#oblikovanje_sprite a {
	width: 111px;
	background-position: -205px 0;
	left: 205px;
}

#fotografija_sprite a {
	background-position: -407px 0;
	width: 111px;
	left: 407px;
}

#tiskovine_sprite a {
	background-position: -605px 0;
	width: 111px;
	left: 605px;
}
#kontakt_sprite a {
	background-position: -793px 0;
	width: 108px;
	left: 793px;
}
#splet_sprite a:hover {
	background-position: -68px -73px;
}		
#oblikovanje_sprite a:hover {
	background-position: -205px -73px;
}

#fotografija_sprite a:hover {
	background-position: -407px -73px;
}

#tiskovine_sprite a:hover {
	background-position: -605px -73px;
}
#kontakt_sprite a:hover {
	background-position: -793px -73px;
}

/*KONEC CSS ZA MENU SPRITE*/

<script>
$(document).ready(function() {
	//When you click on a link with class of poplight and the href starts with a # 
$('a.odprisezam[href^=#]').click(function() {
    var popID = $(this).attr('rel'); //Get Popup Name
    var popURL = $(this).attr('href'); //Get Popup href to define size

    //Pull Query & Variables from href URL
    var query= popURL.split('?');
    var dim= query[1].split('&');
    var popWidth = dim[0].split('=')[1]; //Gets the first query string value

    //Fade in the Popup and add close button
    $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="images/iksek.png" class="iksek" title="Zapri okno" alt="Zapri" /></a>');

    //Define margin for center alignment (vertical   horizontal) - we add 80px to the height/width to accomodate for the padding  and border width defined in the css
    var popMargTop = ($('#' + popID).height() + 80) / 2;
    var popMargLeft = ($('#' + popID).width() + 80) / 2;

    //Apply Margin to Popup
    $('#' + popID).css({
        'margin-top' : -popMargTop,
        'margin-left' : -popMargLeft
    });

    //Fade in Background
    $('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
    $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies 

    return false;
});

//Close Popups and Fade Layer
$('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
    $('#fade , .popup_block').fadeOut(function() {
        $('#fade, a.close').remove();  //fade them both out
    });
    return false;
});
});
</script>