$(document).ready(function(){
   
    
    var remote =  '<div id="demoIFrameWindow" style="position:absolute; display:none; padding:10px; padding-top:0px; padding-bottom:45px; background-color:#729948; border:solid 1px #000; overflow:hidden;z-index:3000">' +
                  '<div style="height:100%">' + 
                        '<table width="100%">' + 
                        '<tr>' +
                            '<td align="left">' +
                                '<span  style="color:white; font-size:15px; font-family:Verdana; font-weight:bold" id="remoteHeader"></span>' +
                            '</td>' +
                                '<td align="right" style="color:white; font-size:15px; font-family:Verdana; font-weight:bold">' +
                                '<a href="javascript:void(0)" class="closeRemote" style="color:white;text-decoration:none">x</a>' +
                            '</td>' +
                        '</tr>' +
                        '</table>' +
                        '<iframe id="demoIFrame" style="margin-left: 0; border: solid 1px #000; background-color: #ffffff;" src="" scrolling="no" width="100%" height="100%" frameborder="0"></iframe>' +
                        '<div class="closeRemote" style="float:left"><b><a href="javascript:void(0)" style="color:White; font-family:arial">Close Demo</a></b></div>' +
                   '</div>' +
                   '</div>';
    
     $("body").append(remote);  
    
     $(".closeRemote").click(function(){
       tb_remove(); 
       $("#demoIFrameWindow").fadeOut("slow",function(){
            $("#demoIFrame")[0].src = "";
            
       });
    });

});

 function openFrontDemo(url, height, color){
    if (!color){
        color = "#729948";  
    }
  
    tb_show();
    $("#demoIFrameWindow").css("margin-left","-350px");
    $("#demoIFrameWindow").css("left","50%");
    $("#demoIFrameWindow").css("top","50%");
    $("#demoIFrameWindow").css("background-color",color);
  
    var scrollPos = document.documentElement.scrollTop;
  
    $("#demoIFrameWindow").css("margin-top",(-300+scrollPos)+"px");
    
    $("#demoIFrameWindow").css("height",height +"px");
    $("#demoIFrameWindow").css("width","700px");
  
    $("#demoIFrame")[0].src = url;

    $("#demoIFrameWindow").fadeIn("slow");

}