There is three options:
1. Enable "Responsive" (CSS or Javascript) feature in theme settings.
2. Use imported theme
http://www.joomlaboat.com/index.php?option=com_extrasearch&view=details&listing_id=13&Itemid=662&establename=themes
3. Use one Theme for PC and another for small Mobile devices (not iPad as it's screen big enough to show normal version of the website).
Advanced:
Place the code below (disable responsive feature first) to Head Script box of theme settings:
<style>
/*
CSS for making YouTubeGallery player responsive (without javascript):
*/
div#YoutubeGalleryMainContainer[instanceid] {
width: 100% !important;
}
div#YoutubeGallerySecondaryContainer[instanceid] {
position: relative !important;
width: 100% !important;
height: 0 !important;
padding-bottom: 56.25% !important; /* 16:9 */
}
div#YoutubeGallerySecondaryContainer[instanceid] iframe {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
border: 2px solid #000;
background: #000;
-moz-box-shadow: 1px 1px 7px 0px #222;
-webkit-box-shadow: 1px 1px 7px 0px #222;
box-shadow: 1px 1px 7px 0px #222;
}
div#YoutubeGallerySecondaryContainer[instanceid] object{
width: 100% !important;
height: 100% !important;
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
border: 2px solid #000;
background: #000;
-moz-box-shadow: 1px 1px 7px 0px #222;
-webkit-box-shadow: 1px 1px 7px 0px #222;
box-shadow: 1px 1px 7px 0px #222;
}
</style>