mobile device, remove sidebar cutting into content

I am using the travelify theme, and my site is donalsmountainwalks.co.uk
I have noticed that on my smart phone (full site view) the primary column has narrowed to about 3/4 of the screen with the right sidebar cutting into the main content.
On advice I inserted the following, which helped in landscape view but in portrait view the sidebar is still cutting into the main content.

@media only screen and (max-width: 789px) {
#secondary aside { margin-left: 68%; clear: none; }
#secondary aside div { clear: none; }
}

Ideally for smaller devices, what I think would be best would be to have it as it was originally with the primary column and no sidebar (both for portrait and landscape), with all the widgets positioned below - not sure how easy that is to do but any more advice would be greatly appreciated.

By the way, the gallery page (which always had a 1 column format with have a sidebar) is fine, if that makes it any easier to pinpoint the source of the problem.

For your information, in case anyone happens to have this problem in the future I have managed to sort out the problem by inserting

.hgroup-right .social-icons {
display: _none;
}

into the css.
Totally unintended - but it worked. All the widgets on right sidebar desktop view are now below the primary column when viewed on media device.
Thanks