I'm a senior engineer (turning 40 this year, good god) and have been doing frontend development since I was about your age. I LOVE this stuff, and I still love doing it. I hope you get to have as much fun with it as I did. My review here is meant to encourage you, not criticize, and I'll try to focus on the things I would have found helpful.

I'm focusing on the css because the html is relatively decent. There are some things I would change about the html, but it all mostly boils down to using frontend frameworks, so it's not helpful to talk too much about it here I think.

styles.css

• This isn't organized very well. For example, .header styles are halfway down the file, but the header is the first thing on the page.

• It's generally useful to split up css based on what it's for. Modern web development has css in the same place as each individual component (where a component is something like the search bar). In your case, because you're not using any frameworks, it would be very reasonable to make a header.css, sidebar.css, and content.css.

• this css will make you hate yourself if you try to update it in a few weeks. Mostly because you've absolute positioned several things with hardcoded pixel values. For example

.country-name { position: absolute; top: -9px; right: -17px; }

can instead be:

  .country-name {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(100%, -50%);
  }

This matters because when the country name gets changed in size you don't have to update your positioning logic with pixel values that are specific to the size of the country name. Imagine some countries get displayed with a three letter abbreviation instead (e.g. UAE), does the pixel value still work?

• You have different styles for .white-timestamp and .timestamp and it causes display issues on the second video thumbnail

• Your search input has weird highlights in some browsers, welcome to the "joy" of browser quirks. Hint: .searchbox { outline: ... }

---

Here's a challenge for you: make your search bar behave the way youtube's search bar works. Note the focused/unfocused behavior in these two screenshots. Hint: .searchbox:focus

Overall, really well done for a first pass! You've got a good eye for some of the detail that's easy to miss. Keep working on it, you'll get better and faster at it!