Center is not Center on Responsive Site

Center is not Center on Responsive Site

I truly apologize if any of these questions (there's a main one, then one
other that is less important) are absolute idiot questions, but I must
admit they have me stumped, so I do appreciate any help that I can get.
First off, here's my site: "Narnia Greenville".
The question is this: The timeline (named thermometer.png) is off center,
although I have followed all the options from here:
"http://css-tricks.com/snippets/css/absolute-center-vertical-horizontal-an-image/",
as well as from several other sites. Plus, if you re-size your window, it
appears to jump from the right to the left at a certain point for no
apparent reason. I can't figure it out, and the last time I attempted a
site like this (I failed miserably) I encountered this same type of
problem. I'm sure the issue should be staring me in the face (and probably
laughing at me), but I can't see it for the life of me. The goal is to get
"thermometer.png" centered both horizontally and vertically on the page,
and on top of all the other images.
Next: The images are HUGE! And take FOREVER to load, so if you're on a
limited internet connection, I suggest moving on to someone else's
question. I'm working on that. As I'm sure you can tell, I'm new to most
of this. (I've been "rebuilding" wordpress themes for most of my limited
web-design experience, and none of it includes this kind of thing. It just
works... LoL.) So anyways, although not a specific question, if you feel
like documenting how you cut down on image loading time, please feel free
to.
Many thanks to anyone who is willing to help me. And again, I apologize if
either of these is stupid question. LoL.