Develop a MobileWeb website layout (html + css)

Looking to have developed the mobile web version of my website. It is currently under construction, but it can be seen at [login to view URL] I would like the same thing that you see on your desktop, but optimized for Android and iOS. The final result should work well on both Android and iOS with full screen. If needed it can/should be added zooming functionalities / navigation +- to facilitate user experience. Menu is two levels, first is Region (shown in orange) and then the sub-region (shown in yellow). Mobile website will load with one default region and sub-region, and user will be able to select / change region and sub-region on the menu. The timeline should have a javascript or similar solution, that will automatically move timeline between div's. Also div's should be highlighted when rolling horizontally, or whatever solution you suggest for best user experience. The charts in the bottom should change according to the timeline (also following the same concept on the website). It is fine to have one image on the screen at a time only, but with a swipe function to move between chart types (change between regional area or zoomed area, change from wave to wind to period etc). When user tap on the superior part of the image, should go back in time, and when user tap on the bottom part, should move forward. All navigation technology should be provided - it is part of this job, and should be developed by the developer. I will be responsible to insert the programming of the real data on the source code, I need only the HTML schema + css and any additional element / everything that was developed to create the full functionality. I will be the owner of the final result, developer will have to sign the freelancer NDA that I will submit.