I have tried following the demo but my header, navigation bar and figure caoptions are all offset from each other....

You need to upload your page on your server so that people can see it in action what the problem is. All you have done is post some codes here and expect people to look at it and tell you what is wrong with it. It doesn't work like that my friend. People need to see the page and they can get the code from your page itself.

Effectively what nancy is saying to you is to validate your HTML because it is wrong in many respects. for example you have duplicaste body tag as pointed out by Nancy but also, your footer appears outside the body tag.

Once you have correct html structure, you will find that most of your CSS codes will start working and then finding the errors would be very simple.

I have made all of the suggested changes however I am not unable to see my logo and I feel my page is too large. I understand about the images however in regards to the basic format of the page is there something else missing which is stopping me from being able to see my logo and/or putting everything in a box and aligning them up?