Question 1

Images

Accepted Answer

.wp-popup-gallery{ display:grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap:14px; margin:20px 0; } .wp-popup-gallery a{ display:block; border-radius:14px; overflow:hidden; padding:6px; background:#fff; box-shadow:0 4px 12px rgba(0,0,0,0.10); } .wp-popup-gallery img{ width:100%; height:auto; /* ✅ FIX: no cut issue */ aspect-ratio: 4 / 3; /* ✅ FIX: better mobile view */ object-fit: cover; border-radius:12px; transition:0.3s; display:block; } .wp-popup-gallery img:hover{ transform:scale(1.04); } /* ✅ Mobile improvements */ @media(max-width:600px){ .wp-popup-gallery{ grid-template-columns: repeat(2, 1fr); } .wp-popup-gallery img{ aspect-ratio: 1 / 1; /* ✅ square on mobile */ } }

Question 2

Videos

Accepted Answer

.wp-video-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin: 20px 0; } .wp-video-card { position: relative; border-radius: 16px; overflow: hidden; cursor: pointer; box-shadow: 0 6px 18px rgba(0,0,0,0.12); background: #000; transition: 0.3s ease; } .wp-video-card:hover { transform: translateY(-3px); } .wp-video-thumb { width: 100%; height: 220px; object-fit: cover; display: block; opacity: 0.95; } /* Play Button */ .wp-play-btn { position: absolute; inset: 0; display: grid; place-items: center; } .wp-play-btn span { width: 64px; height: 64px; border-radius: 50%; background: rgba(0,0,0,0.55); display: grid; place-items: center; border: 2px solid rgba(255,255,255,0.6); } .wp-play-btn span:before { content: ""; display: block; width: 0; height: 0; margin-left: 4px; border-left: 18px solid #fff; border-top: 12px solid transparent; border-bottom: 12px solid transparent; } /* LIGHTBOX */ .wp-video-lightbox { position: fixed; inset: 0; background: rgba(0,0,0,0.8); display: none; align-items: center; justify-content: center; padding: 16px; z-index: 99999; } .wp-video-lightbox.active { display: flex; } .wp-video-modal { width: min(900px, 95vw); background: #000; border-radius: 16px; overflow: hidden; position: relative; } .wp-video-frame { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; } .wp-close-btn { position: absolute; top: 10px; right: 10px; background: rgba(0,0,0,0.65); color: #fff; border: 1px solid rgba(255,255,255,0.3); border-radius: 10px; padding: 8px 12px; cursor: pointer; font-size: 14px; }

function openVideoLightbox(videoId){ const lightbox = document.getElementById("wpVideoLightbox"); const frame = document.getElementById("wpVideoFrame"); frame.src = "https://www.youtube.com/embed/" + videoId + "?autoplay=1"; lightbox.classList.add("active"); } function closeVideoLightbox(){ const lightbox = document.getElementById("wpVideoLightbox"); const frame = document.getElementById("wpVideoFrame"); frame.src = ""; // ✅ Stop video lightbox.classList.remove("active"); }

© Copyright 2024 Vimansa Medication.All Rights Reserved

Gallery

Capturing Moments of Tranquility and Insight

Playlist

Vimansa meditation center

Sample Video

Vimansa meditation center

Gallery Item Name

Gallery Item Name

Gallery Item Name

Gallery Item Name

Gallery Item Name

About Vimansa Meditation

Get In Touch!

gallery