Pagina no se adapta tamaño pantalla

[PROFETECNOLOGIA]

Buenos tardes. Mi consulta s la siguiente. Resulta que he creado dos hojas de estilo, una para PC y otra para móviles. Si la pantalla es menor de 480px se ve con una hoja de estilo y si es más grande con otra. En pantallas grandes todo correcto, pero cuando entro con un teléfono móvil veo la pagina en la pantalla mas grande que la pantalla del teléfono con lo que hay que desplazarse para verla entera.. Quiero que la pagina se vea del mismo tamaño que la pantalla (en este caso del teléfono móvil). La única forma que lo consigo es quitando el div contenedor del HTML, pero claro eso me perjudica en la vista para PC.

Tengo todo en % para que se adapte, pero no se cual puede ser el fallo.

Os dejo la página:

http://www.areaciencias.com/prueba.html

y Aquí el código para las dos css:

<link rel="stylesheet" type="text/css" href="http://www.areaciencias.com/css-base.css"/>
<link rel="stylesheet" type="text/css" media="screen and (max-device-width: 480px)" href="http://www.areaciencias.com/css-base-adaptable.css" />

Os agradecería mucho una pequeña ayuda o sugerencia. Gracias de antemano.