//==========================================================================================
// the jQuery code
//==========================================================================================
 
//creating the lightbox
    var lightbox = function() {
        var lH = $('#wrapper').outerHeight();
        var lW = $('#wrapper').outerWidth();
        $('#lightbox').css({'width' : lW, 'height' : lH});
        $('#lightbox').fadeIn();
        $('#ltb-cnt div').hide();
    }
 
    var ltbCnt = function(){
        var ltbW = $('#ltb-cnt').outerWidth();
        var ltbH = $('#ltb-cnt').outerHeight();
        $('#ltb-cnt').css({'margin-top' : -ltbH/2, 'margin-left' : -ltbW/2});
    }
 
// lightbox fadeout on escape        
    $(document).bind('keydown', function(e) {//use keydown instead of keypress because keypress doesn't work in Chrome and Opera
        if(e.keyCode==27){
                $("#lightbox").fadeOut();
        }
    });    
 
    var closeLtb = function() { //the close button function
        $('#lightbox').fadeOut(); 
    }
 
    $('#lightbox').click(function(){ //fade out on .blur event
        $(this).fadeOut();
    });
 
    $('#ltb-cnt').click(function(e){ //stop the fade out event propagation when clic on the container info
        e.stopPropagation();
    });
 
    $('.close-ltb').click(function(){ // the close button click
        closeLtb();
    });
// show different content depending on which button was clicked    
    $('#rules-l').click(function(){
        lightbox();
        $('#rules').fadeIn();
        ltbCnt();
    });
    $('#winner-l').click(function(){
        lightbox();
        $('#winner').fadeIn();
        ltbCnt();
    });
    $('.enter').click(function(){
        lightbox();
        $('#succes').fadeIn();
        ltbCnt();
    });
 
//==========================================================================================
// the CSS code
//==========================================================================================
#lightbox {
    position: absolute;
    top: 0;
    left: 0;
    background:url(images/lightbox-bg.png) repeat;
    display: none;
}
 
#ltb-cnt {
    position: absolute;
    top: 50%;
    left: 50%;
}
 
#ltb-cnt div {
    display: none;
}
 
.ltb-content {
    padding: 20px;
    background: white;
    position: relative;
}
 
.close-ltb {
    width: 43px;
    height: 43px;
    display: block;
    position: absolute;
    top: -20px;
    right: -20px;
    background-position: -299px 0;
    text-indent: -9999px;
}
 
.close-ltb:hover {
    background-position: -342px 0;
}
 
//==========================================================================================
// the HTML markup
//==========================================================================================
<div id="lightbox">
            <div id="ltb-cnt">
                <div class="ltb-content" id="rules">
                    <a href="#" title="inchide" class="close-ltb sprites">Inchide</a>
                    Rules
                </div>
                <div class="ltb-content" id="winner">
                    Castigatori
                </div>
                <div id="succes">
                    Succes
                </div>
            </div>
        </div><!-- #/lightbox -->