function mbox(targetDivId, width, height) {
    this._targetDivId = targetDivId;
    this._width = width;
    this._height = height;
    this._isOpened = false;
    this._innerDiv = null;
    
    var mboxModalDiv = document.getElementById(this._targetDivId);
    
    var mboxOpaDiv = document.createElement('div');
    mboxOpaDiv.setAttribute('id', 'MboxOpaDiv');
    mboxOpaDiv.setAttribute('style', 'left:0px;top:0px;width:100%;background-color:#eeeeee;z-index:10000;filter:alpha(opacity=60);opacity:0.6;position:absolute;display:none');
    mboxOpaDiv.setAttribute('align', 'center');
    mboxModalDiv.appendChild(mboxOpaDiv);
    
    var mboxBoxDiv = document.createElement('div');
    mboxBoxDiv.setAttribute('id', 'MboxBoxDiv');
    mboxBoxDiv.setAttribute('style', 'border:solid 3px #e3726f;top:150px;width:' + this._width + 'px;height:' + this._height + 'px;background-color:White;z-index:10001;position:relative;display:none');
    mboxModalDiv.appendChild(mboxBoxDiv);

    $(document).ready(function() {
        var _w = $('#MboxBoxDiv').css('width').replace('px', '');
        var _h = $('#MboxBoxDiv').css('height').replace('px', '');
        $('#MboxBoxDiv').css({ left: (($(document).width() - _w) / 2) });
        //$('#MboxBoxDiv').css({ top: (($(document).height() - _h) / 2) + $(document).scrollTop() - 200 });
        $('#MboxBoxDiv').css({ top: 120 }); // fixed top position
        $('#MboxOpaDiv').css({ height: $(window).height() + $(document).scrollTop() });

        $(window).resize(function() {
            var _w = $('#MboxBoxDiv').css('width').replace('px', '');
            var _h = $('#MboxBoxDiv').css('height').replace('px', '');
            $('#MboxBoxDiv').css({ left: (($(document).width() - _w) / 2) });
            $('#MboxBoxDiv').css({ top: 120 }); // fixed top position
            $('#MboxOpaDiv').css({ height: $(window).height() + $(document).scrollTop() });
        });

        $(window).scroll(function() {
            var _w = $('#MboxBoxDiv').css('width').replace('px', '');
            var _h = $('#MboxBoxDiv').css('height').replace('px', '');
            $('#MboxBoxDiv').css({ left: (($(document).width() - _w) / 2) });
            $('#MboxBoxDiv').css({ top: 120 }); // fixed top position
            $('#MboxOpaDiv').css({ height: $(window).height() + $(document).scrollTop() });
        });
    });
}

mbox.prototype._open = function(innerDiv) {
    // close old if opened
    if (this._isOpened) {
        this.closeBoxImmediatelly();
    }

    this._innerDiv = innerDiv;

    // open new
    var mboxBoxDiv = document.getElementById('MboxBoxDiv');
    mboxBoxDiv.appendChild(innerDiv);
}
mbox.prototype.openBox = function(innerDiv) {
    this._open(innerDiv);
    $('#MboxOpaDiv').show();
    $('#MboxBoxDiv').show();
}
mbox.prototype.openBoxAnimated = function(innerDiv) {
    this._open(innerDiv);
    $('#MboxOpaDiv').fadeIn(200);
    $('#MboxBoxDiv').slideDown(200);
}

mbox.prototype._close = function() {
    var mboxBoxDiv = document.getElementById('MboxBoxDiv');
    mboxBoxDiv.removeChild(this._innerDiv);
}
mbox.prototype.closeBox = function() {
    $('#MboxBoxDiv').hide();
    $('#MboxOpaDiv').hide();
    this._close();
}
mbox.prototype.closeBoxAnimated = function() {
    $('#MboxBoxDiv').slideUp(200);
    $('#MboxOpaDiv').fadeOut(200);
    this._close();
}