56 lines
1.1 KiB
CSS
56 lines
1.1 KiB
CSS
|
|
/**
|
|
* @file
|
|
* Basic styling for the Overlay module.
|
|
*/
|
|
|
|
html.overlay-open,
|
|
html.overlay-open body {
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
#overlay-container,
|
|
.overlay-modal-background,
|
|
.overlay-element {
|
|
height: 100%;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
z-index: 500;
|
|
}
|
|
|
|
.overlay-modal-background {
|
|
/* Using a transparent png renders faster than using opacity */
|
|
background: transparent url(images/background.png) repeat;
|
|
}
|
|
|
|
.overlay-element {
|
|
background: transparent;
|
|
left: -200%;
|
|
z-index: 501;
|
|
}
|
|
.overlay-element.overlay-active {
|
|
left: 0;
|
|
}
|
|
|
|
html.overlay-open .displace-top,
|
|
html.overlay-open .displace-bottom {
|
|
z-index: 600;
|
|
}
|
|
|
|
/**
|
|
* Within the overlay parent, the message about disabling the overlay is for
|
|
* screen-reader users only. It is always kept invisible with the
|
|
* element-invisible class, and removed from the tab order. Overlay-child.css
|
|
* contains styling for the same message appearing within the overlay, and
|
|
* intended for sighted users.
|
|
*/
|
|
#overlay-disable-message {
|
|
display: none;
|
|
}
|
|
html.overlay-open #overlay-disable-message {
|
|
display: block;
|
|
}
|