/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */ /* Styles for basic PhotoSwipe functionality (sliding area, open/close transitions) */ /* pswp = photoswipe */ .pswp { display: none; position: absolute; width: 100%; height: 100%; left: 0; top: 0; overflow: hidden; -ms-touch-action: none; touch-action: none; z-index: 15000; -webkit-text-size-adjust: 100%; /* create separate layer, to avoid paint on window.onscroll in webkit/blink */ -webkit-backface-visibility: hidden; outline: none; } .pswp * { -webkit-box-sizing: border-box; box-sizing: border-box; } .pswp img { max-width: none; } /* style is added when JS option showHideOpacity is set to true */ .pswp--animate_opacity { /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */ opacity: 0.001; will-change: opacity; /* for open/close transition */ -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp--open { display: block; } .pswp--zoom-allowed .pswp__img { /* autoprefixer: off */ cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .pswp--zoomed-in .pswp__img { /* autoprefixer: off */ cursor: -webkit-grab; cursor: -moz-grab; cursor: grab; } .pswp--dragging .pswp__img { /* autoprefixer: off */ cursor: -webkit-grabbing; cursor: -moz-grabbing; cursor: grabbing; } /* Background is added as a separate element. As animating opacity is much faster than animating rgba() background-color. */ .pswp__bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: 0; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; will-change: opacity; } .pswp__scroll-wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; } .pswp__container, .pswp__zoom-wrap { -ms-touch-action: none; touch-action: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; } /* Prevent selection and tap highlights */ .pswp__container, .pswp__img { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .pswp__zoom-wrap { position: absolute; width: 100%; -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; /* for open/close transition */ -webkit-transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp__bg { will-change: opacity; /* for open/close transition */ -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp--animated-in .pswp__bg, .pswp--animated-in .pswp__zoom-wrap { -webkit-transition: none; transition: none; } .pswp__container, .pswp__zoom-wrap { -webkit-backface-visibility: hidden; } .pswp__item { position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden; } .pswp__img { position: absolute; width: auto; height: auto; top: 0; left: 0; } /* stretched thumbnail or div placeholder element (see below) style is added to avoid flickering in webkit/blink when layers overlap */ .pswp__img--placeholder { -webkit-backface-visibility: hidden; } /* div element that matches size of large image large image loads on top of it */ .pswp__img--placeholder--blank { background: #222; } .pswp--ie .pswp__img { width: 100% !important; height: auto !important; left: 0; top: 0; } /* Error message appears when image is not loaded (JS option errorMsg controls markup) */ .pswp__error-msg { position: absolute; left: 0; top: 50%; width: 100%; text-align: center; font-size: 14px; line-height: 16px; margin-top: -8px; color: #CCC; } .pswp__error-msg a {color: #CCC;text-decoration: underline; } .pswp__button{transition:opacity, background-color .2s;color: #fff;font-size: 18px;font-family: 'remixicon';} .pswp__button:hover {background-color: rgba(255,255,255,0.1);} .pswp__button.pswp__button--rotate{background-image: none !important;} .pswp__button.pswp__button--rotate:before{content: "\eb95";} .pswp__button.pswp__button--remove{background-image: none !important;} .pswp__button.pswp__button--remove:before{content:"\ec1e";} /* .pswp__container:not(.touch-start) .pswp__item.loading .pswp__zoom-wrap{transform: none !important;} */ .pswp__item.loading .pswp__zoom-wrap{transform: none !important;} .pswp__item .pswp__zoom-wrap .pswp__img.pswp__img--placeholder{display:none;} .pswp__container.init-first .pswp__zoom-wrap .pswp__img.pswp__img--placeholder{display:block;} .pswp__item.loading .pswp__zoom-wrap .pswp__img.pswp__img--placeholder{display:block;} .pswp__item.loading .pswp__zoom-wrap .pswp__img { position: absolute; top: 0;right: 0;left: 0;bottom: 0; margin: auto;height: 80%;min-width: 40%; } .pswp__button.pswp__button--show-true{ margin-right:5px;background-image: none !important; width: auto;font-size: 12px;padding: 0 8px 0 28px; } .pswp__button.pswp__button--show-true:before{ content:"\ee4a";font-size: 18px;position: absolute;margin:-3px 0 0 -20px; } .pswp .file-panel *{box-sizing: initial;} .pswp__button.pswp__button--info{background-image: none !important;} .pswp__button.pswp__button--info:before{content:"\ee58";} .app-wap-small .pswp__button.pswp__button--info{display: none !important;} .pswp_content .pswp__scroll-wrap{z-index:2;} .pswp_content.dark-mode .file-panel{ border-left: 1px solid rgba(255,255,255,0.15); box-shadow: 0 0 10px #00000080;background: rgba(20,20,20,0.8); } .pswp_content .file-panel-info{position:absolute;right:0;top:0;bottom:0;width:320px;z-index:1;} .pswp_content.panel-info-open .pswp__scroll-wrap{width:auto;right:320px;} .pswp_content.panel-info-open .pswp__button.pswp__button--info{color: #1890ff;background: rgba(255,255,255,0.15);} .pswp__error-msg{width: 100% !important;height: auto !important;} .pswp_content .file-panel .btn[data-action="copyWget"]{display: none;} .pswp_content .file-panel .btn[data-action="copyCurl"]{display: none;} .pswp__button.pswp__button--download i{display: none;} .pswp__button.pswp__button--download{background-image: none !important;} .pswp__button.pswp__button--download:before{content:"\ec53";}