80 lines
1.5 KiB
CSS
80 lines
1.5 KiB
CSS
.blocker {
|
|
position: fixed;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: auto;
|
|
z-index: 9999;
|
|
padding: 20px;
|
|
box-sizing: border-box;
|
|
background-color: rgb(0,0,0);
|
|
background-color: rgba(0,0,0,0.75);
|
|
text-align: center;
|
|
}
|
|
|
|
.blocker:before{
|
|
content: "";
|
|
display: inline-block;
|
|
height: 100%;
|
|
vertical-align: middle;
|
|
margin-right: -0.05em;
|
|
}
|
|
|
|
.blocker.behind {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.modal {
|
|
width: 400px;
|
|
text-align: left;
|
|
background: #fff;
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
position: relative;
|
|
z-index: 2;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
-webkit-border-radius: 8px;
|
|
-moz-border-radius: 8px;
|
|
-o-border-radius: 8px;
|
|
-ms-border-radius: 8px;
|
|
border-radius: 8px;
|
|
-webkit-box-shadow: 0 0 10px #000;
|
|
-moz-box-shadow: 0 0 10px #000;
|
|
-o-box-shadow: 0 0 10px #000;
|
|
-ms-box-shadow: 0 0 10px #000;
|
|
box-shadow: 0 0 10px #000;
|
|
}
|
|
|
|
.modal a.close-modal {
|
|
position: absolute;
|
|
top: -12.5px;
|
|
right: -12.5px;
|
|
display: block;
|
|
width: 30px;
|
|
height: 30px;
|
|
text-indent: -9999px;
|
|
background: url(images/close.png) no-repeat 0 0;
|
|
}
|
|
|
|
.modal-spinner {
|
|
display: none;
|
|
width: 64px;
|
|
height: 64px;
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
margin-right: -32px;
|
|
margin-top: -32px;
|
|
background: url(images/spinner_big.gif) no-repeat center center;
|
|
-webkit-border-radius: 8px;
|
|
-moz-border-radius: 8px;
|
|
-o-border-radius: 8px;
|
|
-ms-border-radius: 8px;
|
|
border-radius: 8px;
|
|
}
|