В качестве заготовки и подсказки можно использовать следующую подборку значений функции media screens, которая позволит адаптировать ваш сайт для мобильных устройств.

<style type="text/css">
/* monitors and laptops */
@media screen and (min-width: 1240px)  {}
 
/* tablet */
@media screen and (min-width: 1024px) and (max-width: 1240px)  {}
 
@media screen and (min-width: 768px) and (max-width: 1024px) {}
 
/* mobile */
@media screen and (max-width: 768px) {}
 
/* iPad in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  {}
 
/* iPad in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (orientation : landscape) {}
 
/* iPad in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (orientation : portrait) {}
 
/* Retina iPad in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (-webkit-min-device-pixel-ratio: 2) {}
 
/* Retina iPad in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 2) {}
 
/* Retina iPad in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (orientation : portrait) and (-webkit-min-device-pixel-ratio: 2) {}
 
/* iPad 1 & 2 in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (-webkit-min-device-pixel-ratio: 1){}
 
/* iPad 1 & 2 in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (orientation : landscape) and (-webkit-min-device-pixel-ratio: 1)  {}
 
/* iPad 1 & 2 in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (orientation : portrait) and (-webkit-min-device-pixel-ratio: 1) {}
 
/* iPad mini in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (-webkit-min-device-pixel-ratio: 1)  {}
 
/* iPad mini in landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (orientation : landscape) and (-webkit-min-device-pixel-ratio: 1)  {}
 
/* iPad mini in portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and
    (orientation : portrait) and (-webkit-min-device-pixel-ratio: 1)  {}
 
/* iPhone 5 in portrait & landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) {}
 
/* iPhone 5 in landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and
    (orientation : landscape) {}
 
/* iPhone 5 in portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and
    (orientation : portrait) {}
 
/* iPhone 2G-4S in portrait & landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {}
 
/* iPhone 2G-4S in landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and
    (orientation : landscape) {}
 
/* iPhone 2G-4S in portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and
    (orientation : portrait) {}
</style>