Как разместить всплывающее диалоговое окно div в центре экрана браузера?

Мне нужно разместить всплывающее окно div в центре экрана браузера (независимо от размера экрана ). И я хочу, чтобы позиция оставалась абсолютной, поскольку я не хочу перемещать всплывающее окно вниз, когда я прокручиваю страницу вниз.

Этот div отображается при нажатии кнопки с помощью JQuery.

Я попытался установить для margin-left половину ширины, как упоминалось в других сообщениях, но у меня это не сработало.

Вот мой код

Код CSS:

.holder{        
    width:100%;
    position:absolute;
    left:0;
    top:0px;
    display:block;  
}
.popup{
    width:800px;
    margin:0 auto;
    border-radius: 7px;
    background:#6b6a63;
    margin:30px auto 0;
    padding:6px;
}

.content{
    background:#fff;
    padding: 28px 26px 33px 25px;
}

Код HTML:

  <div class="holder">
        <div id="popup" class="popup">            
            <div class="content">
                        some lengthy text
                     </div>
        </div>
   </div>

Спасибо !!