EVOLUTION-MANAGER
Edit File: style.css
.wp-block-image a{ display:inline-block; } .wp-block-image img{ box-sizing:border-box; height:auto; max-width:100%; vertical-align:bottom; } @media (prefers-reduced-motion:no-preference){ .wp-block-image img.hide{ visibility:hidden; } .wp-block-image img.show{ animation:show-content-image .4s; } } .wp-block-image[style*=border-radius] img,.wp-block-image[style*=border-radius]>a{ border-radius:inherit; } .wp-block-image.has-custom-border img{ box-sizing:border-box; } .wp-block-image.aligncenter{ text-align:center; } .wp-block-image.alignfull a,.wp-block-image.alignwide a{ width:100%; } .wp-block-image.alignfull img,.wp-block-image.alignwide img{ height:auto; width:100%; } .wp-block-image .aligncenter,.wp-block-image .alignleft,.wp-block-image .alignright,.wp-block-image.aligncenter,.wp-block-image.alignleft,.wp-block-image.alignright{ display:table; } .wp-block-image .aligncenter>figcaption,.wp-block-image .alignleft>figcaption,.wp-block-image .alignright>figcaption,.wp-block-image.aligncenter>figcaption,.wp-block-image.alignleft>figcaption,.wp-block-image.alignright>figcaption{ caption-side:bottom; display:table-caption; } .wp-block-image .alignleft{ float:left; margin:.5em 1em .5em 0; } .wp-block-image .alignright{ float:right; margin:.5em 0 .5em 1em; } .wp-block-image .aligncenter{ margin-left:auto; margin-right:auto; } .wp-block-image :where(figcaption){ margin-bottom:1em; margin-top:.5em; } .wp-block-image.is-style-circle-mask img{ border-radius:9999px; } @supports ((-webkit-mask-image:none) or (mask-image:none)) or (-webkit-mask-image:none){ .wp-block-image.is-style-circle-mask img{ border-radius:0; -webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>'); mask-mode:alpha; -webkit-mask-position:center; mask-position:center; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-size:contain; mask-size:contain; } } :root :where(.wp-block-image.is-style-rounded img,.wp-block-image .is-style-rounded img){ border-radius:9999px; } .wp-block-image figure{ margin:0; } .wp-lightbox-container{ display:flex; flex-direction:column; position:relative; } .wp-lightbox-container img{ cursor:zoom-in; } .wp-lightbox-container img:hover+button{ opacity:1; } .wp-lightbox-container button{ align-items:center; -webkit-backdrop-filter:blur(16px) saturate(180%); backdrop-filter:blur(16px) saturate(180%); background-color:#5a5a5a40; border:none; border-radius:4px; cursor:zoom-in; display:flex; height:20px; justify-content:center; opacity:0; padding:0; position:absolute; right:16px; text-align:center; top:16px; transition:opacity .2s ease; width:20px; z-index:100; } .wp-lightbox-container button:focus-visible{ outline:3px auto #5a5a5a40; outline:3px auto -webkit-focus-ring-color; outline-offset:3px; } .wp-lightbox-container button:hover{ cursor:pointer; opacity:1; } .wp-lightbox-container button:focus{ opacity:1; } .wp-lightbox-container button:focus,.wp-lightbox-container button:hover,.wp-lightbox-container button:not(:hover):not(:active):not(.has-background){ background-color:#5a5a5a40; border:none; } .wp-lightbox-overlay{ box-sizing:border-box; cursor:zoom-out; height:100vh; left:0; overflow:hidden; position:fixed; top:0; visibility:hidden; width:100%; z-index:100000; } .wp-lightbox-overlay .close-button{ align-items:center; cursor:pointer; display:flex; justify-content:center; min-height:40px; min-width:40px; padding:0; position:absolute; right:calc(env(safe-area-inset-right) + 16px); top:calc(env(safe-area-inset-top) + 16px); z-index:5000000; } .wp-lightbox-overlay .close-button:focus,.wp-lightbox-overlay .close-button:hover,.wp-lightbox-overlay .close-button:not(:hover):not(:active):not(.has-background){ background:none; border:none; } .wp-lightbox-overlay .lightbox-image-container{ height:var(--wp--lightbox-container-height); left:50%; overflow:hidden; position:absolute; top:50%; transform:translate(-50%, -50%); transform-origin:top left; width:var(--wp--lightbox-container-width); z-index:9999999999; } .wp-lightbox-overlay .wp-block-image{ align-items:center; box-sizing:border-box; display:flex; height:100%; justify-content:center; margin:0; position:relative; transform-origin:0 0; width:100%; z-index:3000000; } .wp-lightbox-overlay .wp-block-image img{ height:var(--wp--lightbox-image-height); min-height:var(--wp--lightbox-image-height); min-width:var(--wp--lightbox-image-width); width:var(--wp--lightbox-image-width); } .wp-lightbox-overlay .wp-block-image figcaption{ display:none; } .wp-lightbox-overlay button{ background:none; border:none; } .wp-lightbox-overlay .scrim{ background-color:#fff; height:100%; opacity:.9; position:absolute; width:100%; z-index:2000000; } .wp-lightbox-overlay.active{ animation:turn-on-visibility .25s both; visibility:visible; } .wp-lightbox-overlay.active img{ animation:turn-on-visibility .35s both; } .wp-lightbox-overlay.show-closing-animation:not(.active){ animation:turn-off-visibility .35s both; } .wp-lightbox-overlay.show-closing-animation:not(.active) img{ animation:turn-off-visibility .25s both; } @media (prefers-reduced-motion:no-preference){ .wp-lightbox-overlay.zoom.active{ animation:none; opacity:1; visibility:visible; } .wp-lightbox-overlay.zoom.active .lightbox-image-container{ animation:lightbox-zoom-in .4s; } .wp-lightbox-overlay.zoom.active .lightbox-image-container img{ animation:none; } .wp-lightbox-overlay.zoom.active .scrim{ animation:turn-on-visibility .4s forwards; } .wp-lightbox-overlay.zoom.show-closing-animation:not(.active){ animation:none; } .wp-lightbox-overlay.zoom.show-closing-animation:not(.active) .lightbox-image-container{ animation:lightbox-zoom-out .4s; } .wp-lightbox-overlay.zoom.show-closing-animation:not(.active) .lightbox-image-container img{ animation:none; } .wp-lightbox-overlay.zoom.show-closing-animation:not(.active) .scrim{ animation:turn-off-visibility .4s forwards; } } @keyframes show-content-image{ 0%{ visibility:hidden; } 99%{ visibility:hidden; } to{ visibility:visible; } } @keyframes turn-on-visibility{ 0%{ opacity:0; } to{ opacity:1; } } @keyframes turn-off-visibility{ 0%{ opacity:1; visibility:visible; } 99%{ opacity:0; visibility:visible; } to{ opacity:0; visibility:hidden; } } @keyframes lightbox-zoom-in{ 0%{ transform:translate(calc((-100vw + var(--wp--lightbox-scrollbar-width))/2 + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale)); } to{ transform:translate(-50%, -50%) scale(1); } } @keyframes lightbox-zoom-out{ 0%{ transform:translate(-50%, -50%) scale(1); visibility:visible; } 99%{ visibility:visible; } to{ transform:translate(calc((-100vw + var(--wp--lightbox-scrollbar-width))/2 + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale)); visibility:hidden; } }