get background to respong to larger screen

The div .content-area (the background) is set to 750px but the div with the text (.container) is set to 1170px.
You should adjust both to each other.

You should have a look at the theme documentation. You should use the custom widgets on a front page setup only. Like Julian says above, you’re trying to use a widget that has a width of 1170px (like all custom FP have) on a smaller width.

Not sure what you mean about the first part.

thanks julian and vladff, I didn’t realise FP was only for the ‘front page’ – I just thought it was their catchy title for a plugin name!

Should I avoid using FP on all of the other pages ?

and, does anyone know if resetting the div container will interfere with the responsiveness of the content? I will try it anyway

I cant find the div content area in firebug, I can only see ‘panel grid’ ; here is the css

.panel-grid {
}
.panel-grid:before {
content: “”;
display: block;
}
.panel-grid:after {
clear: both;
content: “”;
display: table;
}
.panel-grid-cell {
box-sizing: border-box;
min-height: 1em;
padding: 0 17px;
}
.panel-grid-cell .panel {
min-height: 1em;
}
.panel-grid-cell .panel:before {
content: “”;
display: block;
}
.panel-grid-cell .panel:after {
clear: both;
content: “”;
display: table;
}
.panel-grid-cell .panel.panel-last-child {
margin-bottom: 0;
}
.panel-grid-cell .widget-title {
margin-top: 0;
}