Photo Gallery

Gallery

Home /Image Gallery

Abhyass Classes And Inspiration

Explore our photo gallery, where hard work and guidance come together to bring dreams to life. This collection preserves the inspirational memories of our students, teachers, and successful events. Celebrate the memorable journey and past achievements that have made Abhyass Classes synonymous with excellence.

/* 🌟 Premium 3D Rotating Gallery (Responsive + Mobile Fixed) */ .gallery3d-container { perspective: 1200px; width: 100%; height: 750px; display: flex; justify-content: center; align-items: center; background: radial-gradient(circle at center, #0a0a0a, #000); overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px rgba(255, 150, 0, 0.3); position: relative; } .gallery3d { position: relative; width: 280px; height: 420px; transform-style: preserve-3d; animation: spin 160s infinite linear; transition: animation-play-state 0.3s; } /* 🖱️ Pause only on desktops */ @media (hover: hover) { .gallery3d-container:hover .gallery3d { animation-play-state: paused; } } .gallery3d img { position: absolute; width: 320px; height: 400px; left: -20px; top: 10px; border-radius: 15px; border: 3px solid rgba(255, 255, 255, 0.15); background: linear-gradient(45deg, #ff004f, #ffa200); padding: 4px; box-shadow: 0 0 30px rgba(255, 150, 0, 0.5); object-fit: cover; transition: transform 0.5s, box-shadow 0.5s; cursor: pointer; } .gallery3d img:hover { transform: scale(1.08); box-shadow: 0 0 60px rgba(255, 180, 0, 0.8); } /* 🔄 8 images evenly spaced (360°/8 = 45°) */ .gallery3d img:nth-child(1) { transform: rotateY(0deg) translateZ(380px); } .gallery3d img:nth-child(2) { transform: rotateY(45deg) translateZ(380px); } .gallery3d img:nth-child(3) { transform: rotateY(90deg) translateZ(380px); } .gallery3d img:nth-child(4) { transform: rotateY(135deg) translateZ(380px); } .gallery3d img:nth-child(5) { transform: rotateY(180deg) translateZ(380px); } .gallery3d img:nth-child(6) { transform: rotateY(225deg) translateZ(380px); } .gallery3d img:nth-child(7) { transform: rotateY(270deg) translateZ(380px); } .gallery3d img:nth-child(8) { transform: rotateY(315deg) translateZ(380px); } @keyframes spin { from { transform: rotateY(0deg); } to { transform: rotateY(360deg); } } /* 🪟 Lightbox Styling */ .lightbox { display: none; position: fixed; z-index: 9999; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.9); justify-content: center; align-items: center; } .lightbox img { max-width: 90%; max-height: 90%; border-radius: 10px; box-shadow: 0 0 40px rgba(255, 255, 255, 0.3); } .lightbox.active { display: flex; } /* 📱 Mobile Responsive Adjustments */ @media (max-width: 768px) { .gallery3d-container { height: 420px; perspective: 800px; } .gallery3d { width: 160px; height: 250px; } .gallery3d img { width: 180px; height: 220px; left: 0; top: 15px; padding: 2px; border-width: 2px; } /* Mobile पर translateZ कम ताकि gallery पूरी दिखे */ .gallery3d img:nth-child(1) { transform: rotateY(0deg) translateZ(220px); } .gallery3d img:nth-child(2) { transform: rotateY(45deg) translateZ(220px); } .gallery3d img:nth-child(3) { transform: rotateY(90deg) translateZ(220px); } .gallery3d img:nth-child(4) { transform: rotateY(135deg) translateZ(220px); } .gallery3d img:nth-child(5) { transform: rotateY(180deg) translateZ(220px); } .gallery3d img:nth-child(6) { transform: rotateY(225deg) translateZ(220px); } .gallery3d img:nth-child(7) { transform: rotateY(270deg) translateZ(220px); } .gallery3d img:nth-child(8) { transform: rotateY(315deg) translateZ(220px); } }