/*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */

.pswp__button {
   width:44px;
   height:44px;
   position:relative;
   background:0 0;
   cursor:pointer;
   overflow:visible;
   -webkit-appearance:none;
   display:block;
   border:0;
   padding:0;
   margin:0;
   float:right;
   opacity:.75;
   -webkit-transition:opacity .2s;
   transition:opacity .2s;
   -webkit-box-shadow:none;
   box-shadow:none
}

.pswp__button:focus,.pswp__button:hover {
   opacity:1
}

.pswp__button:active {
   outline:0;
   opacity:.9
}

.pswp__button::-moz-focus-inner {
   padding:0;
   border:0
}

.pswp__ui--over-close .pswp__button--close {
   opacity:1
}

.pswp__button,.pswp__button--arrow--left:before,.pswp__button--arrow--right:before {
   background:url(default-skin.png) 0 0 no-repeat;
   background-size:264px 88px;
   width:44px;
   height:44px
}

.pswp__button--close {
   background-position:0 -44px
}

.pswp__button--share {
   background-position:-44px -44px
}

.pswp__button--fs {
   display:none
}

.pswp--supports-fs .pswp__button--fs {
   display:block
}

.pswp--fs .pswp__button--fs {
   background-position:-44px 0
}

.pswp__button--zoom {
   display:none;
   background-position:-88px 0
}

.pswp--zoom-allowed .pswp__button--zoom {
   display:block
}

.pswp--zoomed-in .pswp__button--zoom {
   background-position:-132px 0
}

.pswp--touch .pswp__button--arrow--left,.pswp--touch .pswp__button--arrow--right {
   visibility:hidden
}

.pswp__button--arrow--left,.pswp__button--arrow--right {
   background:0 0;
   top:50%;
   margin-top:-50px;
   width:70px;
   height:100px;
   position:absolute
}

.pswp__button--arrow--left {
   left:0
}

.pswp__button--arrow--right {
   right:0
}

.pswp__button--arrow--left:before,.pswp__button--arrow--right:before {
   content:'';
   top:35px;
   background-color:rgba(0,0,0,.3);
   height:30px;
   width:32px;
   position:absolute
}

.pswp__button--arrow--left:before {
   left:6px;
   background-position:-138px -44px
}

.pswp__button--arrow--right:before {
   right:6px;
   background-position:-94px -44px
}

.pswp__counter,.pswp__share-modal {
   -webkit-user-select:none;
   -moz-user-select:none;
   -ms-user-select:none;
   user-select:none
}

.pswp__share-modal {
  display:block;
  background:rgba(0,0,0,.5);
  width:100%;
  height:100%;
  top:0;
  left:0;
  padding:10px;
  position:absolute;
  z-index:1600;
  opacity:0;
  -webkit-transition:opacity .25s ease-out;
  transition:opacity .25s ease-out;
  -webkit-backface-visibility:hidden;
  will-change:opacity
}

.pswp__share-modal--hidden {
   display:none
}

.pswp__share-tooltip {
   z-index:1620;
   position:absolute;
   background:#fff;
   top:56px;
   border-radius:2px;
   display:block;
   width:auto;
   right:44px;
   -webkit-box-shadow:0 2px 5px rgba(0,0,0,.25);
   box-shadow:0 2px 5px rgba(0,0,0,.25);
   -webkit-transform:translateY(6px);
   -ms-transform:translateY(6px);
   transform:translateY(6px);
   -webkit-transition:-webkit-transform .25s;
   transition:transform .25s;
   -webkit-backface-visibility:hidden;
   will-change:transform
}

.pswp__share-tooltip a {
   display:block;
   padding:8px 12px;
   color:#000;
   text-decoration:none;
   font-size:14px;
   line-height:18px
}

.pswp__share-tooltip a:hover {
   text-decoration:none;
   color:#000
}

.pswp__share-tooltip a:first-child {
   border-radius:2px 2px 0 0
}

.pswp__share-tooltip a:last-child {
   border-radius:0 0 2px 2px
}

.pswp__share-modal--fade-in {
   opacity:1
}

.pswp__share-modal--fade-in .pswp__share-tooltip {
   -webkit-transform:translateY(0);
   -ms-transform:translateY(0);
   transform:translateY(0)
}

.pswp--touch .pswp__share-tooltip a {
   padding:16px 12px
}

a.pswp__share--facebook: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:#3e5c9a;
   color:#fff
}

a.pswp__share--facebook:hover:before {
   border-bottom-color:#3e5c9a
}

a.pswp__share--twitter:hover {
   background:#55acee;
   color:#fff
}

a.pswp__share--pinterest:hover {
   background:#ccc;
   color:#ce272d
}

a.pswp__share--download:hover {
   background:#ddd
}

.pswp__counter {
   position:absolute;
   left:0;
   top:0;
   height:44px;
   font-size:18px;
   line-height:44px;
   color:#fff;
   opacity:.75;
   padding:0 10px
}

.pswp__caption {
   position:absolute;
   left:0;
   bottom:0;
   width:100%;
   min-height:44px
}

.pswp__caption small {
   font-size:11px;
   color:#bbb
}

.pswp__caption__center {
   text-align:center;
   margin:0 auto;
   font-size:1.8em;
   padding:10px;
   line-height:1em;
   color:#ccc
}

.pswp__caption--empty {
   display:none
}

.pswp__caption--fake {
   visibility:hidden
}

.pswp__preloader {
   width:44px;
   height:44px;
   position:absolute;
   top:0;
   left:50%;
   margin-left:-22px;
   opacity:0;
   -webkit-transition:opacity .25s ease-out;
   transition:opacity .25s ease-out;
   will-change:opacity;
   direction:ltr
}

.pswp__preloader__icn {
   width:20px;
   height:20px;
   margin:12px
}

.pswp__preloader--active {
   opacity:1
}

.pswp__preloader--active .pswp__preloader__icn {
   background:url(preloader.gif) 0 0 no-repeat
}

.pswp--css_animation .pswp__preloader--active {
   opacity:1
}

.pswp--css_animation .pswp__preloader--active .pswp__preloader__icn {
   -webkit-animation:clockwise .5s linear infinite;
   animation:clockwise .5s linear infinite
}

.pswp--css_animation .pswp__preloader--active .pswp__preloader__donut {
   -webkit-animation:donut-rotate 1s cubic-bezier(.4,0,.22,1) infinite;
   animation:donut-rotate 1s cubic-bezier(.4,0,.22,1) infinite
}

.pswp--css_animation .pswp__preloader__icn {
   background:0 0;
   opacity:.75;
   width:14px;
   height:14px;
   position:absolute;
   left:15px;
   top:15px;
   margin:0
}

.pswp--css_animation .pswp__preloader__cut {
   position:relative;
   width:7px;
   height:14px;
   overflow:hidden
}

.pswp--css_animation .pswp__preloader__donut {
   -webkit-box-sizing:border-box;
   box-sizing:border-box;
   width:14px;
   height:14px;
   border:2px solid #fff;
   border-radius:50%;
   border-left-color:transparent;
   border-bottom-color:transparent;
   position:absolute;
   top:0;
   left:0;
   background:0 0;
   margin:0
}

@media screen and (max-width:1024px) {
   .pswp__preloader {
      position:relative;
      left:auto;
      top:auto;
      margin:0;
      float:right
   }
}

@-webkit-keyframes clockwise {
0% {
   -webkit-transform:rotate(0);
   transform:rotate(0)
   }
100% {
   -webkit-transform:rotate(360deg);
   transform:rotate(360deg)
   }
}

@keyframes clockwise {
0% {
   -webkit-transform:rotate(0);
   transform:rotate(0)
   }
100% {
   -webkit-transform:rotate(360deg);
   transform:rotate(360deg)
   }
}

@-webkit-keyframes donut-rotate{
0% {
   -webkit-transform:rotate(0);
   transform:rotate(0)
   }
50% {
   -webkit-transform:rotate(-140deg);
   transform:rotate(-140deg)
   }
100% {
   -webkit-transform:rotate(0);
   transform:rotate(0)
   }
}

@keyframes donut-rotate {
0% {
   -webkit-transform:rotate(0);
   transform:rotate(0)
   }
50% {
   -webkit-transform:rotate(-140deg);
   transform:rotate(-140deg)
   }
100% {
   -webkit-transform:rotate(0);
   transform:rotate(0)
   }
}

.pswp__ui {
   -webkit-font-smoothing:auto;
   visibility:visible;
   opacity:1;
   z-index:1550
}

.pswp__top-bar {
   position:absolute;
   left:0;
   top:0;
   height:44px;
   width:100%
}

.pswp--has_mouse .pswp__button--arrow--left,.pswp--has_mouse .pswp__button--arrow--right,.pswp__caption,.pswp__top-bar {
   -webkit-backface-visibility:hidden;
   will-change:opacity;
   -webkit-transition:opacity 333ms cubic-bezier(.4,0,.22,1);
   transition:opacity 333ms cubic-bezier(.4,0,.22,1)
}

.pswp--has_mouse .pswp__button--arrow--left,.pswp--has_mouse .pswp__button--arrow--right {
   visibility:visible
}

.pswp__caption,.pswp__top-bar {
   background-color:rgba(0,0,0,.5)
}

.pswp__ui--fit .pswp__caption,.pswp__ui--fit .pswp__top-bar {
   background-color:rgba(0,0,0,.3)
}

.pswp__ui--idle .pswp__top-bar {
   opacity:0
}

.pswp__ui--idle .pswp__button--arrow--left,.pswp__ui--idle .pswp__button--arrow--right {
   opacity:0
}

.pswp__ui--hidden .pswp__button--arrow--left,.pswp__ui--hidden .pswp__button--arrow--right,.pswp__ui--hidden .pswp__caption,.pswp__ui--hidden .pswp__top-bar {
   opacity:0
}

.pswp__ui--one-slide .pswp__button--arrow--left,.pswp__ui--one-slide .pswp__button--arrow--right,.pswp__ui--one-slide .pswp__counter {
   display:none
}

.pswp__element--disabled {
   display:none!important
}

.pswp--minimal--dark .pswp__top-bar {
   background:0 0
}

/* Використовуємо власні зображення для кнопок-стрілок */
.pswp__button--arrow--left {
    top:50%;
    width:48px;
    height:48px;
    background-image: url('left-button-48x48.png');
    background-size: cover;
    visibility: visible; /* Завжди відображати */
}

.pswp__button--arrow--right {
    top:50%;
    width:48px;
    height:48px;
    background-image: url('right-button-48x48.png');
    background-size: cover;
    visibility: visible; /* Завжди відображати */
}

/* Завжди відображати стрілки на мобільних пристроях */
.pswp--touch .pswp__button--arrow--left,
.pswp--touch .pswp__button--arrow--right {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Забираємо псевдоелементи, щоб уникнути накладень */
.pswp__button--arrow--left:before,
.pswp__button--arrow--right:before {
    content: none;
}
