.popup { position: fixed; overflow-y: scroll; bottom:0; top:0%; left:100%; width: 100%; background: rgba(0, 0, 0, 0.7); width: 100%; opacity: 0; -webkit-transition: 1.5s ease-in-out; -moz-transition: 1.5s ease-in-out; -o-transition: 1.5s ease-in-out; transition: 1.5s ease-in-out; overflow: hidden; z-index:1000; color:#fff; }
a.popup-close { display:block; width: 50px; height: 50px; text-align:center; box-sizing: border-box; color: #fff; text-decoration: none; position: absolute; top: -80px; right: 0; -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; font-size: 55px; line-height: 55px;}
a.popup-close:before { content: "×"; line-height: 50px; }
.popup:target { display: block;opacity: 1; left:0; -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; max-height: 100%; max-width: 100%;}
.popup:target a.popup-close { top: 10px; right: 10px; }