 .sl-wrapper .sl-close,
 .sl-wrapper .sl-navigation button {
     height: 44px;
     line-height: 44px;
     font-family: Arial, Baskerville, monospace
 }

 .sl-wrapper .sl-close:focus,
 .sl-wrapper .sl-navigation button:focus {
     outline: 0
 }

 body.hidden-scroll {
     overflow: hidden
 }

 .sl-overlay {
     position: fixed;
     left: 0;
     right: 0;
     top: 0;
     bottom: 0;
     background: #000;
     opacity: .7;
     display: none;
     z-index: 1050
 }

 .sl-wrapper .sl-close,
 .sl-wrapper .sl-counter {
     top: 30px;
     display: none;
     color: #fff;
     position: fixed
 }

 .sl-wrapper {
     z-index: 1040
 }

 .sl-wrapper button {
     border: 0;
     background: 0 0;
     font-size: 28px;
     padding: 0;
     cursor: pointer
 }

 .sl-wrapper button:hover {
     opacity: .7
 }

 .sl-wrapper .sl-close {
     right: 30px;
     z-index: 1060;
     margin-top: -14px;
     margin-right: -14px;
     width: 44px;
     font-size: 3rem
 }

 .sl-wrapper .sl-counter {
     left: 30px;
     z-index: 1060;
     font-size: 1rem
 }

 .sl-wrapper .sl-navigation {
     width: 100%;
     display: none
 }

 .sl-wrapper .sl-navigation button {
     position: fixed;
     top: 50%;
     margin-top: -22px;
     width: 22px;
     text-align: center;
     display: block;
     z-index: 1060;
     color: #fff
 }

 .sl-wrapper .sl-navigation button.sl-next {
     right: 5px;
     font-size: 3rem
 }

 .sl-wrapper .sl-navigation button.sl-prev {
     left: 5px;
     font-size: 3rem
 }

 .sl-wrapper .sl-image {
     position: fixed;
     -ms-touch-action: none;
     touch-action: none;
     z-index: 10000
 }

 .sl-wrapper .sl-image img {
     margin: 0;
     padding: 0;
     display: block;
     border: 0
 }

 .sl-wrapper .sl-image iframe {
     background: #000;
     border: 0
 }

 @media (min-width:35.5em) {
     .sl-wrapper .sl-navigation button {
         width: 44px
     }
     .sl-wrapper .sl-navigation button.sl-next {
         right: 10px;
         font-size: 3rem
     }
     .sl-wrapper .sl-navigation button.sl-prev {
         left: 10px;
         font-size: 3rem
     }
     .sl-wrapper .sl-image iframe,
     .sl-wrapper .sl-image img {
         border: 0
     }
 }

 @media (min-width:50em) {
     .sl-wrapper .sl-navigation button {
         width: 44px
     }
     .sl-wrapper .sl-navigation button.sl-next {
         right: 20px;
         font-size: 3rem
     }
     .sl-wrapper .sl-navigation button.sl-prev {
         left: 20px;
         font-size: 3rem
     }
     .sl-wrapper .sl-image iframe,
     .sl-wrapper .sl-image img {
         border: 0
     }
 }

 .sl-wrapper .sl-image .sl-caption {
     display: none;
     padding: 10px;
     color: #fff;
     background: rgba(0, 0, 0, .8);
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0
 }

 .sl-wrapper .sl-image .sl-caption.pos-top {
     bottom: auto;
     top: 0
 }

 .sl-wrapper .sl-image .sl-caption.pos-outside {
     bottom: auto
 }

 .sl-wrapper .sl-image .sl-download {
     display: none;
     position: absolute;
     bottom: 5px;
     right: 5px;
     color: #000;
     z-index: 1060
 }

 .sl-spinner {
     display: none;
     border: 5px solid #333;
     border-radius: 40px;
     height: 40px;
     left: 50%;
     margin: -20px 0 0 -20px;
     opacity: 0;
     position: fixed;
     top: 50%;
     width: 40px;
     z-index: 1007;
     -webkit-animation: pulsate 1s ease-out infinite;
     -moz-animation: pulsate 1s ease-out infinite;
     -ms-animation: pulsate 1s ease-out infinite;
     -o-animation: pulsate 1s ease-out infinite;
     animation: pulsate 1s ease-out infinite
 }

 .sl-scrollbar-measure {
     position: absolute;
     top: -9999px;
     width: 50px;
     height: 50px;
     overflow: scroll
 }

 @-webkit-keyframes pulsate {
     0% {
         transform: scale(.1);
         opacity: 0
     }
     50% {
         opacity: 1
     }
     100% {
         transform: scale(1.2);
         opacity: 0
     }
 }

 @keyframes pulsate {
     0% {
         transform: scale(.1);
         opacity: 0
     }
     50% {
         opacity: 1
     }
     100% {
         transform: scale(1.2);
         opacity: 0
     }
 }

 @-moz-keyframes pulsate {
     0% {
         transform: scale(.1);
         opacity: 0
     }
     50% {
         opacity: 1
     }
     100% {
         transform: scale(1.2);
         opacity: 0
     }
 }

 @-o-keyframes pulsate {
     0% {
         transform: scale(.1);
         opacity: 0
     }
     50% {
         opacity: 1
     }
     100% {
         transform: scale(1.2);
         opacity: 0
     }
 }

 @-ms-keyframes pulsate {
     0%,
     100% {
         opacity: 0
     }
     0% {
         transform: scale(.1)
     }
     50% {
         opacity: 1
     }
     100% {
         transform: scale(1.2)
     }
 }
