CSS: iPhone Custom CSS

<style type="text/css" media="screen">

/* iPhone 4
@media only screen and (-webkit-min-device-pixel-ratio:2){
#innerWrap{ width: 650px; }
#container{ width: inherit; }
}

@media all and (max-device-width: 480px){
#innerWrap{ width: 650px; }
#container{ width: inherit; }
}
@media screen and (orientation:portrait) and (min-device-width: 768px) and (max-device-width: 1024px){
#innerWrap{ width: 1024px; border: 0px solid yellow; }
#container{ width: 650px; border: 0px solid violet; }
}
@media screen and (orientation:landscape) and (min-device-width: 768px) and (max-device-width: 1024px){
#innerWrap{ width: 1024px; border: 0px solid yellow; }
#container{ width: 650px; border: 0px solid violet; }
}
*/

</style>
<!-- Portrait -->
<link media="only screen and (max-width: 320px)" rel="stylesheet" type="text/css" href="http://kuscinteractive.org/css/nowplaying/iphone_portrait.css"/>
<link rel="stylesheet" media="all and (orientation:portrait)" type="text/css" href="http://kuscinteractive.org/css/nowplaying/portrait.css">

<!-- Landscape -->
<link media="only screen and (min-width: 321px)" rel="stylesheet" type="text/css" href="http://kuscinteractive.org/css/nowplaying/iphone_landscape.css"/>
<link media="all and (orientation:landscape)" rel="stylesheet" type="text/css" href="http://kuscinteractive.org/css/nowplaying/landscape.css">

<!-- iPhone Retina Display -->
<link media="only screen and (-webkit-min-device-pixel-ratio: 2)" rel="stylesheet" type="text/css" href="http://kuscinteractive.org/css/nowplaying/retina.css" />