The foreground images are created using that element that you called an image container. It is actually just a default image dummy, a replacement for the real image. Don't worry so much about the dimensions on those dummies, when you replace it with the real image, the image will display the shape of it. Just be aware, that images are initially given a max-width of 200px, so you need to change it to what you want to have.
I cannot stop thinking about the fact that your images, as background images don't get displayed. Have you checked if they actually get uploaded? And if the main.css gets uploaded? If you have a fresh upload now, could you post the URL, please?
Edit: I read you post again and found the address ammar-seer.com, so I opened it. It is the same as before, although the folder structure is now the way we prefer. But the result is exactly the same as before. I had a look at your main.css, it contains something that looks like the HTML for a 'Not found' page, the css styles which should have been there are non-existent.
I also tried to search for some of the images which you have in the 'images' folder, they are not there, the folder itself is also not there. Do compare it with what you have in the _exported folder on your machine, see if you actually have the images folder with the images, and open the main.css (in the css folder) and check what the contents of it is. This is what I find in your online main.css:
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<html><head>
<title>404 Not Found</title>
</head><body>
<h1>Not Found</h1>
<p>The requested URL was not found on this server.</p>
<p>Additionally, a 404 Not Found
error was encountered while trying to use an ErrorDocument to handle the request.</p>
</body></html>
and that is all wrong. I cannot post an attachment to this post, but I'll make another, showing what the main.css should be containing.