v1/web/modules/contrib/blazy/css/components/box/blazy.mfp.css

117 lines
1.8 KiB
CSS

/**
* @file
* Provides Magnific Popup integration.
*/
.mfp-title h2,
.mfp-title p {
margin: 0;
}
.mfp-content .media,
.mfp-content .mfp-html {
margin: auto;
}
.mfp-html {
pointer-events: none;
}
.mfp-content .mfp-html {
max-height: 92%;
max-width: 92%;
max-height: 92vh;
max-width: 92vw;
position: relative;
display: flex;
align-items: center;
flex-direction: row;
justify-content: center;
height: 100%;
height: 100vh;
min-height: auto;
}
.mfp-html > .mfp-inner {
align-self: center;
display: block;
max-height: 92vh;
max-width: 92vw;
pointer-events: auto;
position: relative;
}
.mfp-inner > img,
.mfp-inner > picture img {
height: auto;
display: block;
margin: auto;
max-height: 92vh;
}
.mfp-html .mfp-bottom-bar {
background: rgba(0, 0, 0, .6);
margin-top: -46px;
min-height: 46px;
padding: 5px 15px;
}
.mfp-html .mfp-counter,
.mfp-html .mfp-title {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.mfp-html .mfp-counter {
right: 15px;
}
.mfp-html .mfp-title {
width: 100%;
}
.mfp-bottom-bar {
opacity: 0;
}
.mfp-on .mfp-bottom-bar {
opacity: 1;
}
.mfp-html .mfp-close {
color: #eee;
}
/* Zoom effect */
.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
opacity: 0;
-webkit-backface-visibility: hidden;
/* ideally, transition speed should match zoom duration */
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.mfp-with-zoom.mfp-ready .mfp-container {
opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
opacity: 0.8;
}
.mfp-with-zoom.mfp-removing .mfp-container,
.mfp-with-zoom.mfp-removing.mfp-bg {
opacity: 0;
}
/** 641px with 16px base font. */
@media only screen and (min-width: 40.063em) {
.mfp-content .mfp-html {
min-height: 80vh;
}
}