div[lightbox]{position:fixed;left:100vw;width:100vh;background:0 0;height:100%;z-index:999999999;top:0;-o-transition:transition: .6s ease-out 0s,background .2s linear .6s;-webkit-transition:.6s ease-out 0s,background .6s linear 0s;-moz-transition:.6s ease-out 0s,background .2s linear .6s;transition:.6s ease-out 0s,background .2s linear .6s}div[lightbox]:target{background:rgba(0,0,0,.75);left:0!important;z-index:9999999999;top:0!important}div[lightbox]>article,div[lightbox]>canvas,div[lightbox]>iframe,div[lightbox]>img,div[lightbox]>video{margin:auto;position:absolute;top:0;left:0;right:0;bottom:0;border:3px solid snow;border-radius:3px;max-width:70%;max-height:70%;background:#000}div[lightbox]>article{width:100%;height:100%;color:snow;overflow-y:auto;padding:5px}div[lightbox]>iframe{background:snow;padding:0;color:snow;overflow-y:auto}div[lightbox] button{cursor:pointer;text-align:center;font:4em helvetica,arial,freesans,clean,sans-serif;color:snow;border:1px solid snow;background:#000;height:70%;width:10%;position:absolute;top:15%}div[lightbox] button[lbleft]{left:5%}div[lightbox] button[lbright]{right:5%}div[lightbox] button[lbup]{top:5%;height:10%;width:70%}div[lightbox] button[lbdown]{bottom:5%;height:10%;width:70%}div[lightbox] button[lbleft]:before{content:"\0021DA"}div[lightbox] button[lbright]:before{content:"\0021DB"}div[lightbox] button[lbup]:before{content:"\00290A"}div[lightbox] button[lbdown]:before{content:"\00290B"}div[lightbox]>h1,div[lightbox]>h2,div[lightbox]>h3{position:absolute;left:15%;right:15%;top:25;color:snow;text-shadow:-2px -2px red,2px 2px red,2px -2px red,-2px 2px red,-1px -1px red}div[lightbox],div[lightbox] *{transform:translate3D(0,0,0)}div[lightbox]>a[href="#screenarea"]{width:0;height:100%;background:0 0;background:-moz-linear-gradient(315deg,rgba(0,0,0,0) 90%,#fff 0);background:-webkit-linear-gradient(315deg,rgba(0,0,0,0) 90%,#fff 0);background:-o-linear-gradient(315deg,rgba(0,0,0,0) 90%,#fff 0);background:-ms-linear-gradient(315deg,rgba(0,0,0,0) 90%,#fff 0);background:linear-gradient(45deg,rgba(0,0,0,0) 90%,#fff 0);position:absolute;top:0;right:0;nav-index:-1;cursor:context-menu;transition:0s .6s}div[lightbox]:target>a[href="#screenarea"]{width:100%}div[lightbox]>a[href="#screenarea"]:after{content:"Close";position:absolute;top:-40px;right:-50px;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);font-size:36px;color:#000;text-align:right;cursor:pointer;display:none;padding:80px}div[lightbox]:target>a[href="#screenarea"]:after{display:block}#screenarea{z-index:-1000000;width:1px;height:1px;visibility:hidden;position:fixed;top:0;left:0;color:rgba(255,255,255,0);opacity:0}div[lightbox][id$="-l"],div[lightbox~=left]{left:-100vw}div[lightbox][id$="-t"],div[lightbox~=top]{left:0;top:-100vh}div[lightbox][id$="-b"],div[lightbox~=bottom]{left:0;top:100vh}div[lightbox][id$="-l"]:target,div[lightbox~=left]:target{left:0}div[lightbox][id$="-t"]:target,div[lightbox][id$="-b"]:target,div[lightbox~=bottom]:target,div[lightbox~=top]:target{left:0;top:0}div[lightbox][id$="-l"] a[href~="#screenarea"],div[lightbox][id$="-b"] a[href~="#screenarea"],div[lightbox~=bottom] a[href~="#screenarea"],div[lightbox~=left] a[href~="#screenarea"]{background:0 0;background:-moz-linear-gradient(45deg,rgba(0,0,0,0) 90%,#fff 0);background:-webkit-linear-gradient(45deg,rgba(0,0,0,0) 90%,#fff 0);background:-o-linear-gradient(45deg,rgba(0,0,0,0) 90%,#fff 0);background:-ms-linear-gradient(45deg,rgba(0,0,0,0) 90%,#fff 0);background:linear-gradient(45deg,rgba(0,0,0,0) 90%,#fff 0)}div[lightbox][id$="-l"] a[href~="#screenarea"]:after,div[lightbox][id$="-b"] a[href~="#screenarea"]:after,div[lightbox~=bottom] a[href~="#screenarea"]:after,div[lightbox~=left] a[href~="#screenarea"]:after{-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);text-align:right}div[lightbox][id$="-l"] a[href~="#screenarea"]:after,div[lightbox][id$="-b"] a[href~="#screenarea"]:after*/ div[lightbox~=nosel],div[lightbox~=bottom] a[href~="#screenarea"]:after,div[lightbox~=left] a[href~="#screenarea"]:after{-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:context-menu}div[lightbox~=inst]{transition:0s 0s}div[lightbox~=fast]{transition-duration:.3s}div[lightbox~=fast]>a[href~="#screenarea"]{transition-delay:.3s}div[lightbox~=slow]{transition-duration:1s}div[lightbox~=slow]>a[href~="#screenarea"]{transition-delay:1s}