Updated to v3.5.0

- New option `preventCaptionOverlap` enabled by default for desktop only;
- HTML5 video now uses thumbnail image as poster;
- Caption is now centered and without top border; caption does not hide when idling and `preventCaptionOverlap` is enabled;
- It is now easier to set content height in % (especially for iframes), there is not need to adjust bottom margin and max-height as it is done automatically using JS

- Fixed thumnbail visisbility detection (now works better with sliders);
- Fixed share modal not closing on clicking outside content area;
- Fixed iframe support for iOS

Author: fancyapps

dist/jquery.fancybox.css

@@ -13,7 +13,6 @@ body.compensate-for-scrollbar {
 
 .fancybox-container {
   -webkit-backface-visibility: hidden;
-  backface-visibility: hidden;
   height: 100%;
   left: 0;
   outline: none;
@@ -52,7 +51,7 @@ body.compensate-for-scrollbar {
   transition-timing-function: cubic-bezier(0.47, 0, 0.74, 0.71); }
 
 .fancybox-is-open .fancybox-bg {
-  opacity: .87;
+  opacity: .9;
   transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1); }
 
 .fancybox-infobar,
@@ -115,7 +114,7 @@ body.compensate-for-scrollbar {
   outline: none;
   overflow: auto;
   -webkit-overflow-scrolling: touch;
-  padding: 44px 44px 0 44px;
+  padding: 44px;
   position: absolute;
   text-align: center;
   top: 0;
@@ -140,23 +139,20 @@ body.compensate-for-scrollbar {
 .fancybox-slide--next {
   display: block; }
 
-.fancybox-slide--next {
-  z-index: 99995; }
-
 .fancybox-slide--image {
   overflow: hidden;
-  padding: 44px 0 0 0; }
+  padding: 44px 0; }
 
 .fancybox-slide--image::before {
   display: none; }
 
 .fancybox-slide--html {
-  padding: 6px 6px 0 6px; }
+  padding: 6px; }
 
 .fancybox-content {
   background: #fff;
   display: inline-block;
-  margin: 0 0 44px 0;
+  margin: 0;
   max-width: 100%;
   overflow: auto;
   -webkit-overflow-scrolling: touch;
@@ -190,9 +186,6 @@ body.compensate-for-scrollbar {
   user-select: none;
   z-index: 99995; }
 
-.fancybox-slide--html .fancybox-content {
-  margin: 0 0 6px 0; }
-
 .fancybox-can-zoomOut .fancybox-content {
   cursor: -webkit-zoom-out;
   cursor: zoom-out; }
@@ -237,7 +230,7 @@ body.compensate-for-scrollbar {
 .fancybox-slide--video .fancybox-content,
 .fancybox-slide--map .fancybox-content,
 .fancybox-slide--iframe .fancybox-content {
-  height: calc(100% - 44px);
+  height: 100%;
   overflow: visible;
   padding: 0;
   width: 100%; }
@@ -260,9 +253,14 @@ body.compensate-for-scrollbar {
   margin: 0;
   overflow: hidden;
   padding: 0;
-  vertical-align: top;
   width: 100%; }
 
+/* Fix iOS */
+.fancybox-iframe {
+  left: 0;
+  position: absolute;
+  top: 0; }
+
 .fancybox-error {
   background: #fff;
   cursor: default;
@@ -308,14 +306,16 @@ body.compensate-for-scrollbar {
 .fancybox-button.fancybox-focus {
   outline: 1px dotted; }
 
-.fancybox-button.disabled,
-.fancybox-button.disabled:hover,
 .fancybox-button[disabled],
 .fancybox-button[disabled]:hover {
   color: #888;
   cursor: default;
   outline: none; }
 
+/* Fix IE11 */
+.fancybox-button div {
+  height: 100%; }
+
 .fancybox-button svg {
   display: block;
   height: 100%;
@@ -378,23 +378,23 @@ body.compensate-for-scrollbar {
   right: 0;
   top: 0; }
 
+.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
+  overflow: hidden; }
+
 .fancybox-is-scaling .fancybox-close-small,
 .fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small {
   display: none; }
 
 /* Navigation arrows */
 .fancybox-navigation .fancybox-button {
-  background: transparent;
+  background-clip: content-box;
   height: 100px;
-  margin: 0;
   opacity: 0;
   position: absolute;
   top: calc(50% - 50px);
   width: 70px; }
 
 .fancybox-navigation .fancybox-button div {
-  background: rgba(30, 30, 30, 0.6);
-  height: 100%;
   padding: 7px; }
 
 .fancybox-navigation .fancybox-button--arrow_left {
@@ -408,16 +408,18 @@ body.compensate-for-scrollbar {
 /* Caption */
 .fancybox-caption {
   bottom: 0;
-  color: #fff;
+  color: #eee;
   font-size: 14px;
   font-weight: 400;
   left: 0;
   line-height: 1.5;
   padding: 25px 44px 25px 44px;
-  right: 0; }
+  right: 0;
+  text-align: center;
+  z-index: 99996; }
 
 .fancybox-caption::before {
-  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAEtCAQAAABjBcL7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHRJREFUKM+Vk8EOgDAIQ0vj/3+xBw8qIZZueFnIKC90MCAI8DlrkHGeqqGIU6lVigrBtpCWqeRWoHDNqs0F7VNVBVxmHRlvoVqjaYkdnDIaivH2HqZ5+oZj3JUzWB+cOz4G48Bg+tsJ/tqu4dLC/4Xb+0GcF5BwBC0AA53qAAAAAElFTkSuQmCC);
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAD6CAQAAADKSeXYAAAAYklEQVQoz42RwQ3AMAgDjfcfup8WoRykfBAK5mQHKSz5rbXJPis1hjiV3CIqgG0hLZPkVkA4p4x5oR1bVeDrdCLrW2Q0D5bcwY3TGMHbdw3mPRuOtaspYP1w//G1OIcW148H0DMCqI/3mMMAAAAASUVORK5CYII=);
   background-repeat: repeat-x;
   background-size: contain;
   bottom: 0;
@@ -427,18 +429,9 @@ body.compensate-for-scrollbar {
   pointer-events: none;
   position: absolute;
   right: 0;
-  top: -25px;
+  top: -44px;
   z-index: -1; }
 
-.fancybox-caption::after {
-  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
-  content: '';
-  display: block;
-  left: 44px;
-  position: absolute;
-  right: 44px;
-  top: 0; }
-
 .fancybox-caption a,
 .fancybox-caption a:link,
 .fancybox-caption a:visited {
@@ -572,13 +565,13 @@ body.compensate-for-scrollbar {
 
 /* Styling for Small-Screen Devices */
 @media all and (max-height: 576px) {
+  .fancybox-caption {
+    padding: 12px; }
   .fancybox-slide {
     padding-left: 6px;
     padding-right: 6px; }
   .fancybox-slide--image {
-    padding: 6px 0 0 0; }
-  .fancybox-slide--image .fancybox-content {
-    margin-bottom: 6px; }
+    padding: 6px 0; }
   .fancybox-slide--image .fancybox-close-small {
     background: #4e4e4e;
     color: #f2f4f6;
@@ -766,7 +759,7 @@ body.compensate-for-scrollbar {
   opacity: 1; }
 
 /* Styling for Small-Screen Devices */
-@media all and (max-width: 768px) {
+@media all and (max-width: 576px) {
   .fancybox-thumbs {
     width: 110px; }
   .fancybox-show-thumbs .fancybox-inner {