/* Napster Stylesheet 2011 Napster Using 960gs as Grid / Cufon for Fonts and of course Jquery. Our Cufon Fonts are: fulc 27 Ultra Light Condensed ftc 37 Thin Condensed flc 47 Light Condensed fc 57 Condensed fmc 67 Medium Condensed fbc 77 Bold Condensed Domains: napster.de,napster.com,napster.co.uk,*.napster.co.uk,*.napster.com,*.napster.de,*.napster.co.uk,localhost,127.0.0.1,*.napent.com Chars: €£©™®äöüÄÖÜß-+"'*– */ /* Global Reset */ /********************************************************************************************/ html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, em, img, small, strike, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } ul li { list-style-type: none; } /* Body */ /********************************************************************************************/ body { font-family:Arial, sans-serif; text-align:center; font-size:14px; font-weight: 300; color:#666; line-height:22px; } /* Anti Jumping Layout Fix */ html { height: 100% } body { min-height: 101%; } /* / */ body.home, body.musik-hoeren, body.memberlogin, body.joinnow { background: #efefef url("/images/4.6/cs/bg_blue.png") 0 0 repeat-x; } body { background: #efefef url("/images/4.6/cs/bg_body.png") 0 0 repeat-x; } body div.firstContentBlock { margin-top:40px;} body.home div.firstContentBlock {margin-top:330px;} body.home div.theme { background: transparent url("/images/4.6/cs/bg_body-theme.jpg") scroll center 64px no-repeat; } body.musik-hoeren div.theme, body.memberlogin div.theme, body.joinnow div.theme { background: #efefef url("/images/4.6/cs/bg_blue.png") 0 0 repeat-x; } body#faq-partner-popup { background: #d6d6d6 url("/images/4.6/cs/bg_body-faq.png") 0 0 repeat-x; } body#faq-partner-popup div#pageWrapper { text-align: left; width:440px; padding:0 20px 10px 20px; margin:0 auto; } /* pageWrapper */ /********************************************************************************************/ div#pageWrapper { text-align:left; overflow:hidden; margin-bottom:80px; } /* Header */ /********************************************************************************************/ div#header a.logo { display:block; width:140px; height:64px; text-indent:-9000em; background: transparent url("/images/4.6/cs/napster-logo.png") 0 0 no-repeat; } div#navigation { position:relative; z-index: 1;} div#navigation ul.main { overflow:hidden; margin-top:18px; } div#navigation ul.main li { float:left; margin-left:28px; } div#navigation ul.main li.first { margin-left:0;} div#navigation ul.main li a { display:block; text-align:center; color:#fff; text-decoration:none; background: transparent url(/images/4.6/cs/sprite_navigation.png) 0 0 no-repeat; height:25px; width:67px; text-indent:-9000em; } /* Navigation Matrix */ /********************************************************************************************/ div#navigation ul li.home a { width:67px; background-position:0 -29px; } div#navigation ul li.home a:hover, div#navigation ul li.home a.active { width:67px; background-position:0 -1px; } div#navigation ul li.musikkatalog a { width:118px; background-position:-96px -29px; } div#navigation ul li.musikkatalog a:hover, div#navigation ul li.musikkatalog a.active { width:118px; background-position:-96px -1px; } div#navigation ul li.dasistnapster a { width:132px; background-position:-227px -29px; } div#navigation ul li.dasistnapster a:hover, div#navigation ul li.dasistnapster a.active { width:132px; background-position:-227px -1px; } div#navigation ul li.sofunktionierts a { width:142px; background-position:-710px -29px; } div#navigation ul li.sofunktionierts a:hover, div#navigation ul li.sofunktionierts a.active { width:142px; background-position:-710px -1px; } div#navigation ul li.serviceundfeatures a { width:158px; background-position:-870px -29px; } div#navigation ul li.serviceundfeatures a:hover, div#navigation ul li.serviceundfeatures a.active { width:158px; background-position:-870px -1px; } div#navigation ul li.kompatiblemp3player a { width:189px; background-position:-1040px -29px; } div#navigation ul li.kompatiblemp3player a:hover, div#navigation ul li.kompatiblemp3player a.active { width:189px; background-position:-1040px -1px; } div#navigation ul li.hilfe a { width:62px; background-position:-387px -29px; } div#navigation ul li.hilfe a:hover, div#navigation ul li.hilfe a.active { width:62px; background-position:-387px -1px; } div#navigation ul li.login a { width:64px; background-position:-487px -29px; } div#navigation ul li.login a:hover, div#navigation ul li.login a.active { width:64px; background-position:-487px -1px; } div#navigation ul li.jetztesten a { width:107px; background-position:-579px -29px; } div#navigation ul li.jetztesten a:hover, div#navigation ul li.jetztesten a.active { width:107px; background-position:-579px -1px; } /* Navigation Sub */ /********************************************************************************************/ div#navigation ul.sub { overflow:hidden; margin:0; position:absolute; height:90px; width:195px; left: -999em; -moz-border-radius:0 10px 10px; -moz-border-radius:0 10px 10px; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; padding:30px 0 20px 10px; background: #333 url("/images/4.6/cs/bg-nav-sub.jpg") 0 0 repeat-x; } div#navigation ul.sub li { clear:both; margin:5px 0 0 0; } div#navigation ul.sub li.first { margin-left:0;} div#navigation ul li.dasistnapster:hover ul.sub, div#navigation ul li.sfhover ul.sub { left: 240px; } div.themepageHeader { height:289px; margin-bottom:25px; } /* Headlines & Text */ /********************************************************************************************/ h1 { font-size:60px; color:#333; margin-bottom:15px; letter-spacing:1px; line-height:90px; } .cufon-ready h1 { font-size:90px; color:#333; margin-bottom:15px; letter-spacing:1px; } /* Cufon Homepage Headline Settings - for nice FOUC Fixing */ /********************************************************************************************/ .grid_7 .index-headline-small { margin-top:20px; font-size:28px; color:#666; color:#666666; } .grid_7 .index-headline-large { font-size:70px; font-weight:normal; color:#666666; line-height:100px; margin-bottom:0;} .cufon-ready .grid_7 .index-headline-small { font-size:33px!important; } .cufon-ready .grid_7 .index-headline-large { font-size:85px!important; } h1 small { font-size:42px; } h1 strong { font-weight:bold; font-size:60px; } h1.white { color:#fff!important; } h2.white, h3.white, h4.white, h5.white { color:#fff; } * html h1 { font-size:47px; color:#666666; } * html h1 small { font-size:32px; display:block; } h2 { font-size:26px; font-weight:bold; margin-bottom:15px; letter-spacing:1px; color:#666; } h2 small { font-size:26px; font-weight:normal; } h2 strong { font-weight:bold; font-size:25px; } h3 { color:#666; font-size:26px; font-weight:normal; margin-bottom:15px; letter-spacing:1px; } h3 small { font-size:26px; font-weight:normal; } h3 strong { font-weight:bold; font-size:26px; } h3.small {font-size:24px; } h3.small strong {font-size:24px; } h4 { color:#666; font-size:16px; font-weight:bold; margin-bottom:5px; } h5 { color:#666; font-size:16px; font-weight:bold; margin-bottom:15px; line-height:1.8em;} h4 a{ color:#666; font-size:16px; font-weight:bold; text-decoration:none; } h6 { color:#666; font-size:16px; font-weight:bold; margin-bottom:5px; } h6 a{ color:#666; font-size:16px; font-weight:bold; text-decoration:none; } div#footer p { line-height:20px; } p { font-size:14px; margin-bottom:15px; } p.white { color:#fff;} p a { color:#0C99D1;} strong { font-weight:bold; } a.h6link { font-family:arial; font-size:14px; font-weight:bold; text-decoration:none; color:#333; } /* Buttons */ /********************************************************************************************/ div.compatDevicesRelatedLinks { position:relative; } li.lNtg { position: absolute; top:18px; } li.lNCar { position: absolute; top:110px; } li.lNLiving { position: absolute; top:212px; } /* Buttons */ /********************************************************************************************/ a.btn { display: block; color: #fff; float: left; height: 25px; padding-left: 10px; text-decoration: none; background-repeat: no-repeat; background-image: url(/images/4.6/cs/bg_graybutton_png8.png); background-position:0 -25px; } a.blue { background-image: url(/images/4.6/cs/bg_bluebutton_png8.png); } a.darkblue { background-image: url(/images/4.6/cs/bg_darkbluebutton_png8.png); } a.green { background-image: url(/images/4.6/cs/bg_greenbutton_png8.png);} a.darkgray { background-image: url(/images/4.6/cs/bg_darkgraybutton_png8.png);} a.btn:hover,a.btnactive { background-position:0 -75px; } a.btn b { font: normal 16px "Arial"; line-height:14px; height:25px; padding: 6px 16px 4px 5px; background-repeat: no-repeat; background-color: transparent; background-image: url(/images/4.6/cs/bg_graybutton_png8.png); background-position:right 0; display:block; } a.btn:hover b, a.btnactive b { background-position:right -50px; } * html a.btn { font-weight: bold; height:18px; } * html a.btn b { font-weight: bold; height:17px; display:inline-block; overflow:hidden;} a.blue b { background-image: url(/images/4.6/cs/bg_bluebutton_png8.png); } a.green b { background-image: url(/images/4.6/cs/bg_greenbutton_png8.png); } a.darkgray b { background-image: url(/images/4.6/cs/bg_darkgraybutton_png8.png); } a.darkblue b { background-image: url(/images/4.6/cs/bg_darkbluebutton_png8.png); } a.off { background:none; color:#333; } a.off b { background:none; color:#333; } a.off:hover { background-image: url(/images/4.6/cs/bg_graybutton_png8.png); background-position:0 -25px; } a.off:hover b { background-image: url(/images/4.6/cs/bg_graybutton_png8.png); background-position:right 0; color:#fff; } /* Green Next Prev Button */ /********************************************************************************************/ a.btn-prev,a.btn-next { display:block; width:25px; height:25px; text-indent:-9000em; } a.btn-prev { background: transparent url("/images/4.6/cs/btn-prev.gif") 0 0 no-repeat; } a.btn-next { background: transparent url("/images/4.6/cs/btn-next.gif") 0 0 no-repeat; } div.teaserHomeImg { position:absolute; left:-30px; } div.greenCheckMark { padding-left:20px; background: transparent url("/images/4.6/cs/icon_checkmark.png") 0 5px no-repeat; line-height:22px; } div.exploreNapster div.teaser {height:310px; } /* Home */ /********************************************************************************************/ a.btn-start-your-free-trial { display:block; width:374px; height:68px; text-indent:-9000em; background: transparent url("/images/4.6/cs/btn-start-your-free-trial.jpg") 0 0 no-repeat; position:absolute; top:20px; right:0; } a.btn-promo-prepaid-code-click-here { display:block; width:294px; height:40px; text-indent:-9000em; background: transparent url("/images/4.6/cs/btn-promo-prepaid-code-click-here.jpg") 0 0 no-repeat; position:absolute; top:110px; right:0; } div.header-device-image { position:absolute; display:none; top:170px; left:550px; width:410px; height:226px; background:transparent url("/images/4.6/cs/header-devices.png") 0 0 no-repeat; } a.btn-social-twitter, a.btn-social-facebook { position:absolute; display:block; text-indent:-9000em; top: 210px; } a.btn-social-twitter { width:77px; height:20px; background:transparent url("/images/4.7/icon-de-social-twitter.png") 0 0 no-repeat; left:290px; } a.btn-social-facebook { width:83px; height:20px; background:transparent url("/images/4.7/icon-de-social-facebook.png") 0 0 no-repeat; left:200px; } /* Sprite Support Desktop / Mobile Icon */ /********************************************************************************************/ span.icon-desktop,span.icon-mobile { display:block; float:right; text-indent:-9000em; background:transparent url("/images/4.6/cs/sprite-icon-support-for-desktop-mobile.png") 0 0 no-repeat; margin-right:7px; } span.icon-desktop { width:17px; height:16px; background-position:0 -36px; } span.icon-mobile { width:11px; height:16px; background-position:0 0; } /* Home Music Unlimited CD - Album Display */ /********************************************************************************************/ .music-unlimited-display { background: transparent url("/images/4.6/cs/cd-shadow.png") 0 0 no-repeat; width:300px; height:145px; } .music-unlimited-display .mu-cd1 img.loading { position:absolute; left:55px; top:50px; } .mu-cd0, .mu-cd2 { width:116px; height:106px; top:10px; left:10px; position:absolute; background: transparent url("/images/4.6/cs/cd-small-cover.png") 0 0 no-repeat; } .mu-cd0 img.cover, .mu-cd2 img.cover { position:absolute; width:102px; height:102px; top:2px; left:11px; } .mu-cd2 { left:170px; } .mu-cd1 { width:163px; height:130px; top:0; left:80px; position:absolute; background: transparent url("/images/4.6/cs/large-cover_alpha.png") 0 0 no-repeat; } * html .mu-cd1 { background: transparent url("/images/4.6/cs/large-cover_noalpha.png") 0 0 no-repeat; } .mu-cd1 img.cover {position:absolute; top:2px; left:14px; width:126px; height:126px; } div.set-it-free { background:transparent url('/images/4.6/cs/img-set-it-free.jpg') 0 0 no-repeat; width:300px; height:151px; } div.take-it-easy { background:transparent url('/images/4.6/cs/img-take-it-easy.jpg') 0 0 no-repeat; width:300px; height:151px; } /* Mobile */ /********************************************************************************************/ div.mobile-screens div.grid_4 { position:relative;} div.mobile-screens { margin-bottom:70px; } div.mobile-screens .img1 { background:transparent url('/images/4.6/cs/mobile-img1.png') 0 0 no-repeat; } div.mobile-screens .img2 { background:transparent url('/images/4.6/cs/mobile-img2.png') 0 0 no-repeat; } div.mobile-screens .img3 { background:transparent url('/images/4.6/cs/mobile-img3.png') 0 0 no-repeat; } div.mobile-screens .img4 { background:transparent url('/images/4.6/cs/mobile-img4.png') 0 0 no-repeat; } div.mobile-screens .img5 { background:transparent url('/images/4.6/cs/mobile-img5.png') 0 0 no-repeat; } div.mobile-screens .img6 { background:transparent url('/images/4.6/cs/mobile-img6.png') 0 0 no-repeat; } div.mobile-screens-lastrow .img7 { background:transparent url('/images/4.6/cs/mobile-img7.png') 0 0 no-repeat; } div.mobile-screens-lastrow .img8 { background:transparent url('/images/4.6/cs/mobile-img8.png') 0px 0px no-repeat; } div.mobile-screens-lastrow .img9 { background:transparent url('/images/4.6/cs/mobile-img9.png') 0 0 no-repeat; } div.mobile-screens .img1, div.mobile-screens .img2, div.mobile-screens .img3, div.mobile-screens .img4, div.mobile-screens .img5, div.mobile-screens .img6 { width:300px; height:256px; overflow:hidden; -moz-border-radius: 10px; -webkit-border-radius:10px; border-radius:10px; } div.mobile-screens .hover { z-index:3000; cursor:pointer; } .img6correction { width:80px; height:10px; background-color:#fff; position:absolute; top:246px; left:8px; } .explaination { zoom:1; } .explaination h2 { font-size:21px; padding-top:20px; margin-bottom:5px; } .explaination h2, .explaination p { text-align:center; } .mobile-screens-lastrow div { width:300px; height:351px; -moz-border-radius: 10px; -webkit-border-radius:10px; border-radius:10px; } .bg-mobile-download { background: transparent url("/images/4.7/bg-mobile-download.png") 0 0 no-repeat; color:#fff; } .bg-mobile-download h5 { font-size:12px; line-height:16px; color:#fff; } .bg-mobile-download h2, .bg-mobile-download h2 strong { font-size:26px; } .bg-mobile-download h4 { color:#fff; } .bg-mobile-download div { width:auto!important; height:auto!important; } .bg-mobile-download-box { padding: 31px 15px 0 186px; } .bg-mobile-download-first { margin-bottom:30px; } /* Anywhere Link */ /********************************************************************************************/ .img7 a { position:absolute; display:block; text-indent:-9000em; width:300px; height:351px; } .img9 a { position:absolute; display:block; text-indent:-9000em; width:300px; height:351px; } a.icon-apple { position:absolute; top:305px; left:52px; width:26px; height:32px; background:transparent url('/images/4.6/cs/icon-apple.png') 0 0 no-repeat; } a.icon-android { position:absolute; top:318px; left:188px; width:74px; height:10px; background:transparent url('/images/4.6/cs/icon-android.png') 0 0 no-repeat; } /* Feature Bubbles :) */ /********************************************************************************************/ div.feature-bubbles .bubble { cursor:pointer; width:220px; height:210px; overflow:visible; background: transparent url("/images/4.6/cs/features-devices.jpg") 0 0 no-repeat; } div.feature-bubbles .bubbletext { display:none; position:absolute; width:220px; min-height: 75px; height: auto !important; height: 75px; top:0; text-align:center; left:0; opacity:0; filter: alpha(opacity=0); background-color:#5b5b5b; -moz-border-radius: 10px; -webkit-border-radius:10px; border-radius:10px; } div.feature-bubbles div.img4 div.bubbletext a.btn { margin-left:30px; } div.feature-bubbles div.img3 div.bubbletext a.btn { margin-left:15px; } div.feature-bubbles .bubbletext .arrow { width:32px; height:32px; position:absolute; bottom:-30px; left:100px; background: transparent url("/images/4.6/cs/icon-bubbletext-arrow.png") 0 0 no-repeat; } div.feature-bubbles .bubbletext h5{ display:block; font-size:14px; line-height:16px; padding: 10px; color:white; } div.feature-bubbles .img1 { background-position: 30px 0; } div.feature-bubbles .img2 { background-position:-230px 0; } div.feature-bubbles .img3 { background-position:-490px 0; } div.feature-bubbles .img4 { background-position:-770px 0; } /* SEO PAGES WITH BODY MUSIK */ /********************************************************************************************/ body.musik h1 { font-size:45px; line-height:50px;} body.musik h2 { font-size:14px; line-height:16px;} body.musik a.seo-link-napster-gratistest { width:380px; height:40px; display:block; position:absolute; text-indent:-9000em; left:20px; top:150px; } body.musik .and-symbol { font-size:200px; color:#cecece; display:block; position:absolute; left:10px; } /* Release Feed */ /********************************************************************************************/ div#releaseFeed {position:relative; height:250px; } div#releaseFeed a.btn-prev, div#releaseFeed a.btn-next { position: absolute; top:40px; } div#releaseFeed a.btn-prev {left:-50px;} div#releaseFeed a.btn-next {left:640px;} div#releaseFeed div.feedContent { width:640px; overflow:hidden; } div#releaseFeed div.feedContent ul li { width:140px; height:218px; float:left; margin-left:20px; } div#releaseFeed div.feedContent ul li a.albumimg { float:left; margin-bottom:12px; } div#releaseFeed div.feedContent ul li em { color:#666; display:block; margin-bottom:13px; font-family:arial; font-style:normal; } div#releaseFeed div.feedContent ul li em.albumname { float:left; display:inline; overflow:hidden; height:35px;font-size:14px; font-weight:bold; } div#releaseFeed div.feedContent ul li em.artistname { float:left; display:inline; overflow:hidden; font-size:14px; height:15px; font-weight:normal; } div#releaseFeed div.feedContent ul li.first {margin-left:0; } /* FAQ */ /********************************************************************************************/ div.faq { } div.faq div.question { border:1px solid #ccc; border-width:0 0 1px 0; padding:15px 0 15px 0; position:relative; line-height:22px; } div.faq div.question h4 { cursor:pointer; position:relative; padding-left:25px; } * html div.faq div.question h4 { zoom:1; } div.faq div.question div { padding-left:25px; display:none; } div.faq div.question div a {color:#0C99D1; font-weight:bold; text-decoration:none; } div.faq div.question h4 span.footnote { position:absolute; left:0px; } /* Mood Manager */ /********************************************************************************************/ div#mood-manager { background: transparent url("/images/4.6/cs/bg_mood-manager.png") 0 0 no-repeat; width:960px; height:643px; margin-top:25px; position:relative; } div#mood-image { position:absolute; right:24px; top:28px; width:517px; height:246px; cursor:pointer; } div#mood-content { position:absolute; background-color:white; right:24px; top:274px; width:517px; height:357px; overflow:hidden; } div#mood-content div.explaination { padding:50px;} /* Product Info */ /********************************************************************************************/ div.productInfo { margin-bottom:25px;} div.chooseProduct { padding-left:220px; margin-bottom:25px; overflow:hidden; } div.productInfo h1 { margin-bottom:0; } div.productInfo h4 { margin-bottom:20px; } ul.productInfoList { width:960px; overflow:hidden; } ul.ntg, ul.light, ul.flatrate { display:none; } ul.productInfoList li { float:left; display:none; width:300px; margin-left:20px; } * html ul.productInfoList li { zoom:1; } ul.productInfoList li b { float:left; display:block; width:60px; height:100px; } ul.productInfoList li p { float:left; display:inline; width:213px; height:120px; margin-left:20px; line-height:16px; } /* Music Features RSS List */ /********************************************************************************************/ div#rssReleases { margin-top:50px; } div#rssReleases h4 { margin-bottom:30px; } div#rssReleases div.row { float:left; display:inline; width:235px;} div#rssReleases ul li a {text-decoration:none;} div#rssReleases ul li a.albumimg { float:left; display:inline; margin:0 20px 2px 0; } div#rssReleases ul li div.info { float:left; display:inline; width: 140px; } div#rssReleases ul li em { color:#666; display:block; margin-bottom:5px; font-family:arial; line-height:14px; } div#rssReleases ul li em.albumname { font-size:14px; font-weight:bold; } div#rssReleases ul li em.artistname { font-size:10px; font-weight:normal; } div#mood-innercontent div.result { padding:10px; } div#mood-innercontent div.result div.left { float:left; display:inline; margin-right:20px; width:190px; height:100px; } div#mood-innercontent div.result div.left a {display:block; } div#mood-innercontent div.result div.left a.image { border:1px solid #fff; float:left; background-color:#fff; } div#mood-innercontent div.result div.right { float:left; display:inline; width:230px; height:100px; line-height:16px; } div#mood-innercontent div.result div.col {overflow:hidden; padding:10px 0 10px 0; border:1px solid black; border-width:0 0 1px 0;} div#mood-innercontent div.result div.right span {display:block;} * html div#mood-innercontent div.result div.col { zoom:1; } /* Footer */ /********************************************************************************************/ div#footer { margin-top:0; } div#footer, div#footer p {font-family:verdana; font-size:10px; } div#footer a { color:#666; text-decoration:none; font-family:verdana; font-size:10px; } div#footer a:hover { color:#0c99d1; } div#footer p { margin: 0 0 20px 0; } div#footer ul { list-style: none; padding: 0; margin: 0 0 20px 0; } div#footer ul li { display: inline; padding: 0; margin: 0; } /* Pipe List */ /********************************************************************************************/ div#footer ul{text-align: left; } div#footer ul li { width:auto; margin:0; display:inline; padding:0 .5em; border-left: 1px solid #666; } div#footer ul li.leadin {border-left: 0; padding-left:0;} /* Teaser */ /********************************************************************************************/ div.teaser { display: inline; float: left; position: relative; margin-right: 10px; } div.small { width:190px; } div.teaser a { font-size:14px; text-decoration:none; color:#666;} div.teaser img { margin-bottom:10px; } /* Dark Theme (Sign Up - Join Now */ /********************************************************************************************/ div.loginbox { margin-top:40px; margin-bottom:140px; } div.loginbox label { display:block; } div.loginbox input { font-family: Arial; font-size:16px; font-weight:bold; border:none; } div.loginbox div { float:left; display:inline; margin-right:20px; } div.loginbox a.forgotpass { margin-top:5px; display:block; color:#fff; font-size:12px; text-decoration:none; } div.loginbox a.actionbtn { margin-top:18px; } /* Feature List */ /********************************************************************************************/ div#featureList div.imageCol {} div#featureList div.textCol { margin-top:60px;} div#featureList div.textCol div.textRow { margin-bottom:90px; overflow:hidden; } div#featureList2011 div.imageCol { background: transparent url("/images/4.6/cs/sprite_icon-features.png") 0 0 no-repeat; width:217px; height:109px; text-indent:-9000em; } div#featureList2011 div.one { background-position: 0 0px; height:110px; } div#featureList2011 div.two { background-position: 0 -125px; height:120px; } div#featureList2011 div.three { background-position: 0 -255px; height:120px; } div#featureList2011 div.four { background-position: 0 -380px; height:120px; } div#featureList2011 div.five { background-position: 0 -510px; height:140px; } div#featureList2011 div.six { background-position: 0 -660px; height:120px; } div#featureList2011 div.seven { background-position: 0 -780px; height:130px; } div#featureList2011 h4 strong { font-size:21px; } /* Car Connect List List Napster in your Car */ /********************************************************************************************/ ul#carConnectList { margin-top:60px; } ul#carConnectList li { /* background: transparent url("/images/4.6/cs/hr-line-1pixel.gif") repeat-x center bottom; */ margin:0 0 40px 0; zoom:1; } ul#carConnectList li.last { background: none; margin:0; } ul#carConnectList li p { margin-bottom:30px;} ul#carConnectList li div.grid_4 { width:220px; height:50px; background: transparent url("/images/4.6/cs/sprite_icon-in-your-car.png") 0 0 no-repeat; } ul#carConnectList li div.img-1 { background-position:64px -15px; } ul#carConnectList li div.img-2 { background-position:-17px -78px; } ul#carConnectList li div.img-3 { background-position:-17px -138px; } ul#carConnectList li div.img-4 { background-position:-17px -205px; } ul#carConnectList li div.img-5 { background-position:67px -265px; height:62px; } /* Featured Home Entertainment Systems Napster in your Living Room */ /********************************************************************************************/ div#featuredHomeSystems div.systemImage { width:220px; height:100px; background:transparent url("/images/4.6/cs/sprite_living-room-players.png") 0 0 no-repeat; } div#featuredHomeSystems div.img-1 { background-position: 0 -22px; } div#featuredHomeSystems div.img-2 { background-position: -250px -22px; } div#featuredHomeSystems div.img-3 { background-position: -500px -22px; } /* Service Features */ /********************************************************************************************/ div#serviceFeaturesBox ul.scrollNavigation {} div#serviceFeaturesBox ul.scrollNavigation li { overflow:hidden; margin-bottom:10px; clear:both; } div#serviceFeaturesBox ul.scrollNavigation a { } div#serviceFeaturesBox ul.scrollNavigation a:hover { background-position:0 -25px; } div#serviceFeaturesBox ul.scrollNavigation a:hover b { background-position:right 0; } div#scrollBox { position:relative; width:620px; float:left; display:inline; overflow:hidden; } div#scrollBox ul { width:3100px; } div#scrollBox li { float:left; width:620px; } div#scrollBox ul ul { width:600px; margin-left: 0; } div#scrollBox li li { width:550px; margin-bottom:5px; padding-left: 15px; background: transparent url("/images/4.6/cs/icon-list-bullet.gif") 0 5px no-repeat; } /* Plans */ /********************************************************************************************/ div.teaser-wifi { width:220px; height:422px; background:transparent url("/images/4.6/cs/teaser-modul-stuff-brilliant-through-wifi.jpg") 0 0 no-repeat; -moz-border-radius: 10px; -webkit-border-radius:10px; border-radius:10px; } div.plans h5 { margin-bottom:0; line-height:1em; } div.plans span.yes, div.plans span.no { display:block; text-indent:-9000em; width:20px; height:20px; background:transparent url("/images/4.6/cs/icon-green-checked.png") 0 0 no-repeat; } div.plans span.no { background-position:0 -20px; } div.plans .pricing { text-align:center; padding-left:20px; } div.plans-headline h5 { text-align:center; line-height:16px; padding-left:35px; } div.plans-links div.button { } div.footnotes { font-size:11px; font-family:verdana; padding:30px 0 0 10px; clear:both; } div.footnotes span { display:block; } p.footnotes {font-size:10px; font-family:verdana; line-height:16px;} /* Musik Hören */ /********************************************************************************************/ body.musik-hoeren div#pageWrapper { background: url("/images/4.6/cs/screen-listen-to-music.png") no-repeat scroll -40px 110px transparent; } body.musik-hoeren .firstContentBlock { margin-bottom: 110px; margin-top: 50px; } /* Company Info */ /********************************************************************************************/ ul.cinfo-nav {} ul.cinfo-nav li { clear:both; overflow:hidden; margin-bottom:5px; } /* Contacts */ /********************************************************************************************/ div.contacts h2 { } ul.contactsList li { overflow:hidden; margin-bottom:50px;} ul.contactsList li p { margin-bottom:5px;} /* Partner */ /********************************************************************************************/ ul.partnerList { margin:20px 0 20px 0; } ul.partnerList li { float:left; height:85px; margin-right:85px; } /* Creatives */ /********************************************************************************************/ div.creatives ul { margin-bottom:20px; } div.creatives ul li a { display:block; font-size:11px; color:#666; text-decoration:none; } div.creatives ul li a:hover { color:#0C99D1; } /* Press List */ /********************************************************************************************/ ul.datesNav { margin-bottom:20px; } ul.datesNav li { float:left; display:inline; margin:0 10px 0 0;} ul.pressReleaseList { } ul.pressReleaseList h4 { font-size:18px; } ul.pressReleaseList h5 { font-size:18px; margin-bottom:5px; } ul.pressReleaseList li { background: transparent url("/images/4.6/cs/hr-line-1pixel.gif") repeat-x bottom center; padding:15px 0 15px 15px; } div.pressCopy, div.pressCopy p { font-size:11px; line-height:18px; } div.pressCopy h2 { color:#666; } div.pressCopy h5 { font-size:26px; } div.pressCopy span.dateinfo { display:block; } div.pressCopy a { color:#666; } div.pressCopy a:hover { color:#0C99D1; } ul.pressCopyLists ul { margin-left:20px; } ul.pressCopyLists ul li { padding-left: 15px; margin:5px 0 5px 0; background: transparent url("/images/4.6/cs/icon-list-bullet.gif") 0 5px no-repeat; } ul.simpleList { margin:0 0 20px 20px; } ul.noLeftMargin { margin:0 0 20px 0!important;} ul.simpleList li{ padding-left: 15px; margin:5px 0 5px 0; background: transparent url("/images/4.6/cs/icon-list-bullet.gif") 0 5px no-repeat; } div.privacy-policy a { color:#0C99D1; font-weight:bold; text-decoration:none; } div.privacy-policy, div.privacy-policy p { font-size:11px; } /********************************************************************************************/ /* 960 Grid System ~ Core CSS. Learn more ~ http://960.gs/ Licensed under GPL and MIT. */ .container_12, .container_16{margin-left:auto; margin-right:auto; width:960px; position:relative; z-index:10}.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12, .grid_13, .grid_14, .grid_15, .grid_16{display:inline; float:left; position:relative; margin-left:10px; margin-right:10px}.container_12 .grid_3{width:220px}.container_12 .grid_6{width:460px}.container_12 .grid_9{width:700px}.container_12 .grid_12{width:940px}.alpha{margin-left:0}.omega{margin-right:0!important}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_12 .prefix_3{padding-left:240px}.container_12 .prefix_6{padding-left:480px}.container_12 .prefix_9{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_12 .suffix_3{padding-right:240px}.container_12 .suffix_6{padding-right:480px}.container_12 .suffix_9{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_12 .push_3{left:240px}.container_12 .push_6{left:480px}.container_12 .push_9{left:720px}.container_12 .push_1{left:80px}.container_12 .push_2{left:160px}.container_12 .push_4{left:320px}.container_12 .push_5{left:400px}.container_12 .push_7{left:560px}.container_12 .push_8{left:640px}.container_12 .push_10{left:800px}.container_12 .push_11{left:880px}.container_12 .pull_3{left:-240px}.container_12 .pull_6{left:-480px}.container_12 .pull_9{left:-720px}.container_12 .pull_1{left:-80px}.container_12 .pull_2{left:-160px}.container_12 .pull_4{left:-320px}.container_12 .pull_5{left:-400px}.container_12 .pull_7{left:-560px}.container_12 .pull_8{left:-640px}.container_12 .pull_10{left:-800px}.container_12 .pull_11{left:-880px} /* Misc & Clearfix */ /********************************************************************************************/ .on-top { z-index: 10000; } /* zindex ie fix */ .fr {float:right;} .fl {float:left;} .clear {clear:both;} .block {display:block;} .black {background-color:black; color:white;} .show {display:block!important;} .hide {display:none!important; } .nobg { background:none!important; } .center { text-align:center; } .tb { position:relative; top:-5px; } /* if a button follows a h4 headline */ .mb50 { margin-bottom:50px; } .mb25 { margin-bottom:25px; } .mt50 { margin-top:50px; } .mt5 { margin-top:5px; } .mt10 { margin-top:10px; } .mt20 { margin-top:20px; } .mt30 { margin-top:30px; } .mr10 { margin-right:10px; } .mr20 { margin-right:20px; } .ieMarginFix { margin-bottom:15px; } html>body .ieMarginFix { *margin-bottom:-5px; } /*ie*/ .clearfix:after { content: " "; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; font-size:0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } * html .clearfix { height: 1%; } /* Horizontal Rule Divider */ /********************************************************************************************/ div.hrline hr{ display:none; } div.hrline { background: transparent url("/images/4.6/cs/hr-line-1pixel.gif") repeat-x center center; height: 20px; } div.large {height: 60px;} div.onepixel { height: 1px; } div.line-2-col { background: transparent url("/images/4.6/cs/line-2-col.png") 0 0 no-repeat; height:2px; } /* Nyro Modal Popup Layer Styles */ /********************************************************************************************/ div#nyroModalFull { font-size: 12px; color: #777; } div#nyroModalLoading { border: 4px solid #777; width: 150px; height: 150px; text-indent: -9999em; background: #fff url(/images/4.6/cs/icon-ajaxLoader.gif) no-repeat; background-position: center; } div#nyroModalLoading.error { border: 4px solid #f66; line-height: 20px; padding: 20px; width: 300px; height: 100px; text-indent: 0; background: #fff; } div#nyroModalWrapper { background: #fff; border: 4px solid #777; } a#closeBut { position: absolute; display: block; top: -13px; right: -13px; width: 24px; height: 24px; text-indent: -9999em; background: url(/images/4.6/cs/icon-close.png) no-repeat; outline: 0; } h1#nyroModalTitle { margin: 0; padding: 0; position: absolute; top: -22px; left: 5px; font-size: 12px; color: #ddd; } div.wrapper div#nyroModalContent { padding: 5px; } div.wrapperImg div#nyroModalContent { position: relative; overflow: hidden; text-align: center; } div.wrapperImg img { vertical-align: baseline; } div.wrapperImg div#nyroModalContent div { position: absolute; bottom: 0; left: 0; background: black; padding: 10px; margin: 10px; border: 1px white dotted; overflow: hidden; opacity: 0.2; filter: alpha(opacity=20); } div.wrapperImg div#nyroModalContent div:hover { opacity: 0.5; filter: alpha(opacity=50); cursor: help; } a.nyroModalPrev, a.nyroModalNext { z-index: 105; outline: none; position: absolute; top: 0; height: 100%; width: 40%; cursor: pointer; text-indent: -9999em; background-image: url(data:image/gif;base64,AAAA); /* Trick IE6 */ } div.wrapperSwf a.nyroModalPrev, div.wrapperSwf a.nyroModalNext, div.wrapper a.nyroModalPrev, div.wrapper a.nyroModalNext { height: 60%; width: 20%; } a.nyroModalPrev { left: 0;} a.nyroModalPrev:hover { background: url(/images/4.6/cs/icon-prev.gif) left 20% no-repeat; } a.nyroModalNext { right: 0; } a.nyroModalNext:hover { background: url(/images/4.6/cs/icon-next.gif) right 20% no-repeat; }