Section 1 : Welcome, Welcome, Welcome
Lecture 1 Welcome to the Most Advanced CSS Course Ever! c 00:03:44 Duration
Lecture 2 READ BEFORE YOU START
Lecture 3 Setting up Our Tools 00:02:30 Duration

Section 2 : Natours Project — Setup and First Steps (Part 1)
Lecture 1 Section Intro 00:00:35 Duration
Lecture 2 Project Overview 00:05:24 Duration
Lecture 3 Building the Header - Part 1 00:24:05 Duration
Lecture 4 Building the Header - Part 2 00:16:55 Duration
Lecture 5 Creating Cool CSS Animations 00:19:02 Duration
Lecture 6 Building a Complex Animated Button - Part 1 00:15:40 Duration
Lecture 7 Building a Complex Animated Button - Part 2 00:12:34 Duration

Section 3 : How CSS Works A Look Behind the Scenes
Lecture 1 Section Intro 00:01:22 Duration
Lecture 2 Three Pillars of Writing Good HTML and CSS (Ne 00:03:41 Duration
Lecture 3 How CSS Works Behind the Scenes An Overview. 00:03:25 Duration
Lecture 4 How CSS is Parsed, Part 1 The Cascade and 00:12:07 Duration
Lecture 5 Specificity in Practice 00:05:26 Duration
Lecture 6 How CSS is Parsed, Part 2 Value Processing 00:15:05 Duration
Lecture 7 How CSS is Parsed, Part 3 Inheritance 00:03:42 Duration
Lecture 8 Converting px to rem An Effective Workflow 00:13:41 Duration
Lecture 9 How CSS Renders a Website The Visual Formatting M 00:12:22 Duration
Lecture 10 CSS Architecture, Components and BEM.
Lecture 11 Implementing BEM in the Natours Project 00:04:48 Duration

Section 4 : Introduction to Sass and NPM
Lecture 1 Section Intro 00:00:53 Duration
Lecture 2 What is Sass 00:04:32 Duration
Lecture 3 First Steps with Sass Variables and Nesting 00:24:50 Duration
Lecture 4 First Steps with Sass Mixins, Extends and Function 00:16:45 Duration
Lecture 5 A Brief Introduction to the Command Line 00:10:02 Duration
Lecture 6 NPM Packages Let's Install Sass Locally 00:13:09 Duration
Lecture 7 NPM Scripts Let's Write and Compile Sass Locally 00:12:52 Duration
Lecture 8 The Easiest Way of Automatically Reloading a Page 00:05:50 Duration

Section 5 : Natours Project — Using Advanced CSS and Sass (Part 2
Lecture 1 Section Intro 00:00:43 Duration
Lecture 2 Converting Our CSS Code to Sass Variables and Nes 00:10:56 Duration
Lecture 3 Implementing the 7-1 CSS Architecture with Sass 00:17:09 Duration
Lecture 4 Review Basic Principles of Responsive Design and L 00:04:01 Duration
Lecture 5 Building a Custom Grid with Floats 00:36:42 Duration
Lecture 6 Building the About Section - Part 1 00:23:04 Duration
Lecture 7 Building the About Section - Part 2 00:21:37 Duration
Lecture 8 Building the About Section - Part 3 00:17:17 Duration
Lecture 9 Building the Features Section 00:30:06 Duration
Lecture 10 Building the Tours Section - Part 1 00:25:03 Duration
Lecture 11 Building the Tours Section - Part 1 00:25:03 Duration
Lecture 12 Building the Tours Section - Part 2 00:30:51 Duration
Lecture 13 Building the Tours Section - Part 3 00:16:23 Duration
Lecture 14 Building the Stories Section - Part 1 00:19:23 Duration
Lecture 15 Building the Stories Section - Part 2 00:13:57 Duration
Lecture 16 Building the Stories Section - Part 3 00:13:42 Duration
Lecture 17 Building the Booking Section - Part 1 00:17:48 Duration
Lecture 18 Building the Booking Section - Part 2 00:18:27 Duration
Lecture 19 Building the Booking Section - Part 3 00:22:53 Duration
Lecture 20 Building the Footer
Lecture 21 Building the Navigation - Part 1
Lecture 22 Building the Navigation - Part 2 00:12:53 Duration
Lecture 23 Building the Navigation - Part 3 00:15:17 Duration
Lecture 24 Building a Pure CSS Popup - Part 1 00:24:57 Duration
Lecture 25 Building a Pure CSS Popup - Part 2 00:16:39 Duration

Section 6 : Natours Project — Advanced Responsive Design (Part 3
Lecture 1 Section Intro 00:00:50 Duration
Lecture 2 Mobile-First vs Desktop-First and Breakpoints 00:17:07 Duration
Lecture 3 Let's Use the Power of Sass Mixins to Write Media 00:27:48 Duration
Lecture 4 Writing Media Queries - Base, Typography and Layou 00:26:21 Duration
Lecture 5 Writing Media Queries - Layout, About and Features 00:12:17 Duration
Lecture 6 Writing Media Queries - Tours, Stories and Booking 00:20:08 Duration
Lecture 7 An Overview of Responsive Images 00:05:11 Duration
Lecture 8 Responsive Images in HTML - Art Direction and Dens 00:09:59 Duration
Lecture 9 Responsive Images in HTML - Density and Resolutio 00:17:06 Duration
Lecture 10 Responsive Images in CSS 00:11:28 Duration
Lecture 11 Testing for Browser Support with @supports
Lecture 12 Wrapping up the Natours Project Final Consideratio 00:13:37 Duration

Section 7 : Trillo Project — Master Flexbox
Lecture 1 Section Intro 00:00:54 Duration
Lecture 2 Why Flexbox An Overview of the Philosophy Behind 00:06:11 Duration
Lecture 3 A Basic Intro to Flexbox The Flex Container 00:14:53 Duration
Lecture 4 A Basic Intro to Flexbox Flex Items 00:10:13 Duration
Lecture 5 A Basic Intro to Flexbox Adding More Flex Items 00:05:57 Duration
Lecture 6 Project Overview 00:06:59 Duration
Lecture 7 Defining Project Settings and Custom Properties 00:13:25 Duration
Lecture 8 Building the Overall Layout 00:11:46 Duration
Lecture 9 Building the Header - Part 1 00:17:36 Duration
Lecture 10 Building the Header - Part 2 00:14:35 Duration
Lecture 11 Building the Header - Part 3 00:12:12 Duration
Lecture 12 Building the Navigation - Part 1 00:11:21 Duration
Lecture 13 Building the Navigation - Part 2 00:16:28 Duration
Lecture 14 Building the Hotel Overview - Part 1 00:15:04 Duration
Lecture 15 Building the Hotel Overview - Part 2 00:15:12 Duration
Lecture 16 Building the Description Section - Part 1 00:12:39 Duration
Lecture 17 Building the Description Section - Part 2 00:19:25 Duration
Lecture 18 Building the User Reviews Section 00:22:34 Duration
Lecture 19 Building the CTA Section 00:16:39 Duration
Lecture 20 Writing Media Queries - Part 1 00:18:46 Duration
Lecture 21 Writing Media Queries - Part 2 00:16:01 Duration
Lecture 22 Wrapping up the Trillo Project Final Considerati 00:14:26 Duration

Section 8 : A Quick Introduction to CSS Grid Layouts
Lecture 1 Section Intro 00:00:49 Duration
Lecture 2 Why CSS Grid A Whole New Mindset 00:04:56 Duration
Lecture 3 Quick Setup for This Section 00:01:35 Duration
Lecture 4 Creating Our First Grid 00:11:52 Duration
Lecture 5 . Getting Familiar with the fr Unit
Lecture 6 Positioning Grid Items 00:07:11 Duration
Lecture 7 Spanning Grid Items 00:09:28 Duration
Lecture 8 Grid Challenge 00:02:29 Duration
Lecture 9 Grid Challenge A Basic Solution 00:10:39 Duration
Lecture 10 Naming Grid Lines 00:09:18 Duration
Lecture 11 Naming Grid Areas 00:10:40 Duration
Lecture 12 Implicit Grids vs. Explicit Grids 00:10:19 Duration
Lecture 13 Aligning Grid Items 00:09:40 Duration
Lecture 14 Aligning Tracks 00:12:31 Duration
Lecture 15 Using min-content, max-content and the minmax() fu 00:15:52 Duration
Lecture 16 Responsive Layouts with auto-fit and auto-fill. 00:10:33 Duration

Section 9 : Nexter Project — Master CSS Grid Layouts
Lecture 1 Project Overview and Setup 00:11:06 Duration
Lecture 2 Building the Overall Layout - Part 1 00:15:20 Duration
Lecture 3 Building the Overall Layout - Part 2 00:24:12 Duration
Lecture 4 Building the Features Section - Part 1 00:20:09 Duration
Lecture 5 Building the Features Section - Part 2 00:20:09 Duration
Lecture 6 Building the Story Section - Part 1 copy 00:17:45 Duration
Lecture 7 Building the Story Section - Part 2 00:11:24 Duration
Lecture 8 Building the Homes Section - Part 1 00:15:22 Duration
Lecture 9 Building the Homes Section - Part 2 00:18:37 Duration
Lecture 10 Building the Gallery - Part 1 00:14:56 Duration
Lecture 11 Building the Gallery - Part 2 00:12:15 Duration
Lecture 12 Building the Footer 00:12:17 Duration
Lecture 13 Building the Sidebar 00:04:54 Duration
Lecture 14 Building the Header - Part 1 00:16:01 Duration
Lecture 15 Building the Header - Part 2 00:09:39 Duration
Lecture 16 Building the Realtors Section copy 00:11:01 Duration
Lecture 17 Writing Media Queries - Part 1 00:16:48 Duration
Lecture 18 Writing Media Queries - Part 2 00:18:05 Duration
Lecture 19 Browser Support for CSS Grid 00:08:11 Duration
Lecture 20 Wrapping up the Nexter Project Final Consideratio 00:06:30 Duration

Section 10 : That's It, Everyone
Lecture 1 See You Next Time, CSS Master 00:01:41 Duration
Lecture 2 My Other Courses + Updates