/* See below ... from http://www.colorzilla.com/gradient-editor/ */ /* Theme HS 2012 */ /* @highlightColor: #fff; @darkColor: #333; @mediumColor: #888; @inverseColor: #000; @textMedium: #ceb0a1; @textColor: #ece6de; @bg: #a5805e; */ /* Theme FS 2012 */ @highlightColor: #fff; @darkColor: #333; @mediumColor: #888; @inverseColor: #888; @textMedium: #333; @textColor: #333; @activeColor: #000; @bg: #e2d2b6; @themeBG: #f1e9db; * { margin:0;border:0; } img { border: 0; padding: 0; } html, body { /* height: 100%; */ } html { overflow-y: scroll; } body { font-family: "angie-sans-1","angie-sans-2",sans-serif,sansserif,sans; font-size: 12px; line-height: 18px; margin: 0; padding: 0; color: @textColor; background: @bg; } /* Sonderfall Facebook Händlerliste ============================================== wieder einfügen nach edit!!! */ body.body_sortiment_uebersicht, /* neu 2011 - theme global */ body.body_sortiment, /* neu 2011 - theme global */ body.body_kollektion, body.body_kollektion_uebersicht, body.body_home { /* background: @bg url(/media/custom/bgGradientHW12.jpg) 0 0 repeat-x; */ } #naviLevel3 li, #naviLevel2 li { display: block; width:100%; } .artikelGross .noAbb { background: none; } .abbGross { position:absolute; z-index:0; width:620px; height:550px; } .DescrGross { position:absolute; z-index:1; } #leftMargin80 { margin-left:80px; } .noAbb { background: #eee; /* check */ padding:10px; width:170px; height:170px; color: @mediumColor; } .themed .noAbb { background: @textMedium; /* check */ color: @bg; } p,ul { font-family: "angie-sans-1","angie-sans-2",sans-serif,sansserif,sans; font-size: 12px; color: @textColor; line-height: 20px; margin:0; padding: 0 0 10px 0; } p { display: block; clear:both; } a, a:visited { text-decoration: none; color:@textColor; } ol { line-height:16px; } ul li { text-decoration: none; /* list-style-image: url(/media/custom/arrow.png); */ list-style-position:outside; margin-left:23px; } li a, li a:visited { color:@textColor; } .themed li a, .themed li a:visited { color:@textMedium; } .themed li.current a, .themed li.current a:visited { color:@highlightColor; } ul a,p a, p a:link, p a:active, p a:visited { text-decoration: none; color:@textColor; font-weight: bold; } .themed h1,.themed h2, .themed h3, .themed h4 { color: @inverseColor; } h1,h2,h3,h4 { font-size: 24px; font-family: "angie-sans-1","angie-sans-2",sans-serif,sansserif,sans; color:@textColor; font-weight: normal; padding: 0; margin: 0; /* text-transform: uppercase; */ line-height: normal; /* background: #ffc; */ display: block; clear:both; } h1 { font-weight: bold; font-size: 22px; padding:0 0 12px 0; } h2 { font-weight: bolder; font-size: 16px; line-height: 16px; padding:0 0 8px 0; } h3 { font-size: 14px; line-height: 20px; padding:0 0 7px 0; } h4 { padding:0 0 5px 0; color: @textColor; font-weight: bold; font-size: 12px; line-height: 17px; } #stage { width:960px; height: 100%; margin-left:auto; margin-right:auto; /* background: #eee; */ } #header { width:960px; height:150px; } .home #header { width:960px; height:600px; } .uebersicht #header { width:960px; height:400px; } .colorPreview { cursor: pointer; width:20px; text-align: center; height: 20px; border: 1px solid @highlightColor; float: left; padding:5px; margin:0 5px 0 0; } #listeVarianten { /* border: 10px solid red; */ position: absolute; top: 300px; margin-left:10px; } .noPreview { width:200px; height: 200px; padding:50px; } #col1 { float: left; padding:0; margin:0; width:680px; min-height: 500px; } .highlight { min-height:380px; width:200px; border:1px solid #CCC; padding:10px; float:left; margin:0 10px 10px 0; } .highlight h1 { font-size: 18px; color:#F7288F; } .highlight h2 { font-size: 12px; } .textbox { padding: 0 10px 0 10px; } #content { float:left; min-height:400px; } /* .body_sortiment_uebersicht #content, */ .body_presse #content, .body__standard #content { padding-top: 50px; } .body_presse #content { min-height:100px; } .body_home #content, .body_kollektion_uebersicht #content { min-height:200px; } .body_kollektion #content, .body_sortiment #content { } #passinglane { min-height:200px; float:left; width: 240px } #subnavilevel2 { clear: both; width:220px; margin:10px; min-height:200px; border-top:1px solid @mediumColor; } .themed #subnavilevel2 { border-top:1px solid @textMedium; } .themed #subnavilevel2 h2 { color: @highlightColor; } .themed #subnavilevel2 li.active a { color: @highlightColor; } #subnavilevel2 h2 { float:left; width:150px; margin:0; padding: 5px 0 10px 0; } #subnavilevel2 #controller { float:right; color: @mediumColor; text-align: right; width:150px; margin:0; font-size: 16px; padding: 5px 0 15px 0; } .themed #subnavilevel2 #controller { color:@textMedium; } #subnavilevel2 #controller a { color: @textColor; } .themed #subnavilevel2 #controller a { color: @textMedium; } #arrowController { position: absolute; width:80px; z-index:10; margin-left:640px; } .buttonActive, .buttonInactive { cursor: pointer; width:39px; height:25px; float:left; margin:0 0 0 1px; } .buttonInactive { opacity: .5; } .buttonActive a { display: none; } #arrowController #next { background: @highlightColor url(/media/custom/arrow-right-12px-000000.png) 12px 5px no-repeat; } #arrowController #previous { background: @highlightColor url(/media/custom/arrow-left-12px-000000.png) 14px 5px no-repeat; } #subnavilevel2 ul { width:300px; margin:0; padding:0; } #subnavilevel2 li { width:300px; list-style-image: none; list-style-position: outside; float:right; clear:both; color: @inverseColor; height: 25px; margin: 0; padding: 0; list-style:none; font-size: 12px; /* text-align:right; */ } #head { height:150px; width:960px; float:left; clear:both; } #navigation { width:960px; clear:both; float:left; height:40px; margin:1px 0 1px 0; background: @highlightColor; } #iPadLane #navigation { width: 309px; margin: 0; padding: 0; height: auto; background: transparent; } #iPadLane #navigation li.separator { display: none; } #iPadLane #naviLevel1 { margin: 0; padding: 0; } #iPadLane #search { background: #fff; padding: 5px; width: 100%; height: 20px; margin: 0; padding: 10px 5px 15px 5px; } #iPadLane #navigation li { font-size: 20px; width: 309px; background: white; display: block; clear: both; padding:5px; margin-bottom: 1px; } #iPadLane #logo { padding-top: 20px; width:320px; height:160px; float: left; position: relative; clear:both; text-align: center; } #overviewStyle #iPadLane #logo { width:240px; } #overviewStyle #iPadLane #navigation li, #overviewStyle #iPadLane #navigation, #overviewStyle #iPadLane #search { width: 229px; } #overviewStyle #searchField { width: 160px; } .searchresultArticle { float: left; width: 980px; min-height: 200px; margin: 0; padding: 0; overflow: hidden; } .searchresult { cursor: pointer; margin: 0 1px 1px 0; float: left; width: 295px; height: 240px; padding: 10px; overflow: hidden; background: #F1E9DB; } .resultImage, .resultText { text-align: center; float: left; width: 280px; padding-bottom: 10px; } #language { position: absolute; text-align: right; z-index: 3; width:960px; height: 35px; padding: 0; } #language li { color:@inverseColor; } .themed #language a { color:@textMedium; } #language a { color:@textColor; font-weight: bold; } #language ul { display: inline; margin: 0; padding: 0; list-style: none; } #language li { font-family: arial, helvetica, sans-serif; font-size: 11px; padding: 0 0 0 10px; margin:0; display: inline; line-height: 35px; vertical-align: middle; } #language li img { margin:0 0 -6px 0; } #language li.inactive { font-weight: normal; } .themed #language li.inactive a { color:@textMedium; } #language li.inactive a { font-weight: normal; color:@textColor; } #language li.inactive a:hover { color:@inverseColor; } #headimage { position: absolute; z-index: 0; overflow: hidden; width:960px; } .home #headimage { height:599px; } #slideshow img { display: none } .kollektion_details #headimage { overflow: hidden; height:150px; } #logo { z-index: 100; position: absolute; cursor: pointer; width:240px; height:150px; /* background: url(/media/custom/logo.png) 0 0 no-repeat; */ } .home #logo { width:400px; height:230px; opacity: 0; /* background: url(/media/custom/logoHome.png) 0 0 no-repeat; */ } #search { text-align: center; width:240px; height:25px; float:left; margin-top: 8px; } /* sphider */ #searchSubmit:visited, #searchSubmit { color: @darkColor ; display: inline; float:left; line-height:25px; margin:0 0 0 10px; } #searchField { display: inline; float:left; height:20px; width:180px; border: 1px solid #CCC; color: @darkColor ; padding:0 0 0 4px; /* background: @bg; */ } /* #searchButton { display: inline; float:left; color:@inverseColor; margin: 5px 0 0 10px; } */ .current { font-weight: bold; } .active { font-weight: bold; } .inactive { font-weight: 100; } .sortimentItemHome { cursor: pointer; background: @themeBG; width:319px; height:240px; float:left; margin:0 1px 1px 0; padding:10px 0 0 0; } .ArtikelUebersicht, .variantePreview, .varianteUebersicht, .sortimentItemlarge, .sortimentItem { cursor: pointer; width:139px; height:190px; float:left; margin:0 1px 1px 0; padding:10px; background: @highlightColor; } .description { padding:10px 0 10px 0; width: 100%; clear:both; text-align:center } .sortimentSpacerlarge { float:left; float:left; margin:0 1px 1px 0; padding:10px; height:190px; width:219px; } .sortimentItemlarge { width:219px; } .varianteUebersicht, .ArtikelUebersicht { width: 219px; height: 235px; background: @highlightColor; } .variantePreview { width:192px; height:235px; } .themed .artikelGross, .themed .sortimentItem, .themed .sortimentItemlarge, .themed .variantePreview, .themed .varianteUebersicht, .themed .ArtikelUebersicht { background: @themeBG; } .ArtikelUebersicht h1, .sortimentItemlarge h1, .sortimentItemHome h1, .sortimentItemAdmin h1, .variantePreview h1, .varianteUebersicht h1, .sortimentItem h1 { margin: 0; padding: 0; font-size: 12px; line-height: 18px; font-weight: bold; } .sortimentItemHome h1 { font-size: 14px; font-weight: normal; } .variantePreview h2, .varianteUebersicht h2, .ArtikelUebersicht h2, .sortimentItemlarge h2, .sortimentItemHome h2, .sortimentItemAdmin h2, .sortimentItem h2 { margin: 0; padding: 0; font-size: 12px; font-weight: normal; line-height: 16px; } .sortimentItemHome h2 { font-size: 14px; } .artikelGross { float:left; clear:both; margin-left:80px; margin-bottom:1px; padding:10px; width:620px; height:550px; background: @highlightColor; } .artikelGross h1 { font-size: 32px; } .artikelGross h3 { color: @mediumColor; font-size: 11px; margin:5px 0 0 0; } .themed .artikelGross h3 { color: @textColor; } .artikelGross h2, .artikelGross h1 { margin: 0; padding: 0; font-weight: normal; } .themedHidden { display: inline; } .themedVisible { display: none; } .themed .themedHidden { display: none; } .themed .themedVisible { display: inline; } .hidden { display: none; } .collapsed { background: url(/media/custom/arrow-down-12px-000000.png) top right no-repeat; } .expanded { background: url(/media/custom/arrow-up-12px-000000.png) top right no-repeat; } .accContent ul { list-style: none; } .accContent li { margin:0; padding: 0; } #pagemap { margin-top: 40px; padding: 0 0 10px 0; border-top:1px dotted #ccc; font-family: Arial, Helvetica, sans-serif; } .themed #pagemap { background: none; border-top:1px dotted @textMedium; } .themed #pagemap ul a, .themed #pagemap h3 a, .themed #pagemap h3, .themed #pagemap a { color: @textMedium } #pagemap ul a, #pagemap a { font-family: Arial, Helvetica, sans-serif; padding:0; line-height:140%; color:@textColor; } #pagemap h3 { font-family: Arial, Helvetica, sans-serif; margin: 10px 0 5px 10px; padding:0; line-height:140%; color:@textColor; } #pagemap ul { margin: 0 0 0 10px; padding: 0; } #pagemap li { font-size: 11px; line-height: 14px; padding: 0; margin:0; list-style: none; display: block; } #naviLevel1 { margin: 0 0 0 10px; width: 700px; float:left; } #naviLevel2 { float:left; clear:both; width:220px; padding:10px; } #naviLevel3 { float:left; clear:both; width:270px; padding:20px 10px 10px 10px; margin:0 0 5px 0; background: #ccf; } #naviLevel3 ul, #naviLevel2 ul, #naviLevel1 ul { margin:0; padding:0; } #naviLevel1 li { display:inline; color: @bg; height: 40px; line-height: 40px; font-size: 24px; list-style:none; margin:0 25px 0 0; } #naviLevel1 li.inactive a:hover, #naviLevel1 li.current a:hover, #naviLevel1 li a:hover { color: @activeColor; } #naviLevel1 li.current a { color: @activeColor; font-weight: normal; } #naviLevel1 li.active a { color: @activeColor; font-weight: normal; } #naviLevel1 li.inactive a { color: @inverseColor; font-weight: normal; } #naviLevel3 li, #naviLevel2 li { list-style-image: none; list-style-position: outside; float:left; clear:both; color: @inverseColor; height: 25px; margin: 0; padding: 0; list-style:none; /* background: url(/media/custom/arrow.png) top -20px no-repeat; */ } #breadcrumb a { color: @textColor; } #breadcrumb { color: @textColor; } #breadcrumb { font-size: 11px; height:20px; width:570px; clear:both; padding: 10px 0 10px 0; } #breadcrumb ul, #breadcrumb li { font-size: 11px; color: @textColor; display:inline; list-style:none; margin:0; padding:0; } .themed #footer { color: @textMedium; } #footer{ font-family: arial, helvetica, sans-serif; width:940px; color: @textColor; font-size:11px; padding-top: 20px; margin: 0 10px 50px 10px; clear:both; } #copyright { float:left; height: 40px; width:200px; } .themed #footernavi ul, .themed #footernavi ul a { color: @textMedium; } #footernavi { height: 40px; float:right; width:200px; } #footernavi ul, #footernavi li { font-size:11px; font-family: arial, helvetica, sans-serif; display:inline; text-align: right; float:right; margin:0; padding:0 0 0 5px; border:0; } .pressclipping { margin-bottom: 10px; height:220px; cursor: pointer; } .pressclipping h4 { font-weight: normal; margin-top:5px; } .pressContent { display:none; } .clippingsTrigger { cursor: pointer; } .column1, .column2, .column3, .column4, .column5, .column6, .column7, .column8 { float: left; padding:0; margin:0; border:0; } .column1 { width:120px; } .column2 { width:240px; } .column3 { width:360px; } .column4 { width:480px; } .column5 { width:600px; } .column6 { width:720px; } .column7 { width:840px; } .column8 { width:960px; } .downloadlink { background: url(/media/custom/btnDownloadInline.gif) top left no-repeat; padding: 0 0 0 16px; } .downloadlinkpdf { background: url(/media/custom/icon_pdf_16.gif) top left no-repeat; padding: 0 0 0 24px; } p.downloadlink { padding: 0; } p.downloadlink a, p.downloadlink img { margin: 0; padding: 0; } #navLangs { margin: 39px 0 31px 16px; } #navLangs a, #navLangs a:link, #navLangs a:visited { color: @textColor; } #navLangs ul, #navLangs li { font-size:12px; display:inline; margin:0; padding:0 0 0 5px; border:0; } #navLangs ul { padding:0 0 0 10px; } /* Sonderfall Facebook Händlerliste ============================================== */ body.body_weiss { background: #fff; } #stage.facebook { width:520px; } .facebook .accTrigger { width:140px; } #ScrollArea { overflow:hidden; height:800px; width:640px; } .body_weiss #ScrollArea { height:auto; width:220px; margin:20px; background: #fff; } #haendlerListeFB { width:160px; background:#fff; float:left; } #haendlerListe { width:320px; float:left; } #haendlerItem { padding:10px 0 0 0; width:220px; height:160px; float:left; margin:0 10px 0 0 } .body_weiss #haendlerItem { height:auto; padding:10px 0 20px 0; width:200px; } .body_weiss #ScrollArea a, .body_weiss #ScrollArea p, .body_weiss #ScrollArea h1, .body_weiss #ScrollArea h2, #haendlerListeFB h1, #haendlerListeFB h2, #haendlerListeFB a { color: #000; } .body_weiss .listeKanton { width: 220px; } .listeKanton { width:640px; overflow:hidden; top:245px; float:left; } .body_weiss .accTrigger { border-bottom: 1px dotted #000; } .accTrigger { cursor: pointer; display: block; border-bottom: 1px dotted #FFF; padding:0; margin:0 0 10px 0; padding:0 0 5px 0; width:280px; } /* Mobile Stage */ /* ======================================================================== */ /* @media screen and (max-width: 480px) { */ @media screen and (max-width: 640px) { .varianteUebersicht { width: 49%; padding: 0; margin: 0; margin:0 1px 1px 0; } .varianteUebersicht table { width: 90%; } .description { width: 90%; padding-bottom:5px; } body { background: #fff; } .searchresultArticle, #passinglane, .column8, .column6, #content, .column2, .home #logo, .home #header, #logo, #header, #language, .uebersicht #header, #navigation, #naviLevel1, #naviLevel2, #pagemap, #footer, #copyright, #stage { position: relative; width: 100%; overflow: hidden; } #language { display: none; height: 35px; background: #eee; padding: 0 5% 0 5%; width: 90%; } #logo, .home #logo { text-align: center; margin-top:30px; height: 160px; background: #fff url(/media/custom/logoHome.png) top center no-repeat; background-size: 70%; } #contentNeu, #footernavi, #logo img { display: none; } #header { height: 200px !important; border-bottom: 1px solid #ccc; } .body_home #header { height: 390px !important; } #slideshow img { width:100%; height: auto; } .home #headimage, #headimage, #slideshow { width:100%; position: relative; float: left; clear:both; height: auto; padding: 0; margin: 0; } .body_kollektion_uebersicht #headimage, .body_kollektion_uebersicht #slideshow { display: none; } #navigation, #naviLevel1, #naviLevel2, #navigation li, #navigation ul { padding: 0; margin:0; width: 100%; height: auto; } #navigation li.active, #navigation li.level1, #navigation li.inactive{ text-align: center; width: 100%; height: 40px; background: #eee; display: block; border-bottom: 1px solid #ddd; } #passinglane li.active, #passinglane li.current, #passinglane li.level1, #passinglane li.inactive { text-align: center; width: 100%; height: 30px; line-height: 30px; background: #ddd; display: block; font-size: 16px; border-bottom: 1px solid #ccc; } #passinglane { height: auto; min-height: 10px; padding: 0; margin: 0; } #passinglane li.current a { color: #000; } #navigation li { text-align: center; margin-bottom: 1px; height: 30px; text-align: center; } #search { padding: 10px 0 10px 0; margin:0; top:0; position: fixed; z-index: 300; background: url(/media/custom/bgTopMobile.png) 0 0 repeat-x; width: 100%; } #search * { float:right; padding-right: 10px; } .themed #pagemap, #pagemap ul, #pagemap h3, #pagemap { background: #fff; margin: 0; padding: 0; border: 0; } #pagemap h3, #pagemap ul { padding: 10px 0 10px 0; height: auto; width: 100%; text-align: center; } #pagemap h3, #pagemap h3 a, .themed #pagemap h3 a, .themed #pagemap h3 { color: #000; } #pagemap ul a, #pagemap a, .themed #pagemap ul a, .themed #pagemap a { color: #888; } .themed #pagemap li, #pagemap li { width: 100%; font-size: 14px; line-height: 20px; height: 20px; padding-top: 5px; text-align: center; border-bottom: 1px solid #ddd; } #pagemap, .themed #pagemap { margin-top:50px; border-top:1px solid #ddd; padding: 10px 0 0 0; } #navigation li.separator { display: none; } #arrowController, .artikelGross { margin: 0; width: 100%; } #innerController { float: right; } #mfpagefooter { display: none; } .DescrGross, .abbGross { position: relative; width: 100%; height: auto; padding: 0; margin: 0; } .abbGross table { width: 100%; height: auto; padding: 0; margin: 0; } #leftMargin80 { margin: 0; } .searchresult, .variantePreview, .currentPreview { margin: 0; padding: 0; width: 49%; margin: 0 1px 1px 0; } .resultText, .resultImage, .variantePreview table { margin: 0; padding: 0; width: 100%; } }