/home/arranoyd/telegastro/wp-content/themes/dt-the7/css/static-less/plugins/photoswipe.less
/*! 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: 9500;
-webkit-text-size-adjust: 100%;
/* create separate layer, to avoid paint on window.onscroll in webkit/blink */
-webkit-backface-visibility: hidden;
outline: none; }
.pswp::after,
.pswp::before {
content: ' ';
display: table;
}
.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: unset;
/* 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; }
.admin-bar .pswp {
z-index: 100000;
}
//Video
.pswp__zoom-wrap {
text-align: center;
}
.pswp__zoom-wrap {
.flex-display(@display: flex);
}
.pswp-video-wrap {
//.flex-display(@display: inline-flex);
.align-items(@align: center);
.align-self(@align: center);
line-height: 0;
width: 100%;
//height: 100%;
max-width: 900px;
position: relative;
margin: 0 auto;
text-align: left;
z-index: 1045;
}
.video-wrapper {
position: relative;
padding-bottom: 56.25%;
/* 16:9 */
padding-top: 25px;
height: 0;
width: 100%;
& iframe {
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
& video {
width: 100% !important;
height: auto !important;
}
}
.pswp .pswp__ui--fit .pswp__top-bar,
.pswp .pswp__ui--fit .pswp__caption {
background-color: rgba(0, 0, 0, 0.5);
.admin-bar & {
background-color: rgba(0, 0, 0, 0.7);
}
}
.pswp.video-active .pswp__share-tooltip.show-share-pin .pswp__share--pinterest {
display: none;
}
.pswp__caption .pswp__caption__center {
text-align: center;
}
.pswp__caption h5 {
color: #fff;
margin-bottom: 5px;
}
//Custom lightbox icons
.pswp button.pswp__button {
height: 43px;
background: none !important;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
font-size: 17px;
line-height: 1;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
color: #fff;
opacity: 0.5;
}
.pswp--touch .pswp__ui:not(.pswp__ui--hidden) .pswp__button--arrow--left,
.pswp--touch .pswp__ui:not(.pswp__ui--hidden) .pswp__button--arrow--right {
visibility: visible;
}
.pswp button.pswp__button:focus,
.pswp button.pswp__button:hover {
opacity: 1;
}
.pswp .pswp__button:active {
opacity: 0.9;
}
.pswp--zoom-allowed .pswp__button--zoom:before {
content: "\f00e";
}
.pswp--zoomed-in .pswp__button--zoom:before {
content: "\f010";
}
.pswp--supports-fs .pswp__button--fs:before {
content: "\f065";
}
.pswp--fs .pswp__button--fs:before {
content: "\f066";
}
.pswp button.pswp__button--close {
font-size: 21px;
}
.pswp__button--close:before {
content: "\f00d";
}
.pswp__button--share:before {
content: "\f1e0";
}
.pswp .pswp__button--arrow--left:before,
.pswp .pswp__button--arrow--right:before {
top: 0;
}
.pswp .pswp__button--arrow--left:before {
content: "\f104" !important;
background: none !important;
}
.pswp .pswp__button--arrow--right:before {
content: "\f105" !important;
background: none !important;
}
.pswp .pswp__share-tooltip,
.pswp .pswp__share-tooltip a:first-child,
.pswp .pswp__share-tooltip a:last-child {
border-radius: 0;
}
.pswp .pswp__share-tooltip a {
display: none;
color: #222222;
}
.pswp__share-tooltip a:hover {
color: #fff !important;
}
.pswp__share-tooltip a i[class^="fa"] {
min-width: 15px;
margin-right: 5px;
}
.hide-pspw-share .pswp__share-modal,
.hide-pspw-share .pswp__button--share {
display: none;
}
.pswp .pswp__share-tooltip.show-share-fb .pswp__share--facebook,
.pswp .pswp__share-tooltip.show-share-tw .pswp__share--twitter,
.pswp .pswp__share-tooltip.show-share-pin .pswp__share--pinterest,
.pswp .pswp__share-tooltip.show-share-in .pswp__share--linkedin,
.pswp .pswp__share-tooltip.show-share-wp .pswp__share--whatsapp,
.pswp .pswp__share-tooltip.show-share-g .pswp__share--google,
.pswp .pswp__share-tooltip.show-share-d .pswp__share--download {
display: block;
}
.pswp__share-tooltip {
min-width: 150px;
}
.pswp__share-tooltip:before {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
top: -12px;
right: 15px;
border: 6px solid transparent;
border-bottom-color: #FFF;
-webkit-pointer-events: none;
-moz-pointer-events: none;
pointer-events: none;
}
a.pswp__share--facebook:hover {
background: #4c69c7;
}
a.pswp__share--twitter:hover {
background: #2abeeb;
}
a.pswp__share--pinterest:hover {
background: #cf2834 !important;
}
a.pswp__share--linkedin:hover {
background: #007bc7;
}
a.pswp__share--whatsapp:hover {
background: #36b74d;
}
a.pswp__share--google:hover {
background: #e64235;
}