Hi,
If you refer to your previous thread you will see that I pointed out the biggest error in your code.
You have made the same mistake again 
You simply cannot use relative positioning in that manner. It is not meant for that at all. The biggest problem is that you don’t seem to know how align blocks horizontally so instead you move them left and drag them up with relative positioning. This is not a workable method.
CSS has many ways of aligning blocks of content horizontally and flexbox is the easiest (previously you could have used the display:table properties or even floats). I would suggest that you take some time to learn a little flexbox and learn how to align blocks of content horizontally.
You seem to be applying widths and heights again to things that don’t need them so please read the comments in the other thread.
When I look at your page on my 1920px monitor I just see a jumble of overlapping elements. Nothing seems to fit or match up. There is no structure in your html with disparate elements just flung about willy nilly and then pushed into awkward positions.
I have no idea what those coloured triangles are doing as they are all over the place. I’m guessing you designed everything to fit your small monitor but you are the only one who has that monitor
I also see you have disabled the horizontal x-scrollbar on the viewport to hide the fact that your design has created a massive horizontal scroll. In turn this has created 2 vertical scrollbars. This is again unworkable and bad practice. The problem is solely because you have used relative positioning to move hundred percent width elements some distance to the left making them poke miles out of the viewport. This is another reason why you should avoid relative positioning in that manner.
Usually I would offer some code to help but without a complete re-write again there’s little I can do to fix this. I think it perhaps better if we start again from scratch and we help you at each step rather than you presenting a ‘fait accompli’.
Do you have a design mockup of the look you are going for so we can see how it is supposed to look? This is what I see on my computer:
At smaller widths the 2 columns all overlap from the other sections.
Start simply and leave the bells and whistles to later. Get the structure right using semantic html elements. I can’t work out what those diamond shape elements are supposed to look like and adding each one as a div that is relatively placed is an absolute nightmare. If they are just meant to be borders then maybe a repeating background (or border-image) would suffice. I couldn’t see any logic to them.
Why are there lines going through the headings?
Lastly on mobile it is a complete disaster although I guess you haven’t thought about that yet but it needs to be built into the design process from the beginning.
I suggest we start again from the top and begin with the first blue section and the about us section only and code those properly. I’m assuming the whole page blue background is going to be a nice image of sorts as it looks very odd as just a blue background? (unless that’s some arty design concept you wanted to implement of course.)
Sorry to sound so negative but I’m just listing things that need to be addressed As I said before these are all common beginner mistakes and nothing we all haven’t done at some time. However there has to be a learning curve and correct approaches need to be taken in order to get the results you want.
