Media Query not working

I have a site I am building using the mobile first train of thought. I have finished all of the mobile CSS and have added some desktop CSS in a media query that is set to break at 985px. This is one of my problems; I originally had it set to break at 800px and when I tested it on my phone (IPhone 5S) the site was pulling up with the desktop version. I found the break point for it to not show the desktop (980px) by just changing it until it loaded correctly. Now that I have the break point fixed it is bugging me that everything is so small just like if I was looking at a non-responsive site. I have used % for all widths until the desktop CSS is brought in (which is not when looking at it on mobile) and it seems like the phone is opening the site as if it has a resolution of 980px, but it shouldn't and it should be around 400ish. I have no idea what is happening and would love help with figuring this out.

The site in question is www.helpmetietheknot.com which is to invite/announce my half of my wedding party once I finish it.