💻PLZ OPEN ON PC IF POSSIBLE !!

🔗link

https://ayushjava07.github.io/IDEATOON.ECELL/

E-Cell Event Landing Page

A mobile-friendly landing page for an entrepreneurship cell event, with animated features, countdown timer, and interactive areas.

Features

• Fully responsive design optimized for mobile (max-width: 480px)
• Interactive navigation menu with mobile-friendly toggle
• Animated countdown timer for event date
• Engaging content sections with 3D perspective effects
• FAQ section with toggle functionality
• Custom animations and hover effects
• Responsive image galleries and information cards

Technologies Used

Core Technologies

• HTML5: Semantic page structure
• CSS3: Styling and animation, including:
  • Flexbox for layout
  • CSS Transitions for interactive elements
  • Media Queries for responsive design
  • Custom animations (@keyframes)
  • 3D transforms (perspective, transform-style)

Design Elements

• Responsive Typography: Utilizing viewport units (vh, vw) for responsive text
• Interactive Components: Hover effects on buttons and cards
• Visual Effects:
• Text shadows
  • Box shadows
  • Border-radius for modern rounded corners
  • Background blends and overlays

Special Features

• Countdown Timer: JavaScript-driven event countdown
• FAQ Toggle System: Interactive question/answer components
• Mobile-First Approach: Primarily optimized for mobile display
• Performance Considerations: Optimized image rendering with object-fit

How to Use

1. Clone this repository
2. Open index.html in a web browser
3. The page is optimized to work best on mobile (width ≤ 480px)

Browser Support

The page is optimized for the latest versions of modern browsers such as:

• Chrome (latest)
• Firefox (latest)
• Safari (latest)
• Edge (latest)

Project Structure

The key elements are:

• Navigation bar with responsive toggle
• Hero section with countdown timer
• Event information cards with 3D effects
• Prize and rules sections
• FAQ accordion
• Footer with contact information

Customization

To customize this project:

1. Change the event date in the JavaScript for the countdown timer
2. Replace placeholder images in the /assets folder
3. Change colors in the CSS variables
4. Update content in the HTML files

License

This project is open-source and can be used for personal and educational purposes.