﻿@import url(blackout.css);

html, body { background-color:#f5f6f7; }

.maincap { position:absolute; width:984px; height:7px; left:0; z-index:5; font-size:1px; }
.maincap.top { top:0; background:url(http://images.apple.com/ipod/images/content_top20090909.png) no-repeat; }
.maincap.bottom { bottom:0; _bottom:-1px; background:url(images/content_bottom20090909.png) no-repeat 0 100%; }

#main { background:#fff url(http://images.apple.com/ipod/images/content_bg20090909.png) repeat-y; }
#content { margin:0 2px; *margin:0 1px; padding:4em 50px 2em; }

h1 img { *margin-bottom:10px; }
#content h2 { font-size:1.8333em; line-height:1.15em; }

#content .left { float:left; }
#content .right { float:right; }

#content .flushtop { position:relative; margin-top:-4em; }
#content .flushright { position:relative; margin-right:-50px; }
#content .flushleft { position:relative; margin-left:-50px; }
#content .flushbottom { position:absolute; bottom:0; }
#content img.inline { margin-top:1em; }
#content img.center { display:block; margin-right:auto; margin-left:auto; }

.nowrap { white-space:nowrap; }
a.wrap:hover { text-decoration:none; }
a.block { display:block; color:#333; }
a.block:hover { text-decoration:none; }
a.wrap:hover span,
a.block:hover span,
a:hover span.more { text-decoration:underline; cursor:pointer; }

.column { display:inline; }
.grid2col .column { width:47%; }

.rounded, .callout, .callout a.block { border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -o-border-radius:4px; -khtml-border-radius:4px; }
.roundedtop { border-radius:4px 4px 0 0; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -moz-border-radius:4px 4px 0 0; -o-border-radius:4px 4px 0 0; -khtml-border-radius:4px 4px 0 0; }
.roundedbottom { border-radius:0 0 4px 4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; -moz-border-radius:0 0 4px 4px; -o-border-radius:0 0 4px 4px; -khtml-border-radius:0 0 4px 4px; }
.roundedright { border-radius:0 4px 4px 0; -webkit-border-top-right-radius:4px; -webkit-border-bottom-right-radius:4px; -moz-border-radius:0 4px 4px 0; -o-border-radius:0 4px 4px 0; -khtml-border-radius:0 4px 4px 0; }
.roundedleft { border-radius:4px 0 0 4px; -webkit-border-top-left-radius:4px; -webkit-border-bottom-left-radius:4px; -moz-border-radius:4px 0 0 4px; -o-border-radius:4px 0 0 4px; -khtml-border-radius:4px 0 0 4px; }

.shadow { box-shadow:rgba(0,0,0,0.3) 0 1px 5px; -webkit-box-shadow:rgba(0,0,0,0.3) 0 1px 5px; -moz-box-shadow:0 1px 5px rgba(0,0,0,0.3); }
.shadow, x:-moz-any-link { border:1px solid #dbdbdb; border-color:#e5e5e5 #dbdbdb #d2d2d2; } /* for old firefoxes */
.shadow:nth-child(1n) { border:none; } /* reset the new firefox 3.5 back to the default */
.shadow { *border:1px solid #dbdbdb; *border-color:#e5e5e5 #dbdbdb #d2d2d2; }

noscript p { text-align:center; font:24px "Myriad Pro", "MyriadPro", "Lucida Grande", "Lucida Sans Unicode", arial, verdana, sans-serif; font-weight:500; }


#main .callout .enlarge { behavior:url(/global/scripts/lib/iepngfix.htc); }

#thankyou .callout.facebook .more { margin-right: 20px; }

/* product header
------------------------*/
#productheader { z-index:10; }
#productheader h2 a { display:inline; text-indent:0; }
#productheader h2 a img { position:relative; margin-bottom:-8px; }


.whatsnew  #pn-whatsnew a,
.whatis    #pn-whatis a,
.features  #pn-features a,
.voiceover #pn-voiceover a,
.gamesapps #pn-gamesapps a,
.itunes    #pn-itunes a,
.gallery   #pn-gallery a { color:#999; text-shadow:#fff 0 1px 0; }

#whatsnew  #pn-whatsnew a,
#whatis	   #pn-whatis a,
#features  #pn-features a,
#voiceover #pn-voiceover a,
#gamesapps #pn-gamesapps a,
#itunes    #pn-itunes a,
#gallery   #pn-gallery a,
#specs     #pn-specs a { color:#999 !important; text-shadow:#fff 0 1px 0; cursor:default; }


/* headernav
------------------------*/
.headernav:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.headernav li { display:-moz-inline-stack; display:inline-block; *display:inline; width:176px; margin:0 -2px 0; text-align:left; background:url(http://images.apple.com/ipod/images/headernav_border20090909.png) no-repeat 0 100%; *margin:0 -1px 0 0; zoom:1; }
.headernav li a { display:block; display:inline-block; *display:inline; width:132px; padding:27px 15px 19px 30px; color:#333; outline:none; background:url(http://images.apple.com/ipod/images/headernav_border20090909.png) no-repeat 100% 100%; zoom:1; }
.headernav li a img { padding:4px; margin-bottom:7px; border:1px solid #ccc; background-color:#fff; }
.headernav li a h4 { line-height:1.4; word-spacing:-1px; color:inherit; }
.headernav li a p { margin:0; }
.headernav li:hover a,

/* selected states */


/* callouts
------------------------*/


/* buy now strips */
#buystrip { _height:156px; _overflow:hidden; position:relative; }
#buystrip h2 { width:96px; margin-bottom:-6px; text-align:right; }
#buystrip .column.first { height:136px; padding-top:25px; }
#buystrip .column.first h4 { width:96px; margin-bottom:0; color:#000; text-align:right; }
#buystrip .column.first h4 strong { padding-left:8px; }
#buystrip .column.first .right { margin:-11px 16px 5px 0; }
#buystrip #comparison { position:absolute; padding-top:13px; bottom:10px; width:221px; }
#buystrip #comparison .family { margin:-8px 18px -10px 10px; }
#buystrip #links { padding-left:20px; text-align:center; width:609px; _width:607px; _position:static; _margin:-7px -100px; }

/* site-specific k2 buy now promo */
#promofooter #promos li.buy { width:232px; padding-left:12px; }
#promofooter #promos li.buy h4 { font-size:15px; font-weight:normal; padding-top:12px; }
#promofooter #promos li.buy h4 span { color:#525252; }
#promofooter #promos li.buy h5 { font-size:12px; }
#promofooter #promos li.buy ul { margin-top:7px; padding:0; }
#promofooter #promos li.buy ul li.pad { margin-bottom:10px; }

/* site-specific box shot buy now promo */
#promofooter #promos li.buy.shot { width:244px; padding-left:0; }
#promofooter #promos li.buy.shot h4 { padding-top:0; }
#promofooter #promos li.buy.shot ul { padding-left:15px; }
#promofooter #promos li.buy.shot ul li { margin-bottom:4px; }
#promofooter #promos li.buy.shot ul li.shop { margin-right:85px; }
#promofooter #promos li.buy.shot .button a { padding:5px 10px 15px; }
#promofooter #promos li.buy.shot .product { position:absolute; top:15px; left:150px; }


/* sosumi */
.sosumi { width:940px; margin:0 auto; margin-bottom:10px !important; padding:18px 20px 0; }
ol.sosumi { margin-left:auto; padding-left:0; }
#content .sosumi { width:auto; padding-right:0; padding-left:0; }
.sosumi a { color:#333; }
.sosumi li { line-height:14px; padding-bottom:5px; margin-bottom:0; }
ol.sosumi li { margin-left:2em; }



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

/* overviews */
#overview #hero { position:relative; width:984px; margin:0 auto 12px; background:#fff url(http://images.apple.com/ipod/images/content_bg20090909.png) repeat-y; }

#overview #hero .hero { position:relative; height:419px; margin:0 2px; background:url(http://images.apple.com/ipod/images/overview_herobg20090909.png) repeat-x 0 100%; }
#overview #hero .hero .content { position:absolute; top:0; left:0; width:100%; height:460px; text-align:center; }
#overview #hero .hero .content img { margin:0; }

#overview #hero .movie { margin:0 auto; padding-top:12px; }
#overview #hero .movie,
#overview #hero .moviePanel,
#overview #hero .endState { width:640px; height:360px; }

#overview #hero .heronav h4 { float:left; padding:1.7em 4px; color:#444; font-size:11px; line-height:1.3em; font-weight:normal; text-align:right; }
#overview #hero .heronav ul { float:left; height:52px; }
#overview #hero .heronav ul li { float:left; position:relative; width:47px; height:52px; margin:0 0 0 6px; }
#overview #hero .heronav ul li a { display:block; width:47px; height:43px; padding-top:9px; color:#333; outline:none; text-decoration:none; cursor:pointer; }
#overview #hero .heronav ul li a i { display:block; width:47px; height:32px; overflow:hidden; }
#overview #hero .heronav ul li a i img { }
#overview #hero .heronav ul li a:hover i img { margin-top:-32px; }
#overview #hero .heronav ul li a.active i img { margin-top:-64px !important; }
#overview #hero .heronav ul li a.active b { display:block; }
#overview #hero .heronav .movie { display:none; }

/* ipod + itunes */
#itunes #hero { margin:0 0 55px; min-height:400px; _height:400px; }

#itunes #hero h1 { margin-bottom:-3px; }
#itunes #hero h1 img { margin-right:-450px; }
#itunes #hero p { width:280px; margin-top:32px; }
#itunes #hero p.intro { margin-top:0; }
#itunes #hero .right { position:absolute; right:0; *right: 1px; top:0; margin:0; }
#itunes #hero .right p { width:375px; margin:-36px 0 0 184px; font-size:11px; line-height:16px; }

#itunes .row { position:relative; margin:0 -50px 5em; padding:0 50px; zoom:1; *margin-left:-49px; }
#itunes .row:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#itunes .row h2 { margin-top:0; position:relative; }
#itunes .row img.flushleft,
#itunes .row img.flushright { margin-bottom:0; *margin-bottom:-18px; }
#itunes .row p { position:relative; }
#itunes #row4 { margin:0 0 40px; padding:0; }
#itunes #row4 .column { width:260px; margin-left:50px; }
#itunes #row4 img { margin-right:50px; }

#itunes #row5 { margin-bottom:0; }
#itunes #row5 img { margin-right:39px; margin-bottom:-22px; *margin-bottom:-40px; }
#itunes #row5 h2 { padding-top:40px; }


/* gallery */
#gallery #content { min-height:684px; _height:684px; padding:0 50px; }
#gallery #content h2 { position:relative; margin:0; padding:37px 0 0; font:24px "Myriad Pro", "MyriadPro", "Lucida Grande", "Lucida Sans Unicode", arial, verdana, sans-serif; font-weight:500; }
#gallery #viewer { height:600px; }
#gallery #viewer noscript p { padding-top:240px; }
#gallery .swap,
#gallery .section { height:470px; text-align:center; }
#gallery .section { overflow:hidden; }
#gallery .section img { position:relative; }
#gallery .sections { display:none; }

#gallery .gallerynav { clear:both; margin:0; padding:20px 0 0; border-top:1px solid #eee; text-align:center; zoom:1; }
#gallery .gallerynav:after { content:'.'; display:block; height:0; clear:both; visibility:hidden; }
#gallery .gallerynav li { position:relative; display:inline; margin:0 5px; }
#gallery .gallerynav li a { position:relative; display:inline-block; width:92px; height:66px; padding:0 0 2em; text-decoration:none; outline:none; font-size:11px; color:#aaa; }
#gallery .gallerynav li a img { display:block; margin:0 auto; border:1px solid #e5e5e5; }
#gallery .gallerynav li a span { position:absolute; left:1px; bottom:0; width:100%; color:#252525; }
#gallery .gallerynav li a:hover { color:#08c; }
#gallery .gallerynav li a.active { color:#888; }
#gallery .gallerynav li a.active img { border:1px solid #000; }

#gallery #content .sosumi { margin-top:-28px; padding-bottom:10px; }


