| @@ -116,8 +116,27 @@ | ||
| 116 | 116 | .elementor-lightbox .elementor-video-container .elementor-video-portrait iframe, |
| 117 | 117 | .elementor-lightbox .elementor-video-container .elementor-video-portrait video { |
| 118 | 118 | aspect-ratio: var(--video-aspect-ratio, 1.77777); |
| 119 | 119 | } |
| 120 | +@supports not (aspect-ratio: 1/1) { | |
| 121 | + .elementor-lightbox .elementor-video-container .elementor-video-square, | |
| 122 | + .elementor-lightbox .elementor-video-container .elementor-video-landscape, | |
| 123 | + .elementor-lightbox .elementor-video-container .elementor-video-portrait { | |
| 124 | + position: relative; | |
| 125 | + overflow: hidden; | |
| 126 | + height: 0; | |
| 127 | + padding-bottom: calc(100% / var(--video-aspect-ratio, 1.77777)); | |
| 128 | + } | |
| 129 | + .elementor-lightbox .elementor-video-container .elementor-video-square iframe, | |
| 130 | + .elementor-lightbox .elementor-video-container .elementor-video-square video, | |
| 131 | + .elementor-lightbox .elementor-video-container .elementor-video-landscape iframe, | |
| 132 | + .elementor-lightbox .elementor-video-container .elementor-video-landscape video, | |
| 133 | + .elementor-lightbox .elementor-video-container .elementor-video-portrait iframe, | |
| 134 | + .elementor-lightbox .elementor-video-container .elementor-video-portrait video { | |
| 135 | + position: absolute; | |
| 136 | + inset: 0; | |
| 137 | + } | |
| 138 | +} | |
| 120 | 139 | .elementor-lightbox .elementor-video-container .elementor-video-square iframe, |
| 121 | 140 | .elementor-lightbox .elementor-video-container .elementor-video-square video { |
| 122 | 141 | width: min(90vh, 90vw); |
| 123 | 142 | height: min(90vh, 90vw); |
| @@ -173,49 +192,17 @@ | ||
| 173 | 192 | width: 15%; |
| 174 | 193 | justify-content: center; |
| 175 | 194 | font-size: var(--lightbox-navigation-icons-size); |
| 176 | 195 | } |
| 177 | -@media (max-width: 1024px) { | |
| 178 | - .elementor-lightbox .elementor-swiper-button-prev:active, .elementor-lightbox .elementor-swiper-button-next:active { | |
| 179 | - -webkit-tap-highlight-color: transparent; /* fallback for some Androids */ | |
| 180 | - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| 181 | - } | |
| 182 | - .elementor-lightbox .elementor-swiper-button-prev svg, | |
| 183 | - .elementor-lightbox .elementor-swiper-button-prev i, .elementor-lightbox .elementor-swiper-button-next svg, | |
| 184 | - .elementor-lightbox .elementor-swiper-button-next i { | |
| 185 | - cursor: pointer; | |
| 186 | - } | |
| 187 | - .elementor-lightbox .elementor-swiper-button-prev svg:active, | |
| 188 | - .elementor-lightbox .elementor-swiper-button-prev i:active, .elementor-lightbox .elementor-swiper-button-next svg:active, | |
| 189 | - .elementor-lightbox .elementor-swiper-button-next i:active { | |
| 190 | - outline: none; | |
| 191 | - background-color: rgba(0, 0, 0, 0.5); | |
| 192 | - } | |
| 193 | -} | |
| 194 | 196 | @media (max-width: 767px) { |
| 195 | 197 | .elementor-lightbox .elementor-swiper-button:focus { |
| 196 | 198 | outline: none; |
| 197 | 199 | } |
| 198 | - .elementor-lightbox .elementor-swiper-button-prev:active, .elementor-lightbox .elementor-swiper-button-next:active { | |
| 199 | - -webkit-tap-highlight-color: transparent; /* fallback for some Androids */ | |
| 200 | - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| 201 | - } | |
| 202 | 200 | .elementor-lightbox .elementor-swiper-button-prev, .elementor-lightbox .elementor-swiper-button-next { |
| 203 | 201 | width: 20%; |
| 204 | 202 | } |
| 205 | 203 | .elementor-lightbox .elementor-swiper-button-prev i, .elementor-lightbox .elementor-swiper-button-next i { |
| 206 | 204 | padding: 10px; |
| 207 | - background-color: rgba(0, 0, 0, 0.5); | |
| 208 | - } | |
| 209 | - .elementor-lightbox .elementor-swiper-button-prev svg, | |
| 210 | - .elementor-lightbox .elementor-swiper-button-prev i, .elementor-lightbox .elementor-swiper-button-next svg, | |
| 211 | - .elementor-lightbox .elementor-swiper-button-next i { | |
| 212 | - cursor: pointer; | |
| 213 | - } | |
| 214 | - .elementor-lightbox .elementor-swiper-button-prev svg:active, | |
| 215 | - .elementor-lightbox .elementor-swiper-button-prev i:active, .elementor-lightbox .elementor-swiper-button-next svg:active, | |
| 216 | - .elementor-lightbox .elementor-swiper-button-next i:active { | |
| 217 | - outline: none; | |
| 218 | 205 | background-color: rgba(0, 0, 0, 0.5); |
| 219 | 206 | } |
| 220 | 207 | .elementor-lightbox .elementor-swiper-button-prev { |
| 221 | 208 | left: 0; |
