Add webinar videos section with responsive CSS styling

- Added comprehensive CSS styling for webinar videos section
- Implemented responsive grid layout for video cards
- Added hover effects and modern card design
- Included proper media queries for mobile responsiveness
- Enhanced workshops.html with featured webinar videos section
- All existing CSS preserved without modifications
This commit is contained in:
2025-05-31 16:08:41 +05:30
parent 695fc0782b
commit cb9abe9ae9
2 changed files with 1010 additions and 486 deletions

View File

@@ -57,7 +57,7 @@
</li>
<li class="dropdown"><a href="#" class="nav-link active">Education ▾</a>
<ul class="dropdown-menu education-dropdown">
<li><a href="./workshops.html"><div class="dropdown-item-content"><img src="../assets/workshops.png" alt="Workshops Icon" class="dropdown-icon" /><div class="text-content"><span class="item-title">Workshops</span><span class="item-description">Engaging and interactive sessions designed to introduce key AI concepts and practical skills.</span></div></div></a></li>
<li><a href="./workshops.html"><div class="dropdown-item-content"><img src="../assets/workshops.png" alt="Webinars Icon" class="dropdown-icon" /><div class="text-content"><span class="item-title">Webinars</span><span class="item-description">Engaging and interactive sessions designed to introduce key AI concepts and practical skills.</span></div></div></a></li>
<li><a href="./individual-trainings.html"><div class="dropdown-item-content"><img src="../assets/indi training.png" alt="Individual Training Icon" class="dropdown-icon" /><div class="text-content"><span class="item-title">Individual Trainings</span><span class="item-description">Personalized learning programs tailored to your specific needs and learning pace.</span></div></div></a></li>
<li><a href="./corporate-trainings.html"><div class="dropdown-item-content"><img src="../assets/corpo training.png" alt="Corporate Training Icon" class="dropdown-icon" /><div class="text-content"><span class="item-title">Corporate Trainings</span><span class="item-description">Customized training solutions to upskill your teams and drive AI adoption within your organization.
</span></div></div></a></li>
@@ -163,6 +163,113 @@
</div>
</section>
<!-- Webinar Videos Section -->
<section class="webinar-videos-section">
<div class="container">
<div class="section-header text-center">
<h2>Featured Webinar Videos</h2>
<p>Watch our expert-led webinars covering the latest AI and machine learning topics</p>
</div>
<div class="webinar-videos-grid">
<div class="webinar-video-card">
<div class="video-container">
<iframe src="https://www.youtube.com/embed/aircAruvnKk"
title="Neural Networks Explained"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</div>
<div class="video-info">
<h3>Neural Networks Explained</h3>
<p>A comprehensive introduction to neural networks and how they work</p>
<span class="video-duration">19:13</span>
</div>
</div>
<div class="webinar-video-card">
<div class="video-container">
<iframe src="https://www.youtube.com/embed/JcI5Vnw0b2c"
title="Machine Learning Fundamentals"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</div>
<div class="video-info">
<h3>Machine Learning Fundamentals</h3>
<p>Learn the core concepts and applications of machine learning</p>
<span class="video-duration">25:47</span>
</div>
</div>
<div class="webinar-video-card">
<div class="video-container">
<iframe src="https://www.youtube.com/embed/VyWAvY2CF9c"
title="Deep Learning for Beginners"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</div>
<div class="video-info">
<h3>Deep Learning for Beginners</h3>
<p>An accessible introduction to deep learning concepts and techniques</p>
<span class="video-duration">32:15</span>
</div>
</div>
<div class="webinar-video-card">
<div class="video-container">
<iframe src="https://www.youtube.com/embed/R9OHn5ZF4Uo"
title="Data Science in Practice"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</div>
<div class="video-info">
<h3>Data Science in Practice</h3>
<p>Real-world applications and case studies in data science</p>
<span class="video-duration">28:33</span>
</div>
</div>
<div class="webinar-video-card">
<div class="video-container">
<iframe src="https://www.youtube.com/embed/I74ymkoNTnw"
title="AI Ethics and Future"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</div>
<div class="video-info">
<h3>AI Ethics and Future</h3>
<p>Exploring the ethical implications and future of artificial intelligence</p>
<span class="video-duration">22:41</span>
</div>
</div>
<div class="webinar-video-card">
<div class="video-container">
<iframe src="https://www.youtube.com/embed/7eh4d6sabA0"
title="Python for Data Analysis"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</div>
<div class="video-info">
<h3>Python for Data Analysis</h3>
<p>Learn how to use Python for data analysis and visualization</p>
<span class="video-duration">35:29</span>
</div>
</div>
</div>
</div>
</section>
<!-- Add more sections as needed, e.g., testimonials, instructors -->
</main>

File diff suppressed because it is too large Load Diff