如何在页脚上方的网页底部显示弹出窗口？

Question

我有popup在页面加载10秒后显示。但是我希望它显示在页面底部（页脚div上方）.Window从下往上滑动并使其宽度为100％。还要想要能够在弹出窗口时滚动页面。我希望弹出窗口从底部出现。这是我的工作小提琴LINK。 这是我的model css：

.modal-header {
padding: 2px 16px;
background-color: #2098d1;
color: white;
}
.modal-body {padding: 2px 16px;}
.modal-footer {
padding: 2px 16px;
background-color: #5cb85c;
color: white;
}
.modal-header2 {
 padding: 2px 16px;
background-color: #2098d1;
color: white;
 }
.modal{
top: auto;
bottom: 10px;
outline: none;
}