position: absolute;
top: 0px;
left: 0px;
- /* !!!!!!!!!!! non !!!!!!!!!!!!!!!!!
- -webkit-transform: translateZ(0);
- -moz-transform: translateZ(0);
- -ms-transform: translateZ(0);
- -o-transform: translateZ(0);
- transform: translateZ(0);*/
-}
+ width: unit(@shadow-width-left+@shadow-width-right, px);
+ height: unit(@book-page-height, px);
+ pointer-events: none;
+ mix-blend-mode: multiply;
- > .shadow {
- position: absolute;
- left: 0;
- opacity: @shadow-opacity;
-
- &.bottom {
- bottom: -@shadow-height+@shadow-offset;
- background-size: 100% @shadow-height;
- height: @shadow-height;
-
- &.left {
- left: -12px;
- width: @shadow-width-left;
- background-image: url("../images/shadows/back/bottom-left.png");
- }
-
- &.right {
- display: none;
- background-image: url("../images/shadows/back/bottom-right.png");
- width: @shadow-width-right;
-
- .landscape & {
- left: @book-page-width;
- }
- }
- }
-
- &.side {
-
- top: 0;
- width: 35px;
- height: unit(@book-page-height, px);
- background-size: 100% 100%;
-
- &.right {
- left: unit(@book-page-width*2, px);
- background-image: url("../images/shadows/back/right.png");
- }
-
- &.left {
- background-image: url("../images/shadows/back/left.png");
- left: -35px;
- }
-
- }
- }
- }
-
- #edges {
+ #shadow > div {
position: absolute;
top: 0px;
left: 0px;