Help with the header and the footer

Hi

I am new here and I will start by saying that I am a completely noob when it comes to coding and stuffs like that. I have tried to make my theme a little bit wider and I managed that. Don't ask me how, I am surprised too. I have changed some things what I thought that it will make it wider and it was ok. I have managed to make the content 750px and the sidebar 300px

And here is the problem. After that, I have noticed that the header and the footer are messed up. Now they are starting from the left:

This is how it looks now :
tutorial-z.com

And this is how it should be (its a free theme and they don't offer support for the free themes) :
demo.mythemeshop.com/s/?theme=Playbook

As you can see, they should be at the limit with the content box. I am not a lazy person and I have searched on the web to find for solution. I have seen that might be a "float" problem. Sure, I have replaced with float : center , which later I have seen that such thing don't exist (don't laugh) .

Can somebody please help me? and if the answer will be YES, can you please use simple words and tell me where to put the codes ?
Here is the style.css file