Grafika nie działa dlatego, że atrybut src zdjęć jest zdefiniowany jako ścieżka do lokalnych plików. Jeżeli umieszczasz stronę na CodePen i chcesz wrzucić swoje zdjęcia wykorzystaj jakiś hosting zdjęć, np. Cloudinary. Rozmiar napisów jest zdecydowanie za duży, a stronie brakuje poczucia odrobiny profesjonalizmu.
Co do kodu, sandboxy takie jak CodePen nie nadają się do pisania kodu (sam nie raz próbowałem pisać ale jest to strasznie niewygodne). Ściągnij sobie Notepad++ i tam pisz. Używaj wcięć w kodzie HTML, najlepiej gdy zagnieżdżasz element wewnątrz innego użyj jednego tabulatora o szerokości czterech spacji.
<html>
<head>
...
</head>
<body>
...
</body>
</html>
Znacznie poprawi to czytelność kodu i ułatwi zrozumienie struktury kodu. Pamiętaj, że kodu nie pisze się tylko dla samego siebie. Prędzej czy później przyjdzie czas kiedy ktoś inny będzie musiał przejrzeć Twój kod lub coś w nim zmienić więc nie utrudniaj tego zadania innym.
Tak samo z kodem CSS, używaj wcięć pomiędzy klamrami, aby właściwości były zagnieżdżone wewnątrz swoich klas. Dobrą praktyką jest unikanie używania id do stylowania elementów. Konwencja mówi, że powinno używać się atrybutu class do nadawania wyglądu elementom, a id wykorzystywać jedynie w kodzie JS. Dlaczego? Każdy selektor w CSS ma ustalony priorytet, im bardziej dokładny selektor tym bardziej nadpisuje ogólny styl elementu. Nadanie stylu poprzez id może powodować nieoczekiwane zachowanie gdy robi to osoba niedoświadczona.
Staraj się używać czystego JavaScriptu do prostych funkcjonalności. Owszem bardzo możliwe, że spędzisz więcej czasu niż używając gotowych rozwiązań z jQuery, ale nauka czystego JavaScriptu zaowocuje w przyszłości. Z własnego doświadczenia mogę Ci powiedzieć, że ja z lenistwa ominąłem JavaScript i korzystałem z jQuery bo było mi "wygodniej i łatwiej". W rezultacie gdy miałem zrobić cokolwiek bez użycia jQuery nie potrafiłem tego wykonać. JavaScript przeszedł długą drogę i nie jest już tak trudno manipulować elementami jak kiedyś więc jQuery traci na znaczeniu. Owszem warto znać bibliotekę jQuery, ale niech to nie będzie Twoja główna umiejętność.
Nazewnictwo klas i zmiennych w CSS i JS, mieszasz nazwy angielskie z polskimi. Nie wiem czy wynika to z tego, że skopiowałeś czyjś kod i dopisałeś trochę swojego czy po prostu nie jesteś konsekwentny. Nie ma nic złego w wykorzystaniu czyjegoś kodu pod warunkiem, że rozumiesz co ten kod robi. Ogólnie przyjętym zwyczajem, również w Polsce jest nazewnictwo angielskie. Język angielski jest językiem informatyki, tak jak kiedyś językiem Europy była łacina więc znajomość języka to podstawa. W pracy często będziesz spotykał się z terminologią anglojęzyczną. Nawet może się zdarzyć, że ktoś z Twojego zespołu nie będzie mówił po polsku, albo, że szukając pomocy będziesz musiał udać się na zagraniczne fora. Tak więc unikaj nazewnictwa polskiego.
Ostatnia rada na koniec, nie przyjmuj krytyki tutaj jako atak personalny na Ciebie. Łatwo jest się zniechęcić bo ktoś skrytykował Twój wysiłek, ale każdy tutaj, a przynajmniej mamy taką nadzieje, ma dobre intencje i chce pomóc początkującemu koledze.
