Well, the short answer would be to implement some "responsive design" principles.
This means the layout and content of your page needs to adapt and respond to changes in window size or device screen size, and enable you to display your website in a neat way on mobile.
I can't really give you a full lesson in responsive design (mainly because I don't know much about the technical side of it), but personally I think you should look at adapting your site for mobile viewers in 3 stages:
Optimize your content - you have a very nice website, but it's super busy with all sorts of things going on, and lots to read and see.
Even if you manage to squeeze everything into a 1136 x 640 pixel screen, it's just too much to take in. So work out what you need to keep, and what you can do without.
Flexible grids and media queries - Flexible grid structures are the basis of responsive design. If you're not using something like that already, it's time to look into it. There's plenty of reading you can do on the web (here and here for example), and if you can watch tutorials on Code Academy or Treehouse as well.
If you want a shortcut, you could always use an "out-of-the-box" template or theme.
Testing on different devices - Even when everything looks good when you're looking at your code, it's always important to test things out on a number of devices and browsers.
Remember, it's not just about switching from desktop to mobile - you have to worry about differences in screen size and display on all the different mobile devices too.
Although you want to appeal to everyone, it's often more sensible to focus on where your core market is going to be.
So maybe don't worry about outdated mobile devices or browsers that have a small market share initially.
Testing and retesting is the best way to make sure you've implemented everything properly, and it also allows you a window into the user's perspective that is very valuable when you're spending hours looking at code.