I have a bunch of questions for you. I apologize in advanced if they seem like silly questions. I started to address some of your suggestions but thought it would be better if I fully understood where you were coming from.

Add margin to separate image with title

Could you explain this a bit. I didn’t realize they were not separate. Which image and which title are you referring too?

Use bootstrap grids to make your website more responsive

I used the columns in different parts of the page. Are the “columns” bootstrap grids? If so, are you suggesting to use it for the whole page? So sections that aren’t broken into columns would respond better on different devices? Is that the benefit?

Halfway through the page there is a massive white blank div (class - parralax2)

The page has 3 background (parralax) images. When you say there is a blank space is the image not loading and instead just comes up as white space? If that’s not it could you let me know which part you are talking about? I tried removing the paralax2 div but that just removes the 2nd image and combines the first and 2nd sections.

You shouldn’t rely on elements, you should use margin instead

Thanks. I changed the 's to margins. If a section is too small to fill a screen what can I use so that the screen will be filled in between images on all devices?
I am having a problem removing the 's after my Portfolio ID:

Without them, when you click “Portfolio” on the Navbar the Navbar hides the title. The 's fix that. I tried removing them and using margin-top and margin-bottom in the ID tag and I tried in the span tag. Neither worked. Any suggestions would be greatly appreciated.

Hi codemoneky
First of all, I would like to apologise for not being clear enough, I am usually struggling with putting words together, that’s why in fact I am here giving other campers feedback by helping them I am helping myself.

Anyway…

Add margin to separate image with title

What I mean by that is that in your projects section there is no padding/margin between the title and the image, here is an image which probably makes more sense than the sentence itself.

Text is literally touching image which makes it look ugly, here is a screenshot of how it should look like:

Use bootstrap grids to make your website more responsive

By grids I did mean rows with columns, ideally, you would want your whole page to be created with columns to make it as responsive as possible although it’s not necessary. For example, you could make your project section more responsive on smaller devices. Look at the image what it looks like:

I see you have used <div class="col-xs-6"> but that in fact splits those cards into two columns for devices with width smaller than 768px

Instead, you could use <div class="col-xs-12 col-md-6"> which would make your cards look the same on devices with larger width and on smaller devices it would take up the whole row so it would look like this