/* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Aufteilung */ .page { margin: 0 auto; width: 960px; padding: 18px 0 0 0 } .header { position: fixed; top: 0; left: 0; width: 100%; height: 70px; z-index: 100; background-color: #ffffff } .header .logo { float: left; width: 115px; height: 72px; padding: 0 0 0 34px; margin: -3px 0 0 0; } .header .hauptnavigation { float: left; width: 645px } .header .meta { margin: 0 0 0 621px; height: 47px } .header .socialbuttons { position: absolute; right: 0; top: 70px; clear: right; min-width: 10px; height: 32px } .header .socialbuttons .buttons-start { float: left; width: 9px; height: 32px; background: url(../pics/layout/socialmedia.hg.png) 0 bottom no-repeat } .header .socialbuttons .buttons { margin: 0 19px 0 9px; padding: 0 5px 0 0; height: 32px; background: url(../pics/layout/socialmedia.hg.png) right bottom no-repeat } .header .socialbuttons .buttons .link { display: block; float: left; margin: 4px 4px 0 0; width: 24px; height: 24px } /* Seitenbild u. a. für Promotion Template */ .pagelogo .bild { position: relative; top: -58px; float: right; } .footer .navigationen { height: 34px; background: url(../pics/layout/footer.hg.png) repeat-x; overflow: hidden } .footer .claim { float: right; min-width: 1px } .footer .claim .bild { float: right; min-width: 1px } .gui-overlay { background: #000; } /* Basisdefinitionen */ * { font-family: "Lucida Sans W01 Roman", Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; color: #FFF; text-align: left; padding: 0; margin: 0 } body { height: 100%; text-align: center; position: relative; background-color: #ddd; margin-top: 47px; } body.popup { background-color: #c9a58f; margin-top: 20px; } body.popup-caffeo { background-color: #5b493d; background-image: url(../pics/layout/hg-info.png); margin-top: 20px; } body.popup-caffeo .page { width: 785px; } a:link { color: #FFF; text-decoration: none; text-transform: none; font-weight: normal; } a:visited { color: #FFF; text-decoration: none; text-transform: none; font-weight: normal; } a:hover { color: #dd1930; text-decoration: none; text-transform: none; font-weight: normal; } a:active { color: #FFF; text-decoration: none; text-transform: none; font-weight: normal; } b { font-family: "Lucida Sans W01 Bold",sans-serif; color: inherit; } strong { font-family: "Lucida Sans W01 Bold",sans-serif; color: inherit; } i { font-style: italic } img { border:0 } p { padding: 0 0 0 0 } ul { margin: 0 0 0 0; padding:0 0 0 10px; display: block; overflow: hidden } ol { margin: 0 0 0 0; padding:0 0 0 10px; display: block; overflow: hidden } ul li { list-style : none } h1, h1 a { font-size: 32px; font-family: "Century Gothic W01", sans-serif; margin: 20px 0 0 0; } h2 { font-size: 16px; margin: 0 0 40px 0; } h2 a:link, h2 a:visited { color: #FFF; font-size: 13px; padding: 1px 30px 1px 0; margin: 0 0 10px 0; background: url(../pics/layout/textlink-pfeil.png) no-repeat; background-position: top right;} h2 a:hover { background-position: 100% -18px;} sup { font-size: 75%; vertical-align: text-top; } .text sup { color: #555; } .page .texte .absatz .text sup { color: #fff; } .page .texte .absatz .text a:hover sup { color: #DD1930; } .modul-produkt .detail .text sup { color: #fff; } .modul-produkt .awards-links sup { color: #555; } .modul-produkt .awards-links a:hover sup { color: #DD1930; } .modul-produkt .tab-toolbar .tab-active sup { color: #DD1930; } .modul-produkt .tab-toolbar sup { color: #555; } .modul-produkt .tab-hover sup { color: #DD1930; } .mh-milkfoamer .modul-produkt .detail sup { color: #555; } .mh-accessories .modul-produkt .detail sup { color: #555; } .suchergebnis-trefferliste a:hover sup { color: #DD1930; } .modal-dialog .page .texte .absatz .text sup { color: #323232; } a:hover span.btn-text-29 sup { color: #DD1930; } a:hover span.button-text sup { color: #DD1930; } a:hover span.button-text-29 sup { color: #DD1930; } .sitemap a:hover sup { color: #DD1930; } .bg-info .text sup { color: #fff; } .bg-promo .text sup { color: #fff; } .absatz-promo .text sup { color: #fff; } .bg-promo .langtext sup { color: #fff; } .bg-promo-red .text sup { color: #fff; } .bg-promo-red .langtext sup { color: #fff; } .viewport sup { color: #323232; } .navigation ul ul a sup { color: #555; } .popup .text sup { color: #fff; } /* Tabellen */ .page table { padding: 10px 0 0 20px; background: url(../pics/layout/promo-detail-hintergrund.png); } .page table td { padding: 0 10px 20px 0; } .page table.verkostung { padding: 10px 0 0 0; background-image: none; } .page table.verkostung td { width: 210px; padding: 20px; background: url(../pics/layout/promo-detail-hintergrund.png); } .page table.verkostung td.empty { background-image: none; } /* Verstecken */ .cycon-wysiwyg { display: none } /* Inhalt einspaltig / zweispaltig */ .page h2 { margin: 0 0 0 0; padding: 5px 0 0 0; } .page .column1 .absatz h2 { margin-bottom: 10px; } .page .column2 .absatz h2 { margin-bottom: 10px; } .page .texte { margin: 20px 0 0 0; } .texte .single-column { width: 60%; margin: 0 0 0 30px; float: left; } .texte .single-column.full-width { width: 100%; padding: 0 30px 0 30px; float: none; margin: 0; box-sizing: border-box; } .texte .column1 { width: 450px; margin: 0 0 0 30px; float: left; } .texte .column2 { margin: 0 10px 0 490px; width: 450px; } .texte .content-wrapper { overflow: hidden; } .texte hr { border: 0; border-top: 1px solid #504036; border-bottom: 1px solid #837369; width: 430px; margin: 15px 0 15px 0; } .dokument .pdf .link-icon { float: left; height: 18px; padding: 0px 0px 0px 37px; background: url(../system/pics/emoticons/icon_typ_pdf.png) no-repeat; cursor:pointer;} .dokument .pdf:hover .link-icon { background-position: 0 -18px; } .dokument .pdf .link-text { padding: 4px 0 10px 45px; } /* Kalender */ .popup-kalender a { color: #000000; } .popup-kalender form { color: #000000; } #cal-monat { float: left; color: #000000; } #cal-jahr { float: left; margin: 0 0 0 10px; color: #000000; } #cal-monat select { color: #000000; } #cal-monat option { color: #000000; } #cal-jahr select { color: #000000; } #cal-jahr option { color: #000000; } /* quiz */ .quiz h2 { color: #323232; } .quiz h1 { color: #323232; } body.quiz { margin-top: 47px; } .quiz .titel { padding-top: 38px; } .quiz .bg-info-footer { height: 25px; } /* Hintergründe */ #background-wrapper { width: 100%; height: 100%; top: 0; left: 0; position: absolute; z-index: -20; overflow: hidden; } #background-wrapper .background { position: absolute; top: 0; left: 50%; z-index: -20; } #background-wrapper .coffeesmile { position: absolute; width: 1515px; height: 313px; left: 0; bottom: 40px; z-index: -10; } .texte_footer_content { clear: both; } /* Hintergründe Kampagne */ #background-wrapper-campaign { width: 100%; height: 100%; top: 0; left: 0; position: absolute; z-index: -20; overflow: hidden; } #background-wrapper-campaign .background { position: absolute; top: 0; left: 50%; z-index: -20; } #background-wrapper-campaign .coffeesmile { position: absolute; width: 1515px; height: 313px; left: 0; bottom: 40px; z-index: -10; } /* Alternative zur Standardhintergrundlogik (background-size: cover) -> Template: content_cover.tpl */ body.content-cover { background-size: cover; background-position: center bottom; } /* Iframe */ body.extern .page iframe { border: 0; display: block; }/* Cookierichtlinien */ div[data-cycon-module=cookie] * { font-family: "Lucida Sans W01 Roman", Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; } div[data-cycon-module=cookie] { background: #DD1930 none repeat scroll 0 0; color: #ffffff; padding: 20px 0; position: fixed; text-align: center; width: 100%; z-index: 101; left: 0; bottom: 34px; display: none; } div[data-cycon-module=cookie] p { margin: 0 10px 10px; text-align: center; color: #ffffff; } div[data-cycon-module=cookie] a.button-29:hover .button-left { background-position: left bottom; } div[data-cycon-module=cookie] a.button-29 .button-left { background-position: left bottom; } div[data-cycon-module=cookie] a.button-29:hover .button-right { background-position: right bottom; } div[data-cycon-module=cookie] a.button-29 .button-right { background-position: right bottom; } div[data-cycon-module=cookie] a.button-29 .button-text { background-position: center bottom; } div[data-cycon-module=cookie] a.button-29:hover .button-text { background-position: center bottom; } div[data-cycon-module=cookie] a.button-29 .button-text span { background-position: right bottom; color: #dd1930; } div[data-cycon-module=cookie] a.button-29:hover .button-text span { background-position: right bottom; color: #dd1930; } div[data-cycon-module=cookie] a.button-29 { display: inline-block; margin-right: 10px; background-position: left bottom; } .cookie-wrapper { text-align: center; display: inline-block; } @media screen and (min-width: 320px) { div[data-cycon-module=cookie] .cookie-button-wrapper { text-align: center; } div[data-cycon-module=cookie] a.button-29 { float: none !important; } } @media screen and (min-width: 1200px) { div[data-cycon-module=cookie] p { float: left; width: 800px; } div[data-cycon-module=cookie] a.button-29 { float: left; } div[data-cycon-module=cookie] .cookie-button-wrapper { margin-left: 840px; overflow: hidden; } } .button-29 { cursor: pointer; height: 29px; text-decoration: none; } .button-29 .button-left { background: url(../pics/layout/buttons.hg.29.png) no-repeat scroll left top transparent; float: left; height: 29px; width: 10px; } .button-29 .button-right { background: url(../pics/layout/buttons.hg.29.png) no-repeat scroll right top transparent; float: left; height: 29px; width: 10px; } .button-29 .button-text { background: url(../pics/layout/buttons.hg.29.png) repeat-x scroll center top transparent; float: left; height: 29px; } .button-29 .button-text span { background: url(../pics/layout/link.text.normal.png) no-repeat right 11px; color: #fff; font-size: 12px; text-transform: uppercase; float: left; padding: 10px 10px 0 0; line-height: 10px; } a.button-29:hover .button-left { background-position: left bottom; } a.button-29:hover .button-right { background-position: right bottom; } a.button-29:hover .button-text { background-position: center bottom; } a.button-29:hover .button-text span { background: url(../pics/layout/link.text.aktiv.png) no-repeat right 11px; color: #DD1930; } .button-29-reverse .button-text span { background: url(../pics/layout/link.text.normal.back.png) no-repeat left 11px; color: #fff; font-size: 12px; text-transform: uppercase; float: left; padding: 10px 0 0 10px; } a.button-29-reverse:hover .button-text span { background: url(../pics/layout/link.text.aktiv.back.png) no-repeat left 11px; } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Hinweise: - jedes Seitenelement wird hier definiert - Seiteneffekte zwischen Seitenelementen sind auszuschließen */ /* TinyMCE Style Dropdown */ /* Eintrag: Rot=rot */ .rot { color: #F00 } /* Eintrag: Grün=gruen */ .gruen { color: #0F0 } /* Eintrag: Blau=blau */ .blau { color: #00F } /* Element: Absatz */ .absatz { } .absatz .bild-unterschrift { font-style: italic; width: 80px } .absatz .bild-rechts { float: right; padding: 0 0 10px 10px } .absatz .bild-links { float: left; padding: 0 10px 10px 0 } .absatz .text { } .absatz-button .button-29 { cursor: pointer; display: block; height: 29px; margin-top: 20px; overflow: hidden; } .absatz-button .text a { text-decoration: underline; } .coffee-experience-header { height: 363px; width: 960px; display: block; min-height: 1px; position: relative; } .coffee-experience-header img { display: block; } .coffee-experience-header .pfeil-rechts:hover .coffee-experience-link-right {display: block; } .coffee-experience-header .coffee-experience-link-right { display:none; height: 21px; position: absolute; right: 0px; top: 163px; padding: 15px 35px 10px 20px; background: url(../navigationen/pics/layout/kaffee-erleben-pfeil-bg-rechts.png) no-repeat left center;} .coffee-experience-header .pfeil-links:hover .coffee-experience-link-left {display: block; } .coffee-experience-header .coffee-experience-link-left { display:none; height: 21px; position: absolute; left: 0px; top: 163px; padding: 15px 20px 10px 35px; background: url(../navigationen/pics/layout/kaffee-erleben-pfeil-bg-links.png) no-repeat right center;} .coffee-experience-header .coffee-experience-pfeil-right { width: 31px; height: 41px; position: absolute; right: 0px; top: 165px; background: url(../navigationen/pics/layout/kaffee-erleben-pfeil-rechts.png) no-repeat 0px 1px;} .coffee-experience-header .pfeil-rechts:hover .coffee-experience-pfeil-right { width: 31px; height: 41px; position: absolute; right: 0px; top: 166px; background: url(../navigationen/pics/layout/kaffee-erleben-pfeil-rechts.png) no-repeat 0px -41px;} .coffee-experience-header .coffee-experience-pfeil-left { width: 25px; height: 41px; position: absolute; left: 0px; top: 165px; background: url(../navigationen/pics/layout/kaffee-erleben-pfeil-links.png) no-repeat 0 1px;} .coffee-experience-header .pfeil-links:hover .coffee-experience-pfeil-left { width: 25px; height: 41px; position: absolute; left: 0px; top: 166px; background: url(../navigationen/pics/layout/kaffee-erleben-pfeil-links.png) no-repeat 0 -41px;} .coffee-experience-header .functions { position: absolute; top: 20px; right: 20px; background: url(../pics/layout/social-print-box.png) no-repeat; } .coffee-experience-header .functions { text-align: right; float: right; width: 117px; padding: 5px 17px 4px 0; overflow: hidden ; } .coffee-experience-header .functions iframe { float: right; margin-right: 6px; } .coffee-experience-header .functions a.print-button { margin: 1px 3px 0 2px; } .coffee-experience-header .functions a.print-button:link { float: right; width: 21px; height: 21px; line-height: 25px; background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .coffee-experience-header .functions a.print-button:visited { background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .coffee-experience-header .functions a.print-button:hover { background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .coffee-experience-header .functions a.print-button:active { background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .coffee-experience-header .functions .facebook-button { float: right; margin-right: 6px; width: 76px; overflow: hidden } .coffee-experience-navi { margin-top: -40px; width: 960px; overflow: hidden; } .coffee-experience-navi .navi-tab { margin-right: 2px; height: 40px; display: inline; float: left; position: relative; } .coffee-experience-navi .navi-tab-ende { background: url(../pics/layout/kaffee-erleben-tabnavi.png) right 84px; height: 40px; width: 15px; float: left; } .coffee-experience-navi .navi-tab-start { padding: 10px 0 0 15px; background: url(../pics/layout/kaffee-erleben-tabnavi.png) 0 84px ; height: 30px; float: left; } .coffee-experience-navi .navi-tab:hover .navi-tab-ende { background: url(../pics/layout/kaffee-erleben-tabnavi.png) right 42px; height: 40px; width: 15px; float: left; } .coffee-experience-navi .navi-tab:hover .navi-tab-start { padding: 10px 0 0 15px; background: url(../pics/layout/kaffee-erleben-tabnavi.png) 0 42px ; height: 30px; float: left; } .coffee-experience-navi .navi-tab-start-aktiv { padding: 10px 0 0 15px; background: url(../pics/layout/kaffee-erleben-tabnavi.png) left top; height: 30px; float: left; } .coffee-experience-navi .navi-tab-ende-aktiv { background: url(../pics/layout/kaffee-erleben-tabnavi.png) right top; height: 40px; width: 15px; float: left; } .coffee-experience-navi a:link { color: #fff; font-size: 13px; } .coffee-experience-navi a:visited { color: #fff; font-size: 13px; } .coffee-experience-navi a:active { color: #fff; font-size: 13px; } .coffee-experience-navi a:hover { color: #fff; font-size: 13px; } .coffee-experience-navi .navi-tab-start-aktiv a:link { color: #dd1930;} .coffee-experience-navi .navi-tab-start-aktiv a:visited { color: #dd1930;} .coffee-experience-navi .navi-tab-start-aktiv a:active { color: #dd1930;} .coffee-experience-navi .navi-tab-start-aktiv a:hover { color: #dd1930;} /* Element: Coffee experience container layouts */ .kaffee-erleben-navi .tab-toolbar { float: left; width: 750px; background-color: #FFF; padding: 0 0 0 3px } .kaffee-erleben-navi .tab { overflow: hidden } .kaffee-erleben-navi .tab-toolbar .tab-label { padding: 0 15px; background: url(../pics/layout/tab.trenner.gif) no-repeat right 6px #FFF; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 14px; line-height: 30px; color: #CCC; text-transform: uppercase } .kaffee-erleben-navi .tab-toolbar .tab-label:hover { color: #555;} .kaffee-erleben-navi .tab-toolbar .tab-active { padding: 0 15px; background: url(../pics/layout/tab.trenner.gif) no-repeat right 6px #FFF; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 14px; line-height: 30px; color: #dd1930; text-transform: uppercase } .kaffee-erleben-navi .tab-toolbar .tab-active:hover { color: #dd1930;} .kaffee-erleben-navi .tab-content { height: 420px; padding: 20px; } .kaffee-erleben-navi .tab-toolbar { float: left; width: 223px; border-top: 1px solid #CCC; margin: 19px 0 0 19px } .kaffee-erleben-navi .tab-toolbar .tab-active { background: url(../pics/layout/link.text.aktiv.png) no-repeat right center; color: #DD1930 } .kaffee-erleben-navi .tab-toolbar .letzter { border: none; background: transparent } /* Element: Absatz Akkordeon */ .absatz-akkordeon { overflow: hidden; } .absatz-akkordeon hr { width: 100%; margin: 0 0 10px 0; border: 0; border-top: 1px solid #440F1A; border-bottom: 1px solid #5E2934; } .absatz-akkordeon hr.erster { display: none; } .absatz-akkordeon .akkordeon-left { float: left; width: 337px } .absatz-akkordeon .akkordeon-right { float: left; width: 603px } .absatz-akkordeon .bild { float: left; padding: 0 10px 10px 20px; } .absatz-akkordeon h2 { font-size: 18px; font-family: "Lucida Sans W01 Roman", sans-serif; color: #ffffff; } .absatz-akkordeon .text { margin: 5px 0 0 0; font-size: 13px; font-family: "Lucida Sans W01 Roman", sans-serif; color: #ffffff; } .absatz-akkordeon .title { margin-bottom: 15px } .absatz-akkordeon .acContent { margin-bottom: 15px } .absatz-akkordeon .more, .absatz-akkordeon .less { float: left } .absatz-akkordeon .btn-start { padding: 6px 0 6px 8px; line-height: 12px; background: url(../pics/layout/buttons.hg.23.png) no-repeat 0 0; font-size: 9px; } .absatz-akkordeon .btn-text { padding: 6px 9px 6px 0; line-height: 12px; background: url(../pics/layout/buttons.hg.23.png) no-repeat right 0; color: #FFF; font-family: "Lucida Sans W01 Bold", sans-serif; font-size: 9px; font-weight: bold; text-transform: uppercase; cursor: pointer; } .absatz-akkordeon .btn-arrow { padding: 6px 9px 6px 6px; line-height: 12px; background: url(../pics/layout/akkordeon.png) no-repeat; font-size: 9px; cursor: pointer; background-position: 5px -36px; } .absatz-akkordeon .btn-start-aktiv { padding: 7px 0 5px 8px; background-position: 0 bottom; cursor: pointer; } .absatz-akkordeon .btn-text-aktiv { background-position: right bottom; color: #DD1930; cursor: pointer; } .absatz-akkordeon .btn-arrow-aktiv { background: url(../pics/layout/akkordeon.png) no-repeat center; cursor: pointer; background-position: 5px -2px; } .absatz-akkordeon .button-23 { cursor: pointer; height: 29px; text-decoration: none; } .absatz-akkordeon .button-23 .button-left { background: url(../pics/layout/buttons.hg.23.png) no-repeat scroll left top transparent; float: left; height: 23px; width: 10px; } .absatz-akkordeon .button-23 .button-right { background: url(../pics/layout/buttons.hg.23.png) no-repeat scroll right top transparent; float: left; height: 23px; width: 10px; } .absatz-akkordeon .button-23 .button-text { background: url(../pics/layout/buttons.hg.23.png) repeat-x scroll center top transparent; float: left; height: 23px;} .absatz-akkordeon .button-23 .button-text span { background: url(../pics/layout/akkordeon.png) no-repeat 32px -36px; color: #fff; font-size: 9px; text-transform: uppercase; float: left; padding: 7px 17px 0 0; line-height: 9px; } .absatz-akkordeon .button-23 .button-left-aktiv { background-position: left bottom; } .absatz-akkordeon .button-23 .button-right-aktiv { background-position: right bottom; } .absatz-akkordeon .button-23 .button-text-aktiv { background-position: center bottom; } .absatz-akkordeon .button-23 .button-text-aktiv span { background: url(../pics/layout/akkordeon.png) no-repeat 49px -2px; color: #DD1930; } .absatz-akkordeon .mehr-weniger-btn { padding-bottom: 50px } .absatz-akkordeon table { width: 561px; background: url(../pics/layout/promo.table.bg.png) no-repeat top center; } .absatz-akkordeon table td { vertical-align: top; font-size: 13px; } .absatz-akkordeon table td p { font-size: 13px; } .absatz-akkordeon table td strong { font-size: 18px; font-weight: normal; } .absatz-akkordeon .acText-unten { width: 561px; height: 10px; display: block; background: url(../pics/layout/promo.table.bg.png) no-repeat bottom center; } .absatz-akkordeon .html { width: 561px; background: url(../pics/layout/promo.table.bg.png) no-repeat 0 -10px; } .absatz-akkordeon .html iframe { margin: 0; } /* Element: Titel */ .titel { } /* Element: Text */ .text { } .text ol li { } .text ul li { list-style-type: disc; margin: 0 0 0 10px } /* Element: Bild */ .bild { } .bild-unterschrift { font-style: italic } .bild-rechts { float: right; padding: 0 } .bild-links { float: left; padding: 0 } /* Element: Bild */ .bild-url-resize { position: absolute; z-index: -1; width: 0; height: 0 } /* Element: Link */ .link { } /* Element: Dokument */ .dokument { overflow:hidden } .dokument .icon-typ { float: left } /* Element: Container */ .container { } /* Element: Umbruch */ .umbruch { font-size: 1px; line-height: 1px; width: 100%; height: 1px; overflow: hidden; } /* Element: Button (rot/weiss) */ a span.btn-start { padding: 6px 0 6px 8px; line-height: 12px; background: url(../pics/layout/buttons.hg.23.png) no-repeat 0 0; font-size: 9px; } a span.btn-text { padding: 6px 9px 6px 0; line-height: 12px; background: url(../pics/layout/buttons.hg.23.png) no-repeat right 0; color: #FFF; font-family: "Lucida Sans W01 Bold", sans-serif; font-size: 9px; font-weight: bold; text-transform: uppercase } a span.btn-arrow { padding: 6px 9px 6px 0; line-height: 12px; background: url(../pics/layout/link.text.normal.png) no-repeat center; font-size: 9px; } a:hover span.btn-start { background-position: left -26px; cursor: pointer; } a:hover span.btn-text { background-position: right bottom; color: #DD1930; cursor: pointer; } a:hover span.btn-arrow { background: url(../pics/layout/link.text.aktiv.png) no-repeat center; cursor: pointer; } .button-23 { cursor: pointer; height: 29px; text-decoration: none; } .button-23 .button-left { background: url(../pics/layout/buttons.hg.23.png) no-repeat scroll left top transparent; float: left; height: 23px; width: 10px; } .button-23 .button-right { background: url(../pics/layout/buttons.hg.23.png) no-repeat scroll right top transparent; float: left; height: 23px; width: 10px; } .button-23 .button-text { background: url(../pics/layout/buttons.hg.23.png) repeat-x scroll center top transparent; float: left; height: 23px; } .button-23 .button-text span { background: url(../pics/layout/link.text.normal.png) no-repeat right 7px; color: #fff; font-size: 9px; text-transform: uppercase; float: left; padding: 7px 10px 0 0; line-height: 9px; } a.button-23:hover .button-left { background-position: left bottom; } a.button-23:hover .button-right { background-position: right bottom; } a.button-23:hover .button-text { background-position: center bottom; } a.button-23:hover .button-text span { background: url(../pics/layout/link.text.aktiv.png) no-repeat right 7px; color: #DD1930; } .button-29 { cursor: pointer; height: 29px; text-decoration: none; } .button-29 .button-left { background: url(../pics/layout/buttons.hg.29.png) no-repeat scroll left top transparent; float: left; height: 29px; width: 10px; } .button-29 .button-right { background: url(../pics/layout/buttons.hg.29.png) no-repeat scroll right top transparent; float: left; height: 29px; width: 10px; } .button-29 .button-text { background: url(../pics/layout/buttons.hg.29.png) repeat-x scroll center top transparent; float: left; height: 29px; } .button-29 .button-text span { background: url(../pics/layout/link.text.normal.png) no-repeat right 11px; color: #fff; font-size: 12px; text-transform: uppercase; float: left; padding: 10px 10px 0 0; line-height: 10px; } a.button-29:hover .button-left { background-position: left bottom; } a.button-29:hover .button-right { background-position: right bottom; } a.button-29:hover .button-text { background-position: center bottom; } a.button-29:hover .button-text span { background: url(../pics/layout/link.text.aktiv.png) no-repeat right 11px; color: #DD1930; } .button-29-reverse .button-text span { background: url(../pics/layout/link.text.normal.back.png) no-repeat left 11px; color: #fff; font-size: 12px; text-transform: uppercase; float: left; padding: 10px 0 0 10px; } a.button-29-reverse:hover .button-text span { background: url(../pics/layout/link.text.aktiv.back.png) no-repeat left 11px; } .button-order { display: block; margin: 15px 0 10px } .button-order .button-text span { background: url(../pics/layout/produkt.button.order.icon.png) no-repeat 0 7px; padding: 10px 0 2px 25px } a.button-order:hover .button-text span { background: url(../pics/layout/produkt.button.order.icon.png) no-repeat 0 -16px } /* in die andere Richtung */ a span.btn-start-reverse { padding-left: 3px; } a span.btn-text-reverse { padding-right: 12px; } a span.btn-arrow-reverse { background: url(../pics/layout/link.text.normal.back.png) no-repeat center; } a:hover span.btn-arrow-reverse { background: url(../pics/layout/link.text.aktiv.back.png) no-repeat center; } .single-column .text { margin-bottom: 15px; } /* Element: GUI */ .dialog { position: absolute; z-index: 999999 } /* Element: Coffee experience container layouts */ .coffee-experience .tab-toolbar { float: left; width: 750px; padding: 0 0 0 3px } .coffee-experience .tab { overflow: hidden } .coffee-experience .tab-toolbar .tab-label { padding: 0 15px; background: url(../pics/layout/tab.trenner.gif) no-repeat right 6px #FFF; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 14px; line-height: 30px; color: #CCC; text-transform: uppercase } .coffee-experience .tab-toolbar .tab-label:hover { color: #555;} .coffee-experience .tab-toolbar .tab-active { padding: 0 15px; background: url(../pics/layout/tab.trenner.gif) no-repeat right 6px #FFF; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 14px; line-height: 30px; color: #dd1930; text-transform: uppercase } .coffee-experience .tab-toolbar .tab-active:hover { color: #dd1930;} .coffee-experience .tab-toolbar .letzter { border: none; background: transparent } .coffee-experience .tab-content { padding: 20px 20px 0 20px; } .coffee-experience-footer { clear: both; overflow: hidden; width: 960px; height: 20px; background: url(../pics/layout/produkt.hintergrund.fff.90.ecken.png) left bottom; float: left; } .coffee-experience { width: 960px; overflow: hidden; background: url(../pics/layout/produkt.hintergrund.fff.90.png) repeat } .coffee-experience-tab { } .coffee-experience .tab-toolbar { float: left; width: 223px; border-top: 1px solid #CCC;} .coffee-experience .tab-toolbar .tab-active { background: url(../pics/layout/link.text.aktiv.png) no-repeat right center; color: #DD1930 } .coffee-experience .content-tab { margin: 0 0 0 238px; background-color: transparent } .coffee-experience .content-tab-label { border-bottom: 1px solid #CCC; padding: 0 10px 0 0; width: 213px; background-color: transparent; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 20px; color: #555; float: left; min-width: 5px; cursor: pointer; } .coffee-experience .content-tab-active { background: url(../pics/layout/link.text.aktiv.png) no-repeat right center; color: #DD1930} .coffee-experience .content-tab-content { background: transparent } .coffee-experience .content-tab.wide { margin: 0; background-color: transparent } .coffee-experience .content-tab.wide .text { float: left; padding: 19px; width: 531px; height: 235px; word-wrap: break-word; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 16px; color: #555; background: url(../pics/layout/produkt.detail.text.breit.hg.png) no-repeat } .coffee-experience .content-tab.wide .large .text { float: left; padding: 19px; width: 902px; height: 235px; word-wrap: break-word; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 16px; color: #555; background: url(../pics/layout/produkt.detail.text.breit.hg.png) no-repeat; background-size: 936px 271px; } .coffee-experience .content-tab.wide .pages { width: 569px; height: 273px; overflow: hidden; position: relative } .coffee-experience .content-tab.wide .pages.large { width: 920px; height: 273px; overflow: hidden; position: relative } .coffee-experience .content-text .text p { font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 19px; color: #555 } .coffee-experience .text p { color: #555 } .coffee-experience .text ul li { color: #555 } .coffee-experience .pages { width: 333px; height: 273px; overflow: hidden; position: relative } .coffee-experience .bild { float: right; width: 332px; height: 273px; min-height: 1px; } .coffee-experience .text { float: left; padding: 19px; width: 295px; height: 235px; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 16px; color: #555; background: url(../pics/layout/produkt.detail.text.hg.png) no-repeat } .coffee-experience .text h4 { padding: 0 0 10px 0; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 16px; line-height: 20px; color: #555 } .coffee-experience .content-text .text p { font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 19px; color: #555 } .coffee-experience .text p { color: #555 } .coffee-experience .text ul li { color: #555 } .coffee-experience .text p a { color: #555 } .coffee-experience .text p a:hover { color: #DD1930 } .coffee-experience .paging { position: absolute; width: 75px; height: 20px; left: 150px; bottom: 8px; z-index: 10; overflow: hidden } .coffee-experience a.page-back { width: 18px; height: 18px; position: absolute; left: 100px; bottom: 10px; z-index: 10; display: block; background: url(../pics/layout/produkt.paging.png) no-repeat 0 0 } .coffee-experience a.page-back:hover { background-position: 0 -16px } .coffee-experience a.page-next { width: 18px; height: 18px; position: absolute; right: 100px; bottom: 10px; z-index: 10; display: block; background: url(../pics/layout/produkt.paging.png) no-repeat -38px 0 } .coffee-experience a.page-next:hover { background-position: -38px -16px } .coffee-experience .paging .punkt { float: left; width: 18px; height: 18px; background: url(../pics/layout/produkt.paging.png) no-repeat -20px -17px } .coffee-experience .paging .punkt-aktiv { width: 18px; height: 18px; background: url(../pics/layout/produkt.paging.png) no-repeat -20px 0 } .coffee-experience .functions { text-align: right; float: right; width: 188px; padding: 5px 19px 4px 0; overflow: hidden ; background: #FFF } .coffee-experience .functions iframe { float: right } .coffee-experience .functions a.print-button:link { float: right; width: 21px; height: 21px; line-height: 25px; background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .coffee-experience .functions a.print-button:visited { background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .coffee-experience .functions a.print-button:hover { background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .coffee-experience .functions a.print-button:active { background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .abschluss { background: url("../pics/layout/produkt.hintergrund.fff.90.ecken.png") no-repeat scroll 0 bottom transparent; height: 10px; width: 960px } /* Element: Container Promo Registrierung */ .promo-registrierung { background-color: #F0F0F0; margin: 10px 200px 20px 37px; padding: 20px; overflow: hidden; min-height: 250px } .promo-registrierung * { color: #555555; font-size: 12px; font-family: "Lucida Sans W01 Roman",sans-serif } .promo-registrierung strong { font-family: "Lucida Sans W01 Bold",sans-serif; } .promo-registrierung sup { color: #555555 !important } .promo-registrierung ul { margin: 10px 0 10px 20px } .promo-registrierung .absatz { margin: 0 0 10px 0 } .promo-registrierung .erfolg { margin: 20px } .promo-registrierung a { color: #555555; text-decoration: underline } .promo-registrierung a:hover { text-decoration: none } /* Links im Fuß */ .single-column .link { float: left; padding: 0 30px 0 20px; background: url("../pics/layout/grafikelemente.png") no-repeat scroll -11px -419px transparent;} /* Element: Video Youtube */ .video.video-youtube { display: inline-block; float: none; } .video.video-youtube:nth-child(2n-1) { margin: 0 20px 20px 0; }/* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Hinweis: die Auswahl dieser Farbwelten wird in der Textdatei "text_suche_kategorien" gepflegt. */ /* Farbwelten Melitta Haushalt */ .mh-filtercoffee .modul-produkt .detail .tab { background-color: #E2001A } .mh-waterkettle .modul-produkt .detail .tab { background-color: #E2001A } .mh-caffeolattea .modul-produkt .detail .tab { background-color: #8E2776 } .mh-milkfoamer .modul-produkt .detail .tab { background-color: #EBECED } .mh-accessories .modul-produkt .detail .tab { background-color: #EBECED } .mh-caffeosolo .modul-produkt .detail .tab { background-color: #D5D7DA } .mh-caffeosolo .modul-produkt .detail h1 { color: #555; } .mh-caffeosolo .modul-produkt .detail sup { color: #555; } .mh-caffeosolo .modul-produkt .detail h2 { color: #555; } .mh-caffeosolo .modul-produkt .detail .text { color: #555; } .mh-caffeosolo .modul-produkt .detail .text sup { color: #555; } .mh-fullyautomatic .modul-produkt .detail .tab { background-color: #474D53 } .mh-filterbags .modul-produkt .detail .tab { background-color: #62A647 } .mh-coldbrew .modul-produkt .detail .tab { background-color: #e5f7ff } /* Farbwelten Melitta Kaffee */ .mc-filtercoffee .modul-produkt .detail .tab { background-color: #E2001A } .mc-bellacrema .modul-produkt .detail .tab { background-color: #844733 } .mc-cappuccino .modul-produkt .detail .tab { background-color: #434f91 } .mc-upawake .modul-produkt .detail .tab { background-color: #C21868 } /* Buttons */ .btn-order a span.btn-start { padding: 6px 0 5px 8px; background: url(../pics/layout/buttons.hg.23.png) no-repeat 0 0; font-size: 11px; } .btn-order a span.btn-text { padding: 6px 9px 5px 0; font-size: 11px } .btn-order a span.btn-icon { padding: 3px 0 5px 20px; background: url(../pics/layout/produkt.button.order.icon.png) no-repeat 0 4px } .btn-order a:hover span.btn-icon { background-position: 0 -19px } .btn-order a:hover span.btn-start { background-position: 0 -26px } .btn-order a:hover span.btn-text { background-position: right -26px; color: #DD1930 } .btn-search a:link, .btn-search a:visited { color: #FFF } .btn-search a:hover { color: #DD1930 } .btn-search a:active { color: #FFF } .btn-search a span.btn-arrow { background: url(../pics/layout/link.text.normal.png) no-repeat center } .btn-search a:hover span.btn-arrow { background: url(../pics/layout/link.text.aktiv.png) no-repeat center } /* hier werden die Farbausnahmen für die HELLEN Farbwelten definiert */ .mh-milkfoamer .btn-search a:link, .mh-milkfoamer .btn-search a:visited { color: #555 } .mh-milkfoamer .btn-search a:hover { color: #DD1930 } .mh-milkfoamer .btn-search a:active { } .mh-milkfoamer .btn-search a span.btn-arrow { background: url(../pics/layout/link.text.mehr.png) no-repeat center } .mh-milkfoamer .btn-search a:hover span.btn-arrow { background: url(../pics/layout/link.text.aktiv.png) no-repeat center } .mh-caffeosolo .btn-search a:link, .mh-caffeosolo .btn-search a:visited { color: #555 } .mh-caffeosolo .btn-search a:hover { color: #DD1930 } .mh-caffeosolo .btn-search a:active { } .mh-caffeosolo .btn-search a span.btn-arrow { background: url(../pics/layout/link.text.mehr.png) no-repeat center } .mh-caffeosolo .btn-search a:hover span.btn-arrow { background: url(../pics/layout/link.text.aktiv.png) no-repeat center } .mh-accessories .btn-search a:link, .mh-accessories .btn-search a:visited { color: #555 } .mh-accessories .btn-search a:hover { color: #DD1930 } .mh-accessories .btn-search a:active { } .mh-accessories .btn-search a span.btn-arrow { background: url(../pics/layout/link.text.mehr.png) no-repeat center } .mh-accessories .btn-search a:hover span.btn-arrow { background: url(../pics/layout/link.text.aktiv.png) no-repeat center } .mh-caffeosolo .text a:link, .mh-caffeosolo .text a:visited { color: #555 } .mh-caffeosolo .text a:hover { color: #DD1930 } .mh-milkfoamer .modul-produkt .detail h1, .mh-milkfoamer .modul-produkt .detail h2, .mh-milkfoamer .modul-produkt .detail .text, .mh-milkfoamer .modul-produkt .detail .text p, .mh-milkfoamer .modul-produkt .detail .text li { color: #555 } .mh-accessories .modul-produkt .detail h1, .mh-accessories .modul-produkt .detail h2, .mh-accessories .modul-produkt .detail .text, .mh-accessories .modul-produkt .detail .text p, .mh-accessories .modul-produkt .detail .text li { color: #555 } .mh-coldbrew .modul-produkt .detail .schatten { background-image: url(../pics/layout/produkt.detail.coldbrew.jpg) } .mh-coldbrew .modul-produkt .detail h1, .mh-coldbrew .modul-produkt .detail h2, .mh-coldbrew .modul-produkt .detail .text, .mh-coldbrew .modul-produkt .detail .text p, .mh-coldbrew .modul-produkt .detail .text li { color: #4f2700 } .mh-coldbrew .modul-produkt .detail sup { color: #4f2700 } .mh-coldbrew .modul-produkt .detail .text sup { color: #4f2700 } .mh-coldbrew .modul-produkt .detail .varianten .zeile span { color: #4f2700 } /* hier werden die Farbausnahmen für die ROTEN Farbwelten definiert */ .mh-filtercoffee .btn-search a:link, .mh-filtercoffee .btn-search a:visited { color: #FFF } .mh-filtercoffee .btn-search a:hover { opacity: .7; filter: alpha(opacity=70) } .mh-filtercoffee .btn-search a:active { } .mh-filtercoffee .btn-order a span.btn-start { background-position: left bottom } .mh-filtercoffee .btn-order a span.btn-text { background-position: right bottom; color: #DD1930 } .mh-filtercoffee .btn-order a span.btn-icon { background-position: 0 -19px } .mh-waterkettle .btn-search a:link, .mh-waterkettle .btn-search a:visited { color: #FFF } .mh-waterkettle .btn-search a:hover { opacity: .7; filter: alpha(opacity=70) } .mh-waterkettle .btn-search a:active { } .mh-waterkettle .btn-order a span.btn-start { background-position: left bottom } .mh-waterkettle .btn-order a span.btn-text { background-position: right bottom; color: #DD1930 } .mh-waterkettle .btn-order a span.btn-icon { background-position: 0 -19px } .mc-filtercoffee .btn-search a:link, .mc-filtercoffee .btn-search a:visited { color: #FFF } .mc-filtercoffee .btn-search a:hover { opacity: .7; filter: alpha(opacity=70) } .mc-filtercoffee .btn-search a:active { } .mc-filtercoffee .btn-order a span.btn-start { background-position: left bottom } .mc-filtercoffee .btn-order a span.btn-text { background-position: right bottom; color: #DD1930 } .mc-filtercoffee .btn-order a span.btn-icon { background-position: 0 -19px } /* Farbwelten für die Container & Absätze*/ .bg-promo { overflow: hidden; background: url(../pics/layout/hg-promo.png); padding: 20px 0 0 0; } .bg-promo-footer { width: 960px; height: 15px; background: url(../pics/layout/hg-promo-rand.png) no-repeat; background-position: 0 bottom; } .bg-promo-header { width: 960px; height: 15px; background: url(../pics/layout/hg-promo-rand.png) no-repeat; background-position: 0 top; margin: 15px 0 0 0; } .absatz-promo { background: url(../pics/layout/hg-promo.png); padding: 10px 10px 10px 30px; } .bg-info { overflow: hidden; background: url(../pics/layout/hg-info.png); padding: 20px 0 0 0; } .bg-info-footer { width: 960px; height: 115px; background: url(../pics/layout/hg-info-rand.png) no-repeat; background-position: 0 bottom; } .klein { height: 15px; } .popup-caffeo .bg-info-footer { display: none; } .bg-info-header { width: 960px; height: 15px; background: url(../pics/layout/hg-info-rand.png) no-repeat; background-position: 0 top; margin: 15px 0 0 0; } .absatz-info { background: url(../pics/layout/hg-info.png); padding: 10px 10px 10px 30px; } .bg-promo-red { overflow: hidden; background: url(../pics/layout/hg-promo-red.png); padding: 20px 0 0 0; } .bg-promo-red-footer { width: 960px; height: 15px; background: url(../pics/layout/hg-promo-red-rand.png) no-repeat; background-position: 0 bottom; } .bg-promo-red-header { width: 960px; height: 15px; background: url(../pics/layout/hg-promo-red-rand.png) no-repeat; background-position: 0 top; margin: 15px 0 0 0; } .absatz-promo-red { background: url(../pics/layout/hg-promo-red.png); padding: 10px 10px 10px 30px; } /* Farbwelt Service */ .bg-service { overflow: hidden; background: url(../pics/layout/hg-service10.png); padding: 0 0 10px 0; text-align: center; } .bg-service-footer { width: 960px; height: 15px; background: url(../pics/layout/hg-service10-ecken.png) no-repeat; background-position: 0 bottom; } .bg-service-header { width: 960px; height: 15px; background: url(../pics/layout/hg-service10-ecken.png) no-repeat; background-position: 0 top; margin: 20px 0 0 0; } /* Farbwelt weiß */ .bg-weiss { overflow: hidden; background-color: #fff; padding: 0 0 0 0; text-align: center; } /* Farbwelt FAQ */ .bg-faq-99 { overflow: hidden; background: url(../pics/layout/hg_99_faq_detail.png); } /* Farbwelten für die Navigation in der Seite */ .nav-inline-promo-red { background: url(../pics/layout/hg-promo-red-navi.png)} .nav-inline-promo { background: url(../pics/layout/hg-promo-navi.png)} .nav-inline-info { background: url(../pics/layout/hg-info-navi.png)} /* Farbwelten Teaser */ .kaffee-header { background: url(../pics/layout/teaserhg.png) no-repeat; } .modul-teaser .kaffee { background: url(../pics/layout/teaserhg.png) no-repeat; width: 960px; height: 325px; margin: 0 0 0 0; } /* Farbwelt Länderauswahl */ .page-country { margin: 0 auto; width: 960px; padding: 38px 0 0 0; } .bg-country { overflow: hidden; background: url(../pics/layout/produkt.hintergrund.fff.90.png); padding: 0 16px; } .bg-country .content-wrapper { border-bottom: 1px solid #D7D7D8; padding: 10px 0 5px 0; } .bg-country-footer { width: 960px; height: 15px; background: url(../pics/layout/produkt.hintergrund.fff.90.ecken.png) no-repeat; background-position: 0 bottom; position: relative; } .bg-country-header { width: 960px; height: 15px; background: url(../pics/layout/produkt.hintergrund.fff.90.ecken.png) no-repeat; background-position: 0 top; margin: 15px 0 0 0; } .bg-country .country-element { float: left; width: 230px; } .bg-country .country-element .bild { float: left; padding: 0 16px 0 0; } .bg-country .country-element .link a { color: #555555; } /*! * Font Awesome 4.6.3 by @davegandy - http://fontawesome.io - @fontawesome * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) */ /* FONT PATH * -------------------------- */ @font-face { font-family: 'FontAwesome'; src: url('webfonts/fontawesome-webfont.eot?v=4.6.3'); src: url('webfonts/fontawesome-webfont.eot?#iefix&v=4.6.3') format('embedded-opentype'), url('webfonts/fontawesome-webfont.woff2?v=4.6.3') format('woff2'), url('webfonts/fontawesome-webfont.woff?v=4.6.3') format('woff'), url('webfonts/fontawesome-webfont.ttf?v=4.6.3') format('truetype'), url('webfonts/fontawesome-webfont.svg?v=4.6.3#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; } .fa { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* makes the font 33% larger relative to the icon container */ .fa-lg { font-size: 1.33333333em; line-height: 0.75em; vertical-align: -15%; } .fa-2x { font-size: 2em; } .fa-3x { font-size: 3em; } .fa-4x { font-size: 4em; } .fa-5x { font-size: 5em; } .fa-fw { width: 1.28571429em; text-align: center; } .fa-ul { padding-left: 0; margin-left: 2.14285714em; list-style-type: none; } .fa-ul > li { position: relative; } .fa-li { position: absolute; left: -2.14285714em; width: 2.14285714em; top: 0.14285714em; text-align: center; } .fa-li.fa-lg { left: -1.85714286em; } .fa-border { padding: .2em .25em .15em; border: solid 0.08em #eeeeee; border-radius: .1em; } .fa-pull-left { float: left; } .fa-pull-right { float: right; } .fa.fa-pull-left { margin-right: .3em; } .fa.fa-pull-right { margin-left: .3em; } /* Deprecated as of 4.4.0 */ .pull-right { float: right; } .pull-left { float: left; } .fa.pull-left { margin-right: .3em; } .fa.pull-right { margin-left: .3em; } .fa-spin { -webkit-animation: fa-spin 2s infinite linear; animation: fa-spin 2s infinite linear; } .fa-pulse { -webkit-animation: fa-spin 1s infinite steps(8); animation: fa-spin 1s infinite steps(8); } @-webkit-keyframes fa-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @keyframes fa-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } .fa-rotate-90 { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .fa-rotate-180 { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)"; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .fa-rotate-270 { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)"; -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); } .fa-flip-horizontal { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)"; -webkit-transform: scale(-1, 1); -ms-transform: scale(-1, 1); transform: scale(-1, 1); } .fa-flip-vertical { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)"; -webkit-transform: scale(1, -1); -ms-transform: scale(1, -1); transform: scale(1, -1); } :root .fa-rotate-90, :root .fa-rotate-180, :root .fa-rotate-270, :root .fa-flip-horizontal, :root .fa-flip-vertical { filter: none; } .fa-stack { position: relative; display: inline-block; width: 2em; height: 2em; line-height: 2em; vertical-align: middle; } .fa-stack-1x, .fa-stack-2x { position: absolute; left: 0; width: 100%; text-align: center; } .fa-stack-1x { line-height: inherit; } .fa-stack-2x { font-size: 2em; } .fa-inverse { color: #ffffff; } /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen readers do not read off random characters that represent icons */ .fa-glass:before { content: "\f000"; } .fa-music:before { content: "\f001"; } .fa-search:before { content: "\f002"; } .fa-envelope-o:before { content: "\f003"; } .fa-heart:before { content: "\f004"; } .fa-star:before { content: "\f005"; } .fa-star-o:before { content: "\f006"; } .fa-user:before { content: "\f007"; } .fa-film:before { content: "\f008"; } .fa-th-large:before { content: "\f009"; } .fa-th:before { content: "\f00a"; } .fa-th-list:before { content: "\f00b"; } .fa-check:before { content: "\f00c"; } .fa-remove:before, .fa-close:before, .fa-times:before { content: "\f00d"; } .fa-search-plus:before { content: "\f00e"; } .fa-search-minus:before { content: "\f010"; } .fa-power-off:before { content: "\f011"; } .fa-signal:before { content: "\f012"; } .fa-gear:before, .fa-cog:before { content: "\f013"; } .fa-trash-o:before { content: "\f014"; } .fa-home:before { content: "\f015"; } .fa-file-o:before { content: "\f016"; } .fa-clock-o:before { content: "\f017"; } .fa-road:before { content: "\f018"; } .fa-download:before { content: "\f019"; } .fa-arrow-circle-o-down:before { content: "\f01a"; } .fa-arrow-circle-o-up:before { content: "\f01b"; } .fa-inbox:before { content: "\f01c"; } .fa-play-circle-o:before { content: "\f01d"; } .fa-rotate-right:before, .fa-repeat:before { content: "\f01e"; } .fa-refresh:before { content: "\f021"; } .fa-list-alt:before { content: "\f022"; } .fa-lock:before { content: "\f023"; } .fa-flag:before { content: "\f024"; } .fa-headphones:before { content: "\f025"; } .fa-volume-off:before { content: "\f026"; } .fa-volume-down:before { content: "\f027"; } .fa-volume-up:before { content: "\f028"; } .fa-qrcode:before { content: "\f029"; } .fa-barcode:before { content: "\f02a"; } .fa-tag:before { content: "\f02b"; } .fa-tags:before { content: "\f02c"; } .fa-book:before { content: "\f02d"; } .fa-bookmark:before { content: "\f02e"; } .fa-print:before { content: "\f02f"; } .fa-camera:before { content: "\f030"; } .fa-font:before { content: "\f031"; } .fa-bold:before { content: "\f032"; } .fa-italic:before { content: "\f033"; } .fa-text-height:before { content: "\f034"; } .fa-text-width:before { content: "\f035"; } .fa-align-left:before { content: "\f036"; } .fa-align-center:before { content: "\f037"; } .fa-align-right:before { content: "\f038"; } .fa-align-justify:before { content: "\f039"; } .fa-list:before { content: "\f03a"; } .fa-dedent:before, .fa-outdent:before { content: "\f03b"; } .fa-indent:before { content: "\f03c"; } .fa-video-camera:before { content: "\f03d"; } .fa-photo:before, .fa-image:before, .fa-picture-o:before { content: "\f03e"; } .fa-pencil:before { content: "\f040"; } .fa-map-marker:before { content: "\f041"; } .fa-adjust:before { content: "\f042"; } .fa-tint:before { content: "\f043"; } .fa-edit:before, .fa-pencil-square-o:before { content: "\f044"; } .fa-share-square-o:before { content: "\f045"; } .fa-check-square-o:before { content: "\f046"; } .fa-arrows:before { content: "\f047"; } .fa-step-backward:before { content: "\f048"; } .fa-fast-backward:before { content: "\f049"; } .fa-backward:before { content: "\f04a"; } .fa-play:before { content: "\f04b"; } .fa-pause:before { content: "\f04c"; } .fa-stop:before { content: "\f04d"; } .fa-forward:before { content: "\f04e"; } .fa-fast-forward:before { content: "\f050"; } .fa-step-forward:before { content: "\f051"; } .fa-eject:before { content: "\f052"; } .fa-chevron-left:before { content: "\f053"; } .fa-chevron-right:before { content: "\f054"; } .fa-plus-circle:before { content: "\f055"; } .fa-minus-circle:before { content: "\f056"; } .fa-times-circle:before { content: "\f057"; } .fa-check-circle:before { content: "\f058"; } .fa-question-circle:before { content: "\f059"; } .fa-info-circle:before { content: "\f05a"; } .fa-crosshairs:before { content: "\f05b"; } .fa-times-circle-o:before { content: "\f05c"; } .fa-check-circle-o:before { content: "\f05d"; } .fa-ban:before { content: "\f05e"; } .fa-arrow-left:before { content: "\f060"; } .fa-arrow-right:before { content: "\f061"; } .fa-arrow-up:before { content: "\f062"; } .fa-arrow-down:before { content: "\f063"; } .fa-mail-forward:before, .fa-share:before { content: "\f064"; } .fa-expand:before { content: "\f065"; } .fa-compress:before { content: "\f066"; } .fa-plus:before { content: "\f067"; } .fa-minus:before { content: "\f068"; } .fa-asterisk:before { content: "\f069"; } .fa-exclamation-circle:before { content: "\f06a"; } .fa-gift:before { content: "\f06b"; } .fa-leaf:before { content: "\f06c"; } .fa-fire:before { content: "\f06d"; } .fa-eye:before { content: "\f06e"; } .fa-eye-slash:before { content: "\f070"; } .fa-warning:before, .fa-exclamation-triangle:before { content: "\f071"; } .fa-plane:before { content: "\f072"; } .fa-calendar:before { content: "\f073"; } .fa-random:before { content: "\f074"; } .fa-comment:before { content: "\f075"; } .fa-magnet:before { content: "\f076"; } .fa-chevron-up:before { content: "\f077"; } .fa-chevron-down:before { content: "\f078"; } .fa-retweet:before { content: "\f079"; } .fa-shopping-cart:before { content: "\f07a"; } .fa-folder:before { content: "\f07b"; } .fa-folder-open:before { content: "\f07c"; } .fa-arrows-v:before { content: "\f07d"; } .fa-arrows-h:before { content: "\f07e"; } .fa-bar-chart-o:before, .fa-bar-chart:before { content: "\f080"; } .fa-twitter-square:before { content: "\f081"; } .fa-facebook-square:before { content: "\f082"; } .fa-camera-retro:before { content: "\f083"; } .fa-key:before { content: "\f084"; } .fa-gears:before, .fa-cogs:before { content: "\f085"; } .fa-comments:before { content: "\f086"; } .fa-thumbs-o-up:before { content: "\f087"; } .fa-thumbs-o-down:before { content: "\f088"; } .fa-star-half:before { content: "\f089"; } .fa-heart-o:before { content: "\f08a"; } .fa-sign-out:before { content: "\f08b"; } .fa-linkedin-square:before { content: "\f08c"; } .fa-thumb-tack:before { content: "\f08d"; } .fa-external-link:before { content: "\f08e"; } .fa-sign-in:before { content: "\f090"; } .fa-trophy:before { content: "\f091"; } .fa-github-square:before { content: "\f092"; } .fa-upload:before { content: "\f093"; } .fa-lemon-o:before { content: "\f094"; } .fa-phone:before { content: "\f095"; } .fa-square-o:before { content: "\f096"; } .fa-bookmark-o:before { content: "\f097"; } .fa-phone-square:before { content: "\f098"; } .fa-twitter:before { content: "\f099"; } .fa-facebook-f:before, .fa-facebook:before { content: "\f09a"; } .fa-github:before { content: "\f09b"; } .fa-unlock:before { content: "\f09c"; } .fa-credit-card:before { content: "\f09d"; } .fa-feed:before, .fa-rss:before { content: "\f09e"; } .fa-hdd-o:before { content: "\f0a0"; } .fa-bullhorn:before { content: "\f0a1"; } .fa-bell:before { content: "\f0f3"; } .fa-certificate:before { content: "\f0a3"; } .fa-hand-o-right:before { content: "\f0a4"; } .fa-hand-o-left:before { content: "\f0a5"; } .fa-hand-o-up:before { content: "\f0a6"; } .fa-hand-o-down:before { content: "\f0a7"; } .fa-arrow-circle-left:before { content: "\f0a8"; } .fa-arrow-circle-right:before { content: "\f0a9"; } .fa-arrow-circle-up:before { content: "\f0aa"; } .fa-arrow-circle-down:before { content: "\f0ab"; } .fa-globe:before { content: "\f0ac"; } .fa-wrench:before { content: "\f0ad"; } .fa-tasks:before { content: "\f0ae"; } .fa-filter:before { content: "\f0b0"; } .fa-briefcase:before { content: "\f0b1"; } .fa-arrows-alt:before { content: "\f0b2"; } .fa-group:before, .fa-users:before { content: "\f0c0"; } .fa-chain:before, .fa-link:before { content: "\f0c1"; } .fa-cloud:before { content: "\f0c2"; } .fa-flask:before { content: "\f0c3"; } .fa-cut:before, .fa-scissors:before { content: "\f0c4"; } .fa-copy:before, .fa-files-o:before { content: "\f0c5"; } .fa-paperclip:before { content: "\f0c6"; } .fa-save:before, .fa-floppy-o:before { content: "\f0c7"; } .fa-square:before { content: "\f0c8"; } .fa-navicon:before, .fa-reorder:before, .fa-bars:before { content: "\f0c9"; } .fa-list-ul:before { content: "\f0ca"; } .fa-list-ol:before { content: "\f0cb"; } .fa-strikethrough:before { content: "\f0cc"; } .fa-underline:before { content: "\f0cd"; } .fa-table:before { content: "\f0ce"; } .fa-magic:before { content: "\f0d0"; } .fa-truck:before { content: "\f0d1"; } .fa-pinterest:before { content: "\f0d2"; } .fa-pinterest-square:before { content: "\f0d3"; } .fa-google-plus-square:before { content: "\f0d4"; } .fa-google-plus:before { content: "\f0d5"; } .fa-money:before { content: "\f0d6"; } .fa-caret-down:before { content: "\f0d7"; } .fa-caret-up:before { content: "\f0d8"; } .fa-caret-left:before { content: "\f0d9"; } .fa-caret-right:before { content: "\f0da"; } .fa-columns:before { content: "\f0db"; } .fa-unsorted:before, .fa-sort:before { content: "\f0dc"; } .fa-sort-down:before, .fa-sort-desc:before { content: "\f0dd"; } .fa-sort-up:before, .fa-sort-asc:before { content: "\f0de"; } .fa-envelope:before { content: "\f0e0"; } .fa-linkedin:before { content: "\f0e1"; } .fa-rotate-left:before, .fa-undo:before { content: "\f0e2"; } .fa-legal:before, .fa-gavel:before { content: "\f0e3"; } .fa-dashboard:before, .fa-tachometer:before { content: "\f0e4"; } .fa-comment-o:before { content: "\f0e5"; } .fa-comments-o:before { content: "\f0e6"; } .fa-flash:before, .fa-bolt:before { content: "\f0e7"; } .fa-sitemap:before { content: "\f0e8"; } .fa-umbrella:before { content: "\f0e9"; } .fa-paste:before, .fa-clipboard:before { content: "\f0ea"; } .fa-lightbulb-o:before { content: "\f0eb"; } .fa-exchange:before { content: "\f0ec"; } .fa-cloud-download:before { content: "\f0ed"; } .fa-cloud-upload:before { content: "\f0ee"; } .fa-user-md:before { content: "\f0f0"; } .fa-stethoscope:before { content: "\f0f1"; } .fa-suitcase:before { content: "\f0f2"; } .fa-bell-o:before { content: "\f0a2"; } .fa-coffee:before { content: "\f0f4"; } .fa-cutlery:before { content: "\f0f5"; } .fa-file-text-o:before { content: "\f0f6"; } .fa-building-o:before { content: "\f0f7"; } .fa-hospital-o:before { content: "\f0f8"; } .fa-ambulance:before { content: "\f0f9"; } .fa-medkit:before { content: "\f0fa"; } .fa-fighter-jet:before { content: "\f0fb"; } .fa-beer:before { content: "\f0fc"; } .fa-h-square:before { content: "\f0fd"; } .fa-plus-square:before { content: "\f0fe"; } .fa-angle-double-left:before { content: "\f100"; } .fa-angle-double-right:before { content: "\f101"; } .fa-angle-double-up:before { content: "\f102"; } .fa-angle-double-down:before { content: "\f103"; } .fa-angle-left:before { content: "\f104"; } .fa-angle-right:before { content: "\f105"; } .fa-angle-up:before { content: "\f106"; } .fa-angle-down:before { content: "\f107"; } .fa-desktop:before { content: "\f108"; } .fa-laptop:before { content: "\f109"; } .fa-tablet:before { content: "\f10a"; } .fa-mobile-phone:before, .fa-mobile:before { content: "\f10b"; } .fa-circle-o:before { content: "\f10c"; } .fa-quote-left:before { content: "\f10d"; } .fa-quote-right:before { content: "\f10e"; } .fa-spinner:before { content: "\f110"; } .fa-circle:before { content: "\f111"; } .fa-mail-reply:before, .fa-reply:before { content: "\f112"; } .fa-github-alt:before { content: "\f113"; } .fa-folder-o:before { content: "\f114"; } .fa-folder-open-o:before { content: "\f115"; } .fa-smile-o:before { content: "\f118"; } .fa-frown-o:before { content: "\f119"; } .fa-meh-o:before { content: "\f11a"; } .fa-gamepad:before { content: "\f11b"; } .fa-keyboard-o:before { content: "\f11c"; } .fa-flag-o:before { content: "\f11d"; } .fa-flag-checkered:before { content: "\f11e"; } .fa-terminal:before { content: "\f120"; } .fa-code:before { content: "\f121"; } .fa-mail-reply-all:before, .fa-reply-all:before { content: "\f122"; } .fa-star-half-empty:before, .fa-star-half-full:before, .fa-star-half-o:before { content: "\f123"; } .fa-location-arrow:before { content: "\f124"; } .fa-crop:before { content: "\f125"; } .fa-code-fork:before { content: "\f126"; } .fa-unlink:before, .fa-chain-broken:before { content: "\f127"; } .fa-question:before { content: "\f128"; } .fa-info:before { content: "\f129"; } .fa-exclamation:before { content: "\f12a"; } .fa-superscript:before { content: "\f12b"; } .fa-subscript:before { content: "\f12c"; } .fa-eraser:before { content: "\f12d"; } .fa-puzzle-piece:before { content: "\f12e"; } .fa-microphone:before { content: "\f130"; } .fa-microphone-slash:before { content: "\f131"; } .fa-shield:before { content: "\f132"; } .fa-calendar-o:before { content: "\f133"; } .fa-fire-extinguisher:before { content: "\f134"; } .fa-rocket:before { content: "\f135"; } .fa-maxcdn:before { content: "\f136"; } .fa-chevron-circle-left:before { content: "\f137"; } .fa-chevron-circle-right:before { content: "\f138"; } .fa-chevron-circle-up:before { content: "\f139"; } .fa-chevron-circle-down:before { content: "\f13a"; } .fa-html5:before { content: "\f13b"; } .fa-css3:before { content: "\f13c"; } .fa-anchor:before { content: "\f13d"; } .fa-unlock-alt:before { content: "\f13e"; } .fa-bullseye:before { content: "\f140"; } .fa-ellipsis-h:before { content: "\f141"; } .fa-ellipsis-v:before { content: "\f142"; } .fa-rss-square:before { content: "\f143"; } .fa-play-circle:before { content: "\f144"; } .fa-ticket:before { content: "\f145"; } .fa-minus-square:before { content: "\f146"; } .fa-minus-square-o:before { content: "\f147"; } .fa-level-up:before { content: "\f148"; } .fa-level-down:before { content: "\f149"; } .fa-check-square:before { content: "\f14a"; } .fa-pencil-square:before { content: "\f14b"; } .fa-external-link-square:before { content: "\f14c"; } .fa-share-square:before { content: "\f14d"; } .fa-compass:before { content: "\f14e"; } .fa-toggle-down:before, .fa-caret-square-o-down:before { content: "\f150"; } .fa-toggle-up:before, .fa-caret-square-o-up:before { content: "\f151"; } .fa-toggle-right:before, .fa-caret-square-o-right:before { content: "\f152"; } .fa-euro:before, .fa-eur:before { content: "\f153"; } .fa-gbp:before { content: "\f154"; } .fa-dollar:before, .fa-usd:before { content: "\f155"; } .fa-rupee:before, .fa-inr:before { content: "\f156"; } .fa-cny:before, .fa-rmb:before, .fa-yen:before, .fa-jpy:before { content: "\f157"; } .fa-ruble:before, .fa-rouble:before, .fa-rub:before { content: "\f158"; } .fa-won:before, .fa-krw:before { content: "\f159"; } .fa-bitcoin:before, .fa-btc:before { content: "\f15a"; } .fa-file:before { content: "\f15b"; } .fa-file-text:before { content: "\f15c"; } .fa-sort-alpha-asc:before { content: "\f15d"; } .fa-sort-alpha-desc:before { content: "\f15e"; } .fa-sort-amount-asc:before { content: "\f160"; } .fa-sort-amount-desc:before { content: "\f161"; } .fa-sort-numeric-asc:before { content: "\f162"; } .fa-sort-numeric-desc:before { content: "\f163"; } .fa-thumbs-up:before { content: "\f164"; } .fa-thumbs-down:before { content: "\f165"; } .fa-youtube-square:before { content: "\f166"; } .fa-youtube:before { content: "\f167"; } .fa-xing:before { content: "\f168"; } .fa-xing-square:before { content: "\f169"; } .fa-youtube-play:before { content: "\f16a"; } .fa-dropbox:before { content: "\f16b"; } .fa-stack-overflow:before { content: "\f16c"; } .fa-instagram:before { content: "\f16d"; } .fa-flickr:before { content: "\f16e"; } .fa-adn:before { content: "\f170"; } .fa-bitbucket:before { content: "\f171"; } .fa-bitbucket-square:before { content: "\f172"; } .fa-tumblr:before { content: "\f173"; } .fa-tumblr-square:before { content: "\f174"; } .fa-long-arrow-down:before { content: "\f175"; } .fa-long-arrow-up:before { content: "\f176"; } .fa-long-arrow-left:before { content: "\f177"; } .fa-long-arrow-right:before { content: "\f178"; } .fa-apple:before { content: "\f179"; } .fa-windows:before { content: "\f17a"; } .fa-android:before { content: "\f17b"; } .fa-linux:before { content: "\f17c"; } .fa-dribbble:before { content: "\f17d"; } .fa-skype:before { content: "\f17e"; } .fa-foursquare:before { content: "\f180"; } .fa-trello:before { content: "\f181"; } .fa-female:before { content: "\f182"; } .fa-male:before { content: "\f183"; } .fa-gittip:before, .fa-gratipay:before { content: "\f184"; } .fa-sun-o:before { content: "\f185"; } .fa-moon-o:before { content: "\f186"; } .fa-archive:before { content: "\f187"; } .fa-bug:before { content: "\f188"; } .fa-vk:before { content: "\f189"; } .fa-weibo:before { content: "\f18a"; } .fa-renren:before { content: "\f18b"; } .fa-pagelines:before { content: "\f18c"; } .fa-stack-exchange:before { content: "\f18d"; } .fa-arrow-circle-o-right:before { content: "\f18e"; } .fa-arrow-circle-o-left:before { content: "\f190"; } .fa-toggle-left:before, .fa-caret-square-o-left:before { content: "\f191"; } .fa-dot-circle-o:before { content: "\f192"; } .fa-wheelchair:before { content: "\f193"; } .fa-vimeo-square:before { content: "\f194"; } .fa-turkish-lira:before, .fa-try:before { content: "\f195"; } .fa-plus-square-o:before { content: "\f196"; } .fa-space-shuttle:before { content: "\f197"; } .fa-slack:before { content: "\f198"; } .fa-envelope-square:before { content: "\f199"; } .fa-wordpress:before { content: "\f19a"; } .fa-openid:before { content: "\f19b"; } .fa-institution:before, .fa-bank:before, .fa-university:before { content: "\f19c"; } .fa-mortar-board:before, .fa-graduation-cap:before { content: "\f19d"; } .fa-yahoo:before { content: "\f19e"; } .fa-google:before { content: "\f1a0"; } .fa-reddit:before { content: "\f1a1"; } .fa-reddit-square:before { content: "\f1a2"; } .fa-stumbleupon-circle:before { content: "\f1a3"; } .fa-stumbleupon:before { content: "\f1a4"; } .fa-delicious:before { content: "\f1a5"; } .fa-digg:before { content: "\f1a6"; } .fa-pied-piper-pp:before { content: "\f1a7"; } .fa-pied-piper-alt:before { content: "\f1a8"; } .fa-drupal:before { content: "\f1a9"; } .fa-joomla:before { content: "\f1aa"; } .fa-language:before { content: "\f1ab"; } .fa-fax:before { content: "\f1ac"; } .fa-building:before { content: "\f1ad"; } .fa-child:before { content: "\f1ae"; } .fa-paw:before { content: "\f1b0"; } .fa-spoon:before { content: "\f1b1"; } .fa-cube:before { content: "\f1b2"; } .fa-cubes:before { content: "\f1b3"; } .fa-behance:before { content: "\f1b4"; } .fa-behance-square:before { content: "\f1b5"; } .fa-steam:before { content: "\f1b6"; } .fa-steam-square:before { content: "\f1b7"; } .fa-recycle:before { content: "\f1b8"; } .fa-automobile:before, .fa-car:before { content: "\f1b9"; } .fa-cab:before, .fa-taxi:before { content: "\f1ba"; } .fa-tree:before { content: "\f1bb"; } .fa-spotify:before { content: "\f1bc"; } .fa-deviantart:before { content: "\f1bd"; } .fa-soundcloud:before { content: "\f1be"; } .fa-database:before { content: "\f1c0"; } .fa-file-pdf-o:before { content: "\f1c1"; } .fa-file-word-o:before { content: "\f1c2"; } .fa-file-excel-o:before { content: "\f1c3"; } .fa-file-powerpoint-o:before { content: "\f1c4"; } .fa-file-photo-o:before, .fa-file-picture-o:before, .fa-file-image-o:before { content: "\f1c5"; } .fa-file-zip-o:before, .fa-file-archive-o:before { content: "\f1c6"; } .fa-file-sound-o:before, .fa-file-audio-o:before { content: "\f1c7"; } .fa-file-movie-o:before, .fa-file-video-o:before { content: "\f1c8"; } .fa-file-code-o:before { content: "\f1c9"; } .fa-vine:before { content: "\f1ca"; } .fa-codepen:before { content: "\f1cb"; } .fa-jsfiddle:before { content: "\f1cc"; } .fa-life-bouy:before, .fa-life-buoy:before, .fa-life-saver:before, .fa-support:before, .fa-life-ring:before { content: "\f1cd"; } .fa-circle-o-notch:before { content: "\f1ce"; } .fa-ra:before, .fa-resistance:before, .fa-rebel:before { content: "\f1d0"; } .fa-ge:before, .fa-empire:before { content: "\f1d1"; } .fa-git-square:before { content: "\f1d2"; } .fa-git:before { content: "\f1d3"; } .fa-y-combinator-square:before, .fa-yc-square:before, .fa-hacker-news:before { content: "\f1d4"; } .fa-tencent-weibo:before { content: "\f1d5"; } .fa-qq:before { content: "\f1d6"; } .fa-wechat:before, .fa-weixin:before { content: "\f1d7"; } .fa-send:before, .fa-paper-plane:before { content: "\f1d8"; } .fa-send-o:before, .fa-paper-plane-o:before { content: "\f1d9"; } .fa-history:before { content: "\f1da"; } .fa-circle-thin:before { content: "\f1db"; } .fa-header:before { content: "\f1dc"; } .fa-paragraph:before { content: "\f1dd"; } .fa-sliders:before { content: "\f1de"; } .fa-share-alt:before { content: "\f1e0"; } .fa-share-alt-square:before { content: "\f1e1"; } .fa-bomb:before { content: "\f1e2"; } .fa-soccer-ball-o:before, .fa-futbol-o:before { content: "\f1e3"; } .fa-tty:before { content: "\f1e4"; } .fa-binoculars:before { content: "\f1e5"; } .fa-plug:before { content: "\f1e6"; } .fa-slideshare:before { content: "\f1e7"; } .fa-twitch:before { content: "\f1e8"; } .fa-yelp:before { content: "\f1e9"; } .fa-newspaper-o:before { content: "\f1ea"; } .fa-wifi:before { content: "\f1eb"; } .fa-calculator:before { content: "\f1ec"; } .fa-paypal:before { content: "\f1ed"; } .fa-google-wallet:before { content: "\f1ee"; } .fa-cc-visa:before { content: "\f1f0"; } .fa-cc-mastercard:before { content: "\f1f1"; } .fa-cc-discover:before { content: "\f1f2"; } .fa-cc-amex:before { content: "\f1f3"; } .fa-cc-paypal:before { content: "\f1f4"; } .fa-cc-stripe:before { content: "\f1f5"; } .fa-bell-slash:before { content: "\f1f6"; } .fa-bell-slash-o:before { content: "\f1f7"; } .fa-trash:before { content: "\f1f8"; } .fa-copyright:before { content: "\f1f9"; } .fa-at:before { content: "\f1fa"; } .fa-eyedropper:before { content: "\f1fb"; } .fa-paint-brush:before { content: "\f1fc"; } .fa-birthday-cake:before { content: "\f1fd"; } .fa-area-chart:before { content: "\f1fe"; } .fa-pie-chart:before { content: "\f200"; } .fa-line-chart:before { content: "\f201"; } .fa-lastfm:before { content: "\f202"; } .fa-lastfm-square:before { content: "\f203"; } .fa-toggle-off:before { content: "\f204"; } .fa-toggle-on:before { content: "\f205"; } .fa-bicycle:before { content: "\f206"; } .fa-bus:before { content: "\f207"; } .fa-ioxhost:before { content: "\f208"; } .fa-angellist:before { content: "\f209"; } .fa-cc:before { content: "\f20a"; } .fa-shekel:before, .fa-sheqel:before, .fa-ils:before { content: "\f20b"; } .fa-meanpath:before { content: "\f20c"; } .fa-buysellads:before { content: "\f20d"; } .fa-connectdevelop:before { content: "\f20e"; } .fa-dashcube:before { content: "\f210"; } .fa-forumbee:before { content: "\f211"; } .fa-leanpub:before { content: "\f212"; } .fa-sellsy:before { content: "\f213"; } .fa-shirtsinbulk:before { content: "\f214"; } .fa-simplybuilt:before { content: "\f215"; } .fa-skyatlas:before { content: "\f216"; } .fa-cart-plus:before { content: "\f217"; } .fa-cart-arrow-down:before { content: "\f218"; } .fa-diamond:before { content: "\f219"; } .fa-ship:before { content: "\f21a"; } .fa-user-secret:before { content: "\f21b"; } .fa-motorcycle:before { content: "\f21c"; } .fa-street-view:before { content: "\f21d"; } .fa-heartbeat:before { content: "\f21e"; } .fa-venus:before { content: "\f221"; } .fa-mars:before { content: "\f222"; } .fa-mercury:before { content: "\f223"; } .fa-intersex:before, .fa-transgender:before { content: "\f224"; } .fa-transgender-alt:before { content: "\f225"; } .fa-venus-double:before { content: "\f226"; } .fa-mars-double:before { content: "\f227"; } .fa-venus-mars:before { content: "\f228"; } .fa-mars-stroke:before { content: "\f229"; } .fa-mars-stroke-v:before { content: "\f22a"; } .fa-mars-stroke-h:before { content: "\f22b"; } .fa-neuter:before { content: "\f22c"; } .fa-genderless:before { content: "\f22d"; } .fa-facebook-official:before { content: "\f230"; } .fa-pinterest-p:before { content: "\f231"; } .fa-whatsapp:before { content: "\f232"; } .fa-server:before { content: "\f233"; } .fa-user-plus:before { content: "\f234"; } .fa-user-times:before { content: "\f235"; } .fa-hotel:before, .fa-bed:before { content: "\f236"; } .fa-viacoin:before { content: "\f237"; } .fa-train:before { content: "\f238"; } .fa-subway:before { content: "\f239"; } .fa-medium:before { content: "\f23a"; } .fa-yc:before, .fa-y-combinator:before { content: "\f23b"; } .fa-optin-monster:before { content: "\f23c"; } .fa-opencart:before { content: "\f23d"; } .fa-expeditedssl:before { content: "\f23e"; } .fa-battery-4:before, .fa-battery-full:before { content: "\f240"; } .fa-battery-3:before, .fa-battery-three-quarters:before { content: "\f241"; } .fa-battery-2:before, .fa-battery-half:before { content: "\f242"; } .fa-battery-1:before, .fa-battery-quarter:before { content: "\f243"; } .fa-battery-0:before, .fa-battery-empty:before { content: "\f244"; } .fa-mouse-pointer:before { content: "\f245"; } .fa-i-cursor:before { content: "\f246"; } .fa-object-group:before { content: "\f247"; } .fa-object-ungroup:before { content: "\f248"; } .fa-sticky-note:before { content: "\f249"; } .fa-sticky-note-o:before { content: "\f24a"; } .fa-cc-jcb:before { content: "\f24b"; } .fa-cc-diners-club:before { content: "\f24c"; } .fa-clone:before { content: "\f24d"; } .fa-balance-scale:before { content: "\f24e"; } .fa-hourglass-o:before { content: "\f250"; } .fa-hourglass-1:before, .fa-hourglass-start:before { content: "\f251"; } .fa-hourglass-2:before, .fa-hourglass-half:before { content: "\f252"; } .fa-hourglass-3:before, .fa-hourglass-end:before { content: "\f253"; } .fa-hourglass:before { content: "\f254"; } .fa-hand-grab-o:before, .fa-hand-rock-o:before { content: "\f255"; } .fa-hand-stop-o:before, .fa-hand-paper-o:before { content: "\f256"; } .fa-hand-scissors-o:before { content: "\f257"; } .fa-hand-lizard-o:before { content: "\f258"; } .fa-hand-spock-o:before { content: "\f259"; } .fa-hand-pointer-o:before { content: "\f25a"; } .fa-hand-peace-o:before { content: "\f25b"; } .fa-trademark:before { content: "\f25c"; } .fa-registered:before { content: "\f25d"; } .fa-creative-commons:before { content: "\f25e"; } .fa-gg:before { content: "\f260"; } .fa-gg-circle:before { content: "\f261"; } .fa-tripadvisor:before { content: "\f262"; } .fa-odnoklassniki:before { content: "\f263"; } .fa-odnoklassniki-square:before { content: "\f264"; } .fa-get-pocket:before { content: "\f265"; } .fa-wikipedia-w:before { content: "\f266"; } .fa-safari:before { content: "\f267"; } .fa-chrome:before { content: "\f268"; } .fa-firefox:before { content: "\f269"; } .fa-opera:before { content: "\f26a"; } .fa-internet-explorer:before { content: "\f26b"; } .fa-tv:before, .fa-television:before { content: "\f26c"; } .fa-contao:before { content: "\f26d"; } .fa-500px:before { content: "\f26e"; } .fa-amazon:before { content: "\f270"; } .fa-calendar-plus-o:before { content: "\f271"; } .fa-calendar-minus-o:before { content: "\f272"; } .fa-calendar-times-o:before { content: "\f273"; } .fa-calendar-check-o:before { content: "\f274"; } .fa-industry:before { content: "\f275"; } .fa-map-pin:before { content: "\f276"; } .fa-map-signs:before { content: "\f277"; } .fa-map-o:before { content: "\f278"; } .fa-map:before { content: "\f279"; } .fa-commenting:before { content: "\f27a"; } .fa-commenting-o:before { content: "\f27b"; } .fa-houzz:before { content: "\f27c"; } .fa-vimeo:before { content: "\f27d"; } .fa-black-tie:before { content: "\f27e"; } .fa-fonticons:before { content: "\f280"; } .fa-reddit-alien:before { content: "\f281"; } .fa-edge:before { content: "\f282"; } .fa-credit-card-alt:before { content: "\f283"; } .fa-codiepie:before { content: "\f284"; } .fa-modx:before { content: "\f285"; } .fa-fort-awesome:before { content: "\f286"; } .fa-usb:before { content: "\f287"; } .fa-product-hunt:before { content: "\f288"; } .fa-mixcloud:before { content: "\f289"; } .fa-scribd:before { content: "\f28a"; } .fa-pause-circle:before { content: "\f28b"; } .fa-pause-circle-o:before { content: "\f28c"; } .fa-stop-circle:before { content: "\f28d"; } .fa-stop-circle-o:before { content: "\f28e"; } .fa-shopping-bag:before { content: "\f290"; } .fa-shopping-basket:before { content: "\f291"; } .fa-hashtag:before { content: "\f292"; } .fa-bluetooth:before { content: "\f293"; } .fa-bluetooth-b:before { content: "\f294"; } .fa-percent:before { content: "\f295"; } .fa-gitlab:before { content: "\f296"; } .fa-wpbeginner:before { content: "\f297"; } .fa-wpforms:before { content: "\f298"; } .fa-envira:before { content: "\f299"; } .fa-universal-access:before { content: "\f29a"; } .fa-wheelchair-alt:before { content: "\f29b"; } .fa-question-circle-o:before { content: "\f29c"; } .fa-blind:before { content: "\f29d"; } .fa-audio-description:before { content: "\f29e"; } .fa-volume-control-phone:before { content: "\f2a0"; } .fa-braille:before { content: "\f2a1"; } .fa-assistive-listening-systems:before { content: "\f2a2"; } .fa-asl-interpreting:before, .fa-american-sign-language-interpreting:before { content: "\f2a3"; } .fa-deafness:before, .fa-hard-of-hearing:before, .fa-deaf:before { content: "\f2a4"; } .fa-glide:before { content: "\f2a5"; } .fa-glide-g:before { content: "\f2a6"; } .fa-signing:before, .fa-sign-language:before { content: "\f2a7"; } .fa-low-vision:before { content: "\f2a8"; } .fa-viadeo:before { content: "\f2a9"; } .fa-viadeo-square:before { content: "\f2aa"; } .fa-snapchat:before { content: "\f2ab"; } .fa-snapchat-ghost:before { content: "\f2ac"; } .fa-snapchat-square:before { content: "\f2ad"; } .fa-pied-piper:before { content: "\f2ae"; } .fa-first-order:before { content: "\f2b0"; } .fa-yoast:before { content: "\f2b1"; } .fa-themeisle:before { content: "\f2b2"; } .fa-google-plus-circle:before, .fa-google-plus-official:before { content: "\f2b3"; } .fa-fa:before, .fa-font-awesome:before { content: "\f2b4"; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } .sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Home Slider */ .home { margin-top: 0; background: transparent } .home .header { position: relative; z-index: 5 } .home .footer { position: relative; z-index: 5 } .home .page { position: fixed; top: 0; left: 0; overflow: hidden; width: 100%; height: 100% } .page-slider { } .slider-page { float: left; position: relative; overflow: hidden; } .page-slider .coffeesmile { position: absolute; z-index: 1; width: 1515px; height: 313px; left: 0; bottom: 40px } .page-slider .slider-page .background { position: absolute; z-index: 0; left: 50%; top: 50% } .page-slider .slider-page .focus-element { position: absolute; z-index: 2 } .page-slider .slider-page .focus-element .bild { position: absolute } .page-slider .slider-page .focus-element .titel { position: absolute } .page-slider .slider-page .focus-element .verweis { position: absolute; width: 250px } .page-slider .slider-page .focus-element-1 { position: absolute; z-index: 3; left: 0; bottom: 0 } .page-slider .slider-page .focus-element-standard { position: absolute; } .page-slider .slider-page .focus-element .ueberschrift { position: absolute } .page-slider .slider-page .focus-element .untertitel { position: absolute } .page-slider .slider-page .focus-element .ueberschrift h1, .page-slider .slider-page .focus-element .ueberschrift h2, .page-slider .slider-page .focus-element .untertitel h2 { white-space: nowrap } .page-slider .slider-page .focus-element .ueberschrift .titel-dunkel, .page-slider .slider-page .focus-element .ueberschrift .titel-dunkel sup, .page-slider .slider-page .focus-element .untertitel .titel-dunkel, .page-slider .slider-page .focus-element .untertitel .titel-dunkel sup { color: #313131; } .page-slider .slider-page .focus-element .ueberschrift .titel-dunkel a, .page-slider .slider-page .focus-element .untertitel .titel-dunkel a { color: #313131; } .page-slider .slider-page .focus-element .ueberschrift .titel-hell, .page-slider .slider-page .focus-element .ueberschrift .titel-hell sup, .page-slider .slider-page .focus-element .untertitel .titel-hell, .page-slider .slider-page .focus-element .untertitel .titel-hell sup { color: #ffffff; } .page-slider .slider-page .focus-element .ueberschrift .titel-hell a, .page-slider .slider-page .focus-element .untertitel .titel-hell a { color: #ffffff; } .page-slider .slider-page .focus-element .ueberschrift h2.ueberschrift { font-size: 32px; font-family: "Century Gothic W01", sans-serif; margin: 20px 0 0 0; padding: 0 } .page-slider a.page-back:link, .page-slider a.page-back:visited { width: 121px; height: 56px; position: absolute; left: 10px; top: 110px; z-index: 10; display: block; overflow: hidden } .page-slider a.page-back:hover { } .page-slider a.page-back:active { } .page-slider a.page-next:link, .page-slider a.page-next:visited { width: 121px; height: 56px; position: absolute; right: 10px; top: 110px; z-index: 10; display: block; overflow: hidden } .page-slider a.page-next:hover { } .page-slider a.page-next:active { } .page-slider .page-next .arrow { cursor: pointer; position: absolute; width: 24px; height: 56px; top: 0; right: 0; z-index: 20; background: url(../pics/layout/home.slider.button.right.png) no-repeat 0 0 } .page-slider .page-next-hover .arrow { background-position: right -56px } .page-slider .page-back .arrow { cursor: pointer; position: absolute; width: 24px; height: 56px; top: 0; left: 0; z-index: 20; background: url(../pics/layout/home.slider.button.left.png) no-repeat 0 0 } .page-slider .page-back-hover .arrow { background-position: 0 -56px } .page-slider .page-back .preview { position: absolute; width: 0; height: 56px; top: 0; left: 24px } .page-slider .page-next .preview { position: absolute; width: 0; height: 56px; top: 0; right: 24px } .slider-slide-left { width: 24px; height: 56px; background: url(../pics/layout/home.slider.button.left.png) top left no-repeat; z-index:999; position: absolute; left: 10px; top: 50%; cursor: pointer; } .slider-slide-left-hover { background-position: bottom; } .slider-slide-right { width: 24px; height: 56px; background: url(../pics/layout/home.slider.button.right.png) top right no-repeat; z-index:999; position: absolute; right: 10px; top: 50%; cursor: pointer; } .slider-slide-right-hover { background-position: bottom; } #slide-left-morph { height: 56px; margin-left:24px; overflow: hidden; } #slide-right-morph { position: relative; width: 0; height: 56px; right: 0; overflow: hidden; } .slider-slide-left .preview { height: 56px; } .slider-slide-right .preview { height: 56px; } /* Home POI */ .home-poi a { display: block; width: 431px; height: 126px; text-indent: -9999px } .home-poi .link-kaffeeguertel a { background: url(../pics/layout/poi.homelinks.sprite.png) no-repeat 0 0 } .home-poi .link-kaffeeguertel a:hover { background-position: -431px 0 } .home-poi .link-zeitreise a { background: url(../pics/layout/poi.homelinks.sprite.png) no-repeat 0 -126px } .home-poi .link-zeitreise a:hover { background-position: -431px -126px } .home-poi .link-kaffeevielfalt a { background: url(../pics/layout/poi.homelinks.sprite.png) no-repeat 0 -252px } .home-poi .link-kaffeevielfalt a:hover { background-position: -431px -252px } .home-poi .link-kaffeewissen a { background: url(../pics/layout/poi.homelinks.sprite.png) no-repeat 0 -378px } .home-poi .link-kaffeewissen a:hover { background-position: -431px -378px } .home-poi .link-filtertueten a { background: url(../pics/layout/poi.homelinks.sprite.png) no-repeat 0 -504px } .home-poi .link-filtertueten a:hover { background-position: -431px -504px } .home-poi .link-vollautomaten a { background: url(../pics/layout/poi.homelinks.sprite.png) no-repeat 0 -630px } .home-poi .link-vollautomaten a:hover { background-position: -431px -630px } .home-poi .link-kaffeebar a { background: url(../pics/layout/poi.homelinks.sprite.png) no-repeat 0 -756px } .home-poi .link-kaffeebar a:hover { background-position: -431px -756px } .home-poi .link-aktuell a { background: url(../pics/layout/poi.homelinks.sprite.png) no-repeat 0 -882px } .home-poi .link-aktuell a:hover { background-position: -431px -882px } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Kaffee erleben - Verteilerseite */ .coffeebar .background { position: absolute; z-index: 0; left: 50%; top: 50% } .coffeebar .preload img { display: none; } .coffeebar a.teaser_leidenschaft { width: 231px; height: 70px; background: url(../pics/kaffeebar/teaser_leidenschaft.png); display: block; } .coffeebar a.teaser_leidenschaft:hover { background: url(../pics/kaffeebar/teaser_leidenschaft_hover.png); } .coffeebar a.teaser_bohne { width: 231px; height: 70px; background: url(../pics/kaffeebar/teaser_bohne.png); display: block; } .coffeebar a.teaser_bohne:hover { background: url(../pics/kaffeebar/teaser_bohne_hover.png); } .coffeebar #container_tafel { background: url(../pics/kaffeebar/tafel.png); } .coffeebar .headline { margin: 8px 0 0 15px } .coffeebar .coffeesmile { bottom: 40px; left: 0; position: absolute; z-index: 1; } /* Kaffee erleben - Tafelslider */ .coffeebar-page-slider .liste { display: block; width: 465px; height: 205px; overflow: hidden; } .coffeebar-page-slider .slider-page .background { position: absolute; top: 20px; left: 20px; } .coffeebar-page-slider .slider-page .titel { float: right; width: 280px; padding-top: 20px; } .coffeebar-page-slider .slider-page .titel h1 { font-size: 16px; } .coffeebar-page-slider .slider-page .text { float: right; width: 180px; padding: 20px 40px 0 0; } .coffeebar-page-slider a.page-back .preview { display: none;} .coffeebar-page-slider a.page-next .preview { display: none;} .coffeebar-page-slider a.page-back:link { position: absolute; top: 133px; left: 10px; width: 11px; height: 21px; z-index: 10; display: block; overflow: hidden; background: url(../pics/layout/verteiler.pfeil.links.png) no-repeat 0 0 } .coffeebar-page-slider a.page-back:visited { } .coffeebar-page-slider a.page-back:hover { background-position: 0 -21px } .coffeebar-page-slider a.page-back:active { } .coffeebar-page-slider a.page-next:link { position: absolute; top: 133px; right: 10px; width: 11px; height: 21px; z-index: 10; display: block; overflow: hidden; background: url(../pics/layout/verteiler.pfeil.rechts.png) no-repeat 0 0 } .coffeebar-page-slider a.page-next:visited { } .coffeebar-page-slider a.page-next:hover { background-position: right -21px } .coffeebar-page-slider a.page-next:active { } .coffeebar-page-slider .paging { bottom: 8px; height: 20px; overflow: hidden; position: absolute; } .coffeebar-page-slider .paging .punkt { float: left; background: url(../pics/layout/verteiler.paging.png) no-repeat scroll -20px -17px transparent; height: 18px; width: 18px; } .coffeebar-page-slider .paging .punkt-aktiv { background: url(../pics/layout/verteiler.paging.png) no-repeat scroll -20px 0 transparent; height: 18px; width: 18px; } /* Kaffee erleben - Tafelinhalt */ .absatz-coffee-board-bild { margin: 10px 30px 0 30px; } .absatz-coffee-board-bild .coffee-links { float: left; width: 200px; } .absatz-coffee-board-bild .coffee-rechts { float: right; width: 190px; } .absatz-coffee-board-bild .coffee-board-bild { float: left } .absatz-coffee-board-bild .coffee-board-titel { float: left } .absatz-coffee-board-bild .coffee-board-text { display: block; float: left } .absatz-coffee-board-bild .coffee-board-link { float: left; padding-top: 20px;} .absatz-coffee-board-text { margin: 10px 40px 0 40px; } .absatz-coffee-board-text .coffee-board-link { float: right; padding-top: 10px; } .absatz-coffee-board-video { margin: 20px 20px 0 30px; } .absatz-coffee-board-video .coffee-links { float: left; width: 235px; } .absatz-coffee-board-video .coffee-rechts { float: right; width: 165px; } .absatz-coffee-board-video .coffee-board-bild { float: left } .absatz-coffee-board-video .coffee-board-titel { float: left } .absatz-coffee-board-video .coffee-board-text { display: block; float: left } .absatz-coffee-board-video .coffee-board-link { float: left; padding-top: 78px;} .coffee-board-titel h2 { font-family: "Lucida Sans W01 Bold", sans-serif; font-size: 13px; padding-top: 10px; } /* IFrame Gewinnspiel */ .coffeebar-iframe { width: 960px; height: 903px; padding-bottom: 30px } /* Facebook Stream Expander */ .facebook-stream-expander .tab { float: left; padding-top: 130px; cursor: pointer; } .facebook-stream-expander .stream { float: left; height: 590px; background-color: #ffffff; } .facebook-stream-expander .stream-hidden { display: none; } .facebook-stream-expander iframe { z-index: 51 } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Kampagnenseite - Layout */ body.campaign { margin-top: 47px; } .campaign h1, .campaign h2 { color: #323232; margin: 0 0 0 13px; } .campaign .titel { margin: 0; padding: 38px 0 9px 0; } .campaign .dialog { overflow: hidden; } .viewport { position: relative; } .campaign-element { position: absolute; background-repeat: no-repeat; } .coffeesmile-front { position: absolute; left: 0; bottom: 60px; } /* Kampagnenseite - Inhalte */ .campaign-element a.button-29 { position: absolute; z-index: 50; } .campaign-element .bereich { float: left; } .campaign-element .bereich span { color: #323232; } .campaign-element .bereich img.modal { cursor: pointer; } .campaign-element .bereich span.modal { cursor: pointer; } .campaign-element .absatz-text { display: block; } .campaign-element .absatz-text strong { color: #323232; font-size: 13px } .campaign-element .absatz-text img { vertical-align: middle; margin-right: 4px; } .campaign-element .absatz-text a { color: #DD192F; } .campaign-element .absatz-text a.erzeugt { color: #DD192F; } .campaign-element .video-titel { font-size: 17px; color: #323232; position: absolute; } .campaign-element .video-fb { position: absolute; } .campaign-element .iframe { position: absolute; } /* Zurück-Link */ #container_backlink a.backlink { background: url(../pics/promotionen_und_kampagnen/handfiltrationNY/zurueck_button_default.png); display: block; width: 82px; height: 31px;} #container_backlink a.backlink:hover { background: url(../pics/promotionen_und_kampagnen/handfiltrationNY/zurueck_button_hover.png); } #container_backlink .preload img { display: none; } /* Modaler Dialog */ .dialog .modal-top { float: left; width: 626px; height: 33px; display: block; background: url(../pics/layout/modal.oben.png) no-repeat 0 0; } .dialog .modal-content { float: left; height: 505px; clear: both; display: block; overflow: hidden; background: url(../pics/layout/modal.mitte.png) repeat-y 0 0; } .dialog .modal-content-wrap { margin: 0 23px; background-color: #ffffff; width: 580px; } .dialog .modal-content .modal-iframe { width: 580px; height: 560px; } .dialog .modal-bottom { float: left; width: 626px; height: 33px; clear: both; display: block; background: url(../pics/layout/modal.unten.png) no-repeat 0 0; } .dialog a.modal-close { width: 24px; height: 23px; display: block; position: absolute; right: 35px; top: 35px; color: #323232; background: url(../pics/layout/modal.close.png) no-repeat 0 0; cursor: pointer; } .dialog a.modal-close:hover { background: url(../pics/layout/modal.close.png) no-repeat 0 -23px; } .dialog .modal-text { height: 348px; } .modal-dialog { margin: 0; padding: 0; background-color: #ffffff; text-align: left; } .modal-dialog .titel { margin: 0; padding: 3px 0 14px 0; line-height: 21px; border-bottom: 1px solid #e0dfdd } .modal-dialog .titel h1 { color: #323232; font-size: 17px; margin: 0; padding-left: 15px; } .modal-dialog .slider-page { padding-top: 20px; } .modal-dialog .page { width: 580px; margin: 0; } .modal-dialog .texte { margin: 0; } .modal-dialog .bild-rechts { width: 580px; text-align: center; } .modal-dialog .bild-rechts img { height: 235px; } .modal-dialog .bild-unterschrift { font-style: normal; width: 470px; text-align: right; color: #323232; margin: 0 auto; padding-top: 5px; } .modal-dialog .text { color: #323232; width: 470px; margin: 0 auto; font-size: 14px; } .modal-dialog .text p { color: #323232; } .modal-dialog .text a { color: #DD192F !important; } .modal-dialog .modal-text .text { width: 550px; } .modal-dialog .text strong { color: #323232; line-height: 23px; } .modal-dialog sup { color: #323232; } .modal-dialog.scrollable .page { overflow-y: auto; height: 530px; } .modal-dialog a.page-next:link, .modal-dialog a.page-next:visited, .modal-dialog a.page-back:link, .modal-dialog a.page-back:visited { top: 175px; } .modal-dialog .page-next .arrow { width: 35px; height: 46px; background: url(../pics/layout/modal.rechts.png) no-repeat 0 0; } .modal-dialog .page-back .arrow { width: 35px; height: 46px; background: url(../pics/layout/modal.links.png) no-repeat 0 0; } .modal-dialog a.page-next:hover .arrow { background: url(../pics/layout/modal.rechts.png) no-repeat 0 -46px; } .modal-dialog a.page-back:hover .arrow { background: url(../pics/layout/modal.links.png) no-repeat 0 -46px; } /* Modaler Dialog Spezial */ .dialog-special .modal-top { width: 960px; height: 14px; background: url(../pics/layout/br_contentbox_100.png) no-repeat top; } .dialog-special .modal-content { height: 417px; background: url(../pics/layout/br_contentbox_100_1px.png); background-color: #4F1F0B; } .dialog-special .modal-content-wrap { margin: 0 23px; background-color: #4F1F0B; width: 914px; } .dialog-special .modal-content .modal-iframe { width: 914px; height: 417px; background-color: #4F1F0B; } .dialog-special .modal-bottom { width: 960px; height: 14px; background: url(../pics/layout/br_contentbox_100.png) no-repeat bottom; } .dialog-special a.modal-close { right: 27px; top: 16px; } .modal-dialog-special { margin: 0; padding: 0; background-color: #4F1F0B; text-align: left; } .modal-dialog-special .page { width: 914px; margin: 0; } .modal-dialog-special .link-top { width: 140px; height: 30px; position: relative; left: 200px; top: 120px; background: url(../pics/layout/kampagne/content_pfeil.png) no-repeat 0 0; } .modal-dialog-special .link-top a { width: 100px; height: 30px; margin: 0 0 0 40px; display: block; text-indent: -3000px; background: url(../pics/layout/kampagne/content_typo_1_default.png) no-repeat 0 0; } .modal-dialog-special .link-top a:hover { background: url(../pics/layout/kampagne/content_typo_1_hover.png) no-repeat 0 0; } .modal-dialog-special .link-bottom-one { width: 178px; height: 30px; position: relative; left: 200px; top: 120px; background: url(../pics/layout/kampagne/content_pfeil.png) no-repeat 0 0; } .modal-dialog-special .link-bottom-one a { width: 138px; height: 30px; margin: 0 0 0 40px; display: block; text-indent: -3000px; background: url(../pics/layout/kampagne/content_typo_2_default.png) no-repeat 0 0; } .modal-dialog-special .link-bottom-one a:hover { background: url(../pics/layout/kampagne/content_typo_2_hover.png) no-repeat 0 0; } .modal-dialog-special .link-bottom-two { width: 178px; height: 30px; position: relative; left: 200px; top: 125px; background: url(../pics/layout/kampagne/content_pfeil.png) no-repeat 0 0; } .modal-dialog-special .link-bottom-two a { width: 138px; height: 30px; margin: 0 0 0 40px; display: block; text-indent: -3000px; background: url(../pics/layout/kampagne/content_typo_3_default.png) no-repeat 0 0; } .modal-dialog-special .link-bottom-two a:hover { background: url(../pics/layout/kampagne/content_typo_3_hover.png) no-repeat 0 0; } .modal-dialog-special .left { float: left; width: 530px; height: 417px; background: url(../pics/layout/kampagne/content_polaroids.png) no-repeat 0 130px; } .modal-dialog-special .left h2 { color: #B8997A; } .modal-dialog-special .left .text { width: 520px; color: #B8997A; } .modal-dialog-special .left .absatz { width: 240px; padding: 10px 0 0 290px; } .modal-dialog-special .left .absatz h2 { color: #FFF; float: right; width: 180px; margin: 5px 0 5px 0; } .modal-dialog-special .left .absatz .bild-rechts { float: left; padding: 0; } .modal-dialog-special .left .absatz .text { float: right; width: 180px; color: #FFF; } .modal-dialog-special .right { float: left; width: 384px; height: 417px; } .modal-dialog-special .right .top { float: left; height: 210px; width: 384px; background: url(../pics/layout/kampagne/content_solo.png) no-repeat 50px 45px; } .modal-dialog-special .right .top h2 { color: #B8997A; padding: 20px 0 0 40px; } .modal-dialog-special .right .top .absatz .bild-rechts { float: right; padding: 10px 155px 0 0; } .modal-dialog-special .right .top .absatz .text { float: right; clear: both; width: 180px; padding: 0; } .modal-dialog-special .right .bottom { float: left; clear: both; height: 220px; width: 384px; background: url(../pics/layout/kampagne/content_packshots.png) no-repeat -20px 25px; } .modal-dialog-special .right .bottom h2 { color: #B8997A; padding: 0 0 0 40px; } .modal-dialog-special .right .bottom .absatz .bild-rechts { float: right; padding: 10px 155px 0 0; } .modal-dialog-special .right .bottom .absatz .text { float: right; clear: both; width: 180px; padding: 0; } /* Kampagne Spezial */ .campaign-special .page { position: relative; overflow: hidden; width: 100%; padding: 0; } .campaign-special .background-wrapper { width: 100%; height: 100%; top: 0; left: 0; position: absolute; z-index: -20; overflow: hidden; } .campaign-special .background-wrapper .background { position: absolute; top: 0; left: 50%; z-index: -20; } .campaign-special .background-wrapper .coffeesmile { position: absolute; width: 1515px; height: 313px; left: 0; bottom: 15px; z-index: -10; } .campaign-special .viewport { margin: 0 auto; width: 1280px; } .campaign-special .page-slider .page-next .arrow { width: 99px; height: 110px; right: auto; left: 0; background: url(../pics/promotionen_und_kampagnen/brasilien/navi_stage_right.png) no-repeat 0 0; } .campaign-special .page-slider .page-back .arrow { width: 99px; height: 110px; right: 0; left: auto; background: url(../pics/promotionen_und_kampagnen/brasilien/navi_stage_left.png) no-repeat 0 0; } .campaign-special .page-slider a.page-next:link, .campaign-special .page-slider a.page-next:visited { width: 99px; height: 110px; right: 0; top: 130px; z-index: 25; } .campaign-special .page-slider a.page-back:link, .campaign-special .page-slider a.page-back:visited { width: 99px; height: 110px; left: 0; top: 130px; z-index: 25; } .campaign-special .page-slider a.page-next:hover .arrow { background: url(../pics/promotionen_und_kampagnen/brasilien/navi_stage_right_hover.png) no-repeat 0 0; } .campaign-special .page-slider a.page-back:hover .arrow { background: url(../pics/promotionen_und_kampagnen/brasilien/navi_stage_left_hover.png) no-repeat 0 0; } .campaign-special .page-slider .preview-left { position: absolute; display: block; overflow: hidden; width: 75px; height: 100%; left: 0; top: 0; z-index: 20; background: url(../pics/layout/trans.gif); } .campaign-special .page-slider .preview-right { position: absolute; display: block; overflow: hidden; width: 75px; height: 100%; right: 0; top: 0; z-index: 20; background: url(../pics/layout/trans.gif); } .campaign-special .campaign-guide { margin: 787px auto 0 auto; width: 794px; height: 265px; display: block; padding-top: 114px; background: url(../pics/promotionen_und_kampagnen/brasilien/guide/guide_bg.png) no-repeat 0 0; } .campaign-special .campaign-guide .background { display: none; } .campaign-special .guide { margin: 0 auto; width: 660px; height: 140px; overflow: hidden; display: block; } .campaign-special .page-slider .guide-picture { width: 165px; height: 140px; float: left; display: block; text-align: center; } .campaign-special .page-slider .guide-picture img { cursor: pointer; } .campaign-special .guide .page-next .arrow { width: 89px; height: 96px; right: auto; left: auto; background: url(../pics/promotionen_und_kampagnen/brasilien/guide/navi_videos_right.png) no-repeat 0 0; } .campaign-special .guide .page-back .arrow { width: 89px; height: 96px; right: auto; left: auto; background: url(../pics/promotionen_und_kampagnen/brasilien/guide/navi_videos_left.png) no-repeat 0 0; } .campaign-special .guide a.page-next:link, .campaign-special .guide a.page-next:visited { width: 89px; height: 96px; right: auto; top: auto; margin-left: 651px; } .campaign-special .guide a.page-back:link, .campaign-special .guide a.page-back:visited { width: 89px; height: 96px; left: auto; top: auto; margin-left: -80px; } .campaign-special .guide a.page-next:hover .arrow { background: url(../pics/promotionen_und_kampagnen/brasilien/guide/navi_videos_right_hover.png) no-repeat 0 0; } .campaign-special .guide a.page-back:hover .arrow { background: url(../pics/promotionen_und_kampagnen/brasilien/guide/navi_videos_left_hover.png) no-repeat 0 0; } .campaign-special .cp-gewinnspiel .link { display: none; } .campaign-special .cp-gewinnspiel .formular { position: absolute; left: 19px; top: 124px; width: 100%; } .campaign-special .cp-gewinnspiel .antwort { float: left; clear: both; width: 100%; height: 27px; margin-bottom: 8px; } .campaign-special .cp-gewinnspiel .antwort div { width: 33px; height: 28px; display: block; cursor: pointer; position: relative; left: 13px; top: 1px; } .campaign-special .cp-gewinnspiel .checkbox { display: none; } .campaign-special .cp-gewinnspiel .antwortgrafiken { display: none; } .campaign-special .cp-gewinnspiel .formular .abschicken { position: absolute; left: 16px; top: 119px; } .campaign-special .cp-gewinnspiel .formular .inaktiv { width: 148px; height: 29px; display: block; position: absolute; top: 119px; left: 16px; cursor: normal; background: url(../pics/promotionen_und_kampagnen/brasilien/gewinnspiel/gewinnspiel_button_inaktiv.png) no-repeat 0 0; } .campaign-special .headline { margin-left: 189px; padding-top: 35px; } .campaign-special .brown h1, .campaign-special .brown h2, .campaign-special .brown sup { color: #5F381C; } .campaign-special .white h1, .campaign-special .white h2, .campaign-special .white sup { color: #FFF; } .campaign-special .video-titel { top: 7px; left: 17px; color: #FFF; } .campaign-special .video-fb { top: 7px; right: 17px; } /* Kampagne Spezial Gewinnspiel */ .quiz .bg-info-header { background: url("../pics/layout/br_contentbox_80.png") no-repeat 0 top transparent; } .quiz .bg-info { background: url("../pics/layout/br_contentbox_80_1px.png") 0 0 transparent; } .quiz .bg-info-footer { background: url("../pics/layout/br_contentbox_80.png") no-repeat 0 bottom transparent; } .quiz-danke .space { height: 134px; display: block; } .quiz-danke .page .titel { padding: 0 0 0 30px; } .quiz-danke .page .text { width: 350px; padding: 30px 0 0 80px; } .quiz-danke .page h1 { color: #B8997A; margin: 0; } .quiz-danke .bg-info { height: 310px; position: relative; } /* Kampagne Selection des Jahres */ .bg-sdj-header { height: 15px; background: url("../pics/layout/sdj_contentbox_100.png") no-repeat 0 top transparent } .bg-sdj { background: url("../pics/layout/sdj_contentbox_100_1px.png") 0 0 transparent; padding: 0 } .bg-sdj-footer { height: 15px; background: url("../pics/layout/sdj_contentbox_100.png") no-repeat 0 bottom transparent; margin: 0 0 120px 0 } .bg-sdj .absatz-sdj { float: left; margin: 0 0 0 29px } .bg-sdj .absatz-sdj .headline { float: left; width: 450px; padding: 18px 0 15px 0 } .bg-sdj .absatz-sdj .headline h2 { font-size: 14px } .bg-sdj .absatz-sdj .text { float: left; width: 450px; padding: 0 0 15px 0; font-size: 11px } .bg-sdj .absatz-sdj .bild-rechts { padding: 23px 38px 23px 70px } .bg-sdj .absatz-sdj .sdj-button { float: left; clear: both } .bg-sdj .sdj-trennlinie { float: left; width: 960px; height: 2px; background: url("../pics/layout/sdj_trenner.png") repeat-x 0 0; margin: 12px 0 } .bg-sdj .absatz-sdj .bild-unterschrift { width: 300px } /* Kampagne Steigenberger */ .steigenberger .popup, .steigenberger .uebersicht { display: none } .steigenberger h2 { font-family: "Lucida Sans W01 Bold",sans-serif; margin: 0 0 10px 0; font-size: 14px; display: block; float: left } .steigenberger .info { width: 430px; float: left; margin: 0 0 2px 0 } .steigenberger .ort { text-transform: uppercase; float: left; width: 180px } .steigenberger h2.ch, .steigenberger h2.at, .steigenberger h2.nl { margin: 20px 0 10px 0 } .steigenberger .hotels { float: left } .steigenberger .hotels a { padding: 0 0 4px 0; display: block; width: 250px } .sb-popup { width: 448px; height: 368px; padding: 8px 16px; display: block; background-color: #ffffff } .sb-popup .absatz h2 { color: #000000; font-weight: bold; text-transform: uppercase; font-size: 14px; width: 200px; margin: 0 0 8px 0 } .sb-popup .absatz .text, .sb-popup .absatz .text p { color: #000000; } .sb-popup .link { float: left; width: 224px; margin: 20px 0 0 0; text-align: right } .sb-popup .link a { padding: 1px 0 0 21px; color: #000000; background: url(../pics/layout/grafikelemente.png) no-repeat -11px -419px } .sb-popup .link a:hover { color: #dd1930 } .sb-popup .link.erster { text-align: left } .sb-uebersicht { width: 368px; height: 118px; padding: 8px 16px; display: block; background-color: #ffffff } .sb-uebersicht h2 { color: #000000; font-weight: bold; text-transform: uppercase; font-size: 14px; width: 200px; margin: 0 0 8px 0 } .sb-uebersicht a { padding: 1px 0 0 21px; color: #000000; background: url(../pics/layout/grafikelemente.png) no-repeat -11px -419px; margin: 0 0 3px 0; display: block } .sb-uebersicht a:hover { color: #dd1930 } /* Kampagne Freizeitparks */ .freizeitparks .popup, .freizeitparks .uebersicht { display: none } .fp-popup { width: 448px; height: 448px; padding: 8px 16px; display: block; background-color: #ffffff } .fp-popup .absatz { margin: 20px 0 0 0 } .fp-popup .absatz h2 { color: #000000; font-weight: bold; text-transform: uppercase; font-size: 14px; width: 200px; margin: 0 0 8px 0 } .fp-popup .absatz .text { width: 286px } .fp-popup .absatz .text, .fp-popup .absatz .text p, .fp-popup .absatz .text strong { color: #000000; } .fp-popup .absatz .text a { position: absolute; bottom: 16px; left: 16px; padding: 0 0 0 21px; color: #000000; background: url(../pics/layout/grafikelemente.png) no-repeat -11px -419px } .fp-popup .absatz .text a:hover { color: #dd1930 } .fp-popup .bild { position: absolute; right: 16px; top: 273px } .fp-popup .text { margin: 20px 0 0 0 } .fp-popup .text, .fp-popup .text p, .fp-popup .text strong { color: #000000 } .fp-uebersicht { width: 368px; height: 318px; padding: 8px 16px; display: block; background-color: #ffffff } .fp-uebersicht h2 { color: #000000; font-weight: bold; text-transform: uppercase; font-size: 14px; width: 300px; margin: 0 0 8px 0 } .fp-uebersicht a { padding: 0 0 0 21px; color: #000000; background: url(../pics/layout/grafikelemente.png) no-repeat -11px -419px; margin: 0 0 3px 0; display: block } .fp-uebersicht a:hover { color: #dd1930 } .fp-uebersicht .infos { float: left; clear: both } .tb-link { margin: 10px 0 0 0 } .tb-link a { padding: 0 0 0 21px; color: #ffffff; background: url(../pics/layout/grafikelemente.png) no-repeat -11px -419px } .tb-link a:hover { color: #dd1930 } .logo-monte-mare { margin: 20px 0; width: 93px; height: 88px; display: block; float: left; background: url(../pics/layout/kampagne/montemare.png) no-repeat 0 0 } .logo-halligalli { margin: 20px 0; width: 131px; height: 78px; display: block; float: left; background: url(../pics/layout/kampagne/halligalli.png) no-repeat 0 0 } /* Kampagne Selection des Jahres 2013 */ .kampagne-sdj-2013 .page { height: 2355px; padding: 0 } .kampagne-sdj-2013 .video-fb { display: none } .kampagne-sdj-2013-feedback .page { height: 1070px; padding: 0 } .kampagne-sdj-2013-feedback .sdj2013-text { background: url(../pics/layout/kampagne/blatt.oben.png) no-repeat 0 0 } .kampagne-sdj-2013-feedback .sdj2013-text .titel { padding: 30px 0 } .kampagne-sdj-2013-feedback .sdj2013-text .titel h1 { font-family: papyrus_plainregular; margin: 0 20px; font-size: 24px; line-height: 28px; font-weight: bold } .kampagne-sdj-2013-feedback .sdj2013-text .text { color: #323232; margin: 0 20px; line-height: 20px; font-size: 14px } .kampagne-sdj-2013-feedback .sdj2013-text .link { text-align: right; padding: 20px 20px 0 0 } .kampagne-sdj-2013-feedback .sdj2013-text .link a { color: #323232; text-decoration: underline; line-height: 20px; font-size: 14px } .kampagne-sdj-2013-feedback .sdj2013-text .link a:hover { text-decoration: none } .kampagne-sdj-2013-feedback .sdj2013-slider .viewport { width: 390px; height: 235px; display: block; margin: 0 55px; overflow: hidden; background: url(../pics/layout/kampagne/blatt.unten.png) no-repeat 0 0 } .kampagne-sdj-2013-feedback .sdj2013-slider .slider-page { width: 390px; height: 235px; display: block } .kampagne-sdj-2013-feedback .sdj2013-slider .slider-page .text { color: #323232; font-family: pastelregular; font-size: 14px; margin: 30px 30px 0 30px } .kampagne-sdj-2013-feedback .sdj2013-slider .slider-page h2 { text-align: right; margin: 0 30px 0 0; line-height: 20px; font-size: 14px; padding: 10px 0 0 0 } .kampagne-sdj-2013-feedback .sdj2013-slider .arrow { width: 55px; height: 55px; display: block; position: absolute; top: 36px; cursor: pointer } .kampagne-sdj-2013-feedback .sdj2013-slider .next { right: 10px; background: url(../pics/layout/kampagne/button.rechts.png) no-repeat 0 0 } .kampagne-sdj-2013-feedback .sdj2013-slider .back { left: 10px; background: url(../pics/layout/kampagne/button.links.png) no-repeat 0 0 } .kampagne-sdj-2013-gewinnspiel .page { height: 1490px; padding: 0 } .kampagne-sdj-2013-gewinnspiel .kopf { line-height: 50px; background: url(../pics/layout/kampagne/kopf.gewinnspiel.png) no-repeat 0 0; font-size: 14px; font-family: "Lucida Sans W01 Roman",sans-serif; text-transform: uppercase; color: #BB0000; padding: 0 0 0 20px } .kampagne-sdj-2013-gewinnspiel .sdj2013-text .titel { padding: 20px 0 10px 0 } .kampagne-sdj-2013-gewinnspiel .sdj2013-text .titel h1 { font-family: papyrus_plainregular; margin: 0 20px; font-size: 24px; line-height: 28px; font-weight: bold } .kampagne-sdj-2013-gewinnspiel .sdj2013-text .bild { text-align: center } .kampagne-sdj-2013-gewinnspiel .sdj2013-text .text { color: #323232; margin: 0 0 0 20px; line-height: 16px; font-size: 12px; font-family: "Lucida Sans W01 Roman",sans-serif } .kampagne-sdj-2013-gewinnspiel .sdj2013-text .erfolg { color: #323232; margin: 20px 0 0 20px; line-height: 20px; font-size: 16px; font-family: "Lucida Sans W01 Bold",sans-serif; font-weight: bold } .kampagne-sdj-2013-gewinnspiel .sdj2013-danke .titel h1 { line-height: 32px; text-align: center } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator { margin: 60px 0 0 20px } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator * { color: #323232 } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular label { width: 140px } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular .form-text { width: 270px; height: 18px; background-color: #fefefd } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular .form-eingabe-zeile { margin: 0 0 11px 0 } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular .checkbox-information { width: 410px; margin: 0 40px 0 0 } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular .form-button { float: left; margin: 10px 0 0 0 } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular .zeile_formularsdj_gewinnspiel_hausnummer .form-text, .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular .zeile_formularsdj_gewinnspiel_plz .form-text { width: 115px } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular .zeile_formularsdj_gewinnspiel_antwort { margin: 30px 0 } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular .zeile_formularsdj_gewinnspiel_antwort .form-text { margin: 15px 0 0 0 } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular div.fehler { display: none } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular div.fehler.checkbox-information { display: block; color: #DD1930; border: 0; margin: 0 40px 0 0 } .kampagne-sdj-2013-gewinnspiel .modul-formulargenerator .formular div.fehler.checkbox-information a { color: #DD1930 } /* Kampagne Selection des Jahres 2014 */ .kampagne-sdj-2014 { background: url(../pics/layout/kampagne/sdj14.bg.png) } .kampagne-sdj-2014 .page { width: 1270px; height: 2675px; padding: 0 } .kampagne-sdj-2014 .page .viewport > div.titel { position: relative; z-index: 20; padding: 80px 0 9px } .kampagne-sdj-2014 .page .viewport > div.titel * { color: #ffffff } .kampagne-sdj-2014 .page .viewport > div.titel h1 { margin-left: 144px; text-shadow: #000000 0.1em 0.1em 0.2em; font-family: "Century Gothic W01", sans-serif } .kampagne-sdj-2014 .page .viewport > div.titel-extra { position: relative; z-index: 20; padding: 0 0 9px; } .kampagne-sdj-2014 .page .viewport > div.titel-extra * { color: #ffffff } .kampagne-sdj-2014 .page .viewport > div.titel-extra h2 { margin-left: 144px; text-shadow: #000000 0.1em 0.1em 0.2em; font-size: 32px; font-family: "Century Gothic W01", sans-serif } .kampagne-sdj-2014 .page .viewport > h2 { margin-left: 144px; color: #ffffff; position: relative; z-index: 20; font-size: 19px; text-shadow: #000000 0.1em 0.1em 0.2em } .kampagne-sdj-2014 .page .viewport .button-29 .button-left { background-position: left bottom } .kampagne-sdj-2014 .page .viewport .button-29 .button-text { background-position: center bottom } .kampagne-sdj-2014 .page .viewport .button-29 .button-text span { color: #DD1930; background: url(../pics/layout/link.text.aktiv.png) no-repeat right 11px } .kampagne-sdj-2014 .page .viewport .button-29 .button-right { background-position: right bottom } .kampagne-sdj-2014 .page .viewport .fb_iframe_widget { display: none } .kampagne-sdj-2014 .dialog .modal-content { height: 545px } .kampagne-sdj-2014 .page .viewport .absatz-text { color: #ffffff; font-size: 15px; line-height: 19px; text-shadow: #000000 0.1em 0.1em 0.2em } .kampagne-sdj-2014 .page .viewport .absatz-text * { color: #ffffff; text-shadow: #000000 0.1em 0.1em 0.2em } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .formular { overflow: hidden; position: relative; height: 240px } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .schritt-0 .text { text-shadow: #000000 0.1em 0.1em 0.2em; width: 320px; line-height: 19px } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .schritt-0 .text * { color: #ffffff } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .link { display: none; } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .titel { padding: 0; margin: 0 0 40px 80px } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .titel * { color: #ffffff } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .titel h2 { text-shadow: #000000 0.1em 0.1em 0.2em; font-size: 19px } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .frage * { color: #ffffff } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .frage { margin-bottom: 18px; text-shadow: #000000 0.1em 0.1em 0.2em; width: 320px; line-height: 19px } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .antwort { float: left; clear: both; width: 180px; height: 16px; margin-bottom: 8px; position: relative } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .antwort div { width: 15px; height: 16px; display: block; cursor: pointer; position: absolute; left: 0; top: 0; } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .antwort div.text { width: 100%; left: 25px; text-shadow: #000000 0.1em 0.1em 0.2em } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .checkbox { display: none; } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .inaktiv { width: 166px; height: 29px; display: block; position: absolute; bottom: 0; left: 0; cursor: normal; background: url(../pics/layout/kampagne/button.inaktiv.png) no-repeat 0 0; } .kampagne-sdj-2014 .page .viewport .cp-gewinnspiel .abschicken { position: absolute; bottom: 0; left: 0 } .kampagne-sdj-2014-gewinnspiel { background: url(../pics/layout/kampagne/sdj14.bg.png) } .kampagne-sdj-2014-gewinnspiel .page { width: 1270px; height: 1390px; padding: 0 } .kampagne-sdj-2014-gewinnspiel .page .titel { padding: 0; color: #323232; font-size: 17px; font-family: "Century Gothic W01", sans-serif } .kampagne-sdj-2014-gewinnspiel .page .absatz-text { width: 325px; line-height: 19px; } .kampagne-sdj-2014-gewinnspiel .formular { width: 423px; height: 505px; padding: 10px 42px 0 55px; background: #ffffff } .kampagne-sdj-2014-gewinnspiel .formular * { color: #323232; line-height: 19px } .kampagne-sdj-2014-gewinnspiel .formular a { text-decoration: underline } .kampagne-sdj-2014-gewinnspiel .formular a:hover { text-decoration: none } .kampagne-sdj-2014-gewinnspiel .formular a.button-29 { margin: 12px 0 0 0; float: left } .kampagne-sdj-2014-gewinnspiel .formular .form-button { width: 1px; height: 1px; position: absolute; left: -10000px; } .kampagne-sdj-2014-gewinnspiel .formular a.button-29:hover .button-left { background-position: left top} .kampagne-sdj-2014-gewinnspiel .formular a.button-29:hover .button-right { background-position: right top; } .kampagne-sdj-2014-gewinnspiel .formular a.button-29:hover .button-text { background-position: center top; } .kampagne-sdj-2014-gewinnspiel .formular a.button-29:hover .button-text span { background: url(../pics/layout/link.text.normal.png) no-repeat right 11px; color: #ffffff; } .kampagne-sdj-2014-gewinnspiel .formular .zeile_formularsdj_vierzehn_gewinnspiel_vorname { float: left; width: 205px; margin: 7px 0 0 0 } .kampagne-sdj-2014-gewinnspiel .formular .zeile_formularsdj_vierzehn_gewinnspiel_name { float: left; width: 205px; margin: 7px 0 0 12px } .kampagne-sdj-2014-gewinnspiel .formular .zeile_formularsdj_vierzehn_gewinnspiel_email { float: left; width: 422px; margin: 7px 0 0 0 } .kampagne-sdj-2014-gewinnspiel .formular .zeile_formularsdj_vierzehn_gewinnspiel_strasse { float: left; width: 205px; margin: 7px 0 0 0 } .kampagne-sdj-2014-gewinnspiel .formular .zeile_formularsdj_vierzehn_gewinnspiel_hausnummer { float: left; width: 205px; margin: 7px 0 0 12px } .kampagne-sdj-2014-gewinnspiel .formular .zeile_formularsdj_vierzehn_gewinnspiel_plz { float: left; width: 205px; margin: 7px 0 0 0 } .kampagne-sdj-2014-gewinnspiel .formular .zeile_formularsdj_vierzehn_gewinnspiel_stadt { float: left; width: 205px; margin: 7px 0 0 12px } .kampagne-sdj-2014-gewinnspiel .formular .form-text { width: 100%; border: 1px solid #abadb3; height: 19px } .kampagne-sdj-2014-gewinnspiel .formular .form-text.fehler { border: 1px solid #DD1930; background-color: #fbe6e8 } .kampagne-sdj-2014-gewinnspiel .formular .checkbox-zeile { float: left; margin: 12px 0 0 0 } .kampagne-sdj-2014-gewinnspiel .formular .checkbox-information { float: left; margin: 0 0 0 30px; } .kampagne-sdj-2014-gewinnspiel .formular .checkbox-information.fehler { color: #DD1930 } .kampagne-sdj-2014-gewinnspiel .formular .checkbox-information.fehler a { color: #DD1930 } .kampagne-sdj-2014-gewinnspiel .formular .form-checkbox { float: left; margin-top: 3px; padding-bottom: 200px; margin-bottom: -200px } /* Kampagne Sky */ .kampagne-sky .absatz-akkordeon .html { background: url(../pics/layout/kampagne/sky.video.bg.png) no-repeat 0 0; height: 337px } .kampagne-sky .absatz-akkordeon .html iframe { margin: 23px 0 0 23px } .kampagne-sky .absatz-akkordeon .acText-unten { display: none } /* Pad Offensive */ .pad-offensive { position: relative } .pad-offensive .po-fussnote .text { font-size: 10px; } .pad-offensive .po-h2 { position: absolute } .pad-offensive img { float:left } .modul-formulargenerator .pad-form .form-checkbox { float:left } .modul-formulargenerator .pad-form .checkbox-information { padding: 0px 0px 0px 25px } .modul-formulargenerator .pad-form .checkbox-zeile { padding: 10px 0px 0px 0px } .modul-formulargenerator .pad-form .datenschutz { clear: both; overflow: hidden } .modul-formulargenerator .pad-form .submit { margin: 20px 0px 0px 0px } .modul-formulargenerator .pad-form .gruppe-email .form-text { width: 412px; } .modul-formulargenerator .pad-form .gruppe-email .form-eingabe-zeile { margin: 0px 0px 5px 0px } .pad-offensive .modul-formulargenerator { height: 170px } .modul-formulargenerator .pad-form { margin: 0px 0px 0px 0px !important } .modul-formulargenerator .pad-form .datenschutz a, .pad-offensive .absatz .text a { text-decoration:underline; } .pad-offensive .po-gewinne-text { padding: 37px 0px 0px 0px } .pad-offensive .content .absatz { margin: 0px 0px 20px 0px } .pad-offensive .modul-formulargenerator .code h2 { } .modul-formulargenerator .antwort input { vertical-align: text-top } .modul-formulargenerator .antwort label { } .pad-offensive hr { margin: 15px 0px 5px 0px } .pad-offensive .column2 .bild { margin: 0px 0px 10px 0px } .modul-formulargenerator .pad-form .form-eingabe-zeile input { height: auto; line-height: 15px; padding: 1px } /* Selection des Jahres Gewinnspiel*/ .sdj-gewinnspiel { position: relative } .sdj-gewinnspiel .po-fussnote .text { font-size: 10px; margin: 57px 0px 0px 0px } .sdj-gewinnspiel .sdj-h2 { } .sdj-gewinnspiel .column1 img { float:left } .modul-formulargenerator .sdj-gewinnspiel-form .form-checkbox { float:left } .modul-formulargenerator .sdj-gewinnspiel-form .checkbox-information { padding: 0px 0px 0px 25px } .modul-formulargenerator .sdj-gewinnspiel-form .checkbox-zeile { padding: 10px 0px 0px 0px } .modul-formulargenerator .sdj-gewinnspiel-form .datenschutz { clear: both; overflow: hidden } .modul-formulargenerator .sdj-gewinnspiel-form .submit { margin: 20px 0px 0px 0px } .modul-formulargenerator .sdj-gewinnspiel-form .gruppe-email .form-text { width: 380px; } .modul-formulargenerator .sdj-gewinnspiel-form .gruppe-email .form-eingabe-zeile { margin: 0px 0px 5px 0px } .sdj-gewinnspiel .modul-formulargenerator { height: 170px } .modul-formulargenerator .sdj-gewinnspiel-form { margin: 0px 0px 0px 0px !important } .modul-formulargenerator .sdj-gewinnspiel-form .datenschutz a, .sdj-gewinnspiel .absatz .text a { text-decoration:underline; } .sdj-gewinnspiel .sdj-gewinne-text { padding: 24px 0px 0px 0px; margin: 0px 0px 0px 306px; width: 125px; } .sdj-gewinnspiel .modul-formulargenerator .code { width: 460px} .sdj-gewinnspiel .content .absatz { margin: 0px 0px 20px 0px } .sdj-gewinnspiel .modul-formulargenerator .code h2 { } .modul-formulargenerator .antwort input { vertical-align: text-top } .modul-formulargenerator .antwort label { } .sdj-gewinnspiel hr { margin: 15px 0px 5px 0px } .sdj-gewinnspiel .column1 .bild { margin: 20px 0px 0px 0px } .sdj-gewinnspiel .column2 .oben { position: relative; margin: 0px 0px 0px 50px } .sdj-gewinnspiel .column2 .unten { position: relative; margin: 34px 0px 0px 20px } .modul-formulargenerator .sdj-gewinnspiel-form .form-eingabe-zeile input { height: auto; line-height: 15px; padding: 1px } .sdj-gewinnspiel .frage-text-block {height: 480px; /*width: 395px*/ } /* Kampagne Selection des Jahres 2015 */ .kampagne-sdj-2015 { background: url(../pics/layout/kampagne/sdj14.bg.png); margin-top: 20px !important } .kampagne-sdj-2015 .page { width: 1246px; height: 2540px; padding: 0 } .kampagne-sdj-2015 .page .viewport > div.titel { position: relative; z-index: 20; padding: 180px 0 15px } .kampagne-sdj-2015 .page .viewport > div.titel * { color: #ffffff } .kampagne-sdj-2015 .page .viewport > div.titel h1 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; font-size: 36px; font-family: "Century Gothic W01 Bold", sans-serif } .kampagne-sdj-2015 .page .viewport > div.titel-extra { position: relative; z-index: 20; padding: 0 0 15px } .kampagne-sdj-2015 .page .viewport > div.titel-extra * { color: #ffffff } .kampagne-sdj-2015 .page .viewport > div.titel-extra h2 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; font-size: 36px; font-family: "Century Gothic W01 Bold", sans-serif } .kampagne-sdj-2015 .page .viewport > h2 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; color: #ffffff; position: relative; z-index: 20; font-size: 26px; font-family: "Century Gothic W01", sans-serif } .kampagne-sdj-2015 .page .viewport .button-29 .button-left { background-position: left bottom } .kampagne-sdj-2015 .page .viewport .button-29 .button-text { background-position: center bottom } .kampagne-sdj-2015 .page .viewport .button-29 .button-text span { color: #DD1930; background: url(../pics/layout/link.text.aktiv.png) no-repeat right 11px } .kampagne-sdj-2015 .page .viewport .button-29 .button-right { background-position: right bottom } .kampagne-sdj-2015 .page .viewport .fb_iframe_widget { display: none } .kampagne-sdj-2015 .dialog .modal-content { height: 500px } .kampagne-sdj-2015 .page .viewport .absatz-text { color: #ffffff; font-size: 16px; line-height: 22px } .kampagne-sdj-2015 .page .viewport .absatz-text * { color: #ffffff; font-size: 14px; line-height: 20px } .kampagne-sdj-2015 .page .viewport .absatz-text .titel { font-family: "Century Gothic W01", sans-serif; font-size: 20px; padding: 38px 0 15px } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .formular { overflow: hidden; position: relative; height: 240px } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .schritt-0 .text { width: 295px; line-height: 20px; font-size: 14px } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .schritt-0 .text * { color: #ffffff } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .link { display: none; } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .titel { padding: 0; margin: 0 0 28px 0 } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .titel * { color: #ffffff } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .titel h2 { font-size: 25px; font-family: "Century Gothic W01", sans-serif; margin: 0; padding: 0 } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .frage * { color: #ffffff; line-height: 20px; font-size: 14px } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .frage { margin-bottom: 18px; width: 330px; line-height: 20px } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .antwort { float: left; clear: both; width: 230px; height: 16px; margin-bottom: 8px; position: relative } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .antwort div { width: 15px; height: 16px; display: block; cursor: pointer; position: absolute; left: 0; top: 0; } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .antwort div.text { width: 100%; left: 25px; line-height: 16px; font-size: 14px } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .checkbox { display: none; } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .inaktiv { width: 166px; height: 29px; display: block; position: absolute; bottom: 0; left: 0; cursor: normal; background: url(../pics/layout/kampagne/button.inaktiv.png) no-repeat 0 0; } .kampagne-sdj-2015 .page .viewport .cp-gewinnspiel .abschicken { position: absolute; bottom: 0; left: 0 } .kampagne-sdj-2015-gewinnspiel { background: url(../pics/layout/kampagne/sdj14.bg.png) } .kampagne-sdj-2015-gewinnspiel .page { width: 1270px; height: 1390px; padding: 0 } .kampagne-sdj-2015-gewinnspiel .page .titel { padding: 0; color: #323232; font-size: 17px; font-family: "Century Gothic W01", sans-serif } .kampagne-sdj-2015-gewinnspiel .page .absatz-text { width: 325px; line-height: 19px } .kampagne-sdj-2015-gewinnspiel .formular { width: 423px; height: 505px; padding: 10px 42px 0 55px; background: #ffffff } .kampagne-sdj-2015-gewinnspiel .formular * { color: #323232; line-height: 19px } .kampagne-sdj-2015-gewinnspiel .formular a { text-decoration: underline } .kampagne-sdj-2015-gewinnspiel .formular a:hover { text-decoration: none } .kampagne-sdj-2015-gewinnspiel .formular a.button-29 { margin: 12px 0 0 0; float: left } .kampagne-sdj-2015-gewinnspiel .formular .form-button { width: 1px; height: 1px; position: absolute; left: -10000px; } .kampagne-sdj-2015-gewinnspiel .formular a.button-29:hover .button-left { background-position: left top} .kampagne-sdj-2015-gewinnspiel .formular a.button-29:hover .button-right { background-position: right top; } .kampagne-sdj-2015-gewinnspiel .formular a.button-29:hover .button-text { background-position: center top; } .kampagne-sdj-2015-gewinnspiel .formular a.button-29:hover .button-text span { background: url(../pics/layout/link.text.normal.png) no-repeat right 11px; color: #ffffff; } .kampagne-sdj-2015-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_vorname { float: left; width: 205px; margin: 7px 0 0 0 } .kampagne-sdj-2015-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_name { float: left; width: 205px; margin: 7px 0 0 12px } .kampagne-sdj-2015-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_email { float: left; width: 422px; margin: 7px 0 0 0 } .kampagne-sdj-2015-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_strasse { float: left; width: 205px; margin: 7px 0 0 0 } .kampagne-sdj-2015-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_hausnummer { float: left; width: 205px; margin: 7px 0 0 12px } .kampagne-sdj-2015-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_plz { float: left; width: 205px; margin: 7px 0 0 0 } .kampagne-sdj-2015-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_stadt { float: left; width: 205px; margin: 7px 0 0 12px } .kampagne-sdj-2015-gewinnspiel .formular .form-text { width: 100%; border: 1px solid #abadb3; height: 19px } .kampagne-sdj-2015-gewinnspiel .formular .form-text.fehler { border: 1px solid #DD1930; background-color: #fbe6e8 } .kampagne-sdj-2015-gewinnspiel .formular .checkbox-zeile { float: left; margin: 12px 0 0 0 } .kampagne-sdj-2015-gewinnspiel .formular .checkbox-information { float: left; margin: 0 0 0 30px; } .kampagne-sdj-2015-gewinnspiel .formular .checkbox-information.fehler { color: #DD1930 } .kampagne-sdj-2015-gewinnspiel .formular .checkbox-information.fehler a { color: #DD1930 } .kampagne-sdj-2015-gewinnspiel .formular .form-checkbox { float: left; margin-top: 3px; padding-bottom: 200px; margin-bottom: -200px } /* Kampagne Selection des Jahres 2016 */ .kampagne-sdj-2016 { background: url(../pics/layout/kampagne/sdj14.bg.png); margin-top: 20px !important } .kampagne-sdj-2016 .page { width: 1246px; height: 2540px; padding: 0 } .kampagne-sdj-2016 .page .viewport > div.titel { position: relative; z-index: 20; padding: 180px 0 15px } .kampagne-sdj-2016 .page .viewport > div.titel * { color: #ffffff } .kampagne-sdj-2016 .page .viewport > div.titel h1 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; font-size: 36px; font-family: "Century Gothic W01 Bold", sans-serif } .kampagne-sdj-2016 .page .viewport > div.titel-extra { position: relative; z-index: 20; padding: 0 0 15px } .kampagne-sdj-2016 .page .viewport > div.titel-extra * { color: #ffffff } .kampagne-sdj-2016 .page .viewport > div.titel-extra h2 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; font-size: 36px; font-family: "Century Gothic W01 Bold", sans-serif } .kampagne-sdj-2016 .page .viewport > h2 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; color: #ffffff; position: relative; z-index: 20; font-size: 26px; font-family: "Century Gothic W01", sans-serif } .kampagne-sdj-2016 .page .viewport .button-29 .button-left { background-position: left bottom } .kampagne-sdj-2016 .page .viewport .button-29 .button-text { background-position: center bottom } .kampagne-sdj-2016 .page .viewport .button-29 .button-text span { color: #DD1930; background: url(../pics/layout/link.text.aktiv.png) no-repeat right 11px } .kampagne-sdj-2016 .page .viewport .button-29 .button-right { background-position: right bottom } .kampagne-sdj-2016 .page .viewport .fb_iframe_widget { display: none } .kampagne-sdj-2016 .dialog .modal-content { height: 500px } .kampagne-sdj-2016 .page .viewport .absatz-text { color: #ffffff; font-size: 16px; line-height: 22px } .kampagne-sdj-2016 .page .viewport .absatz-text * { color: #ffffff; font-size: 14px; line-height: 20px } .kampagne-sdj-2016 .page .viewport .absatz-text .titel { font-family: "Century Gothic W01", sans-serif; font-size: 20px; padding: 38px 0 15px } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .formular { overflow: hidden; position: relative; height: 240px } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .schritt-0 .text { width: 295px; line-height: 20px; font-size: 14px } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .schritt-0 .text * { color: #ffffff } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .link { display: none; } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .titel { padding: 0; margin: 0 0 28px 0 } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .titel * { color: #ffffff } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .titel h2 { font-size: 25px; font-family: "Century Gothic W01", sans-serif; margin: 0; padding: 0 } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .frage * { color: #ffffff; line-height: 20px; font-size: 14px } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .frage { margin-bottom: 18px; width: 330px; line-height: 20px } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .antwort { float: left; clear: both; width: 230px; height: 16px; margin-bottom: 8px; position: relative } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .antwort div { width: 15px; height: 16px; display: block; cursor: pointer; position: absolute; left: 0; top: 0; background-size: 100% auto !important; } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .antwort div.text { width: 100%; left: 25px; line-height: 16px; font-size: 14px } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .checkbox { display: none; } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .inaktiv { width: 166px; height: 29px; display: block; position: absolute; bottom: 0; left: 0; cursor: normal; background: url(../pics/layout/kampagne/button.inaktiv.png) no-repeat 0 0; } .kampagne-sdj-2016 .page .viewport .cp-gewinnspiel .abschicken { position: absolute; bottom: 0; left: 0 } @-webkit-keyframes down { 0% { top: 22px; opacity: 1; } 100% { top: 33px; opacity: 0; } } @keyframes down { 0% { top: 22px; opacity: 1; } 100% { top: 33px; opacity: 0; } } .kampagne-sdj-2016 .page .scrolldown { position: fixed; right: 60px; bottom: 80px; text-align: center; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; z-index: 25; } .kampagne-sdj-2016 .page .scrolldown span { font-family: "Century Gothic W01 Bold", sans-serif; font-size: 18px; display: block; width: 100%; } .kampagne-sdj-2016 .page .scrolldown i { position: absolute; left: 50%; margin-left: -9px; font-size: 28px; -webkit-animation: down 1.5s linear infinite; -moz-animation: down 1.5s linear infinite; animation: down 1.5s linear infinite; } .kampagne-sdj-2016 .page .scrolldown.invisible { opacity: 0; } .kampagne-sdj-2016-gewinnspiel { background: url(../pics/layout/kampagne/sdj14.bg.png) } .kampagne-sdj-2016-gewinnspiel .page { width: 1270px; height: 1390px; padding: 0 } .kampagne-sdj-2016-gewinnspiel .page .titel { padding: 0; color: #323232; font-size: 17px; font-family: "Century Gothic W01", sans-serif } .kampagne-sdj-2016-gewinnspiel .page .absatz-text { width: 325px; line-height: 19px } .kampagne-sdj-2016-gewinnspiel .formular { width: 423px; height: 560px; padding: 10px 42px 0 55px; background: #ffffff } .kampagne-sdj-2016-gewinnspiel .formular * { color: #323232; line-height: 19px } .kampagne-sdj-2016-gewinnspiel .formular a { text-decoration: underline } .kampagne-sdj-2016-gewinnspiel .formular a:hover { text-decoration: none } .kampagne-sdj-2016-gewinnspiel .formular a.button-29 { margin: 12px 0 0 0; float: left } .kampagne-sdj-2016-gewinnspiel .formular .form-button { width: 1px; height: 1px; position: absolute; left: -10000px; } .kampagne-sdj-2016-gewinnspiel .formular a.button-29:hover .button-left { background-position: left top} .kampagne-sdj-2016-gewinnspiel .formular a.button-29:hover .button-right { background-position: right top; } .kampagne-sdj-2016-gewinnspiel .formular a.button-29:hover .button-text { background-position: center top; } .kampagne-sdj-2016-gewinnspiel .formular a.button-29:hover .button-text span { background: url(../pics/layout/link.text.normal.png) no-repeat right 11px; color: #ffffff; } .kampagne-sdj-2016-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_vorname { float: left; width: 205px; margin: 7px 0 0 0 } .kampagne-sdj-2016-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_name { float: left; width: 205px; margin: 7px 0 0 12px } .kampagne-sdj-2016-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_email { float: left; width: 422px; margin: 7px 0 0 0 } .kampagne-sdj-2016-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_strasse { float: left; width: 205px; margin: 7px 0 0 0 } .kampagne-sdj-2016-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_hausnummer { float: left; width: 205px; margin: 7px 0 0 12px } .kampagne-sdj-2016-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_plz { float: left; width: 205px; margin: 7px 0 0 0 } .kampagne-sdj-2016-gewinnspiel .formular .zeile_formularsdj_fuenfzehn_gewinnspiel_stadt { float: left; width: 205px; margin: 7px 0 0 12px } .kampagne-sdj-2016-gewinnspiel .formular .form-text { width: 100%; border: 1px solid #abadb3; height: 19px } .kampagne-sdj-2016-gewinnspiel .formular .form-text.fehler { border: 1px solid #DD1930; background-color: #fbe6e8 } .kampagne-sdj-2016-gewinnspiel .formular .checkbox-zeile { float: left; margin: 12px 0 0 0 } .kampagne-sdj-2016-gewinnspiel .formular .checkbox-information { float: left; margin: 0 0 0 30px; } .kampagne-sdj-2016-gewinnspiel .formular .checkbox-information.fehler { color: #DD1930 } .kampagne-sdj-2016-gewinnspiel .formular .checkbox-information.fehler a { color: #DD1930 } .kampagne-sdj-2016-gewinnspiel .formular .form-checkbox { float: left; margin-top: 3px; padding-bottom: 200px; margin-bottom: -200px } /* Kaffee des Jahres 2016 */ .kaffee-des-jahres-2016 { margin-top: 70px; background: url(../pics/layout/kaffee_des_jahres/background.jpg) 0 0 no-repeat, url(../pics/layout/kaffee_des_jahres/background_fill.png) 0 0 repeat-y; background-size: cover, auto; background-attachment: fixed, scroll; } .kaffee-des-jahres-2016 .page { width: 1280px; height: 2656px; padding-top: 0; background: url(../pics/layout/kaffee_des_jahres/content.png) 29px 0 repeat-y; position: relative; } .kaffee-des-jahres-2016 .page .kdj-element { position: absolute; z-index: 1; } .kaffee-des-jahres-2016 .page .kdj-element-cta { z-index: 2; } .kaffee-des-jahres-2016 .page .leaves { top: 0; left: 730px; width: 333px; height: 159px; } .kaffee-des-jahres-2016 .page .new { top: 160px; left: 980px; width: 170px; height: 170px; } .kaffee-des-jahres-2016 .page .packshot { top: 45px; left: 350px; width: 618px; height: 812px; } .kaffee-des-jahres-2016 .page .headline { top: 252px; left: 138px; width: 300px; height: 327px; } .kaffee-des-jahres-2016 .page .intro { top: 415px; left: 870px; width: 301px; height: 344px; } .kaffee-des-jahres-2016 .page .text { top: 865px; left: 52px; width: 434px; height: 217px; } .kaffee-des-jahres-2016 .page .origin { top: 765px; left: 681px; width: 572px; height: 506px; } .kaffee-des-jahres-2016 .page .video { top: 1060px; left: 165px; width: 643px; height: 388px; } .kaffee-des-jahres-2016 .page .filter { top: 1335px; left: 610px; width: 504px; height: 277px; } .kaffee-des-jahres-2016 .page .chocolate { top: 1540px; left: 200px; width: 480px; height: 420px; } .kaffee-des-jahres-2016 .page .wheel { top: 2005px; left: 165px; width: 297px; height: 265px; z-index: 4; } .kaffee-des-jahres-2016 .page .table { bottom: 0; left: 0; width: 1280px; height: 910px; } .kaffee-des-jahres-2016 .coffeesmile { position: absolute; left: 0; bottom: 34px; z-index: 3; } .kaffee-des-jahres-2016 .page .scrolldown { position: fixed; right: 60px; bottom: 80px; text-align: center; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; z-index: 25; } .kaffee-des-jahres-2016 .page .scrolldown span { font-family: "Century Gothic W01 Bold", sans-serif; font-size: 18px; display: block; width: 100%; } .kaffee-des-jahres-2016 .page .scrolldown i { position: absolute; left: 50%; margin-left: -9px; font-size: 28px; -webkit-animation: down 1.5s linear infinite; -moz-animation: down 1.5s linear infinite; animation: down 1.5s linear infinite; } .kaffee-des-jahres-2016 .page .scrolldown.invisible { opacity: 0; } /* Kaffee des Jahres 2016 */ .kaffee-des-jahres-2017 { margin-top: 70px; background: url(../pics/layout/kaffee_des_jahres/background2017.png) 0 0 no-repeat, url(../pics/layout/kaffee_des_jahres/background_fill_2017.png) 0 0 repeat-y; background-size: cover, auto; background-attachment: fixed, scroll; } .kaffee-des-jahres-2017 .page { width: 1280px; height: 2982px; padding-top: 0; background: url(../pics/layout/kaffee_des_jahres/content.png) 29px 0 repeat-y; position: relative; } .kaffee-des-jahres-2017 .page .kdj-element { position: absolute; z-index: 1; } .kaffee-des-jahres-2017 .page .kdj-element-cta { z-index: 2; } .kaffee-des-jahres-2017 .page .leaves { top: 0; left: 730px; width: 333px; height: 159px; z-index: 2; } .kaffee-des-jahres-2017 .page .leaves-left { top: 0; left: 100px; } .kaffee-des-jahres-2017 .page .packshot { left: 100px; top: 45px; } .kaffee-des-jahres-2017 .page .augenblicke { left: -50px; top: 700px; } .kaffee-des-jahres-2017 .page .tarte { top: 1375px; left: 20px; } .kaffee-des-jahres-2017 .page .wheel { left: 815px; top: 2085px; z-index: 5; } .kaffee-des-jahres-2017 .page .table { left: 0; top: 2155px; z-index: 4; } .kaffee-des-jahres-2017 .coffeesmile { position: absolute; left: 0; bottom: 34px; z-index: 3; } .kaffee-des-jahres-2017 area { cursor: pointer; } .kaffee-des-jahres-2017 .scrollup { position: fixed; display: block; width: 84px; height: 62px; bottom: 80px; right: 0; background: url(../pics/layout/kampagne/sdj17.top.png) 0 0 no-repeat; cursor: pointer; z-index: 100; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; } .kaffee-des-jahres-2017 .scrollup.invisible { opacity: 0; display: none} .kaffee-des-jahres-2017 .page .scrolldown { position: fixed; right: 60px; bottom: 80px; text-align: center; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; z-index: 25; } .kaffee-des-jahres-2017 .page .scrolldown span { font-family: "Century Gothic W01 Bold", sans-serif; font-size: 18px; display: block; width: 100%; } .kaffee-des-jahres-2017 .page .scrolldown i { position: absolute; left: 50%; margin-left: -9px; font-size: 28px; -webkit-animation: down 1.5s linear infinite; -moz-animation: down 1.5s linear infinite; animation: down 1.5s linear infinite; } .kaffee-des-jahres-2017 .page .scrolldown.invisible { opacity: 0; } .kaffee-des-jahres-2017 .scrollup { position: fixed; display: block; width: 84px; height: 62px; bottom: 80px; right: 0; background: url(../pics/layout/kampagne/sdj17.top.png) 0 0 no-repeat; cursor: pointer; z-index: 100; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; } .kaffee-des-jahres-2017 .scrollup.invisible { opacity: 0; display: none} .dialog-kdj-text .modal-content { height: 420px; } .dialog-kdj-text .modal-content .modal-iframe { height: 420px; } .dialog-kdj-text-kurz .modal-content { height: 225px; } .dialog-kdj-text-kurz .modal-content .modal-iframe { height: 225px; } .dialog-kdj-video .modal-content { height: 420px; } .dialog-kdj-video .modal-content .modal-iframe { height: 420px; } .dialog-kdj-long .modal-content { height: 800px; } .dialog-kdj-long .modal-content .modal-iframe { height: 800px; } .dialog-kdj-scroll .modal-content { height: 600px; } .dialog-kdj a.modal-close { right: 65px; } .kdj-dialog-content .titel { border-bottom: 0; padding-bottom: 25px; } .kdj-dialog-content .titel h1 { font-family: "Century Gothic W01 Bold", sans-serif; font-size: 24px; padding-left: 55px; } .kdj-dialog-content sup { vertical-align: super; } .kdj-dialog-content .absatz .text * { font-size: 14px; line-height: 20px; } .kdj-dialog-content .absatz .bild-unterschrift { text-align: left; opacity: 0.5; margin-bottom: 20px; } .kdj-dialog-content .absatz .bild-rechts img { width: 75%; height: auto; } .kdj-dialog-content .absatz table td { color: #000000; } /* Punktroestung */ body.punktroestung-teaser-mobile { background: url("../pics/campaign_punktroestung/Melitta_Mobile_Hintergrund.jpg") !important; background-size: cover !important; background-repeat: no-repeat !important; } body.punktroestung-teaser-mobile::before { background: none; } body.punktroestung-teaser-desktop { background-image: url("../pics/campaign_punktroestung/Melitta_Desktop_Hintergrund.png"); background-size: cover; background-repeat: no-repeat; } .punktroestung-teaser-desktop .texte img { max-width: 100%; height: auto !important; } .punktroestung-teaser-desktop .texte { width: 900px; height: 680px; } .punktroestung-teaser-mobile .texte { margin: 0 auto; position: fixed; width: 100%; } .punktroestung-teaser-mobile .texte img { max-width: 100%; height: auto !important; margin: 0 auto; } /* Kampagne Selection des Jahres 2018 */ .kampagne-sdj-2018 { background: #000000 url(../pics/layout/kampagne/sdj18.bg.jpg) center top no-repeat; margin-top: 23px !important; } .kampagne-sdj-2018 .page { width: 1246px; height: 2900px; padding: 0; background: #ffffff url(../pics/layout/kampagne/sdj18.page.jpg) center top no-repeat; } .kampagne-sdj-2018 .coffeesmile-front { bottom: 0; } .kampagne-sdj-2018 .footer { position: relative; z-index: 1; } .kampagne-sdj-2018 .page .scrolldown { position: absolute; width: 50px; top: 500px; left: 50%; margin-left: -25px; text-align: center; text-shadow: rgba(0, 0, 0, 0.75) 1px 1px 1px; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; z-index: 25; cursor: default; } .kampagne-sdj-2018 .page .scrolldown i { position: absolute; left: 50%; margin-left: -18px; font-size: 60px; -webkit-animation: down 1.5s linear infinite; -moz-animation: down 1.5s linear infinite; animation: down 1.5s linear infinite; cursor: default; } .kampagne-sdj-2018 .scrollup { position: fixed; display: block; width: 84px; height: 62px; bottom: 80px; right: 0; background: url(../pics/layout/kampagne/sdj17.top.png) 0 0 no-repeat; cursor: pointer; } .kampagne-sdj-2018 .page .viewport > div.titel { position: relative; z-index: 20; padding: 140px 0 0; line-height: 50px; } .kampagne-sdj-2018 .page .viewport > div.titel * { color: #ffffff } .kampagne-sdj-2018 .page .viewport > div.titel h1 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; font-size: 46px; font-family: "Century Gothic W01 Bold", sans-serif } .kampagne-sdj-2018 .page .viewport > div.titel-extra { position: relative; z-index: 20; padding: 0 0 15px } .kampagne-sdj-2018 .page .viewport > div.titel-extra * { color: #ffffff } .kampagne-sdj-2018 .page .viewport > div.titel-extra h2 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; font-size: 46px; font-family: "Century Gothic W01 Bold", sans-serif } .kampagne-sdj-2018 .page .viewport > h2 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; color: #ffffff; position: relative; z-index: 20; font-size: 26px; font-family: "Century Gothic W01", sans-serif } .kampagne-sdj-2018 .page .viewport .absatz-text { color: #ffffff; font-size: 16px; line-height: 22px } .kampagne-sdj-2018 .page .viewport .absatz-text * { color: #ffffff; font-size: 16px; line-height: 22px } .kampagne-sdj-2018 .page .viewport .absatz-text .titel { font-family: "Century Gothic W01", sans-serif; font-size: 20px; padding: 38px 0 15px } .kampagne-sdj-2018 .page .viewport .absatz-text p strong { font-family: "Century Gothic W01 Bold", sans-serif; font-size: 20px; font-weight: normal; padding: 50px 0 15px; display: inline-block; } .kampagne-sdj-2018 .page .viewport .absatz-text ul { padding: 0; } .kampagne-sdj-2018 .page .viewport .absatz-text ul li { font-size: 14px; line-height: 16px; margin: 0 0 15px 0; padding: 0 0 0 26px; background: url(../pics/layout/kampagne/sdj17.bullet.png) 0 0 no-repeat; } .kampagne-sdj-2018 .page .viewport .absatz-text ul li * { line-height: 16px; } .kampagne-sdj-2018 .page .viewport > .headline { position: absolute; left: 130px; } .kampagne-sdj-2018 .page .viewport > .headline h2 { color: #ffffff; font-size: 36px; font-family: "Century Gothic W01 Bold", sans-serif; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; padding: 0; margin: 0 0 15px 0; line-height: 36px; } .kampagne-sdj-2018 .page .viewport > .headline h3 { color: #ffffff;font-size: 26px; font-family: "Century Gothic W01", sans-serif;text-shadow: rgba(0,0,0,0.75) 1px 1px 1px;padding: 0;margin: 0; } .kampagne-sdj-2018 .page .viewport > .headline-01 { top: 640px; } .kampagne-sdj-2018 .page .viewport > .headline-02 { top: 1600px; } .kampagne-sdj-2018 .page .viewport > .headline-dark h2 { color: #555555; text-shadow: none; } .kampagne-sdj-2018 .page .viewport > .headline-dark h3 { color: #555555;text-shadow: none; } .kampagne-sdj-2018 .page .viewport .button-29 .button-left { background-position: left bottom } .kampagne-sdj-2018 .page .viewport .button-29 .button-text { background-position: center bottom } .kampagne-sdj-2018 .page .viewport .button-29 .button-text span { color: #DD1930; background: url(../pics/layout/link.text.aktiv.png) no-repeat right 11px } .kampagne-sdj-2018 .page .viewport .button-29 .button-right { background-position: right bottom } .kampagne-sdj-2018 .page .viewport .button-29:hover .button-left { background-position: left top} .kampagne-sdj-2018 .page .viewport .button-29:hover .button-right { background-position: right top; } .kampagne-sdj-2018 .page .viewport .button-29:hover .button-text { background-position: center top; } .kampagne-sdj-2018 .page .viewport .button-29:hover .button-text span { background: url(../pics/layout/link.text.normal.png) no-repeat right 11px; color: #ffffff; } .kampagne-sdj-2018 .page .viewport .campaign-element:last-child .absatz-text p:first-child { font-family: "Century Gothic W01", sans-serif; font-size: 20px; margin-bottom: 15px; display: inline-block; line-height: 32px; } .kampagne-sdj-2018 .page .viewport .campaign-element:last-child .absatz-text p:last-child { font-size: 14px; line-height: 20px; } .modal-dialog-sdj .page-slider { height: 485px !important; } .modal-dialog-sdj .slider-page { height: 405px !important; overflow-y: scroll; } .modal-dialog-sdj .page { padding: 0; } .modal-dialog-sdj .bild-rechts { width: 100%; padding: 0 0 10px 0; } .modal-dialog-sdj .titel h1 { padding-right: 200px; } .modal-dialog-sdj .text { overflow: hidden; margin: 0 auto 40px; } .modal-dialog-sdj .text p { margin: 0 0 1em 0; } .modal-dialog-sdj .text ul li { color: #323232; margin: 0 0 0.5em 10px; } .modal-dialog-sdj .text ol { padding: 0 0 0 21px; } .modal-dialog-sdj .text ol li { color: #323232; margin: 0 0 0.5em; } /* Kampagne Selection des Jahres 2017 */ .kampagne-sdj-2017 { background: #000000 url(../pics/layout/kampagne/sdj17.bg.jpg) center top no-repeat; margin-top: 23px !important; } .kampagne-sdj-2017 .page { width: 1246px; height: 2217px; padding: 0; background: #ffffff url(../pics/layout/kampagne/sdj17.page.jpg) center top no-repeat; } .kampagne-sdj-2017 .coffeesmile-front { bottom: 34px; } .kampagne-sdj-2017 .page .scrolldown { position: absolute; width: 50px; top: 500px; left: 50%; margin-left: -25px; text-align: center; text-shadow: rgba(0, 0, 0, 0.75) 1px 1px 1px; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; z-index: 25; cursor: default; } .kampagne-sdj-2017 .page .scrolldown i { position: absolute; left: 50%; margin-left: -18px; font-size: 60px; -webkit-animation: down 1.5s linear infinite; -moz-animation: down 1.5s linear infinite; animation: down 1.5s linear infinite; cursor: default; } .kampagne-sdj-2017 .scrollup { position: fixed; display: block; width: 84px; height: 62px; bottom: 80px; right: 0; background: url(../pics/layout/kampagne/sdj17.top.png) 0 0 no-repeat; cursor: pointer; } .kampagne-sdj-2017 .page .viewport > div.titel { position: relative; z-index: 20; padding: 160px 0 0; line-height: 50px; } .kampagne-sdj-2017 .page .viewport > div.titel * { color: #ffffff } .kampagne-sdj-2017 .page .viewport > div.titel h1 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; font-size: 46px; font-family: "Century Gothic W01 Bold", sans-serif } .kampagne-sdj-2017 .page .viewport > div.titel-extra { position: relative; z-index: 20; padding: 0 0 15px } .kampagne-sdj-2017 .page .viewport > div.titel-extra * { color: #ffffff } .kampagne-sdj-2017 .page .viewport > div.titel-extra h2 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; font-size: 46px; font-family: "Century Gothic W01 Bold", sans-serif } .kampagne-sdj-2017 .page .viewport > h2 { margin-left: 130px; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; color: #ffffff; position: relative; z-index: 20; font-size: 26px; font-family: "Century Gothic W01", sans-serif } .kampagne-sdj-2017 .page .viewport .absatz-text { color: #ffffff; font-size: 16px; line-height: 22px } .kampagne-sdj-2017 .page .viewport .absatz-text * { color: #ffffff; font-size: 16px; line-height: 22px } .kampagne-sdj-2017 .page .viewport .absatz-text .titel { font-family: "Century Gothic W01", sans-serif; font-size: 20px; padding: 38px 0 15px } .kampagne-sdj-2017 .page .viewport .absatz-text p strong { font-family: "Century Gothic W01 Bold", sans-serif; font-size: 20px; font-weight: normal; padding: 50px 0 15px; display: inline-block; } .kampagne-sdj-2017 .page .viewport .absatz-text ul { padding: 0; } .kampagne-sdj-2017 .page .viewport .absatz-text ul li { font-size: 14px; line-height: 16px; margin: 0 0 15px 0; padding: 0 0 0 26px; background: url(../pics/layout/kampagne/sdj17.bullet.png) 0 0 no-repeat; } .kampagne-sdj-2017 .page .viewport .absatz-text ul li * { line-height: 16px; } .kampagne-sdj-2017 .page .viewport > .headline { position: absolute; left: 130px; } .kampagne-sdj-2017 .page .viewport > .headline h2 { color: #ffffff; font-size: 36px; font-family: "Century Gothic W01 Bold", sans-serif; text-shadow: rgba(0,0,0,0.75) 1px 1px 1px; padding: 0; margin: 0 0 15px 0; line-height: 36px; } .kampagne-sdj-2017 .page .viewport > .headline h3 { color: #ffffff;font-size: 26px; font-family: "Century Gothic W01", sans-serif;text-shadow: rgba(0,0,0,0.75) 1px 1px 1px;padding: 0;margin: 0; } .kampagne-sdj-2017 .page .viewport > .headline-01 { top: 640px; } .kampagne-sdj-2017 .page .viewport > .headline-02 { top: 1600px; } .kampagne-sdj-2017 .page .viewport > .headline-dark h2 { color: #555555; text-shadow: none; } .kampagne-sdj-2017 .page .viewport > .headline-dark h3 { color: #555555;text-shadow: none; } .kampagne-sdj-2017 .page .viewport .button-29 .button-left { background-position: left bottom } .kampagne-sdj-2017 .page .viewport .button-29 .button-text { background-position: center bottom } .kampagne-sdj-2017 .page .viewport .button-29 .button-text span { color: #DD1930; background: url(../pics/layout/link.text.aktiv.png) no-repeat right 11px } .kampagne-sdj-2017 .page .viewport .button-29 .button-right { background-position: right bottom } .kampagne-sdj-2017 .page .viewport .button-29:hover .button-left { background-position: left top} .kampagne-sdj-2017 .page .viewport .button-29:hover .button-right { background-position: right top; } .kampagne-sdj-2017 .page .viewport .button-29:hover .button-text { background-position: center top; } .kampagne-sdj-2017 .page .viewport .button-29:hover .button-text span { background: url(../pics/layout/link.text.normal.png) no-repeat right 11px; color: #ffffff; } .kampagne-sdj-2017 .page .viewport .campaign-element:last-child .absatz-text p:first-child { font-family: "Century Gothic W01", sans-serif; font-size: 20px; margin-bottom: 15px; display: inline-block; } .kampagne-sdj-2017 .page .viewport .campaign-element:last-child .absatz-text p:last-child { font-size: 14px; line-height: 20px; } .modul-sdj-2017 { width: 1248px; height: 825px; position: absolute; left: 0; top: 2180px; background: url(../pics/layout/kampagne/sdj17.karte.png) no-repeat center 0; } .modul-sdj-2017 .frage { position: absolute; width: 58px; height: 71px; background: no-repeat 0 0; } .modul-sdj-2017 .frage .pin { position: relative; width: 100%; height: 100%; z-index: 18; cursor: pointer; } .modul-sdj-2017 .frage .pin.aktiv { z-index: 20; } .modul-sdj-2017 .frage-aktiv { width: 88px; height: 119px; } .modul-sdj-2017 .frage-aktiv .pin { background-image: url(../pics/layout/kampagne/sdj17.pin.active.png); } .modul-sdj-2017 .frage-zukuenftig .pin { background-image: url(../pics/layout/kampagne/sdj17.pin.future.png); } .modul-sdj-2017 .frage-abgelaufen .pin { background-image: url(../pics/layout/kampagne/sdj17.pin.past.png); } .modul-sdj-2017 .frage-01 { top: 300px; left: 110px; } .modul-sdj-2017 .frage-02 { top: 255px; left: 185px; } .modul-sdj-2017 .frage-03 { top: 290px; left: 350px; } .modul-sdj-2017 .frage-04 { top: 310px; left: 425px; } .modul-sdj-2017 .frage-05 { top: 370px; left: 395px; } .modul-sdj-2017 .frage-06 { top: 485px; left: 470px; } .modul-sdj-2017 .frage-07 { top: 580px; left: 495px; } .modul-sdj-2017 .frage-08 { top: 635px; left: 645px; } .modul-sdj-2017 .frage-09 { top: 320px; left: 700px; } .modul-sdj-2017 .frage-01.frage-aktiv { top: 252px; left: 95px; } .modul-sdj-2017 .frage-02.frage-aktiv { top: 207px; left: 170px; } .modul-sdj-2017 .frage-03.frage-aktiv { top: 242px; left: 335px; } .modul-sdj-2017 .frage-04.frage-aktiv { top: 262px; left: 410px; } .modul-sdj-2017 .frage-05.frage-aktiv { top: 322px; left: 380px; } .modul-sdj-2017 .frage-06.frage-aktiv { top: 437px; left: 455px; } .modul-sdj-2017 .frage-07.frage-aktiv { top: 532px; left: 480px; } .modul-sdj-2017 .frage-08.frage-aktiv { top: 587px; left: 630px; } .modul-sdj-2017 .frage-09.frage-aktiv { top: 272px; left: 685px; } .modul-sdj-2017 .frage .layer { display: none; width: 228px; position: absolute; bottom: 45px; left: -85px; min-height: 100px; background: #9a0305; background: -webkit-radial-gradient(#d21e31, #9a0305); background: -ms-radial-gradient(#d21e31, #9a0305); background: -moz-radial-gradient(#d21e31, #9a0305); background: -o-radial-gradient(#d21e31, #9a0305); background: radial-gradient(#d21e31, #9a0305); z-index: 19; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; text-align: center; } .modul-sdj-2017 .frage .layer.aktiv { display: block; } .modul-sdj-2017 .frage .layer .close { position: absolute; right: 0; top: 0; width: 32px; height: 30px; background: url(../pics/layout/kampagne/sdj17.layer.close.png) no-repeat center center; cursor: pointer; } .modul-sdj-2017 .frage-aktiv .layer { width: 268px; bottom: 80px; left: -90px; } .modul-sdj-2017 .frage-zukuenftig .layer { box-sizing: border-box; padding: 30px 20px; font-size: 14px; } .modul-sdj-2017 .frage-abgelaufen .layer { width: 368px; box-sizing: border-box; padding: 30px 20px; left: -152px; font-size: 14px; } .modul-sdj-2017 .frage-zukuenftig .layer span { font-family: "Century Gothic W01 Bold", sans-serif; font-size: 18px; display: inline-block; margin-bottom: 5px; } .modul-sdj-2017 .frage-abgelaufen .layer span { font-family: "Century Gothic W01 Bold", sans-serif; font-size: 18px; display: inline-block; margin-bottom: 5px; } .modul-sdj-2017 .frage .layer .frage-zeitraum { float: left; width: 100%; box-sizing: border-box; padding: 20px 40px 0; text-align: center; color: #ffffff; } .modul-sdj-2017 .frage .layer .clock { float: left; width: 100%; height: 50px; padding: 10px 0; display: flex; justify-content: space-around; } .modul-sdj-2017 .frage .layer .clock .unit { width: 50px; } .modul-sdj-2017 .frage .layer .clock .unit .number { text-align: center; font-family: "Century Gothic W01 Bold", sans-serif; font-size: 26px; } .modul-sdj-2017 .frage .layer .clock .unit .text { text-align: center; color: #24110f; } .modul-sdj-2017 .frage .layer .frage-text { float: left; width: 100%; box-sizing: border-box; padding: 0 20px; text-align: center; font-size: 14px; line-height: 20px; } .modul-sdj-2017 .frage .layer .button { display: inline-block; box-sizing: border-box; line-height: 30px; height: 30px; padding: 0 25px 0 15px; margin: 25px 0 50px; color: #dd1930; background: #ffffff url(../pics/layout/kampagne/sdj17.arrow.png) no-repeat right center; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-transform: uppercase; cursor: pointer; } .modul-sdj-2017 .frage .layer .button:hover { color: #ffffff; background: #dd1930 url(../pics/layout/kampagne/sdj17.arrow.hover.png) no-repeat right center; } .kampagne-sdj-2017 .dialog a.close { width: 24px; height: 23px; display: block; position: absolute; right: 15px; top: 15px; color: #323232; background: url(../pics/layout/modal.close.png) no-repeat 0 0; cursor: pointer; overflow: hidden; text-indent: 100%; } .kampagne-sdj-2017 .dialog a.close:hover { background: url(../pics/layout/modal.close.png) no-repeat 0 -23px; } .dialog-ajax { background-color: #ffffff; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .dialog-ajax .dialog-frage { width: 930px; } .dialog-ajax .dialog-frage h2 { margin: 0; box-sizing: border-box; line-height: 49px; display: block; width: 100%; padding-left: 50px; font-family: "Century Gothic W01", sans-serif; font-size: 18px; color: #323232; border-bottom: 1px solid #e0dfdd; } .dialog-ajax .dialog-frage h3 { color: #323232; font-size: 30px; font-family: "Century Gothic W01 Bold", sans-serif; padding: 30px 50px; box-sizing: border-box; display: block; width: 100%; } .dialog-ajax .dialog-frage .zeile { width: 100%; overflow: hidden; padding: 0 50px 30px; box-sizing: border-box; } .dialog-ajax .dialog-frage .zeile .button { display: inline-block; box-sizing: border-box; line-height: 30px; height: 30px; padding: 0 25px 0 15px; margin: 0 0 10px; color: #ffffff; background: #dd1930 url(../pics/layout/kampagne/sdj17.arrow.hover.png) no-repeat right center; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-transform: uppercase; cursor: pointer; } .dialog-ajax .dialog-frage .zeile .button.inaktiv { opacity: 0.5; } .dialog-ajax .dialog-frage .zeile .antwort { margin-bottom: 15px; } .dialog-ajax .dialog-frage .zeile .antwort input { display: none; } .dialog-ajax .dialog-frage .zeile .antwort label { display: inline-block; cursor: pointer; position: relative; padding-left: 25px; color: #323232; font-size: 20px; font-family: "Century Gothic W01 Bold", sans-serif; line-height: 22px; user-select: none; } .dialog-ajax .dialog-frage .zeile .antwort label:before { content: ''; display: inline-block; width: 13px; height: 13px; position: absolute; left: 0; top: 7px; background: 0 0 no-repeat; } .dialog-ajax .dialog-frage .zeile .antwort input[type=checkbox] + label:before { background-image: url(../pics/layout/kampagne/sdj17.checkbox.png) } .dialog-ajax .dialog-frage .zeile .antwort input[type=radio] + label:before { background-image: url(../pics/layout/kampagne/sdj17.radio.png) } .dialog-ajax .dialog-frage .zeile .antwort input[type=checkbox]:checked + label:before { background-image: url(../pics/layout/kampagne/sdj17.checkbox.checked.png) } .dialog-ajax .dialog-frage .zeile .antwort input[type=radio]:checked + label:before { background-image: url(../pics/layout/kampagne/sdj17.radio.checked.png) } .dialog-ajax .dialog-frage .zeile .antwort.bild label { padding: 0 0 25px 0; } .dialog-ajax .dialog-frage .zeile .antwort.bild label:before { width: 100%; background-position: center 0; top: auto; bottom: 0; } .dialog-ajax .dialog-frage .zeile .antwort.bild { float: left; margin-right: 50px; min-height: 155px; } .dialog-ajax .dialog-frage .zeile .antwort.bild img { float: left; } .kampagne-sdj-2017.neues-gewinnspiel .page { height: 3255px; background-image: url(../pics/layout/kampagne/sdj17.page.neu.jpg); } .kampagne-sdj-2017.neues-gewinnspiel .modul-formulargenerator { position: absolute; top: 1860px; left: 80px; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular { height: 660px; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular h2 { margin: 0; box-sizing: border-box; line-height: 49px; display: block; width: 100%; padding-left: 50px; font-family: "Century Gothic W01", sans-serif; font-size: 18px; color: #323232; border-bottom: 1px solid #e0dfdd; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular h3 { color: #323232; font-size: 30px; font-family: "Century Gothic W01 Bold", sans-serif; padding: 30px 0 20px; box-sizing: border-box; display: block; width: 100%; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular * { color: #323232; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular form { box-sizing: border-box; width: 530px; padding: 0 50px; overflow: hidden; float: left; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular a { text-decoration: underline } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular a:hover { text-decoration: none } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .form-button { width: 1px; height: 1px; position: absolute; left: -10000px; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .button { display: inline-block; box-sizing: border-box; line-height: 30px; height: 30px; padding: 0 25px 0 15px; margin: 20px 0 10px; color: #ffffff; background: #dd1930 url(../pics/layout/kampagne/sdj17.arrow.hover.png) no-repeat right center; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-transform: uppercase; cursor: pointer; text-decoration: none; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .zeile { float: left; width: 100%; margin: 0 0 7px 0; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .zeile .form-eingabe-zeile { width: 50%; float: left; box-sizing: border-box; padding-right: 10px; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .zeile .zeile_formularsdj_siebzehn_gewinnspiel_email { width: 100%; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .zeile .form-eingabe-zeile label { margin: 3px 0 0 0; display: inline-block; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .pflicht { width: 100%; float: left; margin: 10px 0; color: #323232; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .form-text { width: 100%; background-color: #ffffff; height: 21px; line-height: 21px; box-sizing: border-box; padding: 0 5px; border: 0; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .form-text.fehler { background-color: #fbe6e8 } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .checkbox-zeile { float: left; margin: 12px 0 0 0 } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .checkbox-information { float: left; margin: 0 0 0 30px; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .checkbox-information.fehler { color: #DD1930 } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .checkbox-information.fehler a { color: #DD1930 } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .form-checkbox { float: left; margin-top: 3px; padding-bottom: 200px; margin-bottom: -200px } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .checkbox-zeile input { display: none; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .checkbox-zeile label { display: inline-block; position: relative; padding-left: 25px; color: #323232; margin: 0; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .checkbox-zeile label:before { content: ''; display: inline-block; cursor: pointer; width: 13px; height: 13px; position: absolute; left: 0; top: 2px; background: 0 0 no-repeat; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .checkbox-zeile input[type=checkbox] + label:before { background-image: url(../pics/layout/kampagne/sdj17.checkbox.png) } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .checkbox-zeile input[type=checkbox]:checked + label:before { background-image: url(../pics/layout/kampagne/sdj17.checkbox.checked.png) } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .zeile .radio-zeile { width: 100%; margin-bottom: 10px; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .zeile .radio-zeile .radio { float: left; margin-right: 20px; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .radio-zeile input { display: none; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .radio-zeile label { display: inline-block; position: relative; padding-left: 25px; color: #323232; margin: 0; line-height: 16px; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .radio-zeile label:before { content: ''; display: inline-block; cursor: pointer; width: 13px; height: 13px; position: absolute; left: 0; top: 2px; background: 0 0 no-repeat; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .radio-zeile input[type=radio] + label:before { background-image: url(../pics/layout/kampagne/sdj17.radio.png) } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular .radio-zeile input[type=radio]:checked + label:before { background-image: url(../pics/layout/kampagne/sdj17.radio.checked.png) } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular.formular-erfolg { height: 550px; width: 600px; } .kampagne-sdj-2017.neues-gewinnspiel .sdj2017-gewinnspiel-formular.formular-erfolg h3 { line-height: 550px; text-align: center; } .kampagne-sdj-2017.gewinner { background-image: url(../pics/layout/kampagne/sdj17.bg.gewinner.jpg); } .kampagne-sdj-2017.gewinner .page { height: 7200px; background-image: url(../pics/layout/kampagne/sdj17.page.gewinner.jpg); } .kampagne-sdj-2017.gewinner .gewinner-1 { margin: 0; padding: 0; list-style-type: none; position: absolute; top: 1930px; left: 100px; line-height: 18px; } .kampagne-sdj-2017.gewinner .gewinner-1 li { color: #323232; margin: 0; padding: 0; } .kampagne-sdj-2017.gewinner .gewinner-2 { margin: 0; padding: 0; list-style-type: none; position: absolute; top: 1930px; left: 380px; line-height: 18px; } .kampagne-sdj-2017.gewinner .gewinner-2 li { color: #323232; margin: 0; padding: 0; } .kampagne-sdj-2017.gewinner .gewinner-3 { margin: 0; padding: 0; list-style-type: none; position: absolute; top: 1930px; left: 660px; line-height: 18px; } .kampagne-sdj-2017.gewinner .gewinner-3 li { color: #323232; margin: 0; padding: 0; } .kampagne-sdj-2017.gewinner .gewinner-4 { margin: 0; padding: 0; list-style-type: none; position: absolute; top: 1930px; left: 940px; line-height: 18px; } .kampagne-sdj-2017.gewinner .gewinner-4 li { color: #323232; margin: 0; padding: 0; } /* Hochzeitsreise Reloaded */ .hochzeitsreise-reloaded-formular { margin: 70px 0 40px 0; background: url(../pics/layout/kampagne/schiefer.jpg) repeat-y; padding: 20px; } .hochzeitsreise-reloaded-formular h2 { margin-bottom: 15px; } .hochzeitsreise-reloaded-formular h2 + p { margin-bottom: 30px; } .hochzeitsreise-reloaded-formular .btn { color: #ffffff; } .hochzeitsreise-reloaded-formular .btn { background-color: #DD1930; } .hochzeitsreise-reloaded-formular .btn:hover { color: #DD1930; background-color: #ffffff; border-color: #DD1930; } .hochzeitsreise-reloaded-formular .btn:hover { } .hochzeitsreise-reloaded-formular .checkbox a { text-decoration: underline; } .hochzeitsreise-reloaded-formular .checkbox a:hover { color: #DD1930; } .hochzeitsreise-reloaded-formular .custom_radio { margin-bottom: 10px } .hochzeitsreise-reloaded-formular .custom_radio .help-block { display: inline-block; float: right; margin-right: 15px } .hochzeitsreise-reloaded-formular .custom_radio input[type=radio] { display: none } .hochzeitsreise-reloaded-formular .custom_radio span { position: relative; margin: 0 5px 0 20px; font-size: 16px; } .hochzeitsreise-reloaded-formular .custom_radio span:before { width: 13px; height: 13px; margin-left: -20px; position: absolute; border: 1px solid #ffffff; border-radius: 50%; left: 0; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); content: ' ' } .hochzeitsreise-reloaded-formular .custom_radio span.active:before { background: #DD1930; border: 1px solid #ffffff; } .hochzeitsreise-reloaded-formular input[type=radio][checked] + span:before { background: #DD1930; border-width: 1px; } .hochzeitsreise-reloaded-formular .custom_radio span:hover { cursor: pointer } .hochzeitsreise-reloaded-formular .fehler { border: 2px solid red !important; } .hochzeitsreise-reloaded-formular .help-block { color: #ffffff; text-align: right; clear: both; display: block} .hochzeitsreise-reloaded-formular .upload { margin: 40px 0 0 0; } .hochzeitsreise-reloaded-formular .upload img { max-width: 300px; width: 100%; height: auto !important; margin-bottom: 30px; border: solid 5px white; } .hochzeitsreise-reloaded-formular .form-group label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: normal; font-size: 16px; } .hochzeitsreise-reloaded-formular .featherlight-content .featherlight-only { display: block; } .hochzeitsreise-reloaded-formular .featherlight-only { display: none; } .hochzeitsreise-reloaded-formular.erfolg { display: table; height: 320px; width: 100%; } .hochzeitsreise-reloaded-formular.erfolg h2 { display: table-cell; vertical-align: middle; text-align: center; width: 100%; } .featherlight-content a.featherlight-close { position: relative !important; font-weight: inherit !important; font-size: 16px !important; text-decoration: underline !important; padding: 40px 0 10px !important; display: block !important; width: 100% !important; } .ui-datepicker-calendar * { color: black } .ui-datepicker-title select { color: black !important; } .ui-datepicker-title select option { color: black !important; } /* 2017 - Mein Erlebnistag */ .aktion-mein-erlebnistag .single-column { width: 100%; } .aktion-mein-erlebnistag .absatz-promo { overflow: hidden; } .aktion-mein-erlebnistag .absatz h2 { font-size: 19px; } .aktion-mein-erlebnistag .absatz-promo h2 { display: inline-block; float: right; margin: 0 20px; } .aktion-mein-erlebnistag .content-wrapper img { max-width: 100%; height: auto !important; } .aktion-mein-erlebnistag .content-wrapper .btn { display: inline-block; padding: 6px 12px; margin-bottom: 10px; font-size: 14px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid white; border-radius: 2px; color: #fff; background-color: #dd1930; } .aktion-mein-erlebnistag .content-wrapper .btn:hover { color: #DD1930; background-color: #ffffff; border-color: #DD1930; } .aktion-mein-erlebnistag .footernavigation { display: none; } .aktion-mein-erlebnistag .navigation { display: none; } .aktion-mein-erlebnistag .d4c-navigation { visibility: hidden; } .aktion-mein-erlebnistag .page { padding: 68px 0 0 0; width: 100%; } .aktion-mein-erlebnistag .page * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .aktion-mein-erlebnistag .bg-info-header { width: inherit; } .aktion-mein-erlebnistag .column1 { width: 100%; margin: 0; padding: 0 15px; } .aktion-mein-erlebnistag .column2 { width: 100%; margin: 0; padding: 0 15px; } .aktion-mein-erlebnistag .single-column { width: 100%; margin: 0; padding: 0 15px; } .aktion-mein-erlebnistag .bg-promo-footer { width: 100%; } .aktion-mein-erlebnistag .bild-mobile { display: inline; } .aktion-mein-erlebnistag .bild-desktop { display: none; } .aktion-mein-erlebnistag .titel h1 { line-height: 32px; } .aktion-mein-erlebnistag .mobile { display: block; } .aktion-mein-erlebnistag .desktop { display: none; } .aktion-mein-erlebnistag .bg-info-header { display: none; } .aktion-mein-erlebnistag .bg-promo-footer { display: none; } .aktion-mein-erlebnistag .absatz-promo { padding: 10px 10px 20px 30px; } @media only screen and (min-width: 768px) { .aktion-mein-erlebnistag .absatz-promo { padding: 10px 10px 10px 30px; } .aktion-mein-erlebnistag .bg-info-header { display: block; } .aktion-mein-erlebnistag .bg-promo-footer { display: block; } .aktion-mein-erlebnistag .footernavigation { display: inline-block; } .aktion-mein-erlebnistag .navigation { display: inline-block; } .aktion-mein-erlebnistag .d4c-navigation { visibility: visible; } .aktion-mein-erlebnistag .page { padding: 18px 0 0 0; width: 960px; } .aktion-mein-erlebnistag .page * { box-sizing: inherit; -moz-box-sizing: inherit; -webkit-box-sizing: inherit; } .aktion-mein-erlebnistag .bg-info-header { width: inherit; } .aktion-mein-erlebnistag .column1 { width: 450px; margin: 0 0 0 30px; float: left; padding: 0; } .aktion-mein-erlebnistag .column2 { margin: 0 10px 0 490px; width: 450px; padding: 0; } .aktion-mein-erlebnistag .single-column { margin: 0 0 0 30px; } .aktion-mein-erlebnistag .bg-promo-footer { width: 960px; } .aktion-mein-erlebnistag .bild-mobile { display: none; } .aktion-mein-erlebnistag .bild-desktop { display: inline; } .aktion-mein-erlebnistag .link-filtertueten { position: relative; bottom: 35px; left: 100px; } .aktion-mein-erlebnistag .mobile { display: none; } .aktion-mein-erlebnistag .desktop { display: block; } } /* 2017 - Code 24 */ .code-24 form input[type=text] { color: black; width: 100%; height: 30px; margin: 10px 0 10px; padding: 4px 10px; line-height: 16px; font-size: 14px; max-width: 400px; } .code-24 form .code input[type=text] { color: black; width: 100%; height: 30px; margin: 30px 0 10px; padding: 4px 10px; line-height: 16px; font-size: 14px; max-width: 300px; } .code-24 form .radio { display: inline-block; margin: 0 20px 0 0; } .code-24 form .form-label-radio { display: inline-block } .code-24 form .form-radio { display: inline-block } .code-24 form .form-checkbox { display: inline-block; float: left; } .code-24 form .checkbox-information { margin-left: 20px; } .code-24 form .checkbox-zeile { margin: 0 0 20px; } .code-24 form .fehler input { border: 2px solid #DD1930; } .code-24 form .checkbox-zeile .fehler { border: 2px solid #DD1930; } .code-24 form .checkbox-zeile { max-width: 424px; width: 100%; } .code-24 form .checkbox-zeile a { text-decoration: underline } .code-24 .single-column { width: 100%; } .code-24 .absatz-promo { overflow: hidden; } .code-24 .absatz h2 { font-size: 19px; } .code-24 .absatz-promo h2 { display: inline-block; float: right; margin: 0 20px; } .code-24 .content-wrapper img { max-width: 100%; height: auto !important; } .code-24 .content-wrapper .btn { display: inline-block; padding: 6px 12px; margin-bottom: 10px; font-size: 14px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid white; border-radius: 2px; color: #fff; background-color: #dd1930; } .code-24 .content-wrapper .btn:hover { color: #DD1930; background-color: #ffffff; border-color: #DD1930; } .code-24 .footernavigation { display: none; } .code-24 .navigation { display: none; } .code-24 .d4c-navigation { visibility: hidden; } .code-24 .page { padding: 68px 0 0 0; width: 100%; } .code-24 .page * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .code-24 .bg-info-header { width: inherit; } .code-24 .column1 { width: 100%; margin: 0; padding: 0 15px; } .code-24 .column2 { width: 100%; margin: 0; padding: 0 15px; } .code-24 .single-column { width: 100%; margin: 0; padding: 30px 15px 0; } .code-24 .bg-promo-footer { width: 100%; } .code-24 .bild-mobile { display: inline; } .code-24 .bild-desktop { display: none; } .code-24 .titel h1 { line-height: 32px; } .code-24 .mobile { display: block; } .code-24 .desktop { display: none; } .code-24 .bg-info-header { display: none; } .code-24 .bg-promo-footer { display: none; } .code-24 .absatz-promo { padding: 10px 10px 20px 30px; } .code-24 .absatz li { line-height: 17px; position: relative; margin: 0 0 10px 15px; } .code-24 .absatz li:before { background: red; border: 2px solid white; border-radius: 100%; width: 15px; height: 15px; display: inline-block; text-align: center; vertical-align: middle; margin-right: 4px; position: absolute; left: -25px; } .code-24 .absatz li:nth-child(1)::before { content: "1" } .code-24 .absatz li:nth-child(2)::before { content: "2" } .code-24 .absatz li:nth-child(3)::before { content: "3" } .code-24 .absatz li:nth-child(4)::before { content: ">" } .code-24 .single-column .wrapper .absatz { display: inline-block; margin: 0 0 30px; max-width: 200px; text-align: center; } .code-24 .wrapper .absatz { text-align: center; display: inline-block; } .code-24 .wrapper.float .absatz { text-align: center; margin-right: 30px; margin-bottom: 20px; display: inline-block; } .code-24 .wrapper.float .absatz p { display: inline-block; max-width: 100px; } .code-24 .single-column .wrapper { text-align: center; vertical-align: top; } .code-24 .bild.packshot { text-align: center; } .code-24 .link-filtertueten { text-align: center; } .code-24 .link-filtertueten a { padding-left: 70px; } @media only screen and (min-width: 768px) { .code-24 .single-column .wrapper .absatz { height: 200px; } .code-24 .gewinne { padding-top: 110px !important; } .code-24 .wrapper.float .absatz { float: left; } .code-24 .absatz-promo { padding: 10px 10px 10px 30px; } .code-24 .bg-info-header { display: block; } .code-24 .bg-promo-footer { display: block; } .code-24 .footernavigation { display: inline-block; } .code-24 .navigation { display: inline-block; } .code-24 .d4c-navigation { visibility: visible; } .code-24 .page { padding: 18px 0 0 0; width: 960px; } .code-24 .page * { box-sizing: inherit; -moz-box-sizing: inherit; -webkit-box-sizing: inherit; } .code-24 .bg-info-header { width: inherit; } .code-24 .column1 { width: 450px; margin: 0 0 0 30px; float: left; padding: 0; } .code-24 .column2 { margin: 0 10px 0 490px; width: 450px; padding: 0; } .code-24 .single-column { padding: 0; margin: 0 0 0 30px; } .code-24 .single-column .wrapper { display: inline-block; } .code-24 .single-column .wrapper .absatz { display: inline-block; margin: 10px 110px 20px 0; } .code-24 .bg-promo-footer { width: 960px; } .code-24 .bild-mobile { display: none; } .code-24 .bild-desktop { display: inline; } .code-24 .link-filtertueten { position: relative; bottom: 0; left: 190px; } .code-24 .mobile { display: none; } .code-24 .desktop { display: block; } .code-24 .link-filtertueten { text-align: left; } .code-24 .link-filtertueten a { padding-left: 0; } } .code-24 .mb-30 { margin-bottom: 30px; } .code-24 .mb-10 { margin-bottom: 10px; } /* Aktionstemplate dynamisch */ .aktion .single-column { width: 100%; } .aktion .absatz-promo { overflow: hidden; } .aktion .absatz h2 { font-size: 19px; } .aktion .absatz-promo h2 { display: inline-block; float: right; margin: 0 20px; } .aktion .content-wrapper img { max-width: 100%; height: auto !important; } .aktion .footernavigation { display: none; } .aktion .navigation { display: none; } .aktion .d4c-navigation { visibility: hidden; } .aktion .page { padding: 68px 0 0 0; width: 100%; } .aktion .page * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .aktion .bg-info-header { width: inherit; } .aktion .column1 { width: 100%; margin: 0; padding: 0 15px; } .aktion .column1 a { display: inline-block; padding: 6px 12px; margin-bottom: 10px; font-size: 14px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid white; border-radius: 2px; color: #fff; background-color: #dd1930; } .aktion .column1 a:hover { color: #DD1930; background-color: #ffffff; border-color: #DD1930; } .aktion .column2 { width: 100%; margin: 0; padding: 0 15px; } .aktion .column2 .link { font-size: 16px; margin: 0 0 40px 0; text-align: center; } .aktion .column2 .link a:link, .aktion .column2 .link a:visited { color: #FFF; font-size: 13px; padding: 1px 30px 1px 0; margin: 0 0 10px 0; background: url(../pics/layout/textlink-pfeil.png) no-repeat; background-position: top right;} .aktion .column2 .link a:hover { background-position: 100% -18px;} .aktion .single-column { width: 100%; margin: 0; padding: 0 15px; box-sizing: border-box; } .aktion .bg-promo-footer { width: 100%; } .aktion .bild-mobile { display: inline; } .aktion .bild-desktop { display: none; } .aktion .only-desktop { display: none; } .aktion .only-mobile { display: block; } .aktion .titel h1 { line-height: 32px; } .aktion .mobile { display: block; } .aktion .desktop { display: none; } .aktion .bg-info-header { display: none; } .aktion .bg-promo-footer { display: none; } .aktion .absatz-promo { padding: 10px 10px 20px 30px; } /* Slider */ .aktion .slider-slides { width: 900px; height: 345px; position: relative; overflow: hidden; margin: 0; } .aktion .slider-slide { float: left; min-width: 170px; height: 345px; margin: 0; text-align: center } .aktion .slider-slides a.page-back:link { width: 19px; height: 30px; position: absolute; left: 19px; top: 105px; z-index: 10; display: block; background: url(../pics/layout/produkt.filter.buttons.png) no-repeat 0 0 } .aktion .slider-slides a.page-back:visited { } .aktion .slider-slides a.page-back:hover { background-position: 0 -30px } .aktion .slider-slides a.page-back:active { } .aktion .slider-slides a.page-next:link { width: 19px; height: 30px; position: absolute; right: 19px; top: 105px; z-index: 10; display: block; background: url(../pics/layout/produkt.filter.buttons.png) no-repeat right 0 } .aktion .slider-slides a.page-next:visited { } .aktion .slider-slides a.page-next:hover { background-position: right -30px } .aktion .slider-slides a.page-next:active { } @media only screen and (min-width: 768px) { .aktion .absatz-promo { padding: 10px 10px 10px 30px; } .aktion .bg-info-header { display: block; } .aktion .bg-promo-footer { display: block; } .aktion .footernavigation { display: inline-block; } .aktion .navigation { display: inline-block; } .aktion .d4c-navigation { visibility: visible; } .aktion .page { padding: 18px 0 0 0; width: 960px; } .aktion .page * { box-sizing: inherit; -moz-box-sizing: inherit; -webkit-box-sizing: inherit; } .aktion .bg-info-header { width: inherit; } .aktion .column1 { width: 450px; margin: 0 0 0 30px; float: left; padding: 0; } .aktion .column2 { margin: 0 10px 0 490px; width: 450px; padding: 0; } .aktion .single-column { width: 900px; margin: 0 30px; box-sizing: border-box; } .aktion .bg-promo-footer { width: 960px; } .aktion .bild-mobile { display: none; } .aktion .bild-desktop { display: inline; } .aktion .only-desktop { display: block; } .aktion .only-mobile { display: none; } .aktion .link-filtertueten { position: relative; bottom: 35px; left: 100px; } .aktion .mobile { display: none; } .aktion .desktop { display: block; } } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Länderauswahl in der Metanavigation */ .countries-meta { float: right; height: 22px; } .countries-meta ul { overflow: visible; padding: 0; } .countries-meta li { display: inline; font-family: "Lucida Sans W01 Roman",sans-serif; font-size: 9px; line-height: 24px; margin: 0; padding: 7px 10px 6px 10px; position: relative; text-transform: uppercase; z-index: 50; } .countries-meta a:link, .countries-meta a:visited { color: #555555; font-family: "Lucida Sans W01 Roman",sans-serif; font-size: 9px; padding: 0; text-transform: uppercase; margin: 0; } .countries-meta a:hover { color: #DD1930; } .countries-meta li.top:hover { background-color: #F7F5F4; } .countries-meta .liste { position: absolute; right: 3px; z-index: 50; width: 150px; display: none; } .countries-meta .country { background-color: #F7F5F4; border-top: 1px solid #D7D7D8; padding: 0; margin: 0; display: block; } .countries-meta li.country:hover { background-color: #FFFFFF; } .countries-meta li.country:hover a { color: #DD1930; } .countries-meta .country .bild { float: left; padding: 3px 5px 0 10px; clear: both; width: 14px; height: 14px; } .countries-meta .country .link a, .countries-meta .country-end .link a { text-transform: none; font-size: 12px; font-weight: normal; display: block; } .countries-meta .country-end { background: url(../pics/layout/land.hg.png) 0 0 no-repeat transparent; border-top: 1px solid #D7D7D8; padding: 0; margin: 0; display: block; height: 26px } .countries-meta .country-end .link { padding-left: 11px; } .countries-meta li.country-end:hover { background-position: -150px 0; } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Formatierungen für die Landingpage */ .landingpage .titel h1, .landingpage h2, .landingpage sup, .landingpage .text { color: #000000 } .landingpage .absatz { clear: both } .landingpage .header .hauptnavigation { width: auto } /* Formatierungen für Sprachwähler */ .sprachen { margin: 7px 0 0 179px } .sprachauswahl { width: 150px; height: 24px; border: 1px solid #cccccc; margin: 0; padding: 0; overflow: hidden; position: relative; list-style: none outside none; background: none repeat scroll 0 0 #ffffff } .sprachauswahl li { line-height: 24px; padding: 0; margin: 0 } .sprachauswahl li a { color: #555555; display: block; padding: 0 10px 0 36px; position: relative; outline: none } .sprachauswahl li a:hover { color: #dd1930 } .sprachauswahl li a.aktiv { background: url("../pics/layout/sprachauswahl.png") no-repeat scroll 132px 10px transparent } .sprachauswahl li a.aktiv:hover { background-position: 132px -35px } .sprachauswahl li.aktiv { position: absolute; left: 0; top: 0; width: 150px } .sprachauswahl .land-de { background: url(../pics/flaggen/germany.png) 8px 5px no-repeat } .sprachauswahl .land-at { background: url(../pics/flaggen/austria.png) 8px 5px no-repeat } .sprachauswahl .land-ch { background: url(../pics/flaggen/suisse.png) 8px 5px no-repeat } .sprachauswahl .land-dk { background: url(../pics/flaggen/denmark.png) 8px 5px no-repeat } .sprachauswahl .land-se { background: url(../pics/flaggen/sweden.png) 8px 5px no-repeat } .sprachauswahl .land-nl { background: url(../pics/flaggen/netherlands.png) 8px 5px no-repeat } .sprachauswahl .land-fr { background: url(../pics/flaggen/france.png) 8px 5px no-repeat } .sprachauswahl .land-be { background: url(../pics/flaggen/belgium.png) 8px 5px no-repeat } .sprachauswahl .land-cz { background: url(../pics/flaggen/cech-republic.png) 8px 5px no-repeat } .sprachauswahl .land-sk { background: url(../pics/flaggen/slovakia.png) 8px 5px no-repeat } .sprachauswahl .land-gb { background: url(../pics/flaggen/great-britain.png) 8px 5px no-repeat } .sprachauswahl .land-ru { background: url(../pics/flaggen/russia.png) 8px 5px no-repeat } /* Ausgeblendete Sprachen */ .sprachauswahl .land-es { background: url(../pics/flaggen/spain.png) 8px 5px no-repeat; display: none } body.gewinnspiel-campaign { height: auto; } .gewinnspiel-campaign .header .d4c-navigation, .header .hauptnavigation, .header .meta { display: none; } .gewinnspiel-campaign .header .mobile-home-link { float: right; margin-right: 25px; margin-top: 25px; } .gewinnspiel-campaign .footer { width: 100%; position: relative; background-color: #411701; z-index: 0; display: flex; flex-direction: column; align-items: center; padding: 20px 0; margin-top: -1px; } .gewinnspiel-campaign .footernavigation { min-width: auto; float: left;} .gewinnspiel-campaign .footernavigation li { display: block; margin: 0; text-align: center;} .gewinnspiel-campaign .header .mobile-home-link a {display: block; color: #333333; } @media only screen and (min-width: 1200px) { .gewinnspiel-campaign .header .d4c-navigation, .header .hauptnavigation, .header .meta { display: block; } .gewinnspiel-campaign .header .mobile-home-link { display: none; } .gewinnspiel-campaign .footer { padding: 0; height: 34px; flex-direction: row; justify-content: space-between; } .gewinnspiel-campaign .footer li { display: inline-block; margin: 0 0 0 19px; } } .gewinnspiel-campaign .titel { line-height: inherit; margin: 0; padding: 0; } .gewinnspiel-campaign div.wrapper.wrapper-white div.absatz div.text p { color: #555; text-align: left; } .gewinnspiel-campaign div.wrapper.wrapper-white div.absatz div.text span strong { font-size: 25px; font-family: "Century Gothic W01",sans-serif; } .gewinnspiel-campaign .wrapper-gray .absatz .titel h2 { color:#ffffff; font-family: "Century Gothic W01",sans-serif; margin-left: 0; } .gewinnspiel-campaign .wrapper-gray .absatz .text p strong { color:#ffffff; font-size: 14px; line-height: 20px; } .gewinnspiel-campaign .wrapper-gray .absatz .text p { color:#ffffff; font-size: 14px; line-height: 20px; } .gewinnspiel-campaign div, .gewinnspiel-campaign div p { color: #333333; font-size: 14px; } .gewinnspiel-campaign div.wrapper .container label { color: #333333; font-size: 14px; } .gewinnspiel-campaign div.wrapper .container label a { font-size: 14px; } .gewinnspiel-campaign .wrapper-gray .text sup { color: #ffffff; } .gewinnspiel-campaign .gewinnspiel .col-radio .form-eingabe-zeile, .gewinnspiel-campaign .gewinnspiel .col-radio .form-eingabe-zeile:last-child { margin: 0 2em 5em 0;} .gewinnspiel .form-text{padding:5px;width:100%;border:0;background:#bcbcbc}/* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Hinweise: .MODUL .KOMMANDO TAG */ /* cy:con Portaleditor */ .cycon-portaleditor { margin: 0px; padding: 1px; border-width: 0px; } .cycon-portaleditor-x { margin: 0px; padding: 0px; border-width: 1px; border-style: dashed; border-color: #a0a0a0; } .cycon-portaleditor-bezeichner { } .cycon-portaleditor-zeile { text-align: left; } /* Klasse: Pageview */ .pageview { margin: 0px; margin-bottom: 5px; padding: 0px; } .pageview li { display: inline; margin-right: 5px; } /* Element: formular */ .formular { } .formular .form-eingabe-zeile { } .formular label { } .formular .form-text { } .formular .form-button { } /* Optional: Textfelder erhalten beim Überfahren mit der Maus und bei Eingabe eine andere Rahmenfarbe .formular .form-text :hover { border: 1px solid #888888; } .formular .form-text :focus { border: 1px solid #888888; }*/ .formular .formular-kontakt { } .formular .formular-empfehlung { } /* Element: formular_passwort */ .formular-passwort { } .formular-passwort .form-button { } .formular-passwort .form-text { width: 180px; } .formular-passwort .formular-passwort-vergessen { } .formular-passwort .formular-passwort-aendern { } /* Element: modul_system_ist_neu */ .modul-system-ist-neu { } /* Kalender Formular */ body.kalender { margin: 0px; } .popup-kalender { margin: 10px 0px 0px 5px; } .popup-kalender label { color: #707173} .popup-kalender table { border: 1px solid #CBCBCB; clear: both; margin-top: 5px;} .popup-kalender table th { width: 29px; height: 25px; background: #aaaaaa; color:#FFFFFF; } .popup-kalender table td { height: 18px; background:#DDDDDD; } .popup-kalender table a { display:block; } .popup-kalender table a:hover { background:#cbcbcb; } .popup-kalender table .tag { } .popup-kalender table .tag a { } .popup-kalender table .ftag { background:#bbbbbb; } .popup-kalender table .ftag a { color:#FFFFFF; } .popup-kalender table .gewaehlt { background:#BD484E; } .popup-kalender table .gewaehlt a { font-style: italic; } .popup-kalender table .aktuell { background:#D58A8D; } .popup-kalender table .aktuell a { font-weight: bold; } .popup-kalender table .tag_leer { background:#cbcbcb; } .popup-kalender .form-eingabe-zeile { clear: both; float: none; } .popup-kalender .form-eingabe-zeile label { text-align:left; width:95px; float: left; } .popup-kalender .form-eingabe-zeile .form-select { width: 90px; float: right;} .popup-kalender .form-eingabe-zeile .form-dropdown { float: right; margin-bottom: 3px;} /* Chemical Check */ .cc-link .pdf .link-icon { float: left; height: 18px; padding: 0px 0px 0px 37px; background: url(../system/pics/emoticons/icon_typ_pdf.png) no-repeat; cursor:pointer;} .cc-link .pdf:hover .link-icon { background-position: 0 -18px; } .cc-link .pdf .link-text { margin: 2px 0 15px 45px; padding-top: 1px; } .chemicalcheck #feld_sprache option { color: #000000; } .chemicalcheck #feld_sprache { color: #000000; } .chemicalcheck { margin: 0 0 20px 0; } /* Kontakt */ .formular-kontakt .spalte-oben { margin: 0 90px 20px 40px; } .formular-kontakt .spalte-links { float:left; width: 400px; margin-left: 40px; } .formular-kontakt .spalte-rechts { margin: 0 75px 0 500px; } .formular-kontakt .form-radio { margin: 0 0 0 10px ; } .formular-kontakt label { margin: 0 0 8px 0; width: 85px; display: block; float: left; padding: 0; } .formular-kontakt .spalte-links label.form-label-checkbox { line-height: 18px; } .formular-kontakt label.form-label-checkbox { margin: 0; width: auto; display: inline; float: none; vertical-align: top; } .formular-kontakt .form-eingabe-zeile { overflow: hidden; } .formular-kontakt label.form-label-radio { width: auto; display: inline; float: none; } .formular-kontakt .form-text { margin: 0 0 8px 10px; width: 270px; height: 20px; } .formular-kontakt textarea.form-text { height: auto; } .formular-kontakt .form-select option { color: #000000; } .formular-kontakt .form-select { color: #000000; padding: 2px 0 0 0; width: auto; margin: 0 0 8px 10px; width: 272px; height: 22px;} .formular-kontakt .erstes { width: 60px; } .formular-kontakt .zweites { width: 200px; margin: 0 0 0 5px; vertical-align: top; } .formular-kontakt input { color: #000000; } .formular-kontakt textarea { color: #000000; } .formular-kontakt .zeile-checkbox { margin: 0 0 4px 95px; } .formular-kontakt .spalte-rechts .zeile-checkbox { margin-left: 95px; } .formular-kontakt .spalte-rechts .zeile-checkbox label { margin-left: 20px; display: block; font-size: 11px; } .formular-kontakt img.captcha { vertical-align: top; } .formular-kontakt .fehler { border: 2px solid #dd1930;} .formular-kontakt .zeile-checkbox div { overflow: hidden; width: 12px; float:left;} .formular-kontakt .submit { margin: 20px 0 20px 285px; } .formular-kontakt #checkbox-agb { float:left; } .formular-kontakt #captcha { vertical-align: top; width: 131px; height: 20px; margin: 0 5px 10px 10px; } .formular-kontakt #strasse { width: 205px; } .formular-kontakt #nummer { width: 55px; } .formular-kontakt .count { margin: 0 0 4px 95px} /* Gewinnspiel */ .formular-gewinnspiel .spalte-unten { margin: 20px 30px 20px 720px; overflow: hidden; width: 195px; } .formular-gewinnspiel .spalte-links { float:left; width: 400px; margin-left: 80px;} .formular-gewinnspiel .spalte-rechts { margin: 0 30px 0 500px; } .formular-gewinnspiel .spalte-mitte { overflow: hidden; } .formular-gewinnspiel .form-radio { margin: 0 0 0 10px ; } .formular-gewinnspiel label { margin: 0 0 8px 0; width: 85px; display: block; float: left; padding: 0; } .formular-gewinnspiel .spalte-links label.form-label-checkbox { line-height: 18px; } .formular-gewinnspiel label.form-label-checkbox { margin: 0 0 0 5px; padding: 0 0 2px 0; width: auto; display: inline; float: none; vertical-align: top; } .formular-gewinnspiel .form-label-checkbox a { font-weight: bold; border-bottom: 1px solid #dd1930; height: 14px; } .formular-gewinnspiel .form-label-checkbox a:hover { color: #dd1930; } .formular-gewinnspiel .form-eingabe-zeile { overflow: hidden; } .formular-gewinnspiel label.form-label-radio { width: auto; display: inline; float: none; } .formular-gewinnspiel .form-text { margin: 0 0 8px 10px; width: 270px; height: 20px; } .formular-gewinnspiel textarea.form-text { height: auto; } .formular-gewinnspiel .form-select option { color: #000000; } .formular-gewinnspiel .form-select { color: #000000; padding: 2px 0 0 0; width: auto; margin: 0 0 8px 10px; width: 272px; height: 22px;} .formular-gewinnspiel .erstes { width: 60px; } .formular-gewinnspiel .zweites { width: 200px; margin: 0 0 0 5px; vertical-align: top; } .formular-gewinnspiel input { color: #000000; } .formular-gewinnspiel textarea { color: #000000; } .formular-gewinnspiel .spalte-rechts .zeile-checkbox label { margin-left: 20px; display: block; } .formular-gewinnspiel img.captcha { vertical-align: top; } .formular-gewinnspiel .captcha { margin: 0 0 5px 0; } .formular-gewinnspiel .gewinne { height: 160px; margin: 0 0 40px 0; } .formular-gewinnspiel .captcha label { width: 145px; } .formular-gewinnspiel .fehler { border: 2px solid #dd1930 ; } .formular-gewinnspiel span.fehler { border: 0px; color: #dd1930 ; } .formular-gewinnspiel span.fehler a { border: 0px; color: #dd1930 ; } .formular-gewinnspiel .pflicht { margin: 30px 0 0 0;} .formular-gewinnspiel .submit { float: right; } .formular-gewinnspiel .zurueck { float: left; margin: 0; } .formular-gewinnspiel h2 { margin: 0 0 35px 30px; color: #fff; } .formular-gewinnspiel .zeile-checkbox div { overflow: hidden; width: 12px; float:left; margin: 0 5px 0 0; } .formular-gewinnspiel #checkbox-agb { float:left; } .formular-gewinnspiel #captcha { vertical-align: top; width: 120px; height: 20px; margin: 0 5px 10px 10px; } .formular-gewinnspiel #strasse { width: 205px; } .formular-gewinnspiel #nummer { width: 55px; } /* Registrierung */ .formular-registrierung .spalte-links { float:left; width: 400px; } .formular-registrierung .spalte-rechts { margin: 0 0 0 400px; } .formular-registrierung .spalte-unten { margin: 0 90px 0 95px; } .formular-registrierung .spalte-oben { margin: 0 90px 20px 95px; } .formular-registrierung .spalte-mitte { overflow: hidden; margin: 0 45px 40px 95px; } .popup-caffeo .formular-registrierung .spalte-unten { margin: 0 0 0 10px; } .popup-caffeo .formular-registrierung .spalte-oben { margin: 0 0 20px 5px; } .popup-caffeo .formular-registrierung .spalte-mitte { overflow: hidden; margin: 0 0 40px 5px; } .popup-caffeo .formular-registrierung .spalte-mitte.mit-abschnitt-garantie { margin: 0 0 20px 5px; } .formular-registrierung .mitte2 { overflow: hidden; margin-bottom: 10px; } .formular-registrierung .agb { margin: 0 0 30px 85px; } .formular-registrierung .fehler { border: 2px solid #dd1930 ; } .formular-registrierung .zeile-checkbox div { overflow: hidden; width: 12px; float:left; margin: 0 5px 0 0; } .formular-registrierung .nur_anzeigen { line-height: 20px; } .formular-registrierung img.captcha { vertical-align: top; } .formular-registrierung #captcha { vertical-align: top; width: 131px; height: 20px; margin: 0 5px 10px 0; } .formular-registrierung .form-radio { margin: 0 0 0 10px ; } .formular-registrierung label { margin: 0 0 8px 0; width: 95px; display: block; float: left; padding: 2px 0 0 0; } .formular-registrierung .schritt2 label { margin: 0 0 8px 0; width: 115px; display: block; float: left; padding: 2px 0 0 0; } .formular-registrierung .form-eingabe-zeile { overflow: hidden; } .formular-registrierung label.form-label-radio { width: auto; display: inline; float: none; } .formular-registrierung label.form-label-checkbox { margin: 0; width: auto; display: inline; float: none; vertical-align: top; } .formular-registrierung .form-text { margin: 0 0 8px 10px; width: 270px; height: 20px; } .formular-registrierung .form-select option { color: #000000; } .formular-registrierung .form-select { color: #000000; width: auto; margin: 0 0 8px 10px; width: 272px; height: 20px;} .formular-registrierung .erstes { width: 60px; } .formular-registrierung .zweites { width: 200px; margin: 0 0 0 5px; } .formular-registrierung input { color: #000000; box-sizing: border-box; } .formular-registrierung span.hinweis { margin: 0 0 0 95px; display: block; } .formular-registrierung .special-dk { padding-right: 380px; } .formular-registrierung .radio-dk { float: left; padding: 0 0 0; width: 100px; } .formular-registrierung a.popup_calendar { vertical-align: top; background: url(../pics/layout/caffeo-reg-kalender.png) no-repeat; height: 23px; width: 24px; margin-right: 180px; display: block; float:right; } .popup-caffeo .formular-registrierung a.popup_calendar { margin-right: 135px; } .formular-registrierung a.seriennummer_hilfe { vertical-align: top; background: url(../pics/layout/caffeo-reg-hilfe.png) no-repeat; height: 23px; width: 24px; margin: 0 20px 0 0; display: block; float:right; } .formular-registrierung a.seriennummer_hilfe:hover { background-position: left bottom; } .formular-registrierung a.popup_calendar:hover { background-position: left bottom; } .formular-registrierung #benutzer_strasse { width: 205px; } .formular-registrierung #benutzer_hausnummer { width: 55px; } .formular-registrierung #benutzer_seriennummer1 { width: 35px; } .formular-registrierung #benutzer_seriennummer2 { width: 15px; margin: 0 2px 0 3px; } .formular-registrierung #benutzer_seriennummer3 { width: 15px; margin: 0 0 0 3px; } .formular-registrierung #benutzer_seriennummer4 { width: 125px; margin: 0 0 0 3px; } .formular-registrierung #benutzer_kauf_datum_tag { height: 18px; margin: 0 3px 5px 10px; } .formular-registrierung #benutzer_kauf_datum_monat { height: 18px; margin: 0 3px 0 0; } .formular-registrierung #benutzer_kauf_datum_jahr { height: 18px; } .formular-registrierung .form-eingabe-zeile-geschenk { overflow: hidden; width: 775px; margin: 3px 0 0 0; } .formular-registrierung .form-radiobutton-liste-bilder { float: left; } .formular-registrierung .form-radiobuttonliste-bilder-zeile { width: 190px; float: left; } .formular-registrierung .form-radiobuttonliste-bilder-zeile .radio { float: left; width: 130px; padding: 15px 0 0 0; } .formular-registrierung .form-radiobuttonliste-bilder-zeile .form-label-radio { float:right; width: 100px; } /* Händlersuche */ .modul-haendlersuche { padding-top: 20px; overflow: hidden } .modul-haendlersuche #map { width: 960px; height: 400px; z-index: 0 } .modul-haendlersuche .container { position: relative; width: 960px; height: 400px; } .formular-haendlersuche { position: absolute; right: 20px; top: 20px; width: 315px; z-index: 1; } .formular-haendlersuche .head, .foot { float: left; clear: both; width: 315px; min-height: 25px; display: block; } .formular-haendlersuche .head { background: url(../pics/layout/haendlersuche-weiss-bg.png) no-repeat 0 top; } .formular-haendlersuche .foot { background: url(../pics/layout/haendlersuche-weiss-bg.png) no-repeat 0 bottom; } .formular-haendlersuche .content div { color: #898D8D; } .formular-haendlersuche input { color: #898D8D; } .formular-haendlersuche label { color: #898D8D; float: left; } .formular-haendlersuche .content { float: left; clear: both; width: 301px; background: url(../pics/layout/haendlersuche-weiss-bg.png) no-repeat 0 center; padding: 0 7px 0 7px; } .formular-haendlersuche .infocontent { padding-bottom: 10px; margin: 0 20px 10px 20px; border-bottom: 1px solid #ECECEC; } .formular-haendlersuche .form-text { height: 20px; float: left; clear: both; } .formular-haendlersuche .form-button { display: none; } .formular-haendlersuche .form-eingabe-zeile { float: left; padding: 0 0 0 20px; } .formular-haendlersuche a.button-23 { float: right; padding: 10px 20px 0 0; } .formular-haendlersuche #suche_filter_ort { width: 150px; margin: 5px 0 0 0; } .formular-haendlersuche #suche_filter_plz { width: 85px; margin: 5px 0 0 0; } .formular-haendlersuche .button { float: right; padding: 10px 22px 0 0; } .formular-haendlersuche .fehler { border: 1px solid #EE1A30; background-color: #EEEEEE } .formular-haendlersuche #fehler-text { color: #EE1A30 } .formular-haendlersuche a.button-23:hover .button-left { background-position: left top; } .formular-haendlersuche a.button-23:hover .button-text { background-position: center top; } .formular-haendlersuche a.button-23:hover .button-right { background-position: right top; } .formular-haendlersuche a.button-23:hover .button-text span { color: #FFFFFF; background: url("../pics/layout/link.text.normal.png") no-repeat scroll right 7px transparent; } .modul-haendlersuche .absatz-info { float: left; width: 920px; padding: 10px 10px 30px 30px } .modul-haendlersuche .haendler-zeile { margin: 2px 2px 0 0; padding: 15px 10px 15px 10px; width: 203px; height: 67px; float:left; background: url(../pics/layout/haendler-hg.png); position: relative } .modul-haendlersuche .haendler-zeile .sortiment-oben { float: left; background: url(../pics/layout/haendlersuche-sortiment-bg.png) no-repeat 0 top; width: 237px; height: 24px; text-align: center; color: #EE1A30; padding: 16px 0 0 0 } .modul-haendlersuche .haendler-zeile .sortiment-inhalt { float: left; background: url(../pics/layout/haendlersuche-sortiment-bg.png) no-repeat 0 center; width: 223px; padding: 0 7px; } .modul-haendlersuche .haendler-zeile .sortiment-unten { float: left; background: url(../pics/layout/haendlersuche-sortiment-bg.png) no-repeat 0 bottom; width: 237px; height: 25px } .modul-haendlersuche .haendler-zeile .sortiment { display: none; position: absolute; left: -7px; bottom: 90px; z-index: 2; width: 237px } .modul-haendlersuche .haendler-zeile .sortiment.aktiv { display: block } .modul-haendlersuche .haendler-zeile .sortiment-inhalt .segment { color: #898D8D; font-size: 10px; font-weight: bold; margin: 10px 0 0 10px } .modul-haendlersuche .haendler-zeile .sortiment-inhalt .produkt { color: #898D8D; font-size: 10px; margin: 2px 0 0 20px } .modul-haendlersuche .haendler-zeile .sortiment-inhalt .produkt sup { color: #898D8D; } .modul-haendlersuche .termine-spezial { height: auto; background: none; padding: 15px 10px 0 10px } .modul-haendlersuche .termine-spezial-bg { background: url(../pics/layout/termine-hg-spezial.png) repeat-y 0 0; float: left; display: block; margin-top: 1px; } .modul-haendlersuche .haendler-zeile .haendler-titel { margin: 0 0 5px 0; font-size: 13px; } .modul-haendlersuche .haendler-zeile .termine-titel { margin: 12px 0 5px 0; font-size: 13px; } .modul-haendlersuche .anzahl { height: 20px; padding: 5px 20px 8px 5px; font-size: 13px; } .modul-haendlersuche .anzahl span { float: left; } .modul-haendlersuche .kategorie-links { float: left; width: 158px; height: 32px; display: block; padding-top: 7px; background: url(../pics/layout/haendlersuche-grau-bg.png) no-repeat left top; } .modul-haendlersuche .kategorie-rechts { float: left; width: 157px; height: 32px; display: block; padding-top: 7px; background: url(../pics/layout/haendlersuche-grau-bg.png) no-repeat right top; } .modul-haendlersuche .kategorie-links-aktiv, .modul-haendlersuche .kategorie-rechts-aktiv { background: none; } .modul-haendlersuche .kategorie-links span { float: right; color: #898D8D; width: 151px; height: 23px; text-align: center; margin-top: 8px; display: block; border-bottom: 1px solid #ECECEC; font-size: 13px; cursor: pointer; } .modul-haendlersuche .kategorie-rechts span { float: left; color: #898D8D; width: 150px; height: 23px; text-align: center; margin-top: 8px; display: block; border-bottom: 1px solid #ECECEC; font-size: 13px; cursor: pointer; } .modul-haendlersuche .kategorie-links-aktiv span, .modul-haendlersuche .kategorie-rechts-aktiv span { color: #EE1A30; } .modul-haendlersuche .select { padding-top: 20px; } .modul-haendlersuche .select select { float: left; clear: both; margin-top: 5px; width: 259px; color: #898D8D; } .modul-haendlersuche .select select option { color: #898D8D; } .modul-haendlersuche .select .form-eingabe-zeile { width: 280px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #ECECEC; } .modul-haendlersuche .info-text { float: left; padding: 5px 20px; font-size: 10px; } .modul-haendlersuche .info-html, .info-html b { color: #000000; } .modul-haendlersuche .drucken { float: right; width: 21px; height: 21px; } .modul-haendlersuche .drucken a.drucken-button:link { float: left; background: url(../pics/layout/icons.print.white.png) no-repeat 0 0 transparent; width: 21px; height: 21px; padding-right: 20px; } .geschenk-links { background: url(../pics/layout/caffeo-reg-hg-links.png) no-repeat; width: 15px; float: left; height: 85px; } .geschenk-rechts { background: url(../pics/layout/caffeo-reg-hg-rechts.png) no-repeat; float: left; height: 85px; width: 14px; } .geschenk-submit-rechts { background: url(../pics/layout/caffeo-reg-hg-ecken.png) no-repeat; background-position: -46px 0; float: left; height: 85px; width: 15px; } .geschenk-submit-links { background: url(../pics/layout/caffeo-reg-hg-ecken.png) no-repeat; background-position: 0 0; float: left; height: 85px; width: 15px; } .bg-geschenk { background: url(../pics/layout/caffeo-reg-hg-mitte.png); height: 68px; padding: 8px 0 0 0; } .formular-registrierung .submit { background: url(../pics/layout/caffeo-reg-hg.png); padding: 30px 0 0 60px; height: 46px; width: auto; float: left; } .formular-registrierung .zurueck { background: url(../pics/layout/caffeo-reg-hg.png); padding: 30px 0 0 70px; height: 46px; width: 450px; float: left; } /* iframe Film*/ .bg-promo iframe { margin: 0 0 0 120px; } .bg-promo-red iframe { margin: 0 0 0 120px; } /* Hier können nun alle benötigten Definitionen für die modul_* Elemente eingefügt werden. */ .haendler-footer { text-align: center; height: 40px; padding-top: 20px; background: url(../pics/layout/hg-promo-rand.png) no-repeat scroll 0 -68px transparent; float: left; clear: both; width: 960px } .haendler-footer .paging { display: inline; margin: 0px; padding:0; } .haendler-footer .paging .pageview-center { min-width: 1px; background: url(../pics/layout/paginierung-zahlen.png) repeat-x; margin: 0px; padding: 3px 0px 4px 0px; } .haendler-footer .paging .pageview-center a { padding: 0px 5px 0px 5px; font-weight: bold;} .haendler-footer .paging .pageview-center a:link { padding: 0px 5px 0px 5px; font-weight: bold;} .haendler-footer .paging .pageview-center a:hover { color: #DD1930; padding: 0px 5px 0px 5px; font-weight: bold;} .haendler-footer .paging .pageview-center a:visited { padding: 0px 5px 0px 5px; font-weight: bold;} .haendler-footer .paging .pageview-center .paging-aktiv {color: #DD1930; font-weight: bold; } .haendler-footer .paging .pageview-center a .paging-aktiv {color: #DD1930; font-weight: bold; } .haendler-footer .paging .pageview-center a:link .paging-aktiv { color: #DD1930; font-weight: bold; } .haendler-footer .paging .pageview-center a:hover .paging-aktiv { color: #DD1930; font-weight: bold; } .haendler-footer .paging .pageview-center a:visited .paging-aktiv { color: #DD1930; font-weight: bold; } .haendler-footer .paging .pageview-links { min-width: 1px; background: url(../pics/layout/paginierung-zahlen-ecken.png) repeat-x; margin: 0px; padding: 3px 0 4px 9px; } .haendler-footer .paging .pageview-rechts { min-width: 1px; background: url(../pics/layout/paginierung-zahlen-ecken.png) -15px 0 repeat-x; margin: 0px; padding: 3px 13px 4px 0; } /* FAQ */ .modul-faqs { padding: 0; } .modul-faqs .bg-info { padding: 0; } .modul-faqs .absatz-akkordeon { padding: 10px 0 0 30px; } .modul-faqs .content-wrapper { padding: 0; } .modul-faqs .liste-kategorien { padding: 8px 0 5px 40px; height: 21px; } .modul-faqs .liste-kategorien select { width: 230px; color: #000000;} .modul-faqs .liste-kategorien select option { color: #000000; padding: 2px 0 0px 5px; height: 16px; } .modul-faqs .kategorie { float: left; } .modul-faqs .unterkategorie { margin: 0 0 0 10px; padding: 0 0 0 20px; float: left; background: url(../pics/layout/faq_pfeil.png) no-repeat; } .modul-faqs h2 { margin: 0 0 5px 0; } .modul-faqs hr { margin: 0 0 0 0; padding: 0 0 0 0; width: 100%; } .modul-faqs .frage-antwort { width: 700px; margin: 0 120px 0 0; float: left; } .modul-faqs .frage { margin: 0 150px 10px 0; clear: both; font-size: 16px; font-family: "Lucida Sans W01 Roman", sans-serif; color: #ffffff; } .modul-faqs .antwort { font-size: 13px; font-family: "Lucida Sans W01 Roman", sans-serif; color: #ffffff; } .modul-faqs .antwort img { vertical-align: middle; } .modul-faqs .absatz-akkordeon .mehr-weniger-btn { padding-bottom: 10px; } /* Modul Formulargenerator */ .modul-formulargenerator .filmpromotion .form-eingabe-zeile { margin: 0 0 10px 0; clear: left; overflow: hidden } .modul-formulargenerator .filmpromotion label { font-weight: bold; width: 150px; display: block; float: left; padding: 4px 0 0 0 } .modul-formulargenerator .filmpromotion .form-text { width: 300px; height: 20px; display: block; border: 1px solid #999999 } .modul-formulargenerator .filmpromotion #formularfilmpromotion_hausnummer, .modul-formulargenerator .filmpromotion #formularfilmpromotion_plz { width: 100px } .modul-formulargenerator .filmpromotion .radio { float: left; margin: 0 10px 0 0 } .modul-formulargenerator .filmpromotion .form-label-radio { float: right } .modul-formulargenerator .filmpromotion .pflichtfelder { font-weight: bold; margin: 20px 0 30px 0 } .modul-formulargenerator .filmpromotion .form-checkbox { margin: 1px 0 0 0 } .modul-formulargenerator .filmpromotion .checkbox-zeile { margin: 0 0 10px 20px; width: 475px } .modul-formulargenerator .filmpromotion .checkbox-information { width: 450px; display: block; float: right } .modul-formulargenerator .filmpromotion .checkbox-information a:link { color: #555555; text-decoration: underline } .modul-formulargenerator .filmpromotion .checkbox-information a:hover { text-decoration: none } .modul-formulargenerator .filmpromotion .form-button { float: right; margin: 0 200px 0 0 } .modul-formulargenerator .filmpromotion .fehler { margin: 10px 0 20px 0 } .modul-formulargenerator .filmpromotion .fehler .fehler-titel *, .modul-formulargenerator .filmpromotion .fehler .fehler-zeile { color: #DD1930 } .modul-formulargenerator .filmpromotion .form-eingabe-zeile .fehler { margin: 0; border: 1px solid #DD1930 } /* Login */ .login { width: 300px; display: block; background: url(../pics/layout/hg-promo-red.png) 0 0; margin: 40px 0 0 0; padding: 20px } .login * { color: #000000 } .login label { width: 200px; display: block; color: #ffffff } .login p { padding: 0 0 10px 0; float: left; color: #ffffff } .login .logout { margin: 12px 0 0 0 } .login .logout a, .login .kennung, .login .kennung * { color: #ffffff } .login .kennung a { color: #DD1930 } .login .logout a:hover, .login .kennung a:hover { text-decoration: underline } /* fitue Gewinnspiel */ .modul-formulargenerator .preise .hauptpreis { overflow: hidden; margin: 5px 0 10px 0; float: left } .modul-formulargenerator .preise .hauptpreis img{ height: 190px; } .modul-formulargenerator .fitue .code_digit { width: 20px; height: 20px; font-size: 16px; font-weight: bold; padding: 5px 0 0 5px; margin: 5px 4px 0px 0; color: #000 } .modul-formulargenerator .fitue .fehler { border: 2px solid #DD1930; } .modul-formulargenerator .fitue .submit { padding-top: 7px} .modul-formulargenerator .fitue .checkbox-zeile { clear: both; padding: 10px 0 0 0 } .modul-formulargenerator .fitue .form-checkbox { float: left } .modul-formulargenerator .fitue .checkbox-information { margin-left: 20px } .modul-formulargenerator .fitue .code { float: left } .modul-formulargenerator .preise .preis { overflow: hidden; margin: 5px 0 5px 0 } .modul-formulargenerator .preise .preis div { margin: 0 0 0 90px } .modul-formulargenerator .preise hr { clear: both; } .modul-formulargenerator .preise .preis img { float: left } .modul-formulargenerator .preis-wrapper { overflow: hidden; margin-bottom: 10px; } .modul-formulargenerator .preis-diashow { width: 110px; float: right; } .modul-formulargenerator .diashow-inhalt { position: relative; width: 110px; height: 143px; } .modul-formulargenerator .diashow-inhalt div { position: absolute; top: 0px; left: 0px; width: 110px; height: 143px; } .column1 .code { font-weight: bold; display: block; text-align: center; font-size: 14px; margin: 4px 0 10px 0; } .column1 .absatz-gewonnen { background: url("../pics/layout/aromapor/gewinn_pfeil.png") no-repeat top right; overflow: hidden; padding: 5px 30px 5px 15px; margin-bottom: 20px; width: 250px; height: 100px; } .column1 .absatz-gewonnen h2 { font-weight: bold; font-size: 20px; } .column1 .absatz-gewonnen .text { margin-top: 10px; font-size: 14px; } .modul-formulargenerator .fitue-mail .form-eingabe-zeile { float: left; } .modul-formulargenerator .fitue-mail .gruppe { clear: both; padding: 0 0 5px 0; overflow: hidden; } .modul-formulargenerator .fitue-mail .form-text { width: 200px; height: 20px; color: #000; margin-right: 10px; } .modul-formulargenerator .fitue-mail { margin: 15px 0 10px 0; } .modul-formulargenerator .fitue-mail .fehler { border: 2px solid #DD1930; } .modul-formulargenerator #formularfitue_mailform_email { width: 412px; } /* fitue2016 Gewinnspiel */ .gewinntafel img { width: 400px; } .modul-formulargenerator .preise .hauptpreis { overflow: hidden; margin: 5px 0 10px 0; float: left; text-align: center; } .modul-formulargenerator .preise .hauptpreis p { text-align: center } .modul-formulargenerator .fitue2016 .code_digit { width: 20px; height: 20px; font-size: 16px; font-weight: bold; padding: 5px 0 0 5px; margin: 5px 4px 0 0; color: #000 } .modul-formulargenerator .fitue2016 .erfolg-wrapper-pfeil { background: rgba(0, 0, 0, 0) url("../pics/fitue2016/erfolgsseite_pfeil.png") repeat scroll 0 0; box-sizing: border-box; height: 100px; margin: 0 0 15px; padding: 15px 44px 15px 15px; width: 328px; } .modul-formulargenerator .fitue2016 .fehler { border: 2px solid #DD1930; } .modul-formulargenerator .fitue2016 .submit { padding-top: 7px; overflow: hidden; } .modul-formulargenerator .fitue2016 .checkbox-zeile { float: none !important; clear: both; padding: 10px 0 0 0 } .modul-formulargenerator .fitue2016 .form-checkbox { float: left } .modul-formulargenerator .fitue2016 .checkbox-information { margin-left: 20px; max-width: 395px; } .modul-formulargenerator .fitue2016 .code { float: left } .modul-formulargenerator .fitue2016 label { display: block } .modul-formulargenerator .preise .preis { overflow: hidden; margin: 5px 0 5px 0 } .modul-formulargenerator .preise .preis div { margin: 0 0 0 90px } .modul-formulargenerator .preise hr { clear: both; } .modul-formulargenerator .preise .preis img { float: left } .modul-formulargenerator .preis-wrapper { overflow: hidden; margin-bottom: 10px; } .modul-formulargenerator .preis-diashow { width: 110px; float: right; } .modul-formulargenerator .diashow-inhalt { position: relative; width: 110px; height: 143px; } .modul-formulargenerator .diashow-inhalt div { position: absolute; top: 0px; left: 0px; width: 110px; height: 143px; } .column1 .code { font-weight: bold; display: block; text-align: center; font-size: 14px; margin: 4px 0 10px 0; } .column1 .absatz-gewonnen { background: url("../pics/layout/aromapor/gewinn_pfeil.png") no-repeat top right; overflow: hidden; padding: 5px 30px 5px 15px; margin-bottom: 20px; width: 250px; height: 100px; } .column1 .absatz-gewonnen h2 { font-weight: bold; font-size: 20px; } .column1 .absatz-gewonnen .text { margin-top: 10px; font-size: 14px; } .column2 .filtertueten { margin: 0 0 25px 25px; position: relative; } .column2 .filtertueten a { display: inline-block; position: absolute; z-index: 5; background: transparent url("../pics/layout/grafikelemente.png") no-repeat scroll 70px -419px; float: left; padding: 0 30px 0 20px; } .column2 .gewinn a { display: inline-block; position: absolute; z-index: 5; background: transparent url("../pics/layout/grafikelemente.png") no-repeat scroll 70px -419px; float: left; padding: 0 30px 0 20px; } .column2 .filtertueten .filtertuete1 { bottom: -10px; left: 40px; } .column2 .filtertueten .filtertuete2 { bottom: 20px; left: 120px; } .column2 .filtertueten .filtertuete3 { bottom: 50px; left: 200px; } .column2 .filtertueten .filtertuete4 { bottom: 80px; left: 280px; } .modul-formulargenerator .fitue2016 .form-eingabe-zeile { float: left; margin: 0 0 5px; } .modul-formulargenerator .fitue2016 .form-eingabe-zeile.radio { float: none; margin: 0 0 10px 0; } .modul-formulargenerator .fitue2016 .form-eingabe-zeile.radio label { display: inline-block; } .modul-formulargenerator .fitue2016 .form-eingabe-zeile .radio { display: inline-block; margin: 0 10px 0 0; } .modul-formulargenerator .fitue2016 .form-eingabe-zeile .radio .form-label-radio { display: inline-block; } .modul-formulargenerator .fitue2016 .gruppe { clear: both; padding: 0 0 5px 0; overflow: hidden; } .modul-formulargenerator .fitue2016 .form-text { width: 200px; height: 20px; color: #000; margin-right: 10px; } .modul-formulargenerator .fitue2016 .zeile_formularfitue2016_mailform_strasse .form-text, .modul-formulargenerator .fitue2016 .zeile_formularfitue2016_mailform_email .form-text { width: 414px; height: 20px; color: #000; margin-right: 0; } .modul-formulargenerator .fitue2016 .form-text { width: 200px; height: 20px; color: #000; margin-right: 10px; } .modul-formulargenerator .fitue2016 .checkbox-information a { text-decoration: underline } .modul-formulargenerator .fitue2016 { margin: 0 0 10px 0; } .modul-formulargenerator .fitue2016 .fehler { border: 2px solid #DD1930; } .modul-formulargenerator #formularfitue_mailform_email { width: 412px; } /* Pad Offensive */ .modul-formulargenerator .pad-form .form-eingabe-zeile { float: left; } .modul-formulargenerator .pad-form .gruppe { clear: both; padding: 0 0 5px 0; overflow: hidden; } .modul-formulargenerator .pad-form .form-text { width: 200px; height: 20px; color: #000; margin-right: 10px; } .modul-formulargenerator .pad-form { margin: 15px 0 10px 0; } .modul-formulargenerator .pad-form .fehler { border: 2px solid #DD1930; } .Xmodul-formulargenerator #formularfitue_mailform_email { width: 412px; } /* Selection des Jahres Gewinnspiel */ .modul-formulargenerator .sdj-gewinnspiel-form .form-eingabe-zeile { float: left; } .modul-formulargenerator .sdj-gewinnspiel-form .gruppe { clear: both; padding: 0 0 5px 0; overflow: hidden; } .modul-formulargenerator .sdj-gewinnspiel-form .form-text { width: 183px; height: 20px; color: #000; margin-right: 10px; } .modul-formulargenerator .sdj-gewinnspiel-form { margin: 15px 0 10px 0; } .modul-formulargenerator .sdj-gewinnspiel-form .fehler { border: 2px solid #DD1930; } /* Multiupload */ .multiupload * { color: #000000 !important; } .multiupload .moxie-shim.moxie-shim-html5 { display: none; } .multiupload .form-button { background-color: #DD1930; color: white !important; padding: 4px 10px; margin-right: 15px; }/* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Pfadnavigation */ .pfadnavigation-link { text-align: left; display: inline; } /* Navigation in der Seite */ .nav-inline { padding: 3px 0 0 0; height: 35px; overflow: hidden; } .nav-inline-header { height: 13px; background: url("../pics/layout/produkt.hintergrund.fff.100.ecken.png") no-repeat; } .nav-inline li { margin: 0px 0 10px 0; float: left; } .nav-inline a { padding: 0px 10px 0px 10px; color: #555555; font-family: "Lucida Sans W01 Roman",sans-serif; font-size: 14px; line-height: 16px; background: url("../pics/layout/tab.trenner.gif") no-repeat; background-position: right 0; } .nav-inline .active a,.nav-inline a:hover { color: #BB0000; } .nav-inline div.active { line-height: 16px; background: url("../pics/layout/tab.aktiv.png") no-repeat scroll center 11px transparent; } .nav-inline ul { width: 800px; float: left; } .nav-inline a.letzter { background: none; } /* Toolbox */ .toolbox { position: absolute; top:72px; margin-left: 840px; width: 140px; } .toolbox a.print-button:link { margin-top: 2px; float: right; width: 21px; height: 21px; line-height: 25px; background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .toolbox a.print-button:visited { background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .toolbox a.print-button:hover { background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .toolbox a.print-button:active { background: url(../pics/layout/icons.print.png) no-repeat 0 -30px } .toolbox-promo { top:126px; width: 106px; } .toolbox .facebook-button { width: 76px; overflow: hidden; float: left } /* Sitemap */ .sitemap li { margin: 5px 0 0 0; display: block; } .sitemap .ebene-1 { font-size: 16px; margin: 15px 0 0 0; display: block; } .sitemap .ebene-3 { margin: 0 0 5px 32px; display: block; } .sitemap .icon { display: inline-block; margin: 10px 0 0 5px; padding: 0 20px 0 0; background: url("../pics/layout/grafikelemente.png") no-repeat scroll -11px -419px transparent; } /* D4C Navigation */ .d4c-navigation { height: 23px; background: url(../pics/layout/d4c.navigation.png) repeat-x 0 0; margin: 0 0 0 183px; } .d4c-navigation ul { padding: 0; line-height: 1px } .d4c-navigation ul li { padding: 0 10px 0 11px; font-family: "Lucida Sans W01 Roman", sans-serif; float: left; background: url(../pics/layout/d4c.navigation.png) no-repeat 0 -23px; } .d4c-navigation ul li.erster { background: url(../pics/layout/d4c.navigation.png) no-repeat 0 -46px; } .d4c-navigation ul li a { color: #555555; font-size: 11px; line-height: 23px; font-family: "Lucida Sans W01 Roman", sans-serif; } .d4c-navigation ul li span { color: #DD1930; font-size: 11px; line-height: 23px; font-family: "Lucida Sans W01 Roman", sans-serif; } .d4c-navigation ul li a:hover { color: #DD1930; } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Footernavigation */ .footernavigation { float: left; min-width: 300px } .footernavigation li { display: inline; margin: 0 0 0 19px } .footernavigation a:link { color: #FFF; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 9px; line-height: 32px; text-transform: uppercase } .footernavigation a:visited { color: #FFF; font-size: 9px; font-weight: bold; text-transform: uppercase } .footernavigation a:hover { color: #DD1930 } .footernavigation a:active { color: #DD1930 } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Hauptnavigation */ .navigation { float: left; padding: 0 0 0 34px; background: url(../pics/layout/h1.trenner.png) no-repeat 34px 0 } .navigation ul { overflow: visible; margin: 0; border: 0; padding: 0 } .navigation li { float: left; display: block; position: relative; z-index: 50; background: url(../pics/layout/h1.trenner.png) no-repeat right 0 } .navigation .hatkinder { cursor: default; } .navigation span.kinder { cursor: default; } .navigation li li { background: none } .navigation .level2 { display: none; position: absolute; top: 47px; left: 0; z-index: 50 } .navigation li:hover .level2 { display: block } .navigation a:link, .navigation a:visited { display: block; padding: 0 19px; color: #555; font-family: "Century Gothic W01", sans-serif; font-size: 16px; line-height: 47px; text-transform: none; font-weight: normal; } .navigation a:hover { color: #DD1930; } .navigation a:active { color: #DD1930; } .navigation a:link sup { color: #555; } .navigation a:hover sup { color: #DD1930 } .navigation a:active sup { color: #555 } /* Hauptnavigation: Ebene 1 */ .navigation .ebene-1, .navigation .ebene-1:link, .navigation .ebene-1:visited { display: block; padding: 0 19px; color: #555; font-family: "Century Gothic W01", sans-serif; font-size: 16px; line-height: 47px; } .navigation .ebene-1-aktiv, .navigation .ebene-1-aktiv:link, .navigation .ebene-1-aktiv:visited { display: block; padding: 0 19px; color: #DD1930; font-family: "Century Gothic W01", sans-serif; font-size: 16px; line-height: 47px; } /* Hauptnavigation: Ebene 2 */ .navigation .ebene-2-aktiv, .navigation .ebene-2-aktiv span, .navigation .ebene-2-aktiv:link, .navigation .ebene-2-aktiv:visited { color: #555!important } .navigation .ebene-2-aktiv:hover { color: #DD1930!important; } .navigation ul ul li { background-color: #F7F5F4 } .navigation ul ul li:hover { background-color: #FFF } .navigation ul ul li.letzter { background: transparent url(../pics/layout/h1.hg.level2.png) no-repeat 0 bottom } .navigation ul ul li.letzter:hover { background: transparent url(../pics/layout/h1.hg.level2.png) no-repeat right bottom } .navigation ul ul .hover { background-image: url(../pics/layout/h1.hg.level2.teaser.png)!important } .navigation ul ul a, .navigation ul ul a:link, .navigation ul ul a:visited { width: 158px; display: block; border-bottom: 1px solid #E6E5E4; padding: 9px 19px; color: #555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 16px } .navigation ul ul a:hover { color: #DD1930; background-color: #FFF } .navigation ul ul a.letzter:link, .navigation ul ul a.letzter:visited { border: 0; padding-bottom: 19px } .navigation ul ul a.letzter:hover { color: #DD1930; background: transparent url(../pics/layout/h1.hg.level2.png) no-repeat right bottom } .navigation ul ul a:link span, .navigation ul ul a:visited span { display: block; color: #555 } .navigation ul ul a:hover span { color: #DD1930; background-color: #FFF } .navigation .kinder { font-size: 13px; font-family: "Lucida Sans W01 Roman",sans-serif; padding: 0 8px 0 0; background: url(../pics/layout/link.text.mehr.png) no-repeat right center } /* Hauptnavigation: Ebene 3 */ .navigation .level3 { display: none; position: absolute; z-index: 50; left: 196px; top: 0 } .navigation .ebene-3-aktiv, .navigation .ebene-3-aktiv:link, .navigation .ebene-3-aktiv:visited { color: #DD1930 } .navigation ul ul li:hover .level3 { display: block } .navigation ul ul ul li { background: transparent } .navigation ul ul ul li:hover { background: transparent } .navigation ul ul ul a, .navigation ul ul ul a:link { width: 158px; display: block; background-color: #FFF; border: 0; padding: 5px 19px; color: #555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 16px } .navigation ul ul ul a:hover { color: #DD1930 } .navigation ul ul ul a:active { color: #555 } .navigation ul ul ul a.erster:link, .navigation ul ul ul a.erster:visited { padding-top: 9px; } .navigation ul ul ul a.letzter:link, .navigation ul ul ul a.letzter:visited { border: 0; padding-bottom: 19px; background: transparent url(../pics/layout/h1.hg.level3.png) no-repeat right bottom } .navigation ul ul ul a.letzter:hover { color: #DD1930 } .navigation ul ul ul a.letzter:active { color: #555 } .navigation ul ul ul a.einziger:link , .navigation ul ul ul a.einziger:visited { border: 0; padding-top: 9px; padding-bottom: 19px; background: transparent url(../pics/layout/h1.hg.level3.png) no-repeat right bottom } .navigation ul ul ul a.teaser-navi, .navigation ul ul ul a.teaser-navi:link, .navigation ul ul ul a.teaser-navi:visited, .navigation ul ul ul a.teaser-navi:hover, .navigation ul ul ul a.teaser-navi:active { margin: 0; border: 0; padding: 0; display: block; width: auto; background: transparent; position: relative } .navigation ul ul ul .teaser-navi img { margin: 0; border: 0; padding: 0; display: block; position: absolute; bottom: 0; left: 0 } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Metanavigation */ .metanavigation { float: right; line-height: 16px } .metanavigation ul { padding: 0 23px 0 5px } .metanavigation li { display: inline; margin: 0 10px 10px 10px; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 9px; line-height: 25px; text-transform: uppercase } .metanavigation a:link, .metanavigation a:visited { color: #555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 9px; text-transform: uppercase } .metanavigation a:hover { color: #DD1930; } .metanavigation a:active { color: #DD1930; } .metanavigation a img { margin: 4px 0 0 0; vertical-align: top } /* Metanavigation: Ebene 1 */ .metanavigation .ebene-1, .metanavigation .ebene-1:link { color: #555; } .metanavigation .ebene-1:visited { font-size: 9px; } .metanavigation .ebene-1:hover { color: #DD1930; } .metanavigation .ebene-1:active { color: #DD1930; } .metanavigation .ebene-1-aktiv, .metanavigation .ebene-1-aktiv:link { color: #DD1930; } .metanavigation .ebene-1-aktiv:visited { font-size: 9px; } .metanavigation .ebene-1-aktiv:hover { color: #DD1930; } .metanavigation .ebene-1-aktiv:active { color: #DD1930; } /* Metanavigation: Break (2. Zeile) */ .metanavigation-break { float: right; line-height: 16px } /* Servicenavigation */ .navi-service .ebene-2 { margin: 0 5px 0 0 } .navi-service { padding: 5px 0 10px 0 } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Social-Media und Drucken - Bereich */ .coffee-experience-header .functions a.print-button { margin: 1px 3px 0 1px; }/* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Tipps und Tricks: { opacity: .5; filter:alpha(opacity=50) } */ /* Modul: Produkt */ .modul-produkt { } .modul-produkt .liste {} .modul-produkt .detail { width: 960px; background-color: #DD1930; position: relative } .modul-produkt .detail .arrow-bar { position: absolute; width: 11px; height: 5px; background: url(../pics/layout/tab.aktiv.png) no-repeat center 0 } .modul-produkt .detail .tab-toolbar { background-color: #FFF; padding: 0 0 0 20px } .modul-produkt .detail .tab-toolbar .functions { text-align: right; float: right; width: 110px; padding: 8px 19px 0 0 } .modul-produkt .detail .tab-toolbar .facebook-button { width: 84px; float: left; overflow: hidden; } .modul-produkt .detail .tab { overflow: hidden; background-color: #DD1930 } .modul-produkt .detail .tab-label { padding: 0 15px; background: url(../pics/layout/tab.trenner.gif) no-repeat right 6px #FFF; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 14px; line-height: 36px; color: #555; text-transform: uppercase } .modul-produkt .detail .letzter { background:none; } .modul-produkt .detail .tab-hover, .modul-produkt .detail .tab-active { color: #DD1930 } .modul-produkt .detail .tab-content { min-height: 420px; padding: 25px 50px 25px 25px; } .modul-produkt .detail .produkt-embed { text-align: right; padding: 20px 0; } .modul-produkt .detail .produkt-embed > * { max-width: 400px; display: inline-block; overflow: hidden } .modul-produkt .detail .tab-einziger { background-image: none } .modul-produkt .produkt-details .tab-content sup { color: #555555 } .modul-produkt .produkt-details .tab-content p { color: #555555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; } .modul-produkt .detail .produkt-bild { float: left; width: 485px } .modul-produkt .detail .produkt-bild .bild { display: block } .modul-produkt .detail h1 { margin: 0 0 0 485px; padding: 20px 0 0 0; font-family: "Century Gothic W01", sans-serif; font-size: 32px; line-height: 31px } .modul-produkt .detail h2 { margin: 16px 0 0 485px; padding: 0 0 25px 0; font-family: "Century Gothic W01", sans-serif; font-size: 16px; line-height: 20px } .modul-produkt .detail .text { margin: 0 0 0 485px; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 16px } .modul-produkt .detail .text p { font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 16px; color: #FFF } .modul-produkt .detail .text ol, .modul-produkt .detail .text ul { list-style-position: outside; } .modul-produkt .detail .text li { font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px;} .modul-produkt .detail .schatten { background: url(../pics/layout/produkt.detail.schatten.png) no-repeat; background-size: 100% 100%; } .modul-produkt .detail .view360 { background: transparent!important; background-color: #FFF!important } .modul-produkt .detail .view360-grey { background: transparent!important; background-color: #D5D5D5!important } .modul-produkt .detail .view360-grey .tab-content, .modul-produkt .detail .view360 .tab-content, .modul-produkt .detail .online-special .tab-content { padding: 0; overflow: hidden } .modul-produkt .detail .online-special .tab-content div { text-align: center; margin-top: 75px; } .modul-produkt .detail .online-special .tab-content img { cursor: pointer; } .modul-produkt .detail .view360 .flash, .modul-produkt .detail .view360 .flash-rechts, .modul-produkt .detail .view360-grey .flash, .modul-produkt .detail .view360-grey .flash-rechts { text-align: center } .modul-produkt .detail .view360 iframe { padding: 0; margin: 0 } /* Modul: Produkt Farbvarianten */ .modul-produkt .detail .varianten { overflow: hidden; height: 105px } .modul-produkt .detail .varianten span { opacity: .5; filter: alpha(opacity=50) } .modul-produkt .detail .varianten .aktiv span, .modul-produkt .detail .varianten .farbvariante:hover span { opacity: 1; filter: alpha(opacity=100) } .modul-produkt .detail .varianten { width: 470px; position: relative; } .modul-produkt .detail .varianten .liste { width: 465px; height: 90px; position: relative; margin: 0 15px; } .modul-produkt .detail .varianten .zeile { float: left; width: 150px; height: 90px; margin: 0; text-align: center } .modul-produkt .detail .varianten .zeile img { display: block; padding: 0 7px; } .modul-produkt .detail .varianten .zeile span { } .modul-produkt .detail .varianten a.page-back:link { width: 12px; height: 20px; position: absolute; left: 0; top: 20px; z-index: 10; display: block; background: url("../pics/layout/produkt.filter.buttons.png") no-repeat scroll 0 0 / 27px 42px rgba(0, 0, 0, 0) } .modul-produkt .detail .varianten a.page-back:visited { } .modul-produkt .detail .varianten a.page-back:hover { background-position: 0 -20px } .modul-produkt .detail .varianten a.page-back:active { } .modul-produkt .detail .varianten a.page-next:link { width: 12px; height: 20px; position: absolute; right: 0; top: 20px; z-index: 10; display: block; background: url("../pics/layout/produkt.filter.buttons.png") no-repeat scroll right top / 27px 42px rgba(0, 0, 0, 0) } .modul-produkt .detail .varianten a.page-next:visited { } .modul-produkt .detail .varianten a.page-next:hover { background-position: right -20px } .modul-produkt .detail .varianten a.page-next:active { } .farbvariante { display: block; float: left; width: 150px; text-align: center; overflow: hidden; } .farbvariante img { display: block; margin: 5px auto; box-sizing: border-box; } .farbvariante > div { display: inline-block; text-align: center; } /* Modul: Produkt Details */ .modul-produkt .produkt-row { width: 960px; background-color: #ffffff; position: relative; } .modul-produkt .produkt-row .produkt-row-wrapper { background: #ffffff none repeat scroll 0 0; overflow: hidden; padding: 25px; display: flex; justify-content: space-between; align-items: center; } .modul-produkt .produkt-row .logo { float: left; width: 160px; height: 124px; text-align: center; } .modul-produkt .produkt-row .intro { float: left; width: 320px; box-sizing: border-box; background-color: #ffffff; position: relative; } .modul-produkt .produkt-row .badges { float: left; width: 160px; height: 100%; background-color: #ffffff; position: relative; text-align: center; display: flex; justify-content: center; align-items: center; flex-direction: column; } .modul-produkt .produkt-row .badge { display: inline-block; } .modul-produkt .produkt-row .badge .appstore { width: 140px; display: block; } .modul-produkt .produkt-row .badge .playstore { width: 160px; display: block; } .modul-produkt .produkt-row .badge img { width: 160px; height: auto; } .modul-produkt .produkt-row .badge a { float: left; display: block; overflow: hidden; } .modul-produkt .produkt-row .app-title { font-family: "Century Gothic W01", sans-serif; font-size: 16px; line-height: 21px; color: #555555; margin-bottom: 15px; } .modul-produkt .produkt-row .app-text { color: #555555; } .modul-produkt .produkt-row sup { color: #555555; } .modul-produkt .produkt-row .qrcode { float: left; width: 160px; height: 124px; text-align: center; } .modul-produkt .produkt-row .qrcode img { width: 100%; max-width: 124px; height: auto; } /* Modul: Produkt Details */ .modul-produkt .produkt-details { width: 960px; overflow: hidden; background: url(../pics/layout/produkt.hintergrund.fff.90.png) repeat } .modul-produkt .produkt-details .tab-toolbar { float: left; width: 223px; border-top: 1px solid #CCC; margin: 19px 0 0 19px } .modul-produkt .produkt-details .tab-toolbar .tab-active { background: url(../pics/layout/link.text.aktiv.png) no-repeat right center; color: #DD1930 } .modul-produkt .produkt-details .tab { margin: 0 0 0 242px; background-color: transparent } .modul-produkt .produkt-details .tab-label { width: 100%; border-bottom: 1px solid #CCC; padding: 0; background-color: transparent; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 20px; color: #555 } .modul-produkt .produkt-details .tab-content { padding: 19px } .modul-produkt .produkt-details .tab-hover { color: #DD1930 } .modul-produkt .produkt-details .pages { width: 333px; height: 273px; overflow: hidden; position: relative } .modul-produkt .produkt-details .bild { float: right; width: 333px } .modul-produkt .produkt-details .text { float: left; padding: 19px; width: 295px; height: 235px; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 13px; line-height: 16px; color: #555; background: url(../pics/layout/produkt.detail.text.hg.png) no-repeat } .modul-produkt .produkt-details .text h4 { font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 16px; line-height: 20px; color: #555 } .modul-produkt .produkt-details .text a { color: #555555 } .modul-produkt .produkt-details .text a:hover { color: #DD1930 } .modul-produkt .produkt-details .text ul li { color: #555555 } .produkt-details .paging { position: absolute; width: 75px; height: 20px; left: 150px; bottom: 8px; z-index: 10; overflow: hidden } .produkt-details .paging .punkt { float: left; width: 18px; height: 18px; background: url(../pics/layout/produkt.paging.png) no-repeat -20px -17px } .produkt-details .paging .punkt-aktiv { width: 18px; height: 18px; background: url(../pics/layout/produkt.paging.png) no-repeat -20px 0 } .produkt-details a.page-back { width: 18px; height: 18px; position: absolute; left: 100px; bottom: 10px; z-index: 10; display: block; background: url(../pics/layout/produkt.paging.png) no-repeat 0 0 } .produkt-details a.page-back:hover { background-position: 0 -16px } .produkt-details a.page-next { width: 18px; height: 18px; position: absolute; right: 100px; bottom: 10px; z-index: 10; display: block; background: url(../pics/layout/produkt.paging.png) no-repeat -38px 0 } .produkt-details a.page-next:hover { background-position: -38px -16px } .modul-produkt .btn-order { margin: 19px 0 } .modul-produkt .btn-search { margin: 19px 0 } /* Modul: Produkt Awards */ .modul-produkt .awards-links { width: 960px; overflow: hidden; border-top: 1px solid #CCC; background: url(../pics/layout/produkt.hintergrund.fff.100.png) } .modul-produkt .awards { float: left; width: 353px; padding: 19px 10px 0 19px; overflow: hidden } .modul-produkt .awards .liste { width: 353px; height: 60px; overflow: hidden; position: relative } .modul-produkt .awards .award { float: left; width: 176px; height: 60px; border-right: 1px solid #CCC; text-align: center } .modul-produkt .awards .award-letzter { border: 0 } .awards a.page-back { width: 18px; height: 18px; position: absolute; left: 0; bottom: 20px; z-index: 10; display: block; background: url(../pics/layout/produkt.paging.png) no-repeat -4px 0 } .awards a.page-back:hover { background-position: -4px -16px } .awards a.page-next { width: 18px; height: 18px; position: absolute; right: 0; bottom: 20px; z-index: 10; display: block; background: url(../pics/layout/produkt.paging.png) no-repeat -32px 0 } .awards a.page-next:hover { background-position: -32px -16px } /* Modul: Produkt Links */ .modul-produkt .links { float: left; width: 558px; padding: 19px 0 0 0; overflow: hidden } .modul-produkt .links .liste { overflow: hidden; height: 50px; padding: 7px 0 0 19px; background: url(../pics/layout/produkt.links.hg.png) no-repeat } .modul-produkt .links .link { float: left; width: 167px; height: 29px } .modul-produkt .links a:link, .modul-produkt .links a:visited { text-transform: none; background-repeat: no-repeat; padding: 1px 0 1px 20px; font-size: 11px; line-height: 15px; color: #555 } .modul-produkt .links a:hover { color: #DD1930;} .modul-produkt .links a:active { } .modul-produkt .links .pdf { background: url(../pics/layout/produkt.links.icon.pdf.png) 0 0 } .modul-produkt .links .service { background: url(../pics/layout/produkt.links.icon.service.png) 0 0 } .modul-produkt .links .hilfe { background: url(../pics/layout/produkt.links.icon.hilfe.png) 0 0 } .modul-produkt .links .info { background: url(../pics/layout/produkt.links.icon.info.png) 0 0 } .modul-produkt .links .registrierung { background: url(../pics/layout/produkt.links.icon.registrierung.png) 0 0 } .modul-produkt .links .vergleich { background: url(../pics/layout/produkt.links.icon.vergleich.png) 0 0 } .modul-produkt .abschluss { width: 960px; height: 19px; background: url(../pics/layout/produkt.hintergrund.fff.100.ecken.png) no-repeat 0 bottom } /* Modul: Produkt Filter */ .modul-produkt .filter { width: 960px; height: 245px; position: relative; background: url(../pics/layout/produkt.filter.hg.png) no-repeat } .modul-produkt .filter .liste { width: 850px; height: 245px; position: relative; overflow: hidden; margin: 0 55px; } .modul-produkt .filter .zeile { float: left; min-width: 170px; height: 150px; margin: 65px 0 0 0; text-align: center } .modul-produkt .filter .zeile img { display: block; padding: 0 7px; } .modul-produkt .filter .zeile span { } .modul-produkt .filter a.page-back:link { width: 19px; height: 30px; position: absolute; left: 19px; top: 105px; z-index: 10; display: block; background: url(../pics/layout/produkt.filter.buttons.png) no-repeat 0 0 } .modul-produkt .filter a.page-back:visited { } .modul-produkt .filter a.page-back:hover { background-position: 0 -30px } .modul-produkt .filter a.page-back:active { } .modul-produkt .filter a.page-next:link { width: 19px; height: 30px; position: absolute; right: 19px; top: 105px; z-index: 10; display: block; background: url(../pics/layout/produkt.filter.buttons.png) no-repeat right 0 } .modul-produkt .filter a.page-next:visited { } .modul-produkt .filter a.page-next:hover { background-position: right -30px } .modul-produkt .filter a.page-next:active { } .modul-produkt .filter .label-aktiv { margin: 0 auto; width: 164px; position: relative; top: -10px } .modul-produkt .filter .label { display: block; margin: 0 auto; width: 164px; position: relative; top: -10px; text-align: center } .modul-produkt .filter .ecke-lo { display: block; float: left; min-width: 10px; height: 10px } .modul-produkt .filter .ecke-ro { display: block; min-width: 10px; height: 10px; margin: 0 0 0 10px } .modul-produkt .filter .label-text { display: block; text-align: center; padding: 0 2px; } .modul-produkt .filter .ecke-lu { display: block; float: left; min-width: 10px; height: 10px } .modul-produkt .filter .ecke-ru { display: block; min-width: 10px; height: 10px; margin: 0 0 0 10px } .modul-produkt .filter .label-aktiv .ecke-lo, .modul-produkt .filter a:hover .label .ecke-lo { background: url(../pics/layout/produkt.filter.produkt.aktiv.oben.png) no-repeat left top } .modul-produkt .filter .label-aktiv .ecke-ro, .modul-produkt .filter a:hover .label .ecke-ro { background: url(../pics/layout/produkt.filter.produkt.aktiv.oben.png) no-repeat right top } .modul-produkt .filter .label-aktiv .label-text, .modul-produkt .filter a:hover .label .label-text { background: url(../pics/layout/produkt.filter.produkt.aktiv.unten.png) no-repeat center top } .modul-produkt .filter .label-aktiv .ecke-lu, .modul-produkt .filter a:hover .label .ecke-lu { background: url(../pics/layout/produkt.filter.produkt.aktiv.unten.png) no-repeat left bottom } .modul-produkt .filter .label-aktiv .ecke-ru, .modul-produkt .filter a:hover .label .ecke-ru { background: url(../pics/layout/produkt.filter.produkt.aktiv.unten.png) no-repeat right bottom } .filter .liste-kategorien { position: absolute; z-index: 20; top: 21px; left: 0; width: 960px; height: 28px; text-align: center } .liste-kategorien span { padding: 6px 1px 7px 0; background: url(../pics/layout/produkt-nav-trenner.png) repeat-y right top; } .liste-kategorien a.kategorie:link, .liste-kategorien a.kategorie:visited { font-weight: normal; font-size: 12px; text-transform: none; color: #FFF; padding: 8px 20px; margin: 0; line-height: 29px; background: url(../pics/layout/produkt.filter.filter.hg.png) no-repeat center 2px } .liste-kategorien a.kategorie:hover { color: #FFF; background-position: center -29px } .liste-kategorien a.kategorie:active { color: #FFF; background-position: center -29px } .liste-kategorien a.kategorie-erster:link, .liste-kategorien a.kategorie-erster:visited { background-position: 0 2px } .liste-kategorien a.kategorie-erster:hover { background-position: 0 -29px } .liste-kategorien a.kategorie-erster:active { background-position: 0 -29px } .liste-kategorien a.kategorie-letzter:link, .liste-kategorien a.kategorie-letzter:visited { background-position: right 2px } .liste-kategorien a.kategorie-letzter:hover { background-position: right -29px } .liste-kategorien a.kategorie-letzter:active { background-position: right -29px } .liste-kategorien a.kategorie-aktiv:link, .liste-kategorien a.kategorie-aktiv:visited { font-weight: normal; font-size: 12px; text-transform: none; color: #FFF; padding: 8px 20px; margin: 0; line-height: 29px; background: url(../pics/layout/produkt.filter.filter.hg.png) no-repeat center -29px } .liste-kategorien a.kategorie-aktiv:hover { color: #FFF; background-position: center -29px } .liste-kategorien a.kategorie-aktiv:active { color: #FFF; background-position: center -29px } .liste-kategorien a.kategorie-erster-aktiv:link, .liste-kategorien a.kategorie-erster-aktiv:visited { background-position: 0 -29px } .liste-kategorien a.kategorie-erster-aktiv:hover { background-position: 0 -29px } .liste-kategorien a.kategorie-erster-aktiv:active { background-position: 0 -29px } .liste-kategorien a.kategorie-letzter-aktiv:link, .liste-kategorien a.kategorie-letzter-aktiv:visited { background-position: right -29px } .liste-kategorien a.kategorie-letzter-aktiv:hover { background-position: right -29px } .liste-kategorien a.kategorie-letzter-aktiv:active { background-position: right -29px } .liste-kategorien a.kategorie-einziger-aktiv span { color: #FFF; padding: 6px 0; margin: 0; line-height: 29px; background: url(../pics/layout/produkt.filter.filter.hg.png) no-repeat center -31px } .liste-kategorien a.kategorie-einziger-aktiv .start { background-position: left -31px } .liste-kategorien a.kategorie-einziger-aktiv .ende { background-position: right -31px } /* Modul: Produkt Functions */ .modul-produkt .functions { overflow: hidden } .modul-produkt .functions iframe { float: right; margin-right: 5px; } .modul-produkt .functions a.print-button:link { float: right; width: 21px; height: 21px; line-height: 25px; background: url(../pics/layout/icons.print.png) no-repeat 0 -29px } .modul-produkt .functions a.print-button:visited { background: url(../pics/layout/icons.print.png) no-repeat 0 -29px } .modul-produkt .functions a.print-button:hover { background: url(../pics/layout/icons.print.png) no-repeat 0 -29px } .modul-produkt .functions a.print-button:active { background: url(../pics/layout/icons.print.png) no-repeat 0 -29px } /* Promo Functions */ .toolbox a.print-button:link { float: right; width: 21px; height: 21px; line-height: 25px; background: url(../pics/layout/icons.print.png) no-repeat 0 -29px; margin-top: 0 } .toolbox a.print-button:visited { background: url(../pics/layout/icons.print.png) no-repeat 0 -29px } .toolbox a.print-button:hover { background: url(../pics/layout/icons.print.png) no-repeat 0 -29px } .toolbox a.print-button:active { background: url(../pics/layout/icons.print.png) no-repeat 0 -29px } a.print-button img { display: block } /* Modul: Produkt Videos */ .video-tab-toolbar { position: absolute; top: 440px; width: 640px; text-align: center } .video-tab-toolbar .video-tab-active { border: 1px solid #F00; margin: 0 5px 0 0 } .video-tab { width: 640px; margin: 0 auto } .video-tab-label { margin: 1px 6px 1px 1px } .video-tab-content { padding: 0 0 5px 0 } .tab-content .video-youtube { width: 640px; margin: 0 auto } /* Modul: Produkt Online Special */ .dialog .online-special-modal-content { padding: 0 10px 10px 10px; background-color: #FFF } .dialog .online-special-modal-content h1 { padding: 0 0 0 4px; font-size: 14px; color: #555; line-height: 30px } .dialog .online-special-modal-content h1 sup { color: #555; } .dialog .close { position: absolute; top: 25px; right: 20px; color: #000; font-size: 14px; cursor: pointer; } /* allgemeine Toolbar */ .tab-toolbar { overflow: hidden } .tab-toolbar .tab-label { float: left; min-width: 5px; cursor: pointer } /* Produkt Standard Tab */ .produkt-standard-tab .bild { float: left; width: 500px } .produkt-standard-tab .titel { margin: 0 } .responsive .page { width: inherit; max-width: 960px; } .responsive .no-sidepadding { padding-left: 0 !important; padding-right: 0 !important; } .responsive .navigation * { -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; }/* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Basisdefinitionen */ .socialbuttons a.socialbutton:link, .socialbuttons a.socialbutton:visited { background-repeat: no-repeat; background-position: 0 0 } .socialbuttons a.socialbutton:hover { background-position: 0 -33px } .socialbuttons a.socialbutton:active { background-position: 0 -33px } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Sprachumschaltung */ .sprachnavigation { float: right; height: 22px; } .sprachnavigation ul { overflow: visible; margin: 0; border: 0; padding: 0 } .sprachnavigation li { float: left; display: block; position: relative; z-index: 50; margin: 0 0 10px 5px; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 9px; line-height: 25px; text-transform: uppercase } .sprachnavigation a:link, .sprachnavigation a:visited { padding: 0 4px 0 5px; color: #555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 9px; text-transform: uppercase; } .sprachnavigation a:hover { color: #DD1930; background-color: #F7F5F4 } .sprachnavigation a:active { color: #DD1930 } /* Sprachumschaltung: Ebene 1 */ .sprachnavigation .ebene-1-aktiv, .sprachnavigation .ebene-1-aktiv:link, .sprachnavigation .ebene-1-aktiv:visited { color: #DD1930 } .sprachnavigation .ebene-1-aktiv:hover { color: #DD1930 } .sprachnavigation .ebene-1-aktiv:active { color: #DD1930 } .sprachnavigation .level2 { display: none; position: absolute; z-index: 50; left: 0; border-top: 1px solid #D7D7D8 } .sprachnavigation li:hover .level2 { display: block } .sprachnavigation ul ul li { padding: 0; background: none; position: static; background-color: #F7F5F4; margin: 0 } .sprachnavigation ul ul li.letzter { background: transparent url(../pics/layout/sprache.hg.png) no-repeat 0 bottom } .sprachnavigation li:hover { background-color: #F7F5F4 } .sprachnavigation ul ul a:link, .sprachnavigation ul ul a:visited { width: 64px; display: block; background-color: #F7F5F4; border: 0; padding: 2px 19px; color: #555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 11px; line-height: 13px; font-weight: normal; text-transform: none } .sprachnavigation ul ul a:hover { color: #DD1930 } .sprachnavigation ul ul a:active { color: #000 } .sprachnavigation ul ul a.aktiv:link, .sprachnavigation ul ul a.aktiv:visited { color: #000; border: 0; padding-bottom: 8px; background: transparent url(../pics/layout/sprache.hg.png) no-repeat 0 bottom } .sprachnavigation ul ul a.aktiv:hover { color: #DD1930 } .sprachnavigation ul ul a.aktiv:active { color: #000 } .sprachnavigation ul ul a.erster:link, .sprachnavigation ul ul a.erster:visited { border: 0; padding-top: 8px } .sprachnavigation ul ul a.erster:hover { color: #DD1930 } .sprachnavigation ul ul a.erster:active { color: #000 } .sprachnavigation ul ul a.letzter:link, .sprachnavigation ul ul a.letzter:visited { border: 0; padding-bottom: 8px; background: transparent url(../pics/layout/sprache.hg.png) no-repeat 0 bottom } .sprachnavigation ul ul a.letzter:hover { color: #DD1930 } .sprachnavigation ul ul a.letzter:active { color: #000 } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Suche */ .suche { float: right; height: 22px; } .suche ul { padding: 0; overflow: visible } .suche li { position: relative; display: inline; margin: 0; padding: 7px 10px 10px 0; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 9px; line-height: 25px; text-transform: uppercase } .suche li.search { background-color: #F7F6F5 } .suche a:link, .suche a:visited { background: url(../pics/layout/icons.search.png) no-repeat 11px 0; padding: 0 0 0 25px; color: #555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 9px; text-transform: uppercase } .suche a:hover { background-position: 11px bottom; color: #DD1930 } .suche a:active { background-position: 11px bottom; color: #DD1930 } .suche li.search a:link, .suche li.search a:visited { background-color: #F7F6F5; background-position: 11px bottom; color: #DD1930 } .suche li.search a:hover { } .suche li.search a:active { } .suche li .formular { text-transform: none; display: none; position: absolute; width: 269px; height: 43px; top: 30px; left: 0; padding: 5px 11px 11px 11px; background: url(../pics/layout/search.hg.png) no-repeat center bottom } .suche li.search .formular { display: block; z-index: 100; } .suche .formular label { display: block; padding: 5px 0 3px 0; color: #555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 9px; line-height: 11px } .suche .formular .form-text { color: #555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 11px; line-height: 15px; width: 182px; height: 19px; margin: 0 3px 0 0; border: 0; padding: 2px 4px; background: url(../pics/layout/search.field.hg.png) no-repeat 0 0 } .suche .formular .form-button { display: none } .suche li.search .formular a:link, .suche li.search .formular a:visited { padding: 0; background: none } .suche li.search .formular a:hover { } .suche li.search .formular a:active { } .filter-markieren { color: inherit; font-size: inherit; font-weight: inherit; } .suchergebnis-header { background: url("../pics/layout/hg-info.png") repeat scroll 0 0 transparent; overflow: hidden; padding: 0px 0 15px 20px; } .suchergebnis-header .formular { display: inline; float: left; width: 280px;} .suchergebnis-header .formular label { display: none;} .suchergebnis-header .formular .form-text { float: left; color: #555; font-family: "Lucida Sans W01 Roman", sans-serif; font-size: 11px; line-height: 15px; width: 182px; height: 19px; margin: 0 3px 0 0; border: 0; padding: 2px 4px; background: url(../pics/layout/search.field.hg.png) no-repeat 0 0 } .suchergebnis-header .formular .form-button { display: none; } .suchergebnis-header .treffer-kopf { margin-top: 4px; } .suchergebnis-header .button-23 { float: left; } .suchergebnis-trefferliste { padding-bottom: 80px;} .suchergebnis-trefferliste .liste { background: url(../pics/layout/suche.hg.90.png); padding-top: 1px;} .suchergebnis-trefferliste .treffer { margin: 20px; font-weight: bold;} .suchergebnis-trefferliste .treffer a:link { font-size: 14px;} .suchergebnis-trefferliste .treffer a:active { font-size: 14px;} .suchergebnis-trefferliste .treffer a:hover { font-size: 14px;} .suchergebnis-trefferliste .treffer a:visited { font-size: 14px;} .suchergebnis-trefferliste .linie { background: url(../pics/layout/suche_hr.png); height: 2px; width: 960px; } .suchergebnis-trefferliste .wortvorschlag { background: url(../pics/layout/suche.hg.90.png) repeat scroll 0 0 transparent; overflow: hidden; padding: 15px 0 0px 20px; } .suchergebnis-footer { text-align: center; height: 40px; padding-top: 20px; background: url(../pics/layout/hg-info-rand.png) no-repeat scroll 0 -68px transparent; } .suchergebnis-footer .paging { display: inline; margin: 0px; padding:0; } .suchergebnis-footer .paging .pageview-center { min-width: 1px; background: url(../pics/layout/paginierung-zahlen.png) repeat-x; margin: 0px; padding: 3px 0px 4px 0px; } .suchergebnis-footer .paging .pageview-center a { padding: 0px 5px 0px 5px; font-weight: bold;} .suchergebnis-footer .paging .pageview-center a:link { padding: 0px 5px 0px 5px; font-weight: bold;} .suchergebnis-footer .paging .pageview-center a:hover { color: #DD1930; padding: 0px 5px 0px 5px; font-weight: bold;} .suchergebnis-footer .paging .pageview-center a:visited { padding: 0px 5px 0px 5px; font-weight: bold;} .suchergebnis-footer .paging .pageview-center .paging-aktiv {color: #DD1930; font-weight: bold; } .suchergebnis-footer .paging .pageview-center a .paging-aktiv {color: #DD1930; font-weight: bold; } .suchergebnis-footer .paging .pageview-center a:link .paging-aktiv { color: #DD1930; font-weight: bold; } .suchergebnis-footer .paging .pageview-center a:hover .paging-aktiv { color: #DD1930; font-weight: bold; } .suchergebnis-footer .paging .pageview-center a:visited .paging-aktiv { color: #DD1930; font-weight: bold; } .suchergebnis-footer .paging .pageview-links { min-width: 1px; background: url(../pics/layout/paginierung-zahlen-ecken.png) repeat-x; margin: 0px; padding: 3px 0 4px 9px; } .suchergebnis-footer .paging .pageview-rechts { min-width: 1px; background: url(../pics/layout/paginierung-zahlen-ecken.png) -15px 0 repeat-x; margin: 0px; padding: 3px 13px 4px 0; } .suche li.search .formular a.button-23 { position: absolute; top: 25px; right: 12px } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Tipps und Tricks: { opacity: .5; filter:alpha(opacity=50) } */ /* Modul: Teaser */ .modul-teaser { } .footer .modul-teaser { width: 965px; overflow: hidden; margin: 0 auto; padding: 80px 0 0 0 } .footer .teaser-liste { width: 975px; overflow: hidden } a.teaser:link, a.teaser:visited { text-transform: none; float: left; display: block; width: 315px; height: 86px; margin: 0 10px 0 0; background: url(../pics/layout/teaser.hg.100.90.png) no-repeat 0 -90px } a.teaser:hover { background-position: 0 0 } a.teaser:active { } .teaser img { float: left; display: block; margin: 12px } .teaser .text { display: block; margin: 12px 12px 12px 114px; font-family: "Century Gothic W01", sans-serif; font-size: 12px; line-height: 15px; color: #555 } .teaser .text p { font-family: "Century Gothic W01", sans-serif; font-size: 12px; line-height: 15px; color: #555 } .teaser .text b, .teaser .text strong { font-family: "Century Gothic W01", sans-serif; font-size: 12px; line-height: 15px; color: #555; font-weight: bold } .teaser .text sup { color: #555 } .teaser .icon { padding: 0 15px 0 0; margin: 0 0 0 5px; background: url(../pics/layout/grafikelemente.png) no-repeat -11px -419px; display: inline-block } a.teaser:hover .icon { background: url(../pics/layout/grafikelemente.png) no-repeat -11px -419px } /* Teaser PromoListe */ .teaser-liste-zeile { width: 280px; margin: 20px 0 20px 30px; float: left; } .modul-teaser .erster { width: 960px; height: 325px; margin: 0 0 0 0; } .modul-teaser .erster .bild { float:left; margin: 65px 0 0 100px; } .modul-teaser .erster .text-liste { margin: 65px 0 0 465px; width: 440px; } .modul-teaser .erster h2 { font-size: 18px; } .modul-teaser .erster .untertitel { font-size: 16px; margin: 5px 0 5px 0; } .modul-teaser .btn-start { padding: 7px 5px 0 0; float:left; background: url(../pics/layout/buttons.hg.23.png) no-repeat 0 0; } .modul-teaser .btn-text { float:left; padding: 5px 0 5px 0; background: url(../pics/layout/buttons.hg.23.png) no-repeat right 0; color: #FFF; font-family: "Lucida Sans W01 Bold", sans-serif; font-size: 9px; font-weight: bold; text-transform: uppercase } .modul-teaser .btn-arrow { padding: 0 20px 0px 0; float:right; background: url(../pics/layout/link.text.normal.png) no-repeat; background-position: 8px 2px; } .modul-teaser a:hover .btn-start { background-position: 0 bottom; } .modul-teaser a:hover .btn-text { background-position: right -26px; color: #DD1930; } .modul-teaser a:hover .btn-arrow { background: url(../pics/layout/link.text.aktiv.png) no-repeat; background-position: 8px 2px; } .modul-teaser .teaser-zeilen { overflow: hidden; padding-top:0px;} .modul-teaser h2 { margin: 5px 0 5px 0; } .modul-teaser .more { margin: 10px 0 0 0; } .bg-teaser { padding-top: 0; overflow: hidden; } .modul-teaser .anzahl-2 { margin-left: 110px; margin-right: 70px; } .modul-teaser .anzahl-1 { margin-left: 340px; } .bg-teaser-footer { height: 15px; } .promotion-footer { text-align: center; height: 30px;} .promotion-footer .paging { display: inline; margin: 0px; padding:0; } .promotion-footer .paging .pageview-center { min-width: 1px; background: url(../pics/layout/paginierung-zahlen.png) repeat-x; margin: 0px; padding: 3px 0px 4px 0px; } .promotion-footer .paging .pageview-center a { padding: 0px 5px 0px 5px; font-weight: bold;} .promotion-footer .paging .pageview-center a:link { padding: 0px 5px 0px 5px; font-weight: bold;} .promotion-footer .paging .pageview-center a:hover { color: #DD1930; padding: 0px 5px 0px 5px; font-weight: bold;} .promotion-footer .paging .pageview-center a:visited { padding: 0px 5px 0px 5px; font-weight: bold;} .promotion-footer .paging .pageview-center .paging-aktiv {color: #DD1930; font-weight: bold; } .promotion-footer .paging .pageview-center a .paging-aktiv {color: #DD1930; font-weight: bold; } .promotion-footer .paging .pageview-center a:link .paging-aktiv { color: #DD1930; font-weight: bold; } .promotion-footer .paging .pageview-center a:hover .paging-aktiv { color: #DD1930; font-weight: bold; } .promotion-footer .paging .pageview-center a:visited .paging-aktiv { color: #DD1930; font-weight: bold; } .promotion-footer .paging .pageview-links { min-width: 1px; background: url(../pics/layout/paginierung-zahlen-ecken.png) repeat-x; margin: 0px; padding: 3px 0 4px 9px; } .promotion-footer .paging .pageview-rechts { min-width: 1px; background: url(../pics/layout/paginierung-zahlen-ecken.png) -15px 0 repeat-x; margin: 0px; padding: 3px 13px 4px 0; } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* TinyMCE Style Dropdown */ /* Eintrag: Title=titel */ .titel { margin: 0 0 9px 0; font-size: 19px; line-height: 22px; color: #555; display: block } /* Eintrag: Melitta Rot=melitta-rot */ .melitta-rot { color: #dd1930 !important; } .timeline-content .titel { color: #FFF }/* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ /* Webfonts */ /* font-family:'Century Gothic W01'; font-family:'Century Gothic W01 Bold'; font-family:'Lucida Sans W01 Roman'; font-family:'Lucida Sans W01 Bold'; http://fast.fonts.net/cssapi/68841e47-767e-4089-9429-2d32c8415400.css */ /* Selection des Jahres 2013 */ @font-face { font-family: 'papyrus_plainregular'; src: url('webfonts/papyrusplain.eot'); src: url('webfonts/papyrusplain.eot?#iefix') format('embedded-opentype'), url('webfonts/papyrusplain.woff') format('woff'), url('webfonts/papyrusplain.ttf') format('truetype'), url('webfonts/papyrusplain.svg#papyrus_plainregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'pastelregular'; src: url('webfonts/pastel.eot'); src: url('webfonts/pastel.eot?#iefix') format('embedded-opentype'), url('webfonts/pastel.woff') format('woff'), url('webfonts/pastel.ttf') format('truetype'), url('webfonts/pastel.svg#pastelregular') format('svg'); font-weight: normal; font-style: normal; } /* (c) EIKONA AG, it.x informationssysteme gmbh, Alle Rechte vorbehalten. */ .timeline { position: relative; margin: 150px 0; height: 242px } .timeline .timeline-element { float: left; width: 223px; cursor: pointer } .timeline .timeline-element-lower { margin: 35px 0 0 0 } .timeline .timeline-element-lowest { margin: 70px 0 0 0 } .timeline .button-navigation { position: absolute; top: 400px; width: 100%; height: 23px; text-align: center; overflow: hidden; } .timeline .button-navigation a { padding: 0 5px 0 0; font-size: 20px; line-height: 23px; background: url(../pics/layout/timeline.button.hg.png) no-repeat center 0 } .timeline .button-navigation a span { padding: 4px 6px 4px 12px; vertical-align: top; line-height: 23px; background: url(../pics/layout/timeline.button.trenner.png) no-repeat 0 1px } .timeline .button-navigation a:hover, .timeline .button-navigation a.active { background-position: center -23px } .timeline .button-navigation a:hover span, .timeline .button-navigation a.active span { color: #DD1930 } .timeline .button-navigation a.first { background: url(../pics/layout/timeline.button.hg.png) no-repeat left 0 } .timeline .button-navigation a.first:hover, .timeline .button-navigation a.active-first { background-position: left -23px } .timeline .button-navigation a.first span { background: none } .timeline .button-navigation a.last { padding: 0 12px 0 0; background: url(../pics/layout/timeline.button.hg.png) no-repeat right 0 } .timeline .button-navigation a.last:hover, .timeline .button-navigation a.active-last { background-position: right -23px } .timeline .timeline-element-container {float: left; } .timeline .timeline-element-container .timeline-navi {display: none; } .button-navigation a { padding: 0 9px; line-height: 20px } .timeline-element .content { } .timeline-element .button { padding: 0 19px; background: url(../pics/layout/timeline.element.border.png) no-repeat 0 2px } .timeline-element .button h1 { margin: 0; font-family: "Century Gothic W01 Bold", sans-serif; font-size: 16px; line-height: 19px; color: #FFF; text-transform: uppercase } .timeline-element .button .bild { padding: 19px 0 } .timeline-element .button .titel-timeline h1 { font-family: "Century Gothic W01 Bold", sans-serif; font-size: 13px; line-height: 15px; color: #FFF; text-transform: uppercase } .timeline-element .button .titel-timeline h1 img { margin: 0 0 0 6px } .timeline-element .button .titel-timeline .arrow { margin-left: 3px; width: 6px; height: 9px; display: inline-block; background: url(../pics/layout/link.text.normal.png) no-repeat 0 0; } .timeline-element .button:hover .titel-timeline h1, .timeline-element .button:hover .titel-timeline h1 sup { color: #DD1930; } .timeline-element .button:hover .titel-timeline .arrow { background: url(../pics/layout/link.text.aktiv.png) no-repeat 0 0; } .timeline a.page-back:link, .timeline a.page-back:visited { width: 31px; height: 41px; position: absolute; left: 0; top: 110px; z-index: 10; display: block; overflow: hidden } .timeline a.page-back:hover { } .timeline a.page-back:active { } .timeline a.page-next:link, .timeline a.page-next:visited { width: 31px; height: 41px; position: absolute; right: 0; top: 110px; z-index: 10; display: block; overflow: hidden } .timeline a.page-next:hover { } .timeline a.page-next:active { } .timeline a.page-next .arrow { cursor: pointer; position: absolute; width: 31px; height: 41px; top: 0; right: 0; z-index: 20; background: url(../pics/layout/timeline.slider.button.right.png) no-repeat 0 0 } .timeline a.page-next:hover .arrow { background-position: 0 -41px } .timeline a.page-back .arrow { cursor: pointer; position: absolute; width: 31px; height: 41px; top: 0; left: 0; z-index: 20; background: url(../pics/layout/timeline.slider.button.left.png) no-repeat 0 0 } .timeline a.page-back:hover .arrow { background-position: 0 -41px } /* Dialog Timeline */ .dialog .timeline-content { background: url(../pics/layout/timeline.element.hg.png) no-repeat; overflow: hidden; text-align: right } .dialog .timeline-content a.close { display: block; position: absolute; top: 10px; right: 10px; width: 10px; height: 11px; background: url(../pics/layout/timeline.button.close.hg.png) no-repeat 0 0; font-size: 8px; line-height: 8px } .dialog .timeline-content a.close:hover { background-position: 0 -11px } .timeline-content .paragraphs { float: left; width: 292px; height: 275px; overflow: hidden; position: relative; margin: 19px } .timeline-content .paragraphs h1 { margin: 0; font-family: "Century Gothic W01 Bold", sans-serif; font-size: 16px; line-height: 19px; font-weight: bold; color: #FFF; text-transform: uppercase; opacity: .5; filter:alpha(opacity=40) } .timeline-content .paragraphs .text { float: left; width: 292px; height: 260px; color: #FFF; font-family: "Lucida Sans W01 Roman",sans-serif; font-size: 13px; line-height: 16px } .timeline-content .paragraphs .titel { font-family: "Century Gothic W01 Bold",sans-serif; } .timeline-content .paragraphs .text sup { color: #FFF; } .timeline-content .media { float: left; width: 291px; height: 275px; margin: 19px 0; padding: 0 19px; background: url(../pics/layout/timeline.element.border.png) no-repeat 0 4px } .timeline-content .media .viewport { float: left; width: 291px; height: 275px; overflow: hidden; position: relative } .timeline-content .media .stage div { float: left; width: 291px; height: 275px; color: #FFF; font-family: "Lucida Sans W01 Roman",sans-serif; font-size: 13px; line-height: 16px; text-align: center; } .timeline-content .paragraphs .paging { position: absolute; width: 75px; height: 20px; left: 150px; bottom: 8px; z-index: 10; overflow: hidden } .timeline-content .paragraphs a.page-back { width: 18px; height: 18px; position: absolute; left: 100px; bottom: 10px; z-index: 10; display: block; background: url(../pics/layout/timeline.text.paging.png) no-repeat 0 0 } .timeline-content .paragraphs a.page-back:hover { background-position: 0 -16px } .timeline-content .paragraphs a.page-next { width: 18px; height: 18px; position: absolute; right: 100px; bottom: 10px; z-index: 10; display: block; background: url(../pics/layout/timeline.text.paging.png) no-repeat -38px 0 } .timeline-content .paragraphs a.page-next:hover { background-position: -38px -16px } .timeline-content .paragraphs .paging .punkt { float: left; width: 18px; height: 18px; background: url(../pics/layout/timeline.text.paging.png) no-repeat -20px -17px } .timeline-content .paragraphs .paging .punkt-aktiv { width: 18px; height: 18px; background: url(../pics/layout/timeline.text.paging.png) no-repeat -20px 0 } .timeline-content .media .paging { display: none } .timeline-content .media a.page-back:link, .timeline-content .media a.page-back:visited { width: 18px; height: 18px; position: absolute; left: 331px; top: 156px; z-index: 10; display: block; overflow: hidden; background: url(../pics/layout/timeline.text.paging.png) no-repeat 1px 0 } .timeline-content .media a.page-back:hover { background-position: 1px -16px } .timeline-content .media a.page-back:active { } .timeline-content .media a.page-next:link, .timeline-content .media a.page-next:visited { width: 18px; height: 18px; position: absolute; right: 0; top: 156px; z-index: 10; display: block; overflow: hidden; background: url(../pics/layout/timeline.text.paging.png) no-repeat -38px 0 } .timeline-content .media a.page-next:hover { background-position: -38px -16px } .timeline-content .media a.page-next:active { } .body-timeline .dialog .close { display: none; }