/* page specific
------------------------*/

/* overview */
/*#overview .hero { margin-top:90px; }*/
#overview .content { padding-top:0px; }
#overview .herotop { width: 600px; position:absolute; top:0; left:190px; z-index:50; }
#overview .herotop h1 { text-align: center; margin: 0; padding-top:43px; position:relative; }
#overview .herotop h1 img { margin: 0 auto; }
#overview .herotop p.intro { margin-top:7px; margin-bottom: 0; text-align:center; }
#overview .simple-nav { margin-top:-40px; z-index; 10; }
#overview .hero-nav .arrow span,
#overview .hero-nav .arrow img { *margin-top: 240px; }

#overview .intro { z-index:10; position:relative; }
#overview .hero.gallery { margin-bottom:41px; z-index:1; }
#overview .hero.gallery .gallery-content img.hero { position:absolute; top:0; left:0; }

#overview .scrollernav { margin-bottom:-50px; }
#overview .scrollernav li { width:195px; }
#overview .scrollernav li a { width:145px; height:19em; padding:0 25px; }
#overview .scrollernav li img { margin-bottom:0; }

#overview .swapView { height:537px; position:relative; }
#overview hr#design { margin-bottom:12px; }
#overview hr.plain { margin-top:0; }

#overview #main h2 { margin-bottom:25px; margin-top:15px; }

#overview .design { padding-bottom:60px; }
#overview .voiceover { padding-bottom:10px; }

#overview .design { position:relative; }
#overview .design img.anywhere-anything { position:absolute; bottom:-35px; left:-50px; }
#overview .design .column.first { width:53%; }
#overview .design .column.last { width:46%; padding-top:20px; }
#overview .design .column.last img { margin-left:44px; margin-bottom: 36px; }
#overview .design .column.last p { margin-bottom:25px; }
#overview .design img.right { margin-right:-15px; }

#overview .controls .controls { margin-left: 310px; }
#overview .controls img.on-button { margin: -400px 0 -2px -60px; *position: relative; *margin-bottom:-8px; }

#overview .voiceover { background: url( /sg/ipodshuffle/images/voiceover20100907.jpg) 100% 200px no-repeat; }
#overview .voiceover .diagram { position:relative; padding-bottom:25px; width:182px; }
#overview .voiceover .diagram span { position:absolute; left:6px; bottom:13px; color:#666; font-size:11px; }
#overview .voiceover ul { margin-bottom:30px; }
#overview .voiceover ul li { margin-bottom:15px; width:215px; }
#overview .voiceover ul h4 { font-size:12px; }
#overview .voiceover ul p { width:190px; *width:auto !important; color:#666; font-size:11px; }
#overview .voiceover ul li a { float:left; margin-top:1px; }
#overview .voiceover ul li a.audioLink img { margin-right:13px; }
#overview .voiceover p.voice { width:575px; }
#overview .voiceover .speaks { margin-top: 28px; *position: relative; }
#overview .voiceover .speaks p { width:545px; margin-bottom: 45px; }
#overview .voiceover img.right.flushright { margin-top:45px; }

#overview .voiceover .external { font-size:11px; color:#666; }
#overview .voiceover .external p { margin-bottom:2px; }
#overview .voiceover a { font-size:12px; }

#overview .playlists h3,
#overview .playlists p { margin-left: 410px; width: 450px; *position: relative; *z-index: 1; }
#overview .playlists img { margin-top: -435px; }

#overview ul.flip { text-align:center; color:#888; font-size:12px; _zoom: 1; }
#overview ul.flip:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#overview ul.flip li { width:190px; float: left; _width:188px; }

/* specs */
#specs img.dimensions { margin:55px 0 50px; }
#specs img.external { margin:10px 0; }
#specs img.connector { margin-top:-16px; }
#specs img.battery { margin-bottom:0; margin-left:10px; }
#specs img.capacity { margin-top:-10px; }

#specs #voiceover { zoom:1; }
#specs #voiceover.grid3col .column { width:85px; margin-left:0; }
#specs #voiceover .last { width:87px; }
#specs #voiceover ul li { margin-bottom:0; }

#specs #headphones h3 { position:relative; z-index:1; }
#specs #headphones ul { padding-right:0; margin-bottom:0; }
#specs #headphones img { position:absolute; right:0; bottom:0; }

#specs #accessories { position:relative; }
#specs #accessories #extra { padding-left:90px; padding-bottom:48px; }
#specs #accessories #extra img { margin-top:-20px; position:absolute; left:480px; bottom:0; _bottom:-1px; }

/* audio controller
------------------------*/

/* audio links for circular controllers */
.content a.audioLink { float:left; background:none; padding-top:4px; padding-left:4px; padding-bottom:20px; }
.content a.audioLink img { vertical-align:middle; }
.content a.controller { padding:0; }

/* circular controller */
body > .controllerPanel { width:28px; z-index:5; }
.ACMediaCircularController,
.ACQuicktimeCircularController { position:absolute; left:0; *left: -50px; width:50px; height:50px; margin-top:0; overflow:hidden; cursor: pointer; }
.controllerPanel .ACMediaCircularController .control,
.controllerPanel .ACQuicktimeCircularController .control { position:absolute; top:6px; left:5px; margin:0; width:52px; height:52px; overflow:hidden; text-align:center; text-indent:-999px; background-image:none; }
.ACMediaCircularController .background,
.ACQuicktimeCircularController .background { position:absolute; width:156px; height:52px; left:-104px; top:0; background-image:url(/sg/ipodshuffle/images/circular-controller-parts-large.png) !important; _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/sg/ipodshuffle/images/circular-controller-parts-large.png', sizingMethod='crop'); }
.ACMediaCircularController .control.play .background,
.ACQuicktimeCircularController .control.play .background { left:-5px; top:-5px; }
.ACMediaCircularController .control.pause .background,
.ACQuicktimeCircularController .control.pause .background { left:-57px; top:-5px; }
.ACMediaCircularController canvas,
.ACQuicktimeCircularController canvas { left:1px; top:1px; width:45px; height:45px; position:absolute; }
#main .controllerPanel .ACMediaCircularController .control.play,
#main .controllerPanel .ACMediaCircularController .control.pause,
#main .controllerPanel .ACQuicktimeCircularController .control.play,
#main .controllerPanel .ACQuicktimeCircularController .control.pause { background-image:none; }