#myModal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:none;background-color:rgba(0,0,0,.5);animation:fadeInModal .4s ease-out}.modal-content{position:relative;background-color:#fefefe;margin:0 auto;padding:20px;border:1px solid #888;width:100%;max-width:100%;max-height:100%;overflow:hidden;text-align:center;animation:slideDown .4s ease-out}#myModal .modal-content .close{position:absolute;top:10px;right:10px;font-weight:bold;color:var(--content-bg-color);background-color:var(--text-primary-color);cursor:pointer;padding:3px 6px;border-radius:3px;z-index:99999;transition:transform .2s,background-color .2s;line-height:1;z-index:2;font-size:var(--font-size-normal);padding:var(--spacing-sm)}#myModal .modal-content .close:hover{transform:scale(1.1);background-color:var(--accent-color)}.modal-content .prev,.modal-content .next{position:absolute;top:50%;width:auto;padding:var(--spacing-md);margin-top:-50px;font-weight:bold;font-size:var(--font-size-normal);color:var(--content-bg-color);background-color:var(--text-primary-color);cursor:pointer;user-select:none;-webkit-user-select:none;z-index:2}.modal-img{transition:opacity .4s ease-in-out,transform .4s ease-in-out;opacity:0;transform:scale(.85);max-width:100%;max-height:90vh;position:relative;z-index:1}.modal-img.fade-in{opacity:1;transform:scale(1)}.modal-img.fade-out{opacity:0;transform:scale(.85)}.modal-content .prev,.modal-content .next{transition:background-color .3s,transform .2s;border-radius:5px}.modal-content .prev:hover,.modal-content .next:hover{background-color:rgba(0,0,0,.1);transform:scale(1.1)}@keyframes fadeInModal{from{background-color:rgba(0,0,0,0)}to{background-color:rgba(0,0,0,.5)}}@keyframes slideDown{from{transform:translateY(-30px);opacity:0}to{transform:translateY(0);opacity:1}}@media screen and (max-width:960px){.modal-content .prev{left:5px}.modal-content .next{right:5px}}