/** NOTE: some lines may appear incorrect in your editor (marked as error). this is due to the mozilla(-ff)-transparency-effect which is misunderstood by almost every css-validator since it starts with an hyphen ("-"). the style IS correct! (ks0407) **/ /** PAGE/FRAME **/ html,body { margin:0px; padding:0px; height:100% } html,body,textarea { font-family:verdana,sans-serif; font-size:11px; background:#fff; color:#000 } #pageframe { width:990px } #backgroundTreeTeaser { border-bottom:1px solid #999; background:url(/pix/page_bg_tree_teaser.gif) 0px 0px repeat-y } #backgroundTree { border-bottom:1px solid #999; background:url(/pix/page_bg_tree.gif) 0px 0px repeat-y } /** (PAGE/FRAME) CONTENT (frames and distances) **/ #pageContent { float:left; width:633px; padding:0px 10px } #pageContentBig { float:left; padding-left:10px; width:822px; } #print #pageContentBig { padding:0px; width:590px } #highlightMatrix { float:left; width:653px; overflow:hidden } .albisIframe { width:810px; height:550px; } /** MESSAGE BOXES **/ /** (MESSAGE BOXES) ERROR **/ .errorBox { background:url(/pix/error_small.gif) 5px 5px no-repeat #ffcaca; border:1px solid #e52030; padding:5px 5px 5px 35px; min-height:25px } /** (MESSAGE BOXES) INFO **/ .infoBox { background:url(/pix/info_small.gif) 5px 5px no-repeat #d8deea; border:1px solid #0e54ba; padding:5px 5px 5px 35px; min-height:25px } /** EITHER BOX **/ .centerBox .txt { float:left; width:265px } /** CORE **/ .clipLine { border-bottom:1px solid #ccc; margin-bottom:20px; line-height:20px; margin-top:10px; font-size:10px; text-align:right; } a { text-decoration:underline; color:#000 } img { border:0px } .clear { clear:both; font-size:0px; height:0px; line-height:0px } .bold { font-weight:bold } /** (CORE) 10 pixel space in height, eg. used at product-detail-page **/ br.spacer { height:10px; line-height:10px; font-size:10px } form { display:inline; padding:0px; margin:0px } .input { border:1px solid #666; background:#fff; color:#000; font-size:11px; padding:0px; margin:0px } .input.checkbox {padding:2px } textarea {padding:0px;margin:0px} label { cursor:pointer } button { font-family:verdana,sans-serif } input.button { margin:0 5px; padding:0px 5px; height:18px; width:0px; width:auto; overflow:visible; font-weight:bold; font-size:11px; font-family:verdana,arial,sans; border:1px solid #666; border-top:1px solid #fff; border-left:1px solid #fff; background:#ccc; cursor:pointer } /** (CORE) TO-TOP-LINK **/ .toTop { margin-top:5px; text-align:right } .toTop a { font-size:10px } .hideToTop .toTop { display:none; } /** (CORE) HEADLINE **/ h1 { font-size:20px; line-height:24px; border-bottom:1px solid #ccc; padding:0px 0px 2px 0px; margin:0px } h2 { font-size:18px; line-height:22px; margin:0px; padding:0px } h3 { font-size:16px; line-height:19px; margin:0px; padding:0px } h4 { font-size:14px; line-height:17px; margin:0px; padding:0px } /** <-- (CORE) eg.: product-listing sub-header **/ h5 { font-size:12px; line-height:14px; margin:0px; padding:0px } /** <-- (CORE) smallest head larger than default (11px) **/ /** InformationI FeatureInfo **/ .blueI { margin-left:12px; width:21px; height:21px;; } /** (CORE) price **/ .price { color:#e52030; font-weight:bold; font-size:12px; } hr {border:0px; height:1px;background:#ccc;margin:0px;padding:0px; } /** (CORE) ERROR **/ .error { color:#E52030 } .readonly input[readonly] { border:0 !important; cursor:default; background-color:#ececec; } /** (CORE) LINKS **/ a.cartLink { float:left; width:18px; height:15px; text-decoration:none; background:url(/pix/icons/cart.gif) 0px 0px no-repeat } a.builderLinkAdd { float:left; width:18px; height:15px; text-decoration:none; background:url(/pix/icons/cog.gif) 0px 0px no-repeat } a.builderLinkExchange { float:left; width:18px; height:15px; text-decoration:none; background:url(/pix/icons/change.gif) 0px 0px no-repeat } a.compareLink { float:left; width:18px; height:15px; text-decoration:none; background:url(/pix/icons/compare.gif) 0px 0px no-repeat } a.bidLink { float:left; width:18px; height:15px; text-decoration:none; background:url(/pix/icons/bid.gif) 0px 0px no-repeat } a.viewLink { float:left; width:18px; height:15px; text-decoration:none; background:url(/pix/icons/eye.gif) 0px 0px no-repeat } a.toCartLink { display:block; height:15px; padding:5px 0px 5px 20px; text-decoration:underline; font-weight:bold; background:url(/pix/icons/cart.gif) left center no-repeat } a.toCheckoutLink { display:block; height:15px; padding-left:20px; text-decoration:underline; font-weight:bold; background:url(/pix/icons/checkout.gif) 0px 0px no-repeat } a.backLink { display:block; height:15px; padding-left:20px; text-decoration:underline; font-weight:bold; background:url(/pix/icons/back.gif) 0px 0px no-repeat } a.printVersionLink { float:right; height:15px;padding-left:20px; text-decoration:underline; font-weight:bold; background:url(/pix/icons/printer.gif) 0px 0px no-repeat } a.changeComponent { display:block; height:15px; line-height:15px; padding-left:20px; text-decoration:underline; font-weight:bold; background:url(/pix/icons/change.gif) 0px 0px no-repeat} a.deleteComponent { display:block; height:15px; line-height:15px; padding-left:20px; text-decoration:underline; font-weight:bold; background:url(/pix/icons/delete.gif) 0px 0px no-repeat} a.detailOverview { display:block; height:15px; line-height:15px; font-weight:bold; background:url(/pix/icons/mini_pc.gif) 0px 0px no-repeat #fff; padding-left:20px; text-decoration:underline } a.finishBuilder { display:block; height:15px; line-height:15px; font-weight:bold; background:url(/pix/icons/cart.gif) 0px 0px no-repeat #fff; padding-left:20px; text-decoration:underline } a.messageInfo { float:right; height:15px; line-height:15px; margin-top:6px; background:url(/pix/icons/mail.gif) 0px 0px no-repeat; padding-left:23px; font-weight:bold; font-size:10px } a.reloadPage { float:left; height:15px; line-height:15px; background:url(/pix/icons/reload.gif) 0px 0px no-repeat; padding-left:23px; font-weight:bold; font-size:10px } a.auctionView { float:left; height:15px; line-height:15px; font-weight:bold; background:url(/pix/icons/eye.gif) 0px 0px no-repeat; padding-left:20px } a.auctionBid { float:right; height:15px; line-height:15px; font-weight:bold; background:url(/pix/icons/bid.gif) 0px 0px no-repeat; padding-left:20px } a.deleteLink { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/delete.gif) 0px 0px no-repeat } a.saveLink { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/save.gif) 0px 0px no-repeat } a.loadLink { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/load.gif) 0px 0px no-repeat } a.sendCartLink { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/cart_send.gif) 0px 0px no-repeat } a.financeCartLink { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/finance.gif) 0px 0px no-repeat } a.loadSavedCartLink { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/load.gif) 0px 0px no-repeat } a.deleteSavedCartLink { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/delete.gif) 0px 0px no-repeat } a.loadRecLink { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/load.gif) 0px 0px no-repeat } a.deleteLink { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/delete.gif) 0px 0px no-repeat } a.subPoint { float:left; height:15px; padding-left:20px; font-weight:bold; background:url(/pix/icons/subpoint.gif) 0px 0px no-repeat } /** (CORE) BUTTONS **/ .smallButton { border:1px solid #666; border-top:1px solid #fff; border-left:1px solid #fff; background-position:5px 5px; background-repeat:no-repeat; background-color:#ccc; text-align:left; padding-left:25px; font-size:11px; cursor:pointer } /**#detailRight #cartSubmit { border:1px solid #ccc; border-top:1px solid #eee; width:179px; height:40px; overflow:hidden; text-align:left; padding-left:40px; background:url(/pix/icons/big/cart.gif) 5px 5px no-repeat #eee; font-weight:bold; font-size:12px; cursor:pointer }**/ #auctionBidBig { float:left; border:1px solid #eee; height:40px; line-height:40px; overflow:hidden; text-align:left; padding-left:40px; background:url(/pix/icons/big/bid.gif) 5px 5px no-repeat #eee; font-weight:bold; font-size:12px; cursor:pointer } .refreshButton {height:25px;line-height:22px; background-image:url(/pix/icons/reload.gif)} .checkoutButton {height:27px;float:right;line-height:22px; background-image:url(/pix/icons/checkout.gif)} .cartButton {height:27px;float:right;line-height:22px; background-image:url(/pix/icons/cart.gif)} .saveCartButton {height:27px;float:right;line-height:22px;background-image:url(/pix/icons/save.gif)} .sendCartButton {height:27px;float:right;line-height:22px;background-image:url(/pix/icons/send.gif)} .calculateFinanceButton {height:27px;float:right;line-height:22px;background-image:url(/pix/icons/finance.gif)} .deleteButton {height:27px;float:right;line-height:22px;background-image:url(/pix/icons/delete.gif)} /** PAGE CONTENT **/ .pic100x100 { float:left; width:100px; height:100px; margin:0px 10px 5px 0px; border:1px solid #ccc; background-color:#fff; background-position:0px 0px; background-repeat:no-repeat } .pageText { float:left } #pageContentBig .pageText { width:710px } #pageContent .pageText { width:521px } /** centered boxes like the login-box **/ .centerBox { margin:20px auto 0px auto } #pageContentBig .centerBox { width:540px } #pageContentBig .centerBox .listBodyBorder { width:528px } #pageContent .centerBox { width:340px } #pageContent .centerBox .listBodyBorder { width:328px } /** (PAGE CONTENT) frame around forms (login, fleaMarket, atl.) **/ .formFrame { border:1px solid #ccc; background:#eee; padding:5px } .formFrame label { display:block; font-weight:bold } .formFrame label.required { background:url(/pix/icons/small/required.gif) 0px 1px no-repeat; padding-left:15px } .formFrame label.required.error { background-image:url(/pix/icons/small/required_red.gif) } .formFrame select#academicTitle, .formFrame select#delAcademicTitle, .formFrame select#salutation, .formFrame select#delSalutation { width:218px; } #print table { border:0; padding:5px; } #print table th { text-align:left; } /** TERMS AND CONDITIONS (and the like) **/ .section { margin-bottom:15px; border-bottom:1px solid #ccc } .section .sectionContent { padding-top:15px } .section .sectionContent .sectionContentCount { float:left; width:50px; font-weight:bold } .section .sectionContent .sectionContentText { float:left } .section .sectionContent .head { font-size:12px; font-weight:bold } .section .sectionContent .sectionContentText .sectionContentSubCount { float:left; margin-top:5px; width:20px; font-weight:bold; } .section .sectionContent .sectionContentText .sectionContentSubText { float:left; margin-top:5px; width:96%; } #pageContentBig .section { width:822px } #pageContent .section { width:633px } #pageContentBig .section .sectionContent .sectionContentText { width:772px } #pageContent .section .sectionContent .sectionContentText { width:583px } #print .section .sectionContent .sectionContentText { width:500px } /** LOGIN **/ .loginContainer { margin-top:5px } .loginContainer input#loginUsername, .loginContainer input#loginPassword { width:280px; height:16px; font-size:11px } .loginContainer a { display:block; margin-top:5px; font-weight:bold } /** HEADER **/ #header { position:relative; height:60px; overflow:hidden; background:url(/pix/header/head_bg.gif) 0px 0px repeat-y #92B3D6; margin-bottom:2px } #header #headerLogo { float:left; margin:6px 0px 0px 10px; width:237px; height:60px; background-position:0px 0px; background-repeat:no-repeat; text-decoration:none } #headerUserinfo { position:absolute; top:10px; left:245px; width:550px; height:50px; overflow:hidden; z-index:999999; color:#fff; font-weight:bold } #header .headerLinkPic { float:right; height:50px; margin:5px 10px 0px 0px; text-decoration:none; background-repeat:no-repeat; background-position:0px 0px } /** (HEADER) links at the right **/ #headerLinks { float:right; display:inline; margin:5px 5px 0px 5px; color:#fff; text-align:right } #headerLinks a { color:#fff; line-height:16px; text-decoration:none } #headerLinks a:hover { text-decoration:underline } /** TREE **/ #tree { float:left; width:158px; overflow:hidden } /** (TREE) MICRO TEASER (top left side of the page. below header) **/ #microTeaser { width:158px; height:34px; overflow:hidden; text-align:center; background:#fff; margin:0px; padding:0px; } /** (TREE) MINI SEARCH **/ #miniSearch { width:158px; border:1px solid #999; border-left:0px; border-right:0px; font-size:10px; color:#666; background:#ccc } .contentNEUTRAL #miniSearch { color:#666; background:#ccc; } .miniSearchNeutral { color:#666 !important; background:#ccc; } /** Active/Hover White Text Color**/ .contentHARDWARE #miniSearch, .miniSearchHard, .contentSOFTWARE #miniSearch, .miniSearchSoft, .contentENTERTAINMENT #miniSearch, .miniSearchEntn, .contentMYALTERNATE #miniSearch, .miniSearchMyAlt, .contentBUILDERS #miniSearch, .miniSearchBuilder, .contentAPPLEPORTAL #miniSearch, .miniSearchApple, .contentHELP #miniSearch, .miniSearchHelp, .contentZACKZACK #miniSearch, .miniSearchZackZack, .contentHOMELIVING #miniSearch, .miniSearchHomeLiving, .contentGREENIT #miniSearch, .miniSearchGreenIT, .contentSECURITY #miniSearch, .miniSearchSecurity, .contentZAKELIJK #miniSearch, .contentDIENSTEN #miniSearch, .miniSearchB2BNL, .contentPARTICULARES #miniSearch, .miniSearchB2CES, .contentHARDWARE #miniSearch a#miniSearchDetailSearch, .contentSOFTWARE #miniSearch a#miniSearchDetailSearch, .contentENTERTAINMENT #miniSearch a#miniSearchDetailSearch, .contentMYALTERNATE #miniSearch a#miniSearchDetailSearch, .contentBUILDERS #miniSearch a#miniSearchDetailSearch, .contentNOTEBOOK #miniSearch a#miniSearchDetailSearch, .contentAPPLEPORTAL #miniSearch a#miniSearchDetailSearch, .contentPC #miniSearch a#miniSearchDetailSearch, .contentHELP #miniSearch a#miniSearchDetailSearch, .contentHOMELIVING #miniSearch a#miniSearchDetailSearch, .contentSECURITY #miniSearch a#miniSearchDetailSearch, .contentPARTICULARES #miniSearch a#miniSearchDetailSearch, .contentDIENSTEN #miniSearch a#miniSearchDetailSearch, .contentGAMING #miniSearch a#miniSearchDetailSearch, .miniSearchHard a#miniSearchDetailSearch, .miniSearchSoft a#miniSearchDetailSearch, .miniSearchEntn a#miniSearchDetailSearch, .miniSearchMyAlt a#miniSearchDetailSearch, .miniSearchBuilder a#miniSearchDetailSearch, .miniSearchNotebook a#miniSearchDetailSearch, .miniSearchPc a#miniSearchDetailSearch, .miniSearchHelp a#miniSearchDetailSearch, .miniSearchB2BNL a#miniSearchDetailSearch, .miniSearchB2CES a#miniSearchDetailSearch, .miniSearchHOMELIVING a#miniSearchDetailSearch, .miniSearchSECURITY a#miniSearchDetailSearch, .miniSearchGAMING a#miniSearchDetailSearch, #tabberTabs a.tabHardActive span.tabRowBG, #tabberTabs a.tabHardActive span.tabRowFoot, #tabberTabs a.tabSoftActive span.tabRowBG, #tabberTabs a.tabSoftActive span.tabRowFoot, #tabberTabs a.tabEntnActive span.tabRowBG, #tabberTabs a.tabEntnActive span.tabRowFoot, #tabberTabs a.tabMyAltActive span.tabRowBG, #tabberTabs a.tabMyAltActive span.tabRowFoot, #tabberTabs a.tabBuilderActive span.tabRowBG, #tabberTabs a.tabBuilderActive span.tabRowFoot, #tabberTabs a.tabNotebookActive span.tabRowBG, #tabberTabs a.tabNotebookActive span.tabRowFoot, #tabberTabs a.tabPcActive span.tabRowBG, #tabberTabs a.tabPcActive span.tabRowFoot, #tabberTabs a.tabAppleActive span.tabRowBG, #tabberTabs a.tabAppleActive span.tabRowFoot, #tabberTabs a.tabPhotoServiceActive span.tabRowBG, #tabberTabs a.tabPhotoServiceActive span.tabRowFoot, #tabberTabs a.tabGamingActive span.tabRowBG, #tabberTabs a.tabGamingActive span.tabRowFoot, #tabberTabs a.tabB2BNLSolutionsActive span.tabRowBG, #tabberTabs a.tabB2BNLSolutionsActive span.tabRowFoot, #tabberTabs a.tabZackZackActive span.tabRowBG, #tabberTabs a.tabZackZackActive span.tabRowFoot, #tabberTabs a.tabHomeLivingActive span.tabRowBG, #tabberTabs a.tabHomeLivingActive span.tabRowFoot, #tabberTabs a.tabGreenITActive span.tabRowBG, #tabberTabs a.tabGreenITActive span.tabRowFoot, #tabberTabs a.tabSecurityActive span.tabRowBG, #tabberTabs a.tabSecurityActive span.tabRowFoot, #tabberTabs a.tabB2BNLActive span.tabRowBG, #tabberTabs a.tabB2BNLActive span.tabRowFoot, #tabberTabs a.tabB2CESActive span.tabRowBG, #tabberTabs a.tabB2CESActive span.tabRowFoot, #tabberTabs a.tabHelpActive span.tabRowBG, #tabberTabs a.tabHelpActive span.tabRowFoot { color:#fff; } a#miniSearchDetailSearch { display:block; height:16px; line-height:14px; width:154px; margin-left:3px; border-right:1px solid #999; font-weight:bold; color:#666 } #miniSearchCategory { width:157px; height:22px; line-height:22px; border-right:1px solid #999; overflow:hidden } input.searchCriteria { float:left; width:120px; height:16px; margin:2px 3px 0px 3px } input.miniSearchSubmit { float:left; width:24px; height:18px; margin-top:2px } /** (TREE) MINI LOGIN (shown on start-page only) **/ #miniLogin { background:#ccc; width:157px; border:1px solid #999; border-left:0px; padding:2px 0px; font-size:10px } #miniLoginForm { float:left; width:122px; margin-left:3px; display:inline } #miniLoginButton { float:left; width:24px; height:18px; margin:28px 0px 0px 3px } #miniLoginForm input#miniLoginUsername, #miniLoginForm input#miniLoginPassword { width:120px; height:16px } a.miniLoginLink { display:block; padding:2px 0px; width:154px; margin-left:3px; font-weight:bold; color:#666 } /** (TREE) Plain Text **/ .treeInfoText { color:#000; font-weight:bold; padding-left:12px } /** (TREE) Navigation **/ #tree ul { list-style:none; margin:0px; padding:0px } #tree ul.folderOpen { border-top:1px solid #999; border-bottom:1px solid #999; background:url(/pix/tree/tree_bg_dark.gif) 0px 0px repeat-y } #tree ul li { padding-left:12px; line-height:18px; background-position:2px 6px; background-repeat:no-repeat } #tree ul li.folderClosed { background-image:url(/pix/tree/tree_arrow_closed.gif) } #tree ul li.folderOpen { background-image:url(/pix/tree/tree_arrow_open.gif) } #tree ul li a { color:#666; text-decoration:none; padding-right:4px } #tree ul li a:hover { text-decoration:underline } #tree ul li.leafActive { background:#fff; border-top:1px solid #999; border-bottom:1px solid #999 } #tree ul li.leafActive, #tree ul li.folderOpen a { font-weight:bold } #tree ul li.header { border-bottom:1px #AAA solid;font-weight:bold;color:#666; } #tree ul li.level1 { padding-left:24px; background-position:14px 6px } #tree ul li.level1.header { padding-left:9px;margin:8px 15px 0px 15px; } #tree ul li.level2 { padding-left:36px; background-position:26px 6px } #tree ul li.level2.header { padding-left:9px;margin:8px 27px 0px 15px; } #tree ul li.level3 { padding-left:48px; background-position:38px 6px } #tree ul li.level3.header { padding-left:9px;margin:8px 39px 0px 15px; } /**#testtab:hover span.tabRowBG { color:#fff; background:#e52030;}**/ /** TABBER **/ #tabber { float:left; position:relative; width:832px; height:58px; background:#fff } /** (TABBER) MY ACCOUNT/LOGIN/LOGOUT **/ #myAccountBox { position:absolute; top:0px; right:0px; text-align:right; height:34px; overflow:hidden; padding-right:5px } #myAccountBox a { line-height:16px } /** (TABBER) ADDITIONAL COSTS INFO (* at the prices) **/ #tabberAdditionalCosts { position:absolute; top:0px; left:0px; font-size:10px; height:14px; line-height:14px; width:672px; padding-left:10px; color:#999 } #tabberAdditionalCosts a { color:#666; text-decoration:none } #tabberAdditionalCosts a:hover { text-decoration:underline } /** (TABBER) TABBER TABS (area for the tabs, parent to all tabs) **/ #tabberTabs { position:absolute; top:15px; left:0px; z-index:1; height:20px; line-height:20px; padding-left:5px } /** Tab without Images NEW**/ #tabberTabs a.tabNew { height:20px; float:left; text-decoration:none; cursor:pointer; margin-right:6px; } #tabberTabs a.tabNew span { float:left; overflow:hidden; border-bottom:1px solid #999; } #tabberTabs a.tabNew span.bg { background:#f7f7f7; } #tabberTabs a.tabNew .c1 { height:14px; width:1px; margin:5px 0 0 0; background:#999; } #tabberTabs a.tabNew .c2 { height:14px; width:1px; margin:3px 0 0 0; border-top:2px solid #999; } #tabberTabs a.tabNew .c3 { height:16px; width:1px; margin:2px 0 0 0; border-top:1px solid #999; } #tabberTabs a.tabNew .c4 { height:17px; width:2px; margin:1px 0 0 0; border-top:1px solid #999; } #tabberTabs a.tabNew .text { height:18px; line-height:18px; border-top:1px solid #999; padding:0 3px; } /** Tab without Images**/ #tabberTabs a.tab { outline:0; float:left; position:relative; cursor:pointer; margin-left:3px; height:20px; color:#000; text-decoration:none } #tabberTabs a.tab span.newTabInfo { position:absolute; top:-7px; left:10px; color:#fff; font-size:11px; height:11px; line-height:11px; font-weight:bold; padding:0px 4px; background:#c00; font-variant:small-caps } #tabberTabs a.tab span { overflow:hidden; display:block;} #tabberTabs a.tab span.tabRowHead_1 { background:#999; margin:0 5px; } #tabberTabs a.tab span.tabRowHead_2 { margin:0 3px; border-left:2px solid #999 !important; border-right:2px solid #999 !important; } #tabberTabs a.tab span.tabRowHead_3 { margin:0 2px; } #tabberTabs a.tab span.tabRowHead_4 { height:2px; margin:0 1px; font-size:0px; line-height:0px; } #tabberTabs a.tab span.tabRowHead_1, #tabberTabs a.tab span.tabRowHead_2, #tabberTabs a.tab span.tabRowHead_3, #tabberTabs a.tab span.tabRowFoot { height:1px; font-size:0px; line-height:0px; } #tabberTabs a.tab span.tabRowFoot { background:#999; } #tabberTabs a.tab span.tabRowHead_1, #tabberTabs a.tab span.tabRowBG { border-left:1px solid #999; border-right:1px solid #999; } #tabberTabs a.tab span.tabRowBG { background:#f7f7f7; } #tabberTabs a.tab span.tabRowTxt { height:14px; line-height:13px; text-align:center; padding:0px 13px; } #tabberTabs a#tabHelp { cursor:help } #tabberTabs a.tabHelpActive span.tabRowBG, #tabberTabs a.tabHelpActive span.tabRowFoot { cursor:help; } /** (TABBER) TABBER SUB-TABS **/ #tabberSubTabs { position:absolute; top:34px; left:0px; z-index:0; height:22px; border:1px solid #999; border-left:0px; width:831px; color:#000; background:#ccc } #tabberSubTabs div { height:22px; width:831px } #tabberSubTabs div a { float:left; padding:2px 5px; margin:2px 1px 1px 1px; height:14px; line-height:14px; color:#fff; text-decoration:none } #tabberSubTabs div a:hover { margin:1px 0px 0px 0px; border:1px solid #fff; background:url(/pix/white50perc.png) 0px 0px; color:#000 } #tabberSubTabs div.tabSub { display:none } #tabberSubTabs div.tabSubActive { display:block } /** Color **/ /** Color of HARDWARE**/ #tabberTabs a.tabHardActive span { border-bottom:1px solid #e52030; color:#fff; } #tabberTabs a.tabHardActive span.bg, #tabberTabs a.tabHardActive span.tabRowBG, #tabberTabs a.tabHardActive span.tabRowFoot, #tabberSubTabs div#tabHardSub, .contentHARDWARE #miniSearch, .miniSearchHard, .contentHARDWARE .listHead, .contentHARDWARE .letterChooser a { background-color:#e52030; } /** need for Hover**/ .miniSearchHard { background-color:#e52030 !important; } /** Color of SOFTWARE**/ #tabberTabs a.tabSoftActive span { border-bottom:1px solid #0e54ba; color:#fff; } #tabberTabs a.tabSoftActive span.bg, #tabberTabs a.tabSoftActive span.tabRowBG, #tabberTabs a.tabSoftActive span.tabRowFoot, #tabberSubTabs div#tabSoftSub, .contentSOFTWARE #miniSearch, .miniSearchSoft, .contentSOFTWARE .listHead, .contentSOFTWARE .letterChooser a { background-color:#0e54ba; } /** need for Hover**/ .miniSearchSoft { background-color:#0e54ba !important; } /** Color of ENTERTAINMENT**/ #tabberTabs a.tabEntnActive span { border-bottom:1px solid #29947c; color:#fff; } #tabberTabs a.tabEntnActive span.bg, #tabberTabs a.tabEntnActive span.tabRowBG, #tabberTabs a.tabEntnActive span.tabRowFoot, #tabberSubTabs div#tabEntnSub, .contentENTERTAINMENT #miniSearch, .miniSearchEntn, .contentENTERTAINMENT .listHead, .contentENTERTAINMENT .letterChooser a { background-color:#29947c;} /** need for Hover**/ .miniSearchEntn { background-color:#29947c !important; } /** Color of MYALTERNATE**/ #tabberTabs a.tabMyAltActive span { border-bottom:1px solid #ff5915; color:#fff; } #tabberTabs a.tabMyAltActive span.bg, #tabberTabs a.tabMyAltActive span.tabRowBG, #tabberTabs a.tabMyAltActive span.tabRowFoot, #tabberSubTabs div#tabMyAltSub, .contentMYALTERNATE #miniSearch, .miniSearchMyAlt, .contentMYALTERNATE .listHead, .contentMYALTERNATE .letterChooser a { background-color:#ff5915; } /** need for Hover**/ .miniSearchMyAlt { background-color:#ff5915 !important; } /** Color of HELP**/ #tabberTabs a.tabHelpActive span { border-bottom:1px solid #e7ac00; color:#fff; } #tabberTabs a.tabHelpActive span.bg, #tabberTabs a.tabHelpActive span.tabRowBG, #tabberTabs a.tabHelpActive span.tabRowFoot, #tabberSubTabs div#tabHelpSub, .contentHELP #miniSearch, .miniSearchHelp, .contentHELP .listHead, .contentHELP .letterChooser a { background-color:#e7ac00; }/**OLD: fe9833 **/ /** need for Hover**/ .miniSearchHelp { background-color:#e7ac00 !important; } /** Color of BUILDERS (Module)**/ #tabberTabs a.tabBuilderActive span { border-bottom:1px solid #1679cf; color:#fff; } #tabberTabs a.tabBuilderActive span.bg, #tabberTabs a.tabBuilderActive span.tabRowBG, #tabberTabs a.tabBuilderActive span.tabRowFoot, #tabberSubTabs div#tabBuilderSub, .contentBUILDERS #miniSearch, .miniSearchBuilder, .contentBUILDERS .listHead, .contentBUILDERS .letterChooser a { background-color:#1679cf; } /** need for Hover**/ .miniSearchBuilder { background-color:#1679cf !important; } /** Color of Notebook (Module portal_Notebook)**/ #tabberTabs a.tabNotebookActive span { border-bottom:1px solid #1679cf; color:#fff; } #tabberTabs a.tabNotebookActive span.bg, #tabberTabs a.tabNotebookActive span.tabRowBG, #tabberTabs a.tabNotebookActive span.tabRowFoot, #tabberSubTabs div#tabNotebookSub, .contentNOTEBOOK #miniSearch, .miniSearchNotebook, .contentNOTEBOOK .listHead, .contentNOTEBOOK .letterChooser a { background-color:#1679cf; } /** need for Hover**/ .miniSearchNotebook { background-color:#1679cf !important; } /** Color of PC (Module portal_pc)**/ #tabberTabs a.tabPcActive span { border-bottom:1px solid #1163C2; color:#fff; } #tabberTabs a.tabPcActive span.bg, #tabberTabs a.tabPcActive span.tabRowBG, #tabberTabs a.tabPcActive span.tabRowFoot, #tabberSubTabs div#tabPcSub, .contentPC #miniSearch, .miniSearchPc, .contentPC .listHead, .contentPC .letterChooser a { background-color:#1163C2; } /** need for Hover**/ .miniSearchPc { background-color:#1163C2 !important; } /** Color of APPLE (Module portal_apple)**/ #tabberTabs a.tabAppleActive span { border-bottom:1px solid #545454; color:#fff; } #tabberTabs a.tabAppleActive span.bg, #tabberTabs a.tabAppleActive span.tabRowBG, #tabberTabs a.tabAppleActive span.tabRowFoot, #tabberSubTabs div#tabAppleSub, .contentAPPLEPORTAL #miniSearch, .miniSearchApple, .contentAPPLEPORTAL .listHead, .contentAPPLEPORTAL .letterChooser a { background-color:#545454; } /** need for Hover**/ .miniSearchApple { background-color:#545454 !important; } /** Color of PHOTO (Module tabPhotoService)**/ #tabberTabs a.tabPhotoServiceActive span { border-bottom:1px solid #943486; color:#fff; } #tabberTabs a.tabPhotoServiceActive span.bg, #tabberTabs a.tabPhotoServiceActive span.tabRowBG, #tabberTabs a.tabPhotoServiceActive span.tabRowFoot, #tabberSubTabs div#tabPhotoServiceSub, .contentPHOTOSERVICE #miniSearch, .miniSearchPhotoService, .contentPHOTOSERVICE .listHead, .contentPHOTOSERVICE .letterChooser a { background-color:#943486; } /** need for Hover**/ .miniSearchPhotoService { background-color:#943486 !important; } /** Color of GAMING (Module tabGaming)**/ #tabberTabs a.tabGamingActive span { border-bottom:1px solid #004499; color:#fff; } #tabberTabs a.tabGamingActive span.bg, #tabberTabs a.tabGamingActive span.tabRowBG, #tabberTabs a.tabGamingActive span.tabRowFoot, #tabberSubTabs div#tabGamingSub, .contentGAMING #miniSearch, .miniSearchGaming, .contentGAMING .listHead, .contentGAMING .letterChooser a { background-color:#004499; } .miniSearchGaming { background-color:#004499 !important; } /** Color of "SOLUTIONS" Tab for B2B-NL**/ #tabberTabs a.tabB2BNLSolutionsActive span { border-bottom:1px solid #006666; color:#fff; } #tabberTabs a.tabB2BNLSolutionsActive span.bg, #tabberTabs a.tabB2BNLSolutionsActive span.tabRowBG, #tabberTabs a.tabB2BNLSolutionsActive span.tabRowFoot, #tabberSubTabs div#tabB2BNLSolutionsSub, .contentB2BNLSolutions #miniSearch, .miniSearchB2BNLSolutions, .contentB2BNLSolutions .listHead, .contentB2BNLSolutions .letterChooser a { background-color:#006666; } /**.miniSearchB2BNLSolutions { background-color:#009944 !important; }**/ /** need for Hover**/ /** Color of ZACKZACK (Module)**/ #tabberTabs a.tabZackZackActive span { border-bottom:1px solid #333; color:#fff; } #tabberTabs a.tabZackZackActive span.bg, #tabberTabs a.tabZackZackActive span.tabRowBG, #tabberTabs a.tabZackZackActive span.tabRowFoot, #tabberSubTabs div#tabZackZackSub, .contentZACKZACK #miniSearch, .miniSearchZackZack, .contentZACKZACK .listHead, .contentZACKZACK .letterChooser a { background-color:#333; } /** need for Hover**/ .miniSearchZackZack { background-color:#333 !important; } /** Color of HOMELIVING (Module)**/ #tabberTabs a.tabHomeLivingActive span { border-bottom:1px solid #522113; color:#fff; } #tabberTabs a.tabHomeLivingActive span.bg, #tabberTabs a.tabHomeLivingActive span.tabRowBG, #tabberTabs a.tabHomeLivingActive span.tabRowFoot, #tabberSubTabs div#tabHomeLivingSub, .contentHOMELIVING #miniSearch, .miniSearchHomeLiving, .contentHOMELIVING .listHead, .contentHOMELIVING .letterChooser a { background-color:#522113; } /** need for Hover**/ .miniSearchHomeLiving { background-color:#522113 !important; } /** Color of GREENIT (Module)**/ /** #tabberTabs a.tabGreenITActive span.tabRowBG, #tabberTabs a.tabGreenITActive span.tabRowFoot, #tabberSubTabs div#tabGreenITSub, .contentGREENIT #miniSearch, .miniSearchGreenIT, **/ .contentGREENIT .listHead, .contentGREENIT .letterChooser a { background-color:#c0d96e; } /** need for Hover**/ .miniSearchGreenIT { background-color:#c0d96e !important; } /** Color of SECURITY (Module)**/ #tabberTabs a.tabSecurityActive span { border-bottom:1px solid #066; color:#fff; } #tabberTabs a.tabSecurityActive span.bg, #tabberTabs a.tabSecurityActive span.tabRowBG, #tabberTabs a.tabSecurityActive span.tabRowFoot, #tabberSubTabs div#tabSecuritySub, .contentSECURITY #miniSearch, .miniSearchSecurity, .contentSECURITY .listHead, .contentSECURITY .letterChooser a { background-color:#066; } /** need for Hover**/ .miniSearchSecurity { background-color:#066 !important; } /** Color of ZAKELIJK (B2B NL TAB(Module))**/ #tabberTabs a.tabB2BNLActive span { border-bottom:1px solid #333; color:#fff; } #tabberTabs a.tabB2BNLActive span.bg, #tabberTabs a.tabB2BNLActive span.tabRowBG, #tabberTabs a.tabB2BNLActive span.tabRowFoot, #tabberSubTabs div#tabB2BNLSub, .contentZAKELIJK #miniSearch, .contentDIENSTEN #miniSearch, .miniSearchB2BNL, .contentZAKELIJK .listHead, .contentDIENSTEN .listHead, .contentZAKELIJK .letterChooser a, .contentDIENSTEN .letterChooser a { background-color:#333; } /** need for Hover**/ .miniSearchB2BNL { background-color:#333 !important; } /** Color of PARTICULARES (B2C NL TAB(Module))**/ #tabberTabs a.tabB2CESActive span { border-bottom:1px solid #333; color:#fff; } #tabberTabs a.tabB2CESActive span.bg, #tabberTabs a.tabB2CESActive span.tabRowBG, #tabberTabs a.tabB2CESActive span.tabRowFoot, #tabberSubTabs div#tabB2CESSub, .contentPARTICULARES #miniSearch, .miniSearchB2CES, .contentPARTICULARES .listHead, .contentPARTICULARES .letterChooser a { background-color:#333; } /** need for Hover**/ .miniSearchB2CES { background-color:#333 !important; } /** SHOP PATH (below header) **/ #shopPathContainer { float:left; width:832px; height:33px; background:#fff; overflow:hidden; } #shopPath { float:left; padding-left:5px; width:648px; line-height:33px; font-size:10px } #shopPathRight { float:right; width:179px; height:33px; overflow:hidden } #shopPathRight a.messageLink { float:right; font-weight:bold; font-size:10px; height:33px; line-height:33px; background-position:0px 7px } /** (SHOP PATH) .DE ONLY (currently)! new message(s) **/ a#shopPathHome { float:left; width:13px; margin:7px 3px 0px 5px; height:15px; background:url(/pix/icons/home.gif) 0px 0px no-repeat } /** TEASER **/ #teaser { float:right; width:179px; padding-top:10px; border-top:1px solid #ccc; overflow:hidden } .teaserBox { position:relative; height:220px; width:168px; margin:0px 0px 10px 9px; background:#fff; border:1px solid #ccc } .teaserBox div { position:absolute } .teaserBox .org { white-space:nowrap; position:relative; z-index:1; } .teaserBox .shd { white-space:nowrap; z-index:0 } .teaserBox .b { font-weight:bold } .teaserBox .l { text-decoration:underline } .teaserBox .lt { text-decoration:line-through } .teaserBox .k { font-style:italic } .teaserBox a { position:absolute; z-index:10 } .teaser_pic { width:168px; height:220px } .teaserLink { z-index:3 } /** MY_RECORDER **/ #bottomSeparator { height:23px } #bottomSeparator #bottomSeparatorLeft { float:left; width:158px; height:23px } #bottomSeparator #bottomSeparatorContentBig { float:left; width:832px; height:22px; border-bottom:1px solid #999 } #bottomSeparator #bottomSeparatorContent { float:left; width:653px; height:22px; border-bottom:1px solid #999 } #bottomSeparator #bottomSeparatorRight { float:right; width:179px; height:21px; background:#fff; border-top:1px solid #ccc; border-bottom:1px solid #999 } #myRecorder { background:#eee; border-right:1px solid #999; padding:10px 0px; width:989px } #myRecorder .prodPic { border-color:#ccc } .myRecorderSection { float:left; margin-right:10px; overflow:hidden } .myRecorderAreaFrame { padding:5px; border-bottom:1px solid #ccc; } #myRecorderTitle { height:18px; line-height:18px; background:#ccc; border:1px solid #999; border-left:0px; color:#666; text-align:right; padding-right:5px; font-weight:bold } .myRecorderSectionTitle { height:18px; line-height:18px; padding-left:5px; background:#fff; border:1px solid #ccc } .myRecorderProdDesc { float:left; margin-left:5px; width:190px; margin-right:5px } .noPreviewPic .myRecorderProdDesc { margin-left:0px; width:245px } .myRecorderProdLinks { float:right; width:18px } /** FOOTER **/ #footer { padding-top:10px; font-size:10px; text-align:center } /** HIGHLIGHT **/ /** (HIGHLIGHT) 1x1 **/ .Highlight1x1 { width:308px; height:210px; border:1px solid #ccc; margin:0px 0px 10px 11px; float:left; display:inline; cursor:pointer } .Highlight1x1 var { display:none } .Highlight1x1_frame { position:relative; padding:5px } .Highlight1x1_rubric { font-weight:bold; margin-bottom:5px } .Highlight1x1_title a { position:relative; font-weight:bold; font-size:14px; z-index:1 } .Highlight1x1_picBox { position:absolute; top:50px; left:6px; width:120px; height:120px; background-repeat:no-repeat; background-position:0px 0px; z-index:0 } .Highlight1x1_txtBox { position:absolute; top:50px; left:135px; width:155px; height:105px } .Highlight1x1_txtBox a { font-weight:bold } /** (HIGHLIGHT) 2x1 **/ .Hlight2x1 { position:relative; z-index:0; clear:both; width:630px; height:212px; overflow:hidden; margin:0px 0px 0px 11px } .Hlight2x1 a { position:absolute; z-index:10; width:630px; height:212px } .Hlight2x1 div { position:absolute; white-space:nowrap } .Hlight2x1 .bg { top:0px; left:0px; width:630px; height:212px; background-repeat:no-repeat; background-position:0px 0px; z-index:0 } .Hlight2x1 .org { position:relative; z-index:1 } .Hlight2x1 .shd { z-index:0 } .Hlight2x1 .b { font-weight:bold } .Hlight2x1 .l { text-decoration:line-through } .Hlight2x1 .k { font-style:italic } .Hlight2x1 img { width:630px; height:212px; border:0px } .Hlight2x1 .prc { padding:0px 5px; padding-bottom:5px; background:#ff0; font-weight:bold; border-bottom:1px solid #000; border-right:1px solid #000 } .Hlight2x1 .prc .shd { padding:0px 5px } .Hlight2x1 .prc .strikethrough { position: relative; text-decoration: line-through } .Hlight2x1 .prc .strikethrough sup { vertical-align: top; font-size: 11px } .Hlight2x1 .prc .priceBlock { position: relative } .Hlight2x1 .prc .priceBlock .shd { padding:0px } .Hlight2x1 .prc .priceBlock .org { position:relative } /** HIGHLIGHT 3x1 Styles -------------------------------**/ .Hlight3x1 { position:relative; z-index:0; clear:both; width:822px; height:189px; overflow:hidden; margin:0px 0px 8px 0px } .Hlight3x1 a { position:absolute; z-index:10; width:822px; height:189px; } .Hlight3x1 div { position:absolute; white-space:nowrap } .Hlight3x1 .bg { position:absolute; top:0; left:0; width:822px; height:189px; background-repeat:no-repeat !important; background-position:0 0; z-index:0 } .Hlight3x1 .org { position:relative; z-index:1; } .Hlight3x1 .shd { z-index:0 } .Hlight3x1 .b { font-weight:bold } .Hlight3x1 .l { text-decoration:line-through } .Hlight3x1 .k { font-style:italic } .Hlight3x1 img { width:822px; height:189px; border:0 } .Hlight3x1 .prc { padding:0px 5px; padding-bottom:5px; background:#ff0; font-weight:bold; border-bottom:1px solid #000; border-right:1px solid #000 } .Hlight3x1 .prc .shd { padding:0px 5px } .Hlight3x1 .prc .strikethrough { position: relative; text-decoration: line-through } .Hlight3x1 .prc .strikethrough sup { vertical-align: top; font-size: 11px } .Hlight3x1 .prc .priceBlock { position: relative } .Hlight3x1 .prc .priceBlock .shd { padding:0px } .Hlight3x1 .prc .priceBlock .org { position:relative } /** HIGHLIGHT 2x2 Styles -------------------------------**/ .Hlight2x2 { width:630px; clear:both; height:424px; margin:0 0 10px 11px; position:relative; overflow:hidden; background:url(/pix/highlight/2x2/bg.jpg) 0 0 no-repeat; } .Hlight2x2 .prod { position:relative; float:left; height:424px; } .Hlight2x2 .prod .low { font-size:14px; line-height:17px; padding-top:10px; text-align:center; color:#fff; font-weight:bold; width:114px; height:120px; position:absolute; top:15px; left:10px; background:url(/pix/highlight/2x2/sticker.png) 6px 0px no-repeat; } .Hlight2x2 .prod .low span { font-size:31px; line-height:35px; } .Hlight2x2 .prod .info { position:absolute; } .Hlight2x2 .prod .info .label { display:block; height:30px; font-size:11px; line-height:15px; overflow:hidden; } .Hlight2x2 .prod .info .old { display:block; height:15px; font-size:11px; line-height:15px; font-weight:bold; overflow:hidden; } .Hlight2x2 .prod .info .old span { text-decoration:line-through; } .Hlight2x2 .prod .info .old span sup { font-size:10px; line-height:13px; vertical-align:top; } .Hlight2x2 .prod .info .new.price { display:block; height:20px; font-size:16px; line-height:20px; overflow:hidden; } .Hlight2x2 .prod .info .new.price sup { font-size:11px; line-height:15px; vertical-align:top; } .Hlight2x2 .prod a { width:100%; height:100%; display:block; position:absolute; z-index:10; } /** HIGHLIGHT 2x2 Styles For Only One Product + 0€ Article -------------------------------**/ .Hlight2x2_v2 { width:630px; clear:both; height:424px; margin:0 0 10px 11px; position:relative; overflow:hidden; background:url(/pix/highlight/2x2/bg2.jpg) 0 0 no-repeat; } .Hlight2x2_v2 a { display:block; position:absolute; top:0px; left:0px; z-index:10; } .Hlight2x2_v2 a, .Hlight2x2_v2 img { width:100%; height:100%; } .Hlight2x2_v2 .prod { position:relative; float:left; height:424px; } .Hlight2x2_v2 .prod .lowB { font-size:17px; line-height:20px; padding-top:20px; text-align:center; color:#fff; font-weight:bold; width:142px; height:158px; position:absolute; top:15px; left:10px; background:url(/pix/highlight/2x2/sticker_big.png) 6px 0px no-repeat; } .Hlight2x2_v2 .prod .lowB span { font-size:36px; line-height:40px; } .Hlight2x2_v2 .prod .info { position:absolute; left:15px; bottom:40px; width:600px; font-size:14px; line-height:17px; } .Hlight2x2_v2 .prod .info .head { font-weight:bold; margin-bottom:10px; } .Hlight2x2_v2 .prod .info .part1 { float:left; } .Hlight2x2_v2 .prod .info .part2 { float:left; position:relative; } .Hlight2x2_v2 .prod .info .part2 a { z-index:20; } .Hlight2x2_v2 .prod .info .plus { font-size:42px; line-height:80px; float:left; margin:0 10px; font-weight:bold; } .Hlight2x2_v2 .prod .info .label, .Hlight2x2_v2 .prod .info .old { font-size:14px; line-height:20px; height:20px; overflow:hidden; } .Hlight2x2_v2 .prod .info .old { font-weight:bold; } .Hlight2x2_v2 .prod .info .old span { font-size:14px; line-height:17px; text-decoration:line-through; } .Hlight2x2_v2 .prod .info .old span sup { font-size:10px; line-height:15px; vertical-align:top; } .Hlight2x2_v2 .prod .info .new.price { font-size:20px; line-height:24px; height:24px; overflow:hidden; } .Hlight2x2_v2 .prod .info .new.price sup { font-size:13px; line-height:17px; vertical-align:top; } .Hlight2x2_v2 .prod .info .detail { font-size:12px; line-height:15px; font-weight:bold; margin-top:10px; } .Hlight2x2_v2 .foot { position:absolute; bottom:10px; left:15px; font-size:10px; line-height:11px; color:#6f6f6f; } /** PRODUCT CORE **/ .prodLight { float:left; width:10px; height:20px; margin-right:4px; margin-top:15px; background-position:0px 0px; background-repeat:no-repeat } .noPreviewPics .prodLight { margin-top:0px } .prodPic { float:left; width:50px; height:50px; border:1px solid #fff; background-position:0px 0px; background-repeat:no-repeat } .noPreviewPic .prodPic { display:none } h1 .prodLight { margin-top:0px } #mycarousel {height:50px;overflow:hidden;} /** LISTING **/ /** (LISTING) any (for products!) **/ .listBody { background-position:0px 0px } .listRow { border-bottom:1px solid #ccc; padding:5px 0px } #print .listRow { border-color: #000;} .listHead { height:20px; line-height:20px; color:#fff; background-position:0px 0px; background-color:#616161; overflow:hidden } /** (LISTING) any. 1st col that (usually) displays lights, pic and core info **/ .listHead .colProd, .listBody .colProd { float:left; width:232px; overflow:hidden; padding:0px 5px } .listRow .colProd .colProdContent { float:left; width:162px; margin-left:4px } .listRow .colProd .prodLink { font-weight:bold } .colProd .prodLight { margin-top:15px } .listRow.notSellable {color:#888;} .noPreviewPic .colProd .prodLight { margin-top:0px } /** (LISTING) any. hide pic in 1st column **/ .noPreviewPic .listRow .colProd .colProdContent { float:left; width:218px } .noPreviewPic .listRow .colProd .prodLight { margin-right:0px } .noPreviewPic .list4Col .colProd .prodLight { height:52px } /** (LISTING) any. the last column that displays the price **/ .listHead .colPrice, .listBody .colPrice { float:left; width:122px; overflow:hidden; padding:0px 5px } .listRow .colPrice { text-align:right } .colPrice .prodPriceStrike { color:#333; margin-top:3px; float:right; text-decoration:line-through } .listRow .colPrice .prodLinks { float:right; width:18px; margin-left:4px } .listRow .colPrice .prodPrice { float:left; width:100px } /** (LISTING) any. up-/downarrow in the head of sortable lists **/ .listHead a.sortUp { float:left; width:9px; height:9px; margin-top:5px; background:url(/pix/listing/sortup.gif) 0px 0px no-repeat } .listHead a.sortUpActive { float:left; width:9px; height:9px; margin-top:5px; background:url(/pix/listing/sortup_active.gif) 0px 0px no-repeat } .listHead a.sortDown { float:left; width:9px; height:9px; margin:5px 4px 0px 0px; background:url(/pix/listing/sortdown.gif) 0px 0px no-repeat } .listHead a.sortDownActive { float:left; width:9px; height:9px; margin:5px 4px 0px 0px; background:url(/pix/listing/sortdown_active.gif) 0px 0px no-repeat } /** (LISTING) any **/ .listHead .col div.nobreak { float:left; overflow:hidden } .list6Col .listHead .col div.nobreak { width:80px } /** (LISTING) any (product-)listing: quick-links **/ .listingQuickLinks { padding:5px } .listingQuickLinks a { float:left; margin:0px 10px 5px 0px; font-weight:bold } .col { float:left } /** (LISTING 1 COLUMN) used for accessories in cartAdd **/ .list1Col { float:left; padding-left:5px; width:269px; height:85px } .list1Col .checkBoxContainer { margin-top:25px; width:23px; height:23px; border-left:1px solid #ccc; border-top:1px solid #ccc; border-bottom:1px solid #ccc; float:left } .list1Col .prodContainer { overflow:hidden; width:243px; height:85px; float:left; font-weight:bold; border-left:1px solid #ccc; border-bottom:1px solid #ccc; border-right:1px solid #ccc } /** (LISTING) 3 COLUMNS **/ /** (LISTING - 3 COLUMNS) big content **/ #pageContentBig .list3Col .listHead { width:822px; background-image:url(/pix/listing/list3col_head_big_bg.gif) } #pageContentBig .list3Col .listBody { width:822px; background-image:url(/pix/listing/list3col_body_big_bg.gif) } #pageContentBig .list3Col .listRow { width:822px } #pageContentBig .list3Col .col { float:left; width:400px; overflow:hidden; padding:0px 5px } #pageContentBig .list3Col .notAvailable {background-image:url(/pix/listing/list3col_body_big_na.gif) } /** (LISTING - 3 COLUMNS) small content **/ #pageContent .list3Col .listHead { width:633px; background-image:url(/pix/listing/list3col_head_bg.gif) } #pageContent .list3Col .listBody { width:633px; background-image:url(/pix/listing/list3col_body_bg.gif) } #pageContent .list3Col .listRow { width:633px } #pageContent .list3Col .col { float:left; width:249px; overflow:hidden; padding:0px 5px } #pageContent .list3Col .notAvailable {background-image:url(/pix/listing/list3col_body_bg_na.gif) } /* (LISTING - 3 COLUMNS SIMPLE) specially for auctions, richSource, and the like */ .simpleList .colProdContent { width:175px } .noPreviewPic .simpleList .listRow .colProd .colProdContent { margin:0px; width:231px } /** (LISTING - 6 COLUMNS) product listing only. big content only **/ .list6Col .listHead { width:822px; background-image:url(/pix/listing/list6col_head_bg.gif) } .list6Col .listBody { width:822px; background-image:url(/pix/listing/list6col_body_bg.gif) } .list6Col .listRow { width:822px } .list6Col .col { float:left; width:102px; overflow:hidden; padding:0px 5px } /** (LISTING - 6 COLUMNS) user-ratings **/ .list6Col .col .ratingCol { display:block; text-align:center } .list6Col .col .ratingCol span.pic { display:block; width:58px; height:12px; margin:10px auto 0px auto; background-repeat:no-repeat; background-position:0px 0px } .list6Col .col .ratingCol span.txt { display:block; margin-top:20px } /** (LISTING - 5 COLUMNS) glossary **/ .list5Col .listHead { width:633px; background-image:url(/pix/listing/glossary_head.gif) } .list5Col .listBody { width:633px; background-image:url(/pix/listing/glossary_body.gif) } .list5Col .listRow { width:633px } .list5Col .col { float:left; width:102px; overflow:hidden; padding:0px 5px } /** (LISTING - 4 COLUMNS) topseller and books. 1st column 50x50 pixels. positioned 5px from top **/ .list4Col .listRow { border-bottom:0px; padding:0px } .list4Col .listRow .infoCol { float:left; width:50px; height:50px; border:1px solid #ccc; border-right:0px; margin-top:5px } .list4Col .listRow .rowBorder { float:left; border-bottom:1px solid #ccc; padding:5px 0px } #pageContentBig .list4Col .notAvailable {background-image:url(/pix/listing/list4col_body_big_na.gif) } /** (LISTING - 4 COLUMNS) topseller: 1st col representing the index (from 1 to n) **/ .list4Col .listRow .index { text-align:center; font-weight:bold; font-size:20px; line-height:50px } /** (LISTING - 4 COLUMNS) books: 1st col representing the ranking (book in the bg) **/ .list4Col .listRow .ranking { background:url(/pix/listing/books/book.jpg) 8px 20px no-repeat #fff } .list4Col .listRow .ranking .arrow { width:50px; height:11px; margin-top:5px; background:url(/pix/listing/books/arrowSteady.gif) center no-repeat #fff } .list4Col .listRow .ranking .rank { width:50px; height:34px; line-height:32px; text-align:center; font-size:13px; font-weight:bold } /** (LISTING - 4 COLUMNS) checkbox at first column, e.g.: prod-detail **/ .list4Col .listRow .checker input { margin:17px 0px 0px 17px; padding:0px } /** (LISTING - 4 COLUMNS) big content **/ #pageContentBig .list4Col .listHead { width:771px; margin-left:51px; background-image:url(/pix/listing/list4col_head_big_bg.gif) } #pageContentBig .list4Col .listBody { width:822px; background-image:url(/pix/listing/list4col_body_big_bg.gif) } #pageContentBig .list4Col .listRow { width:822px } #pageContentBig .list4Col .rowBorder { width:771px } #pageContentBig .list4Col .col { float:left; width:387px; overflow:hidden; padding:0px 5px } /** (LISTING - 4 COLUMNS) small content **/ #pageContent .list4Col .listHead { width:582px; margin-left:51px; background-image:url(/pix/listing/list4col_head_bg.gif) } #pageContent .accessoryListing .list4Col .listHead {width:633px;color:#000; background-color:#CCC; margin-left:0px;background-position: 51px 0px } #pageContent .accessoryListing .list4Col .listHead .cartIconCol {width:41px;background:url(/pix/icons/cart.gif) no-repeat 18px 2px; } #pageContent .list4Col .listBody { width:633px; background-image:url(/pix/listing/list4col_body_bg.gif) } #pageContent .list4Col .listRow { width:633px } #pageContent .list4Col .rowBorder { width:582px } #pageContent .list4Col .col { float:left; width:198px; overflow:hidden; padding:0px 5px } /** (LISTING - 4 COLUMNS Std) big content **/ #pageContentBig .list4ColStd .listHead { width:822px; background-image:url(/pix/listing/list4colStd_head_big_bg.gif) } #pageContentBig .list4ColStd .listBody { width:822px; background-image:url(/pix/listing/list4colStd_body_big_bg.gif) } #pageContentBig .list4ColStd .listRow { width:822px } #pageContentBig .list4ColStd .col { float:left; width:214px; overflow:hidden; padding:0px 5px } /** (LISTING - 4 COLUMNS Std) small content **/ #pageContent .list4ColStd .listHead { width:633px; background-image:url(/pix/listing/list4colStd_head_bg.gif) } #pageContent .list4ColStd .listBody { width:633px; background-image:url(/pix/listing/list4colStd_body_bg.gif) } #pageContent .list4ColStd .listRow { width:633px } #pageContent .list4ColStd .col { float:left; width:119px; overflow:hidden; padding:0px 5px } /** LISTING EXTENTED **/ .listBodyBorder { min-height:15px; padding:5px; border:1px solid #ccc; border-top:0px } .listBodyBorder .col { float:left } .listFooter { border:1px solid #ccc; border-top:0px; background:#eee; padding:5px } #pageContentBig .listFooter { width:810px } #pageContent .listFooter { width:621px } #pageContent .centerBox .listFooter { width:328px } /** (LISTING EXTENDED) 3 Column-Listings eg.: prod-detail, auction, flea-market **/ .listBodyBorder3Col { border-bottom:1px solid #ccc; padding-bottom:5px } .listBodyBorder3Col a { float:left; overflow:hidden; margin:5px 5px 0px 5px; font-weight:bold; text-decoration:none } .listBodyBorder3Col a:hover { text-decoration:underline } #pageContentBig .listBodyBorder3Col a { width:264px } #pageContent .listBodyBorder3Col a { width:200px } #pageContentBig .listBodyBorder3Col { width:822px; background:url(/pix/listing/body_list3col_big_bg.gif) 0px 0px repeat-y #fff } #pageContent .listBodyBorder3Col { width:633px; background:url(/pix/listing/body_list3col_bg.gif) 0px 0px repeat-y #fff } /** (LISTING EXTENTED) single-row-text **/ .textListBody { border-left:1px solid #ccc } .textListBody .textListRow { height:20px; line-height:20px; overflow:hidden; border-bottom:1px solid #ccc } .textListBody .grayRow { background-color:#eee } .textListBody .textListRow .textListCell { float:left; padding:0px 5px; border-right:1px solid #ccc; overflow:hidden } .listHead .textListCell { float:left; padding:0px 5px; border-right:1px solid #fff; overflow:hidden } /** (LISTING EXTENDED) letter-chooser, such as used at the manufactureres-listing **/ .letterChooser { margin-top:20px } /** class is listHead + letterChooser **/ .letterChooser a { float:left; text-decoration:none; text-align:center; width:16px; height:16px; margin:1px; line-height:16px; border:1px solid #ccc; color:#fff } .letterChooser a:hover { border-color:#fff !important } .contentNEUTRAL .letterChooser a { border-color:#ccc } .letterChooser a.active { border-color:#fff; color:#000; font-weight:bold; background:url(/pix/white50perc.png) 0px 0px } .contentHELP .letterChooser a.active { background-color:#e7ac00;} /* AUCTION */ .serverTime { margin-bottom:20px; height:25px; line-height:25px;margin-top:3px } /* (AUCTION) Hilite */ .auctionHighlight { float:left; width:192px; padding:5px; overflow:hidden; border:1px solid #ccc; margin:10px 0px 0px 10px } .auctionHighlight a { text-decoration:none; cursor:pointer } .auctionHighlight a span.text { display:block; height:30px } .auctionHighlightPic { display:block; width:120px; height:120px; margin:10px auto; background:url(/pix/prodpic/120x120/no_pic.gif) 0px 0px no-repeat } .auctionHighlightValue { background:#eee; border:1px solid #ccc; padding:0px 5px; height:18px; line-height:18px; font-weight:bold; text-align:right; margin:2px 0px } .auctionStats {margin-top:20px;width:415px;border:1px solid #CCC;border-top:0} .auctionStats td {width:50%;border-top:1px solid #CCC} /* FLEA MARKET */ #fleaMarketTopNavig { margin-bottom:20px; height:25px; line-height:25px } #fleaMarketTopNavig a { float:left; margin-right:10px; font-weight:bold } /** PRODUCT DETAIL **/ .headBox { height:20px; line-height:20px; padding-left:5px; background:#eee; border:1px solid #ccc; font-weight:bold } #detailContentLeft { float:left; width:208px; margin:0 10px 20px 0} .prodPic200 { display:block; position:relative; z-index:100; width:200px; height:200px; margin-left:4px; background-repeat:no-repeat; background-position:0px 0px } .prodPicFrame { display:none; position:absolute; top:-10px; left:-10px; width:440px; height:220px; background:url(/pix/product/picframe.png) 0px 0px no-repeat } .hiddenProdPic450 { display:none; position:absolute; top:0px; left:220px; width:200px; height:200px; background-repeat:no-repeat; background-position:0px 0px; background-color:#fff } .previewPics { position:relative; height:50px; margin:5px 0px; overflow:hidden } .previewPics a { float:left; width:52px; height:50px; text-decoration:none; background-position:0px 0px; background-repeat:no-repeat } .previewPics a span { display:none } .previewPics a:hover { border:0px } .previewPics a:hover span { display:block; position:absolute; width:200px; height:200px; top:-205px; left:4px; background-position:0px 0px; background-repeat:no-repeat } .detailPrice { color:#e52030; font-size:28px; font-weight:bold; margin-top:15px } .detailPriceStrike { color:#000; text-decoration:line-through; font-weight:bold; font-size:18px; text-align:right } .financeInfo { height:25px; line-height:25px } .financeInfo div { float:left; margin-right:5px } .ratingStars { float:left; width:58px; height:12px; background-position:0px 0px; background-repeat:no-repeat; display:inline } .prodPicFooter { margin-top:5px; font-size:10px; text-align:center } /** (PRODUCT DETAIL) CART BUTTON **/ div#intoCartBg { position:relative; float:right; width:190px; overflow:hidden; height:75px; margin-left:10px; background:url(/pix/buttons/intoCart_ani.gif) 0px 0px no-repeat } div#intoCartBg table { position:absolute; width:100px } div#intoCartBg table#tableShadow { top:1px; left:73px; z-index:9 } div#intoCartBg table#tableText { top:0px; left:72px; z-index:10 } div#intoCartBg table tr { height:70px } div#intoCartBg table tr td { font-size:13px; line-height:15px; font-weight:bold } div#intoCartBg table#tableShadow tr td { color:#000 } div#intoCartBg table#tableText tr td { color:#fff } div#intoCartBg input#intoCartButton { display:block; position:absolute; top:0px; left:0px; z-index:100; width:190px; height:75px } div#intoCartBg div#shippingDate {font-size:11px; line-height:15px; width:160px; padding:74px 0 0 5px;} /** .detailStockInfo { float:left; font-size:9px; margin:20px 0px 0px 15px } **/ /** (PRODUCT DETAIL) the links that indicates 360-degree-view availibility */ a.d360 { margin:auto; cursor:pointer; width:100px; height:55px; display:block; background:url(/pix/product/360_degree.gif) center center no-repeat } a.d360:hover { background-image:url(/pix/product/360_degree_animated.gif) } /** (PRODUCT DETAIL) preview slider **/ #previewSliderContainer { position:relative; float:left; height:52px; width:182px; overflow:hidden; margin:5px 0px } #previewSlider { position:absolute; top:0px; left:0px; height:52px; padding-left:1px } #previewSlider a { float:left; height:50px; width:50px; padding:0px 1px; background-position:0px 0px; background-repeat:no-repeat; border-bottom:2px solid #fff; cursor:pointer; filter:alpha(opacity=33); opacity:0.33; -moz-opacity:0.33 } #previewSlider a.active { border-bottom:2px solid #999; filter:none; opacity:100; -moz-opacity:100 } .previewMover { float:left; height:50px; width:13px; background-repeat:no-repeat; background-position:0px 0px; margin:5px 0px } a.previewMover:hover { background-position:-13px 0px } #previewMoverLeft { background-image:url(/pix/product/arrow_left.gif) } #previewMoverRite { background-image:url(/pix/product/arrow_rite.gif) } /** (PRODUCT DETAIL) product variants **/ .variantsHeader { width:224px; background:#eee; border:1px solid #ccc; border-bottom:0px; margin:20px 0px 0px 26px; line-height:20px } .variantCell { float:left; width:75px; height:20px; padding-left:5px } .upgradePriceCell { float:left; width:126px; height:20px; padding-right:5px; text-align:right; overflow:hidden; } .variantsHeader .upgradePriceCell { overflow:hidden } .variantsRow { border:1px solid #ccc; border-top:0px; width:250px; line-height:20px } .variantsRow .upgradePriceCell { font-weight:bold; color:#e52030 } .variantCheck { float:left; width:25px; height:20px; border-right:1px solid #ccc; text-align:center } a.variantInfo { float:left; position:relative; width:25px; height:20px; background:url(/pix/icons/info.gif) 3px 3px no-repeat; cursor:help; text-decoration:none } a.variantInfo span { display:none } a.variantInfo:hover { border:0px } a.variantInfo:hover span { display:block; line-height:14px; width:200px; padding:5px; position:absolute; top:-3px; left:25px; border:1px solid #728ba6; background:#e3f1ff; cursor:default } /** (PRODUCT DETAIL) tech data monster **/ table#techDataTable .techDataCol1 { padding:4px 12px 0px 0px; text-align:right; font-size:12px; font-weight:bold; } /** (PRODUCT DETAIL) tech data in WACS **/ table.techDataTable .techDataCol1 { padding:0px 12px 0px 0px; text-align:right; font-size:12px; font-weight:bold; vertical-align:top; white-space:nowrap; } table.techDataTable .techDataTable .techDataCol1, table.techDataTable .techDataTable .techDataTable .techDataCol1{ padding:0px 12px 0px 0px; text-align:left; font-size:11px; font-weight:normal; } table.techDataTable .techDataSubCol { padding: 0px 0px 2px 8px; } table.techDataTable div.break { height:10px; } table.techDataTable .techDataTable .techDataTable, table.techDataTable .techDataTable div.break { height:0px; } /** (PRODUCT DETAIL) price trend **/ .priceTrend { width:350px; height:200px; background-position:0px 0px; background-repeat:no-repeat } /** (PRODUCT DETAIL) ratings **/ .rateRating { background:#eee; height:20px; line-height:20px; padding:0px 5px; margin-top:5px; border:1px solid #ccc } .rateRating a { float:left; font-weight:bold; height:15px; line-height:15px; margin:2px 0px 0px 5px; background-repeat:no-repeat; background-position:0px 0px; padding-left:20px } .rateRating .plus { background-image:url(/pix/contentDynamic/articleRatings/circle_plus.gif) } .rateRating .minus { background-image:url(/pix/contentDynamic/articleRatings/circle_minus.gif) } .rateRating span.rateCount { float:right; height:15px; line-height:15px; margin:2px 0px 0px 5px; background-repeat:no-repeat; background-position:right; padding-right:20px } /** (PRODUCT DETAIL) **/ .customerSuggestion { float:left; width:261px; padding:5px 0px 5px 5px; margin-right:2px; margin-left:2px; border:1px solid #ccc } .customerSuggestionBox { float:left; margin-left:5px; width:187px; } .noPreviewPic .customerSuggestionBox { width:241px; margin-left:0px } /** (PRODUCT DETAIL) RIGHT AREA **/ #detailContentRight { float:left; width:415px; } #detailRight { float:right; width:179px } /** EXTRA-BOX(es) at the right. e.g. at product detail **/ .extraBoxRight { margin-top:15px; position:relative; z-index:1000 } .extraBoxRight .extraBoxHead { background:#eee; border-bottom:1px solid #ccc; padding-left:5px; font-weight:bold; height:20px; line-height:20px } .extraBoxRight .extraBoxContent { border:1px solid #ccc; padding:0px 5px 5px 5px } .extraBoxRight .extraBoxContent a.textLink { display:block; position:relative; height:15px; line-height:15px; padding-left:22px; background-repeat:no-repeat; background-position:0px 0px; margin-top:7px; text-decoration:none } .extraBoxRight .extraBoxContent a.tlHighlight { background-position:5px 5px; background-repeat:no-repeat; background-color:#eee; padding:5px 0px 5px 25px; border:1px solid #666; border-top:1px solid #fff; border-left:1px solid #fff } .extraBoxRight .extraBoxContent a.textLink span { display:none } .extraBoxRight .extraBoxContent a.textLink:hover { border:0px } .extraBoxRight .extraBoxContent a.tlHighlight:hover { border:1px solid #666 !important; border-top:1px solid #fff !important; border-left:1px solid #fff !important } /** .extraBoxRight .extraBoxContent a.textLink:hover span { display:block; width:190px; padding:5px; position:absolute; top:-6px; left:-207px; z-index:99999; border:1px solid #728ba6; background:#e3f1ff; cursor:default; filter:alpha(opacity=86); opacity:0.86; -moz-opacity:0.86 } **/ .extraBoxRight .extraBoxContent a.textLink:hover span { display:block; width:190px; padding:5px; position:absolute; top:-6px; left:-207px; z-index:99999; border:1px solid #728ba6; background:#e3f1ff; cursor:default } .extraBoxRight .extraBoxContent a.tlHighlight:hover span { left:-208px !important } /** (PRODUCT DETAIL - RIGHT AREA) product links **/ .extraBoxRight .extraBoxContent a.otherHighlight { display:block; margin-top:5px; text-decoration:none; cursor:pointer } .extraBoxRight .extraBoxContent a.otherHighlight .otherCategory { display:block; margin-bottom:3px } .extraBoxRight .extraBoxContent a.otherHighlight .prodPic { margin-right:4px } .extraBoxRight .extraBoxContent a.otherHighlight .otherProductName { float:left; width:111px; overflow:hidden; font-weight:bold; margin-bottom:3px; text-decoration:underline } .noPreviewPic .extraBoxRight .extraBoxContent a.otherHighlight .otherProductName { width:167px } /** (Product Ratings - rating-editor) **/ .editor_button_bar { float:left; width:523px; background:#ddd; border:1px solid #000; border-bottom:0px; height:28px; } .editor_button_bar a { float:left; width:23px; height:22px; margin:2px; background-color:#ddd; border:1px solid #ddd; } .editor_button_bar a:hover { border-top:1px solid #fff; border-left:1px solid #fff; border-bottom:1px solid #000; border-right:1px solid #000; } /** CHECKOUT **/ /** (CHECKOUT) order steps progress bar **/ #checkoutProgress { height:20px; margin-top:5px; padding-left:20px; background:url(/pix/icons/cart.gif) 0px 0px no-repeat } #checkoutProgress a, #checkoutProgress span { float:left; height:15px; line-height:15px; padding-left:22px; background-position:0px 4px; background-repeat:no-repeat; margin-right:5px } #checkoutProgress a { background-image:url(/pix/icons/arrowOrderStepB.gif) } #checkoutProgress span { background-image:url(/pix/icons/arrowOrderStepG.gif) } /** (CHECKOUT) Cart **/ .cartRightColumnRow {border:1px solid #ccc;border-top:0;width:229px;float:right;text-align:right;padding:5px;line-height:18px} #print .cartRightColumnRow {width:197px;border-color:#000;background:#fff} .foreignShippingCostsHintBox {border:1px solid #000; background:url(/pix/blink_yellow_white.gif) 0px 0px; padding:10px} #print .foreignShippingCostsHintBox {background:none;font-size:10px;padding:5px} .displayAddressBox {width:405px;} #print .displayAddressBox {width:285px} .displayAddressBox .formFrame {width:395px;} #print .displayAddressBox .formFrame {width:270px;background:none;border-color:#000} #print .displayAddressBox a {display:none} /** STEP 2 **/ #showCustomerBasicData .billingAddress { float:left; width:253px; } #showCustomerBasicData .hint { float:left; width:250px; margin:5px 0 10px 0; } #showCustomerBasicData .hint h5 { color:#e52030; font-size:11px; line-height:13px; margin-bottom:10px; } #showCustomerBasicData .hint p { margin-top:0px; font-size:11px; line-height:13px; } /** (LISTING - CART) **/ .listCart .listHead { width:822px; background-image:url(/pix/listing/listCart_head_bg.gif) } #print .listCart .listHead { width:588px; background:none;border:1px solid #000 } .listCart .listBody { width:822px; background-image:url(/pix/listing/listCart_body_bg.gif) } #print .listCart .listBody { width:588px; background:none;border-left:1px solid #000;border-right:1px solid #000 } .listCart .listRow { width:822px } #print .listCart .listRow { width:590px } .listCart .col { float:left;text-align:right; width:110px; overflow:hidden; padding:0px 5px} #print .listCart .col { width:92px} #print .listCart .col1 { width:50px} .listCart .listHead .col { text-align:left } #print .listCart .listHead .col { color:#000 } .listCart .listHead .colProd { float:left; width:452px; overflow:hidden; padding:0px 5px } #print .listCart .listHead .colProd { width:310px; color:#000 } .listCart .listBody .colProd { float:left; width:452px; overflow:hidden; padding:0px 5px } #print .listCart .listBody .colProd { width:310px} .listCart .listBody .colProd .colProdContent { width:382px } #print .listCart .listBody .colProd .colProdContent { width:310px } .listCart .errorRow { background-image:url(/pix/listing/listCart_body_error_bg.gif) } .listCart a.textLink { display:block; position:relative;text-decoration:none; height:15px; line-height:15px; } .listCart a.textLink span { display:none } .listCart a.textLink:hover { border:0px } /** .listCart a.textLink:hover span { display:block; width:190px; padding:5px; position:absolute; top:15px; left:-115px; border:1px solid #728ba6; background:#e3f1ff; cursor:default; filter:alpha(opacity=86); opacity:0.86; -moz-opacity:0.86 } **/ .listCart a.textLink:hover span { display:block; width:190px; padding:5px; position:absolute; top:15px; left:-115px; border:1px solid #728ba6; background:#e3f1ff; cursor:default } .listCart .amountSpan {display:none} #print .listCart .prodPic {display:none} #print .listCart .prodLight {display:none} #print a {font-weight:normal;text-decoration:none} .listCart .listBody .listRow.rowBundle { background-image:url(/pix/listing/listCart_body_bundle_bg.gif);border-color:#ccc } #print .listCart .listBody .listRow.rowBundle { border-left:1px solid #000;border-right:1px solid #000;background:none;width:588px} /** (CHECKOUT) Cart - noChangesAllowed removing elements from cartListing, because changing cartlisting not allowed (for example in step5)**/ .noChangesAllowed .deleteLink {display:none} #print .listCart .deleteLink {display:none} .noChangesAllowed .input {display:none} #print .listCart .input {display:none} .noChangesAllowed .amountSpan {display:inline} #print .listCart .amountSpan {display:inline;float:left;width:80px} /** CELEBROS SEARCH **/ .entryBox { float:left; width:145px; height:80px; font-weight:bold; overflow:hidden; color:#000; text-align:center; margin:5px } .entryBox span.pic { display:block; width:50px; height:50px; margin:0px auto; background-repeat:no-repeat; background-position:0px 0px; background-color:#fff; margin-bottom:5px } a.popLink .pop {display:none} a:hover.popLink .pop {display:inline} /** (TABBER) MAILTABBERS (area for the tabs, parent to all included tabs) **/ #mailTabbers { height:20px; line-height:20px; } #mailTabbers a.tab { float:left; margin-right:5px; height:20px; line-height:20px; text-align:center; color:#000; text-decoration:none; overflow:hidden; width:150px; background:url(/pix/contentDynamic/myAlternate/userMail/tabber_bg.gif) 0px 0px no-repeat } #mailTabbers a.tabActive { color:#fff; background-position:0px -40px } /** (TABBER) MAILTABBERS hovered **/ #mailTabbers a:hover.tab { background-position:0px -20px } #mailTabbers a:hover.tabActive { background-position:0px -40px } /** TAGGING **/ /* TagCloud */ .tagCloudStd { height:26px; line-height:26px; margin:0px 10px 0px 10px; white-space:nowrap; } #tagCloud { text-align:left } #tagCloud a { text-decoration:none; white-space:nowrap; } #tagCloud a:hover { text-decoration:underline } /* /TagCloud */ #crossClick { position:relative; display:none; width:15px; height:15px; background:url(/pix/icons/crosshairs.gif) 0px 0px no-repeat; cursor:pointer; } #crossClick div { position:absolute; left:20px; display:none; width:200px; padding:3px; line-height:16px; border:1px solid #728BA6; background:#e3f1ff; filter:alpha(opacity=95); opacity: 0.95; -moz-opacity:0.95 } .crosshair { position:absolute; display:none; width:0px; height:0px; } .crosshair div { position:absolute; height:10px; width:15px; border-style:solid; border-color:#000; border-width:0px; } .crosshair .ctl { top:-14px; left:-20px; border-left-width:1px; border-top-width:1px; } .crosshair .ctr { top:-14px; right:-20px; border-right-width:1px; border-top-width:1px; } .crosshair .cbl { bottom:-14px; left:-20px; border-left-width:1px; border-bottom-width:1px; } .crosshair .cbr { bottom:-14px; right:-20px; border-right-width:1px; border-bottom-width:1px; } .reportTag { background:#f44; } .moreTagBox { color:#999; position:absolute; display:none; top:16px; left:-150px; width:400px; overflow:hidden; line-height:20px; background:#fff; border:2px solid; } .moreTagBox .close { position:absolute; width:12px; height:12px; right:0px; background:url(/pix/icons/small/close.gif) 1px 1px #999 no-repeat; cursor:pointer } .moreTagBox .border { display:block; padding:10px } .moreTagBox .border a { text-decoration:underline; margin-left:3px } .moreTagBox .border a:hover { text-decoration:none; } /** TOGGLE BOXES **/ .toggleBoxHandle { text-decoration:none; display:block; cursor:pointer } .toggleBoxHandle span { cursor:pointer } .toggleBoxHandle span.toggleBoxHandleLeft { float:left; font-weight:bold; margin-left:5px } .toggleBoxHandle span.toggleBoxHandleRite { float:right; margin-right:5px; text-decoration:underline } .loadingIndicator { height:20px; background:#fff url(/pix/icons/ajax_loading_icon.gif) center center no-repeat; border:1px solid #ccc } /* TagEditorCaller */ .tagEC { display:none; float:left; } .tagEC img { position:relative; top:2px; margin-left:5px; cursor:pointer } .eTagBox {color:#999; position:absolute; display:none; z-index:999; width:280px; left:0; top:20px; border:2px solid; background:#fff } .eTagBox .close { position:absolute; width:12px; height:12px; line-height:1px; right:0px; background:url(/pix/icons/small/close.gif) 1px 1px #999 no-repeat; cursor:pointer } /** /TAGGING **/ /* inax */ .acbox { position:absolute; width:300px; background:#fff; border:1px solid #000; } #miniSearch .acbox { width:154px; } .acbox.max { overflow:auto; height:100px; } .acbox div { height:20px; overflow:hidden; padding:0 5px; line-height:20px; cursor:pointer; } .acbox .sel { background:#ddd } .acbox span { float:left; font-style:normal;color:#000 } .acbox strong { float:left;text-decoration:underline; } .acbox dfn { float:right; font-style:normal; } .acError { background:#F66; color:#FFF; } /* end inax */ /** AUTOCOMPLETE **/ .hiddenAutocomplete { position:absolute; overflow:auto; font-size:11px; background:#fff; border:1px solid #000 } .hiddenAutocomplete span { display:block; color:#000; padding:2px; cursor:pointer } .hiddenAutocomplete span.acActive { background:#ccc } .hiddenAutocomplete div { background:#999; color:#fff; font-weight:bold; padding:2px } /* Awo Styles */ .awo { position:absolute; z-index:9999 } .awo var {display:none} .awo .border { position:relative; width:100%; z-index:10; padding:2px; border:1px solid #CCC; background:#ccc; } .awo .title { width:auto; height:20px; background:#ccc; cursor:move; border-bottom:0px solid #000; font-weight:bold; line-height:18px; padding:0 5px; } .awo .close { position:absolute; z-index:13;top:2px; right:2px; width:15px; height:15px; background:url(/pix/icons/close.gif) #eee; cursor:pointer; } .awo .content { position:relative; z-index:12; border:1px solid #000;overflow:hidden; background:#fff; } .awo .progressbar{background:url(/pix/loader-bar.gif) no-repeat 10px 5px;height:18px;width:240px;padding:5px} .awo .loadIn{height:20px} /* /Awo Styles */ /** PRODUCT POPUP **/ #productpopup { position:absolute; z-index:99999 } /** /JCAROUSEL **/ /* general */ .jcarousel-container { position: relative; } .jcarousel-clip { z-index: 2; padding: 0; margin: 0; overflow: hidden; position: relative; } .jcarousel-list { z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0; } .jcarousel-item { float: left; list-style: none; width: 50px; height: 50px; } .jcarousel-next { z-index: 3; display: none; } .jcarousel-prev { z-index: 3; display: none; } /* skin */ .jcarousel-skin.jcarousel-container { background: #FFF; } .jcarousel-skin.jcarousel-container-horizontal { width: 170px; padding: 0px 17px; } .jcarousel-skin .jcarousel-clip-horizontal { width: 170px; height: 50px; } .jcarousel-skin .jcarousel-item { width: 50px; height: 50px; } .jcarousel-skin .jcarousel-item-horizontal { margin-right: 10px; } .jcarousel-skin .jcarousel-item-placeholder { background: #fff; color: #000; } .jcarousel-skin .jcarousel-next-horizontal { position: absolute; right: 0px; width: 13px; height: 50px; cursor: pointer; background: transparent url(/pix/product/arrow_rite.gif) no-repeat 0 0; background-position: -13px 0; } .jcarousel-skin .jcarousel-next-horizontal:hover { background-position: -13px 0; } .jcarousel-skin .jcarousel-next-horizontal:active { background-position: -13px 0; } .jcarousel-skin .jcarousel-next-disabled-horizontal, .jcarousel-skin .jcarousel-next-disabled-horizontal:hover, .jcarousel-skin .jcarousel-next-disabled-horizontal:active { cursor: default; background-position: 0px 0; } .jcarousel-skin .jcarousel-prev-horizontal { position: absolute; left:0px; width: 13px; height: 50px; cursor: pointer; background: transparent url(/pix/product/arrow_left.gif) no-repeat 0 0; background-position: -13px 0; } .jcarousel-skin .jcarousel-prev-horizontal:hover { background-position: -13px 0; } .jcarousel-skin .jcarousel-prev-horizontal:active { background-position: -13px 0; } .jcarousel-skin .jcarousel-prev-disabled-horizontal, .jcarousel-skin .jcarousel-prev-disabled-horizontal:hover, .jcarousel-skin .jcarousel-prev-disabled-horizontal:active { cursor: default; background-position: 0px 0; } /** /JQZOOM **/ div.zoomdiv { z-index:100; position:absolute; top:0px; left:0px; width:450px; height:450px; background: #ffffff; border:10px solid #CCCCCC; display:none; text-align: center; overflow: hidden; margin-top:-10px; } img.jqzoom{ cursor:crosshair; position:relative; } /** VOUCHER **/ .voucherInnerBox { width:448px; margin: 0px 20px; float:left; background: transparent; } .voucherInnerBox input { border: 1px solid #666; height: 25px; width: 220px; float: left; margin: 0px 20px 3px; font-size:20px; text-align: center; vertical-align: middle;} .roundtop, .roundbottom {display:block; background:transparent; font-size:1px;} .roundboxcontent {display:block; background:#ECECEC; border:0 solid #9A9A9A; border-width:0 1px;} .xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;} .xb1, .xb2, .xb3 {height:1px;} .xb2, .xb3, .xb4 {background:#ECECEC; border-left:1px solid #9A9A9A; border-right:1px solid #9A9A9A;} .xb1 {margin:0 5px; background:#9A9A9A;} .xb2 {margin:0 3px; border-width:0 2px;} .xb3 {margin:0 2px;} .xb4 {height:2px; margin:0 1px;} /** /VOUCHER **/ /** SOFTWARE LIZENZ CONTACT **/ .cornerTopLeft, .cornerTopLeftNeutral { position:absolute; left:0px; width:4px; height:4px; background:url(/pix/filter/roundCorner_topLeft.gif) top left no-repeat; } .cornerTopRight, .cornerTopRightNeutral { position:absolute; right:0px; width:4px; height:4px; background:url(/pix/filter/roundCorner_topRight.gif) top left no-repeat; } .cornerBottomLeft, .cornerBottomLeftNeutral { position:absolute; left:0px; width:4px; height:4px; background:url(/pix/filter/roundCorner_bottomLeft.gif) top left no-repeat; } .cornerBottomRight, .cornerBottomRightNeutral { position:absolute; right:0px; width:4px; height:4px; background:url(/pix/filter/roundCorner_bottomRight.gif) top left no-repeat; } .contactBoxHead { position:relative; background:url(/pix/softwarelizenzen/header_bg_contact.gif) top left repeat-x; height:4px; } .contactBoxHeadCont { height:12px; padding:3px 5px; border-left:1px solid #7ca1ca; line-height:10px; border-right:1px solid #7ca1ca; padding-left:10px; color:#fff; font-weight:bold; background-image:url(/pix/softwarelizenzen/header_bg_contact.gif); background-position:0px -4px; } .contactBoxTop { position:relative; height:3px; line-height:1px; background:url(/pix/filter/dot.gif) top left repeat-x #ececec; } .contactBoxBottom { position:relative; height:3px; background:url(/pix/filter/dot.gif) bottom left repeat-x #ececec; } .contactBoxContent { position:relative; padding:10px; background:#ececec; color:#000; border-left:1px solid #ccc; border-right:1px solid #ccc; } .contactBoxButtons { float:right; padding-right:10px; } .contactBoxResetButton { float:left; text-decoration:none; padding-right:10px; cursor:pointer; } .contactBoxResetButton .leftPart { float:left; width:5px; height:22px; background:url(/pix/filter/button_grey_leftSide.gif) top left no-repeat; } .contactBoxResetButton .rightPart { float:left; width:5px; height:22px; background:url(/pix/filter/button_grey_rightSide.gif) top left no-repeat; } .contactBoxResetButton .middlePart { float:left; height:22px; line-height:20px; padding: 0px 5px; font-weight:bold; color:#000; background:url(/pix/filter/button_grey_bg.gif) top left repeat-x; } /** /SOFTWARE LIZENZ CONTACT **/ /** GLOSSARY **/ a.glossaryLink { color:#000;text-decoration:none;padding-right:8px; background:url(/pix/contentDynamic/glossary/glossary_link.png) top right no-repeat; } .glossaryContainer .content a { color:#002bb8; text-decoration:none; } .glossaryContainer .content a:hover { text-decoration:underline; } .glossaryContainer .content a.glossaryLink { color:#000 } .glossaryContainer .content a.glossaryLink.notExist { background-image:url(/pix/contentDynamic/glossary/glossary_link_na.png) } .glossaryContainer .content p, .glossaryContainer .content p a, .glossaryContainer .content p span { font-size:10px; height:20px; line-height:20px; float:left; } .glossaryContainer .categories { padding-top:10px; } .glossaryContainer .dashLine { border-top:1px dashed #ccc; padding-top:10px; } .glossaryContainer .content { padding:10px 0px; line-height:13px; } .glossaryContainer .content h2 { font-size:16px; font-weight:bold; border-bottom:1px solid #ccc; padding-top:10px; margin-bottom:10px; } .glossaryContainer .tabberDiv { position:relative; } .glossaryContainer .tabberDiv .tabberContainer { position:absolute; right:0px; top:-19px; } .glossaryContainer .tabberDiv .tabberContainer .tab { float:right; display:block; border-top:1px solid #CCC; border-left:1px solid #CCC; border-right:1px solid #CCC; padding:2px 10px; text-decoration:none; background:#f5f5f5;line-height:13px } .glossaryContainer .tabberDiv .tabberContainer .active { border-bottom:1px solid #fff; font-weight:bold; background:#FFF; } .glossaryContainer .footer { position:relative; } .glossaryContainer .boxTop { position:relative; height:3px; line-height:1px; background:url(/pix/filter/dot.gif) top left repeat-x #ececec; } .glossaryContainer .boxBottom { position:relative; height:3px; background:url(/pix/filter/dot.gif) bottom left repeat-x #ececec; } .glossaryContainer .boxContent { padding:5px 10px; background:#ececec; border-left:1px solid #ccc; border-right:1px solid #ccc; } .glossaryContainer .pillButton { float:right; width:39px; height:16px; background:url(/pix/product/button_pill.gif) top left no-repeat; text-align:center; text-decoration:none; margin-left:10px; } .glossaryContainer .searchGlossary { float:left; width:170px; line-height:25px; } #searchGlossary { width:150px; } /** /GLOSSARY **/ /** double Availability Popup **/ .AreaHead { clear:both; height:20px; line-height:20px; padding-left:5px; padding-right:5px; color:#fff } .Availability_row { clear:both; height:40px; border-bottom:1px solid #ccc } .Availability_rowActive { clear:both; height:40px; border-bottom:1px solid #ccc; background:#888; color:#fff } .Availability_rowS { clear:both; height:40px; border-bottom:1px solid #ccc } .Availability_rowSActive { clear:both; height:40px; border-bottom:1px solid #ccc; background:#888; color:#fff } .Availability_symbol { float:left; width:59px; height:30px; padding-top:10px; text-align:center; border-right:1px solid #ccc } .Availability_desc { float:left; width:320px; height:30px; padding:5px; } .Availability_symbolS { float:left; width:59px; height:27px; padding-top:13px; text-align:center; border-right:1px solid #ccc } .Availability_descS { float:left; width:220px; height:30px; padding:5px; } /** /double Availability Popup **/ /** Price sup **/ .detailPrice #price { line-height:32px !important; } .detailPrice #price sup { font-size:16px; line-height:24px;vertical-align:top; } .detailPrice .strikethrough { text-decoration: line-through; font-size: 16px; } .detailPrice .strikethrough sup { font-size:10px; line-height:16px;vertical-align:top; } .myConfig #price { line-height:24px !important; } .myConfig #price sup { font-size:12px; line-height:18px;vertical-align:top; } .pcbTreeComponent .price { line-height:14px !important; } .pcbTreeComponent .price sup { font-size:10px; line-height:12px;vertical-align:top; } .Hlight2x1 .prc .org sup { font-size:15px; line-height:28px;vertical-align:top; } .Hlight2x1 .prc .shd sup { font-size:15px; line-height:28px;vertical-align:top; } .Highlight1x1 span.price { line-height:26px; } .Highlight1x1 span.price sup { font-size:13px; line-height:20px;vertical-align:top; } .Highlight1x1 span.price .strikethrough { display:block;font-size:13px;height:20px;text-decoration:line-through; } .Highlight1x1 span.price .strikethrough sup { font-size:10px; line-height:20px;vertical-align:top; } .Highlight1x1 div.Highlight1x1_price { font-size:22px !important; line-height:26px; } .Highlight1x1 div.Highlight1x1_price sup { font-size:13px; line-height:20px;vertical-align:top; } .otherHighlight span.price { line-height:18px; } .otherHighlight span.price sup { font-size:10px; line-height:16px; vertical-align:top; } .col sup { font-size:10px; line-height:11px; vertical-align:top; } /** BasePrice **/ .basePrice {color:#000;font-size:10px;font-weight:normal;} .basePrice span {white-space:nowrap;} .detailPrice #price .basePrice sup { font-size:10px;font-weight:normal;} .Highlight1x1 span.price .basePrice {line-height:10px} .Highlight1x1 span.price .basePrice sup {line-height:10px;color:#000;font-size:10px;font-weight:normal;} .Hlight2x1 .basePrice {position:relative} .Hlight2x1 .basePrice sup {font-size:10px;} /** for static Pages: pageContent **/ .greybox { background-color:#EAEAEA; width:400px; margin:20px auto; padding: 10px 30px 10px 30px; } .greybox2 { position:absolute; background-color:#EAEAEA; width:200px; padding:10px; margin:75px 10px; z-index:1; } /** Verfügbarkeitsampel **/ div.availability {float:left} div.availability a {cursor:hand} div.availability a span.lightStrore {float:left; background-repeat:no-repeat; display:block; width:10px; height:20px; padding-right:4px;} div.availability a span.lightShop, div.availability a span.lightShopDouble {float:left; background-repeat:no-repeat; display:block; width:10px; height:20px; margin-right:4px;} div.availability a span.lightShop {margin-top:15px} h1 div.availability a span.lightShop {margin-top:0px} div.availability a span.lightDoubleText { background-repeat:no-repeat; width:23px; height:41px; display:block; padding-bottom:2px;} /** Simple Tabber auf der Detail-Seite **/ div.tabbers4BoxHead { position:relative;padding:0px 7px;background:url(/pix/tabber/tabberBoxHeadBgNew.png) repeat-x bottom;border:1px solid #999;border-bottom:0px; } div.tabbers4BoxHead .cornerl, div.tabbers4BoxHead .cornerr{position:absolute;top:-1px;height:6px;width:6px} div.tabbers4BoxHead .cornerl{px;left:-1px;background:url(/pix/tabber/corner_l.png) no-repeat left top} div.tabbers4BoxHead .cornerr{right:-1px;background:url(/pix/tabber/corner_r.png) no-repeat right top} div.tabbers4BoxHead ul {width:100%;list-style:none;padding:0px;margin:-1px 0px 0px 0px} div.tabbers4BoxHead ul li {float:left;text-align:center;background:#5F5F5F} div.tabbers4BoxHead ul li:hover, div.tabbers4BoxHead ul li.active {background:#E52030} .contentSOFTWARE div.tabbers4BoxHead ul li:hover, .contentSOFTWARE div.tabbers4BoxHead ul li.active {background:#0e54ba} .contentENTERTAINMENT div.tabbers4BoxHead ul li:hover, .contentENTERTAINMENT div.tabbers4BoxHead ul li.active {background:#29947C} .contentBUILDERS div.tabbers4BoxHead ul li:hover, .contentBUILDERS div.tabbers4BoxHead ul li.active {background:#1679cf} .contentNOTEBOOK div.tabbers4BoxHead ul li:hover, .contentNOTEBOOK div.tabbers4BoxHead ul li.active {background:#1679cf} .contentHOMELIVING div.tabbers4BoxHead ul li:hover, .contentHOMELIVING div.tabbers4BoxHead ul li.active {background:#522113} .contentAPPLEPORTAL div.tabbers4BoxHead ul li:hover, .contentAPPLEPORTAL div.tabbers4BoxHead ul li.active {background:#545454} .contentGAMING div.tabbers4BoxHead ul li:hover, .contentGAMING div.tabbers4BoxHead ul li.active {background:#004499} div.tabbers4BoxHead ul li:hover a, div.tabbers4BoxHead ul li.active a {border-color:#000} div.tabbers4BoxHead ul li a {display:block;border:1px solid #999;width:152px;height:21px;line-height:21px;font-weight:bold;color:#fff;text-decoration:none;background:url(/pix/product/box_header_vl_5.png) repeat} .eneryBox { margin-top:20px; } .eneryBox a { background: url(/pix/energy.png) left center no-repeat; padding-left:64px; float:left;line-height:62px;text-decoration:underline; }