Why does my site render properly on desktop browsers but not on mobile devices? [on hold]

So I've just build a very very simple placeholder site. It renders fine on desktop browsers and the javascript that detects window resizing adjusts the background image, text etc. However when I view it on any mobile device it looks like poo. Here is a link to an image summarizing the side-by-side comparison.

I'm a student studying Mobile Application Development at Uni so forgive the very amateurish question. I've been playing around with Ghostery but am still having troubles.

EDIT: Hi all: I apologize for the way I've framed the question. I didn't intend to violate TOS or general best-practice guidelines. This is the first time I've used stackoverflow for a personal query, and as you can tell: I'm a noob. If I reproduce my issue in something like codepen is that OK to post?