img { display: block; } ul,ol { margin-left: 0; } b,strong,th { font-weight: normal; } h1,h2,h3,h4,h5,h6 { font-weight: normal; } hr { border: none; } html { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } input[type="text"], input[type="password"], input[type="email"], textarea { -webkit-appearance: none; } i { font-style: italic; } .dnone { display: none !important; } .clearfix:before,.clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; } .clearfix:after { clear: both; } *:before, *:after { box-sizing: inherit; } .ssFix:before { content: ""; display: inline-block; height: 100%; vertical-align: middle; } .ssFix [class*=ss-] { display: inline-block; vertical-align: middle; height:1.25em; } a, a:active, a:visited, .linkDecoration { color: var(--color_cLink); cursor: pointer; text-decoration: none; } a.noLinkDecoration { color: inherit; } a, a:active, a:visited, .linkDecoration { display: inline-block; } /**************** Wait Animation *********************/ #waitbox { display: none; } body.wait:not(.ignoreWait) #waitbox { display: block; } #waitbox>.overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--color_cBlack); opacity: 0.7; z-index: 99999; } #waitbox>.wait { background-color: var(--color_cWhite); border: 1px solid var(--color_cBlack); border-radius: 12px; box-shadow: 0 0 15px var(--color_cBlack); color: var(--color_cText); font-size: 18px; height: 160px; left: 50%; margin-left: -130px; margin-top: -80px; padding-top: 20px; position: fixed; text-align: center; top: 50%; width: 260px; z-index: 99999; } #waitbox>.wait .img { background-image: url('File/skeleton_html/loading.gif'); width: 32px; height: 32px; margin: 0 auto; } /************************* Wait for a block *****************************/ .waitBlock { position: relative; } /* Transparent Overlay */ .waitBlock::before { z-index:1; content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.75); } .waitBlock::after { z-index:2; position: absolute; top: calc(50% - 23px); left: calc(50% - 23px); content: " "; display: block; width: 46px; height: 46px; margin: 1px; border-radius: 50%; border: 5px solid red; border-color: var(--color_cCellmsBlue) transparent var(--color_cCellmsBlue) transparent; animation: lds-dual-ring 1.2s linear infinite; } @keyframes lds-dual-ring { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /******************************************************************************/ /******************************* Buttons ************************************/ /******************************************************************************/ .Page button, .defaultButton, .actionButton, .stateButton, .socialButton { cursor:pointer; display: inline-block; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; padding: 4px; border:none; text-decoration:none!important; } /*********** default / Subnavigation Button ***********/ .Page button.noStyle{ padding: 0; margin: 0; border: none; } .Page button, .defaultButton, a.defaultButton { color: var(--color_cWhite); background-color: var(--color_cLink); } /* merken button */ .defaultButton.add_to_wishlist { background-color: var(--color_cTextPassiv); } .defaultButton.inactive { cursor: default; color: var(--color_cWhite); background-color: var(--color_cTextPassiv); } /**** default Button - klein ****/ .defaultButton.small { padding: 2px; } /*********** action Button ***********/ .actionButton, a.actionButton { line-height: 18px; padding: 4px 10px; font-size: 12px; color:var(--color_cLink); } .actionButton span[class*="ss-"] { float: left; color: var(--color_cIconPassiv); margin-right:12px; } .actionButton.right { padding-left: 4px; padding-right: 0; } .actionButton.right span[class*="ss-"] { float: right; margin-left:4px; margin-right:0; } /*********** status Button ***********/ .stateButton { height: 28px; line-height: 28px; padding: 0 10px; color: var(--color_cIconPassiv); background-color: rgba(0, 0, 0, 0.05); } .stateButton [class*="ss-"] { float: right; line-height: 28px; margin-left:12px; } input:checked + label.stateButton, input:checked + label .stateButton { color: var(--color_cText); } input:checked + label.stateButton [class*="ss-"], input:checked + label .stateButton [class*="ss-"] { color: var(--color_cLink); } /*********** social Button ***********/ .socialButton { width: 160px; color: var(--color_cText); font-size: 12px; line-height: 26px; border-width: 1px; background-color: var(--color_cWhite); overflow: hidden; } .socialButton span[class*="icon-"], .socialButton span.ss-instagram { font-size: 24px; line-height: 24px; float: left; } .socialButton span[class*="icon-"], .socialButton span.ss-instagram { color: var(--color_cText); } /******************************************************************************/ /******************************* Buttons ************************************/ /******************************************************************************/ .Page button, .defaultButton, .stateButton, .socialButton { border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; font-size: 1.125rem; padding: 0.4rem 1rem; border: solid 2px var(--color_cTurkis); } .Page button:hover, .defaultButton:hover, .stateButton:hover, .socialButton:hover { color: var(--color_cTurkis); background-color: var(--color_cWhite); } /*********** default / Subnavigation Button ***********/ .Page button, .defaultButton, a.defaultButton { color: var(--color_cWhite); background-color: var(--color_cTurkis); } .defaultButton.inactive { cursor: default; background-color: var(--color_cLinkHover); border-color: var(--color_cLinkHover); } .defaultButton.inactive:hover{ color: var(--color_cWhite); } /** * @license * MyFonts Webfont Build ID 3741763, 2019-04-01T12:06:25-0400 * * The fonts listed in this notice are subject to the End User License * Agreement(s) entered into by the website owner. All other parties are * explicitly restricted from using the Licensed Webfonts(s). * * You may obtain a valid license at the URLs below. * * Webfont: FF Nexus Typewriter Web Pro Italic by FontFont * URL: https://www.myfonts.com/fonts/fontfont/nexus-typewriter/pro-italic-113121/ * Copyright: 2011 Martin Majoor, non-western version by Inka Strotmann published by FSI FontShop International GmbH * Licensed pageviews: 50,000 * * Webfont: Typold-Medium by The Northern Block Ltd * URL: https://www.myfonts.com/fonts/northernblock/typold/medium/ * Copyright: Copyright © 2017 by Jonathan Hill. All rights reserved. * Licensed pageviews: 20,000 * * Webfont: Typold-Book by The Northern Block Ltd * URL: https://www.myfonts.com/fonts/northernblock/typold/book/ * Copyright: Copyright © 2017 by Jonathan Hill. All rights reserved. * Licensed pageviews: 20,000 * * Webfont: Typold-Bold by The Northern Block Ltd * URL: https://www.myfonts.com/fonts/northernblock/typold/bold/ * Copyright: Copyright © 2017 by Jonathan Hill. All rights reserved. * Licensed pageviews: 20,000 * * * License: https://www.myfonts.com/viewlicense?type=web&buildid=3741763 * * © 2019 MyFonts Inc */ /* @import must be at top of file, otherwise CSS will not work */ /*@import url("//hello.myfonts.net/count/391843");*/ @font-face { font-family: 'Nexus-Typewriter-Pro-Italic'; font-weight: normal; font-style: normal; src: url('/Ressource/Css/Font/Nexus_typewriter/391843_0_0.eot'); src: url('/Ressource/Css/Font/Nexus_typewriter/391843_0_0.eot?#iefix') format('embedded-opentype'), url('/Ressource/Css/Font/Nexus_typewriter/391843_0_0.woff2') format('woff2'), url('/Ressource/Css/Font/Nexus_typewriter/391843_0_0.woff') format('woff'), url('/Ressource/Css/Font/Nexus_typewriter/391843_0_0.ttf') format('truetype'); } @font-face { font-family: 'Typold-Medium'; font-weight: normal; font-style: normal; src: url('/Ressource/Css/Font/Typold_medium/391843_1_0.eot'); src: url('/Ressource/Css/Font/Typold_medium/391843_1_0.eot?#iefix') format('embedded-opentype'), url('/Ressource/Css/Font/Typold_medium/391843_1_0.woff2') format('woff2'), url('/Ressource/Css/Font/Typold_medium/391843_1_0.woff') format('woff'), url('/Ressource/Css/Font/Typold_medium/391843_1_0.ttf') format('truetype'); } @font-face { font-family: 'Typold-Book'; font-weight: normal; font-style: normal; src: url('/Ressource/Css/Font/Typold_book/391843_2_0.eot'); src: url('/Ressource/Css/Font/Typold_book/391843_2_0.eot?#iefix') format('embedded-opentype'), url('/Ressource/Css/Font/Typold_book/391843_2_0.woff2') format('woff2'), url('/Ressource/Css/Font/Typold_book/391843_2_0.woff') format('woff'), url('/Ressource/Css/Font/Typold_book/391843_2_0.ttf') format('truetype'); } @font-face { font-family: 'Typold-Bold'; font-weight: normal; font-style: normal; src: url('/Ressource/Css/Font/Typold_bold/391843_3_0.eot'); src: url('/Ressource/Css/Font/Typold_bold/391843_3_0.eot?#iefix') format('embedded-opentype'), url('/Ressource/Css/Font/Typold_bold/391843_3_0.woff2') format('woff2'), url('/Ressource/Css/Font/Typold_bold/391843_3_0.woff') format('woff'), url('/Ressource/Css/Font/Typold_bold/391843_3_0.ttf') format('truetype'); } html { font-size:16px; } body { -webkit-text-size-adjust:100%; /*{ avoids ios font scaling* *}*/ } .Page *, .Page *::after, .Page *::before { -o-transition: background-color .3s, color .3s, border-color .3s; -ms-transition: background-color .3s, color .3s, border-color .3s; -moz-transition: background-color .3s, color .3s, border-color .3s; -webkit-transition: background-color .3s, color .3s, border-color .3s; transition: background-color .3s, color .3s, border-color .3s; } .cookieBanner { position:fixed; left:0; right:0; bottom:0; z-index: 9999; /* position over action bar and flyouts */ max-height: 100vh; overflow: auto; display:block; margin:0 auto; background-color: var(--color_bcArea); } .cookieBanner.js-cookie-hide, body.pos .cookieBanner { display:none; } .cookieBanner .wrapper { max-width:95rem; box-sizing:border-box; padding: 1.25rem 8rem 1.25rem 2.5rem; margin:0 auto; position:relative; } .cookieBanner .textWrapper{ display: inline-block; width: 60%; margin-bottom: 1rem; } .cookieBanner .buttonWrapper{ display: inline-block; text-align:right; vertical-align: top; width: 40%; } .cookieBanner .text { min-height:3rem; line-height: 1.5em; } .cookieBanner .closeButton { position: absolute; right: 2.5rem; top: 0.75rem; font-size:20px; line-height:40px; width: 40px; text-align: center; cursor: pointer; } .cookieBanner button { margin-left: 1rem; margin-bottom: 1rem; } .cookieBanner button.noStyle { padding: 0; margin: 0; border: none; background: none; color: inherit; font-family: initial; } .cookieBanner button.fas { font-family: 'Font Awesome 6 Free'; } @media screen and (max-width:1024px){ .cookieBanner .wrapper { padding-right: 5rem; padding-bottom: 0; } .cookieBanner .buttonWrapper, .cookieBanner .textWrapper{ width: 100%; } } @media screen and (max-width:544px) { .cookieBanner .wrapper { padding-top: 0.75rem; padding-left: 1rem; padding-right: 3rem; overflow: hidden; } .cookieBanner button { position: relative; display: inline-block; float: right; margin-bottom: 1rem; } .cookieBanner .closeButton { right: 0.5rem; top: 0.5rem; } } .cookieBanner .text a { text-decoration: underline; } .cookieBanner button.noStyle.fas:hover { color: var(--color_cLink); } .cookieAgreementCategory { position: relative; margin-bottom: 1.5rem; width: 80rem; max-width: 100%; margin: 0 auto 3.5rem; box-sizing: border-box; } .cookieAgreementCategory .title { font-size: 1rem; line-height: 1.2em; display: block; cursor: pointer; } .cookieAgreementCategory.necessary .title{ cursor: inherit; } .cookieAgreementCategory .title .triStateCheckbox__icon, .cookieAgreementCategory input[type="checkbox"] { position: absolute; right: 2rem; top: 1.5rem; display: inline-block; vertical-align: middle; } .cookieAgreementOverview .expandInfoCategory { margin-bottom: 1rem; color: var(--color_cLink); cursor: pointer; } .cookieAgreementOverview .infoCategory { padding-bottom: 1rem; } .cookieAgreementCategory .showCookie { color: var(--color_cLink); cursor: pointer; } .cookieAgreementCategory label{ float: right; left: 7rem; position: relative; } .cookieAgreementCategory .wrapperCategorySecondPart { display: block; overflow: hidden; } .cookieAgreementCategory:not(.necessary) .wrapperCategoryFirstPart .title{ padding-right: 11rem; } .cookieAgreementCategory .wrapperCategoryFirstPart.open .infoCategory { display: block; } .cookieAgreementCategory.necessary .triStateCheckbox__icon, .cookieAgreementCategory.necessary label, .cookieAgreementCategory .wrapperCategoryFirstPart:not(.open) .infoCategory { display: none; } .cookieAgreementCategory .wrapperServiceFirstPart.open .title{ margin-bottom: 1rem; } .cookieAgreementCategory .widgetList .service { margin-top: 0.7rem; } .cookieAgreementCategory .wrapperCategorySecondPart.open .serviceList, .cookieAgreementCategory .wrapperCategorySecondPart.open .less.icon, .cookieAgreementCategory .cookieAgreementService .wrapperServiceFirstPart.open .icon.less, .cookieAgreementCategory .wrapperCategorySecondPart.open .cookieAgreementService .icon.more { display: block; } .cookieAgreementCategory .wrapperCategorySecondPart.open .more.icon, .cookieAgreementCategory .wrapperCategorySecondPart .less.icon, .cookieAgreementCategory .cookieAgreementService .wrapperServiceFirstPart.open .icon.more, .cookieAgreementCategory .cookieAgreementService .wrapperServiceFirstPart .icon.less, .cookieAgreementCategory .wrapperCategorySecondPart:not(.open) .serviceList { display: none; } @media all and (max-width: 1152px) { .cookieAgreementCategory { margin-bottom: 3rem; } } @media all and (max-width: 768px) { .cookieAgreementCategory { margin-bottom: 2.5rem; } } @media screen and (max-width: 544px) { .cookieAgreementCategory:not(.necessary) .wrapperCategoryFirstPart .title{ padding-right: 5rem; } .cookieAgreementCategory label{ display: none; } } .cookieAgreementCategory .title .triStateCheckbox__icon { right: 1.5rem; top: 0; } .cookieAgreementCategory input[type="checkbox"]{ display: none; } .cookieAgreementCategory .showCookie{ font-family: 'Typold-Bold'; } .cookieAgreementCategory label{ font-size: 1rem; line-height: 1.5em; } #overlay .cookieAgreementCategory { padding-top: 1.5rem; margin-bottom: 3.5rem; border-top: solid 1px var(--color_cLine); } #overlay .cookieAgreementCategory label{ font-size: 0.875rem; line-height: 1.5rem; } #overlay .cookieAgreementCategory .title .triStateCheckbox__icon { top: 1.5rem; } #overlay .cookieAgreementCategory .wrapperCategoryFirstPart .title .BasicText { font-family: 'Typold-Bold'; font-size: 1rem; line-height: 1.25rem; margin-bottom: 0.75rem; } @media all and (max-width: 1152px) { #overlay .cookieAgreementCategory { margin-bottom: 3rem; } } @media all and (max-width: 768px) { #overlay .cookieAgreementCategory { margin-bottom: 2.5rem; } } .cookieAgreementOverview { display:block; margin:0 auto 1rem; padding-top: 2rem; padding-bottom: 1rem; box-sizing:border-box; background-color: var(--color_bcArea) ; } .cookieAgreementOverview .wrapper{ box-sizing:border-box; } .cookieAgreementOverview .icon{ position: absolute; line-height: 1.7em; } .cookieAgreementOverview .icon:before { padding-right: 0.5rem; } .cookieAgreementOverview .moreText, .cookieAgreementOverview .wrapper.firstPart.open .lessText, .cookieAgreementOverview .wrapperServiceFirstPart .title span:not(.icon), .cookieAgreementOverview .showCookie span:not(.icon){ padding-left: 1.5rem; padding-right: 8rem; box-sizing: border-box; display: block; } .cookieAgreementOverview .title { font-size: 1.25rem; line-height: 1.5em; margin-bottom: 1rem; } .cookieAgreementOverview .expand { padding: 0.5rem 0; color: var(--color_cLink); cursor: pointer; display: inline-block; } .cookieAgreementOverview .close, .cookieAgreementOverview .ok { display: block; float:right; } .cookieAgreementOverview .close { margin-right: 1rem; display: none; } #overlay .cookieAgreementOverview .close, #spacerHeader .cookieAgreementOverview .close { display: block; } .cookieAgreementOverview .info p, .cookieAgreementOverview .text{ margin-bottom: 1rem; } .cookieAgreementOverview .wrapper.firstPart{ overflow: hidden; } .cookieAgreementOverview .wrapper.firstPart.open .info, .cookieAgreementOverview .wrapper.firstPart.open .less, .cookieAgreementOverview .wrapper.firstPart .more { display: block; } .cookieAgreementOverview .wrapper.firstPart:not(.open) .info, .cookieAgreementOverview .wrapper.firstPart .less, .cookieAgreementOverview .wrapper.firstPart.open .more { display: none; } .cookieAgreementOverview .wrapper.secondPart{ margin-bottom: 0; } #overlay .cookieAgreementOverview{ max-width: 42rem; } @media screen and (max-width: 1000px) { #overlay .cookieAgreementOverview{ max-width: 35rem; } #overlay .cookieAgreementOverview .close { margin-right: 0; margin-top: 0.5rem; clear: both; } } @media screen and (max-width: 720px) { #overlay .cookieAgreementOverview{ max-width: inherit; } } @media screen and (max-width: 544px) { .cookieAgreementOverview .moreText, .cookieAgreementOverview .wrapper.firstPart.open .lessText, .cookieAgreementOverview .wrapperServiceFirstPart .title span:not(.icon), .cookieAgreementOverview .showCookie span:not(.icon){ padding-right: 2rem; } #overlay .cookieAgreementOverview .ok, #overlay .cookieAgreementOverview .close { width: 100%; } } #overlay .cookieAgreementOverview { background-color: var(--color_bcArea) ; padding-top: 2rem; } .cookieAgreementOverview { text-align: left; background-color: inherit; padding-top: 0; } .cookieAgreementOverview .icon{ line-height: 1.5em; } .cookieAgreementOverview .intro { margin-top: 0; } .cookieAgreementOverview .expand { padding-top: 0.25rem; padding-bottom: 0.25rem; font-family: 'Typold-Bold'; } .cookieAgreementOverview .text { margin-bottom: 0.5rem; line-height: 1.5rem; } {* Wrapper for privacy poliy page *} .cookieAgreementOverview .wrapper { max-width: 70rem; margin: 0 auto 2rem; padding: 0 5rem; } .cookieAgreementOverview .moreText, .cookieAgreementOverview .wrapper.firstPart.open .lessText, .cookieAgreementOverview .wrapperServiceFirstPart .title span:not(.icon), .cookieAgreementOverview .showCookie span:not(.icon) { padding-left: 1rem; } .cookieAgreementOverview .wrapper.firstPart.open .info, .cookieAgreementOverview .wrapper.firstPart.open .less, .cookieAgreementOverview .wrapper.firstPart .more{ line-height: 1.5rem; } {* END: Wrapper for privacy poliy page *} #overlay .cookieAgreementOverview .wrapper { max-width: 54rem; margin: 0 auto 2rem; padding: 0 2rem; } #overlay .cookieAgreementOverview .icon{ line-height: 1.7em; } #overlay .cookieAgreementOverview .firstPart > .title, #overlay .cookieAgreementOverview .secondPart > .title { font-size: 1.75rem; line-height: 2rem; margin-left: 0; } #overlay .cookieAgreementOverview .close{ margin-top: 0.5rem; margin-right: 0; float: right; clear: both; } @media screen and (max-width: 768px) { .cookieAgreementOverview .wrapper { padding: 0 3rem; } #overlay .cookieAgreementOverview{ max-width: 46rem; padding-top: 5rem; } } @media screen and (max-width: 544px) { .cookieAgreementOverview .wrapper { padding: 0 1.25rem; } .cookieAgreementOverview .expand { padding-bottom: 0.5rem; } #overlay .cookieAgreementOverview{ padding-top: 4rem; } #overlay .cookieAgreementOverview .wrapper{ padding-left: 1.25rem; padding-right: 1.25rem; } } .wrapperCategorySecondPart .serviceList.noSelectableServices input { display: none; } .cookieAgreementService { padding-right: 4rem; padding-left: 1rem; background-color: var(--color_bcFond); cursor: pointer; position: relative; } .cookieAgreementService label{ left: 0; display: block; } .cookieAgreementService .title { display: block; margin-bottom: 0; cursor: pointer; padding-top: 1rem; padding-bottom: 1rem; } .cookieAgreementService .wrapperServiceFirstPart.open .cookieList { display: block; } .cookieAgreementService .wrapperServiceFirstPart:not(.open) .cookieList { display: none; } .cookieAgreementService .cookieInformation { border-collapse: collapse; margin-bottom: 1rem; border-bottom: solid 1px #ccc; font-size: 0.75rem; width: 100%; } .cookieAgreementService .cookieInformation:last-child { border-bottom: none; } .cookieAgreementService .cookieInformation td { padding: 0 0.6rem 0.25rem; line-height: 1.5em; } .cookieAgreementService .cookieInformation__value { word-wrap: anywhere; padding-right: 0.5rem; } .cookieAgreementService .cookieInformation tr:last-child td { padding-bottom: 0.5rem; } .cookieAgreementService .cookieInformation__label { width: 18%; text-align: right; padding-right: 0.5rem; font-weight: bold; } @media screen and (max-width: 544px) { .cookieAgreementService label span{ display: none; } } .cookieAgreementService { padding-right: 1.5rem; overflow: auto; } .cookieAgreementService .cookieInformation{ border:solid 1px var(--color_cLine); } .cookieAgreementService .cookieInformation:last-child{ border-bottom:solid 1px var(--color_cLine); } .cookieAgreementService .title { font-size: 1rem; } #overlay .cookieAgreementService .title { font-size: 0.875rem; } .cookieAgreementService .cookieInformation td { padding: 0.8rem 0 0 1rem; } .cookieAgreementService .cookieInformation tr:last-child td { padding-bottom: 0.8rem; } .cookieAgreementService label{ padding-right: 2.5rem; line-height: 1.5rem; } .cookieAgreementService label .icon{ position: absolute; right: 0; height: 1.5rem; width: 1.5rem; box-sizing:border-box; border: 1px solid var(--color_cLine); background-color: var(--color_cWhite); } .cookieAgreementService input[type="checkbox"] + span::before{ font-family: "SSGizmo"; content: "\2713"; font-size: 1.31rem; line-height: 1.8rem; color:transparent; text-align:center; } .cookieAgreementService .cookieInformation__label{ text-align: left; } .cookieAgreementService input[type="checkbox"]:checked + span::before { color: var(--color_cLink); } @media screen and (max-width: 544px) { .cookieAgreementService label .icon{ display: block; } } [data-dynamic-loader="loader"].loading { width:50px; height:50px; background-image:url("/Ressource/Graphic/loading.gif"); background-position: center; background-repeat: no-repeat; } .SetImage.smartLightbox .zoom, .SetImage.smartLightbox .count{ position: absolute; right: 0; top: 0; padding: 1rem; font-size: 1.5rem; -o-transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; transition: .3s; } .SetImage.smartLightbox:hover .zoom, .SetImage.smartLightbox:hover .count{ color: var(--color_cWhite); } .SetImage.smartLightbox .zoom{ font-size: 2.5rem; } .versionHint { padding: 1rem 2rem; background-color: var(--admin_color_bcVersionHint); overflow: hidden; color: var(--admin_color_cVersionHint); } .versionHint .hint { margin-right: 1rem; } .versionHint .defaultButton.reloadPage { display: inline-block; cursor: pointer; color: var(--color_cGreyBorder); } .versionHint .defaultButton.reloadPage:hover { text-decoration: underline; } .versionHint .closeVersionHint { float: right; cursor: pointer; } .VersionProperty .description.multipage { min-height:8rem; } .VersionProperty .descriptionWrapper .description .title { margin:0 0 0.75rem; font-size:1rem; width:auto; float:none; } .VersionProperty .description .content, .VersionProperty .generalInfos { font-size:0.75rem; margin-bottom:0.75rem; } :root { --color_cLine:#d8d8d7; --color_cLink:#f07800; --color_cIconAction:#8c8c8a; --color_cIconPassive:#b4b4b4; --color_cText:#505050; --color_cTextAmount:#505050; --color_cTextPassive:#999999; --color_cOnClick:#e55220; --color_cError:#e0152b; --color_cValid:#31b847; --color_cYellow:#e3cd41; --color_cOrange:#ff7700; --color_cGreen:#7ca545; --color_cRed:#e0292b; --color_cWhite:#ffffff; --color_cBlack:#000000; --color_cGrey:#e1e1de; --color_cGreyBorder:#d5d7d2; --color_cCellmsBlue:#00BEFF; --color_cTransparent:rgba(0, 0, 0, 0); --color_bcInfoBox:rgba(80,80,80,0.5); --color_bcInfoBox70:rgba(80,80,80,0.7); --color_bcWhiteTrans:rgba(255, 255, 255, 0.9); --color_bcBlueTrans:rgba(0, 56, 113, 0.9); --color_bcFond:#f5f5f2; --color_bcArea:#ebebe8; --color_bcFooter:#3c3c3c; --color_bcCellmsBlue40:rgba(125,222,255,0.4); --color_bcPosMenu:#1EE0CA; --admin_color_cAdminButton:#AAAAAA; --admin_color_cAdminButtonBorder:#b2b2b2; --admin_color_cCaption:#777777; --admin_color_cInput:#444444; --admin_color_cLine:#CCCCCC; --admin_color_cRed:#e0292b; --admin_color_cVersionHint:#FFFFFF; --admin_color_cInactiveCell: #808080; --admin_color_bcAdminButton:#1B1B1C; --admin_color_bcCellmsBlue10:#E5F8FF; --admin_color_bcDropZone:#C8EBFB; --admin_color_bcDropZoneLight:#deebfb; --admin_color_bcToolbar:#333439; --admin_color_bcRte:#D4F1F6; --admin_color_bcRteActive:#DDDDDD; --admin_color_bcVersionHint:#333439; --admin_color_bcPropertyTooltip:#f5f5f2; --admin_color_bcInputGradient:#ececec; --admin_color_bcRedOverlay:rgba(255, 0, 0, 0.33); --admin_color_bcGreenOverlay:rgba(0, 255, 0, 0.33); --admin_color_bcInactiveCell: #bfbfbf; --crm_color_ccGrey:#8c8c8a; --crm_color_cGreyLight:#cdcdca; --crm_color_cMain:#1EE0CA; --crm_color_cMainHover:#18b09e; --crm_color_cText:#1EE0CA; --crm_color_cbcAreaGreyLight:#DCEBEA; --crm_color_cbcAreaMainLight:#c2e0dd; --crm_color_cbcDropDown:#e1e1de; --addressType_b2b_retailshop:rgb(247, 100, 20); --addressType_b2b_warehouse:rgb(35, 183, 68); --addressType_b2b_administration:rgb(239, 199, 94); --addressType_company:rgb(163, 97, 255); --addressType_private:rgb(255, 97, 163); --addressType_unknown:rgb(111, 61, 211); --filemanager_bcHover:#e7f4f9; --filemanager_bcSelected:#C8EBFB; --filemanager_bcDialog: #f5f5f2; --filemanager_bcDialogHeader: linear-gradient(180deg, rgba(60, 60, 60, 1) 0%, rgba(100, 100, 100, 1) 100%); --filemanager_bcDialogBtn: #ececec; --filemanager_cDialogBorder: #CCCCCC; --filemanager_bcOverlay: rgba(170, 170, 170, 0.3); --filemanager_bcTr: #CCC2; --filemanager_bcTr2n: #CCC5; } :root { --color_cCellms: ''; --color_cTurkis: #1EE0CA; --color_cGreen: #ADEB02; --color_cYellow: #D8FF00; --color_cPurple: #9F1D9A; --color_cPink: #D9348D; --color_cLightPink: #FC2F68; --color_cDarkGray: #98B9B5; --color_cSemiDarkGray: #BBD5D1; --color_cGray: #D5EFEC; --color_cSemiLightGray: #DCEBEA; --color_cLightGray: #F0FAF9; --color_cStyledBrowser: #EFF4F4; --color_cFormGray: #708683; --color_cVideoGray: #333333; --color_cLink: #1EE0CA; --color_cLinkHover: #ADEB02; --color_cText: #000000; --color_cText60: #999999; --color_cText30: #b3b3b3; } .header { position: relative; z-index: 2200; -o-transition: top .5s, background-color .5s; -ms-transition: top .5s, background-color .5s; -moz-transition: top .5s, background-color .5s; -webkit-transition: top .5s, background-color .5s; transition: top .5s, background-color .5s; } .header .hiddenTitle { opacity: 0; position: absolute; z-index: -100; } .headerContentWrapper .breadcrumb{ display: none; vertical-align: middle; padding: 0.4rem 3.5rem 0 7.25rem; text-align: center; box-sizing: border-box; } .headerContentWrapper .CustomNavigationPath .separator, .headerContentWrapper .CustomNavigationPath a { color:var(--color_cText60); font-family: "Typold-Book"; display:inline; text-decoration: none; padding: 0; line-height: 1em; -o-transition:text-decoration .5s; -ms-transition:text-decoration .5s; -moz-transition:text-decoration .5s; -webkit-transition:text-decoration .5s; transition:text-decoration .5s; } @media screen and (max-width:768px) { .header{ background-color: var(--color_cWhite); } .Page .headerContentWrapper .breadcrumb{ display: block; } } @media screen and (max-width:620px) { .headerContentWrapper .CustomNavigationPath .separator, .headerContentWrapper .CustomNavigationPath a{ font-size: 0.75rem; } .Page .headerContentWrapper .breadcrumb{ display: inline-block; float: left; padding-left: 0; padding-top: 0.25rem; } } .menuIcon { display: none; position: absolute; z-index: 2200; top: 0rem; right: 2rem; width: 3.5rem; height: 5.5rem; cursor: pointer; padding: 2rem 0.75rem 2rem 0.75rem; box-sizing: border-box; } .menuIcon .bar, .menuIcon::before, .menuIcon::after { background-color: var(--color_cBlack); width: 2rem; height: 0.1875rem; position: absolute; left: 0.75rem; content: ""; -moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .menuIcon .bar { top: 2.65rem; } .menuIcon::after { bottom: 2rem; } .Page.menuOpened .menuIcon .bar { display: none; } /*animation*/ .Page.menuOpened .menuIcon:before { transform: translateY(11px) rotate(135deg); -moz-transform: translateY(11px) rotate(135deg); -webkit-transform: translateY(11px) rotate(135deg); } .Page.menuOpened .menuIcon:after { transform: translateY(-11px) rotate(-135deg); -moz-transform: translateY(-11px) rotate(-135deg); -webkit-transform: translateY(-11px) rotate(-135deg); } .Page.menuOpened .menuIcon .bar { -moz-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); } @media screen and (max-width:768px) { .header { position: fixed; top: 0; left: 0; right: 0; } .menuIcon { display: block; } .Page:not(.menuOpened).scrollDown .header { } } @media screen and (max-width:544px) { .menuIcon { right: 0.5rem; } } .headerContentWrapper, .headerActionWrapper { overflow: hidden; display: block; width: 100%; text-align: right; padding: 0 5rem; box-sizing: border-box; } .headerContentWrapper a.SetLink, .headerActionWrapper .CustomUserLogin a, .headerActionWrapper a.SetLink, .headerActionWrapper .BasicLanguageBox a, .headerActionWrapper .BasicLanguageBox a.selected { text-decoration: none; text-transform: uppercase; font-family:Typold-Medium; position: relative; -o-transition:color .5s; -ms-transition:color .5s; -moz-transition:color .5s; -webkit-transition:color .5s; transition:color .5s; } .headerContentWrapper .ListLinkList a:not(.selected):after{ content: ""; display: block; position: absolute; left: 0; right: 0; width: 100%; height: 5px; background: #000; transition: all 500ms ease; transform: scale3d(0,1,1); -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 0; } .headerContentWrapper a.selected, .headerActionWrapper .contentWrapper a.selected{ color:var(--color_cLink); } .headerActionWrapper .contentWrapper > div{ color: rgba(0,0,0,0.6); padding-top: 1rem; display: inline-block; overflow: hidden; } .headerActionWrapper .contentWrapper a { color: rgba(0,0,0,0.6); font-size: 0.875rem; padding: 0 1.25rem; } .headerActionWrapper .contentWrapper a [class*="ss-"] { color: rgba(0,0,0,0.6); } .headerActionWrapper .CustomUserLogin.stateLogout .userName, .headerActionWrapper .CustomUserLogin a{ padding-left: 0.5rem; } .headerActionWrapper .CustomUserLogin.stateLogin .miniIcon { display:none; } .headerActionWrapper .contentWrapper .searchIcon{ padding-left: 1.25rem; padding-right: 0; font-size: 1.125rem; line-height: 0.8em; } .header .BasicLanguageBox a:first-child { padding-left: 1.25rem; } .header .BasicLanguageBox a { padding-left: 0; } .headerContentWrapper { margin-bottom: 5.5rem; } .headerContentWrapper > div a { box-sizing:border-box; border-top: 0.25rem transparent solid; border-bottom: 0.25rem transparent solid; line-height:1.875rem; font-size: 1.125rem; padding: 0.5rem 0 0 0; } .headerContentWrapper .logoWrapper { float: left; display: inline-block; padding-right: 1rem; } .headerContentWrapper .logoWrapper a { padding: 2.4rem 0; border-width: 0; } .headerContentWrapper .logoGraphic { -o-transition: opacity .25s; -ms-transition: opacity .25s; -moz-transition: opacity .25s; -webkit-transition: opacity .25s; transition: opacity .25s; } .headerContentWrapper .ListLinkList { padding-top: 1.875rem; float: right; width: 80%; } .headerContentWrapper .ListLinkList li { padding-left: 12%; } .headerContentWrapper .ListLinkList a.SetLink.selected { border-bottom-color:var(--color_cLink); } .headerContentWrapper .ListLinkList .children { display: none; } .headerContentWrapper .ListLinkList .children li{ padding-top: 0.875rem; padding-left: 3.75rem; } .headerContentWrapper .ListLinkList .children a.SetLink{ font-size: 1rem; /*{ 16px }*/ } .headerContentWrapper .ListLinkList a.SetLink.selected + ul.children{ display: block; position: absolute; right: 5rem; } .headerContentWrapper .ListLinkList .hasChildren ul.children a.SetLink.selected{ border-bottom-color: var(--color_cWhite); } .headerContentWrapper .ListLinkList .hasChildren li a.SetLink{ font-family: Typold-Book; } .headerContentWrapper .ListLinkList .hasChildren li a.SetLink::after{ width: 0; } /*Standart Layout für: 1280px*/ @media screen and (min-width:1920px) { .headerContentWrapper, .headerActionWrapper{ padding: 0 7.5rem; } .headerContentWrapper .ListLinkList { padding-right: 0rem; } .headerContentWrapper .ListLinkList li { padding-left: 10rem; } .headerContentWrapper .ListLinkList a.SetLink.selected + ul.children{ right: 7.5rem; } } @media screen and (max-width:1024px) { .headerContentWrapper{ margin-bottom: 3rem; } .headerContentWrapper .ListLinkList .children li{ padding-top: 0.875rem; padding-left: 2rem; } .headerContentWrapper .ListLinkList .children a.SetLink{ font-size: 0.8rem; } } @media screen and (max-width:768px) { .headerActionWrapper{ display: none; } .headerContentWrapper, .headerActionWrapper{ padding: 0 3rem; } .headerContentWrapper { margin-bottom: 0rem; font-size: 0.75rem; line-height: 1.125rem; padding-top: 2rem; padding-bottom: 2rem; } .headerContentWrapper .BasicLanguageBox, .headerContentWrapper .ListLinkList { display: none; } .headerContentWrapper .ListLinkList a.selected + ul.children{ right: 3rem; } .headerContentWrapper .logoWrapper a { padding: 0; } .headerContentWrapper .logoWrapper img { height: 1.375rem; } } @media screen and (max-width:620px) { .headerContentWrapper .logoWrapper { display: block; width: 100%; margin-bottom: 1rem; } .headerContentWrapper .logoWrapper a { float: left; } .headerContentWrapper, .headerActionWrapper{ padding-bottom: 1rem; } } @media screen and (max-width:544px) { .headerContentWrapper, .headerActionWrapper{ padding-top: 1rem; padding-left: 1.25rem; padding-right: 1.25rem; } .headerContentWrapper .logoWrapper { margin-bottom: 0.5rem; } .headerContentWrapper .ListLinkList a.selected + ul.children{ right: 1.25rem; } .menuIcon { padding-top: 1rem; height: 4.5rem; } .menuIcon .bar { top: 1.65rem; } } /* max-width:1024px max-width:768px max-width:544px max-width:376px */ .footer{ background-color:var(--color_cLightGray); font-family: "Typold-Medium"; font-size: 0.875rem; line-height: 1.25rem; } .footer .wrapper{ padding: 1.125rem 5rem 0; box-sizing: border-box; overflow: hidden; max-width: 120rem; margin: 0 auto; } .footer .footerContentWrapper .footerActionWrapper{ display: none; } .footer .footerContentWrapper .ListLinkList{ width: 70%; display: inline-block; margin-bottom: 1.1875rem; } .footer .footerContentWrapper .subscribeNewsletter{ display: inline-block; width: 30%; vertical-align: top; } .footer .footerContentWrapper .ListLinkList li{ width: 33%; vertical-align: top; } .footer .footerContentWrapper .ListLinkList a{ padding: 0 0 0.5rem 0; } .footerContentWrapper .ListLinkList .children{ display: block; font-family: "Typold-Book"; font-size: 0.75rem; /*{ 12px }*/ line-height: 1.5em; padding-bottom: 0.5rem; } .footerContentWrapper .ListLinkList .children a, .footerContentWrapper .ListLinkList .children li{ padding: 0; line-height: 1.375rem; display: block; width: 100%; } .footerActionWrapper { text-align: right; font-family: "Typold-Book"; font-size: 0.75rem; line-height: 1rem; text-decoration: none; text-transform: uppercase; } .footerActionWrapper > div{ padding-bottom: 0.5rem; display: inline-block; overflow: hidden; } .footer .footerActionWrapper a:not(.editButton){ padding: 0 1.25rem; border-left: solid 1px var(--color_cText); -o-transition:text-decoration .5s; -ms-transition:text-decoration .5s; -moz-transition:text-decoration .5s; -webkit-transition:text-decoration .5s; transition:text-decoration .5s; } .footerActionWrapper .CustomUserLogin a:not(.editButton){ border-left-width: 0px; } .footerActionWrapper .CustomUserLogin .userName, .footerActionWrapper .CustomUserLogin .text, .footerActionWrapper .CustomUserLogin .myPageLink { display: none; } .footerActionWrapper .BasicLanguageBox a{ border-width: 0; padding-right: 0; color: var(--color_cText60); } .footerActionWrapper .BasicLanguageBox a:first-child{ border-width: 1px; } .footerActionWrapper .BasicLanguageBox a.selected{ color: var(--color_cText); } .footerActionWrapper .ListLinkList li:last-child a{ padding-right: 0; } .footer .subscribeNewsletter .title{ text-transform: uppercase; } /*Standart Layout für: 1280px*/ @media screen and (min-width:1920px) { .footer .wrapper{ padding-left: 7.5rem; padding-right: 7.5rem; } } @media screen and (max-width:1024px) { .footer .wrapper{ padding-left: 5rem; padding-right: 5rem; } .footer .footerContentWrapper, .footer .footerContentWrapper .ListLinkList { width: 100%; } .footer .footerContentWrapper{ margin-bottom: 1.25rem; } .footer .footerContentWrapper .subscribeNewsletter{ width: 65%; } .footer .footerContentWrapper .ListLinkList{ display: block; } .footer .footerActionWrapper a:not(.editButton){ padding: 0 0.6rem; } } @media screen and (max-width:768px) { .footer{ line-height: 1.125rem; } .footer .wrapper{ padding-left: 3rem; padding-right: 3rem; } .footer .footerActionWrapper { display: none; width: 50%; float: right; text-align: left; } .footer .footerContentWrapper .footerActionWrapper{ display: inline-block; } .footerActionWrapper > div{ padding: 0; display: block; } .footer .footerActionWrapper a:not(.editButton){ border-width: 0; padding: 0; line-height: 1.375rem; } .footerActionWrapper .BasicLanguageBox a{ padding-right: 0.5rem; } .footer .footerContentWrapper .footerActionWrapper .ListLinkList{ width: 100%; } .footer .footerActionWrapper .ListLinkList li{ display: block; } .footer .footerContentWrapper .footerActionWrapper li[data-depth="0"]{ margin-bottom: 0rem; } .footer .footerContentWrapper{ margin-bottom: 0rem; } .footer .footerContentWrapper .ListLinkList{ width: 50%; margin-bottom: 0rem; display: inline-block; } .footer .footerContentWrapper .ListLinkList li{ width: 100%; } .footer .footerContentWrapper .subscribeNewsletter, .footer .footerContentWrapper li[data-depth="0"]{ margin-bottom: 1.1875rem; } .footer .footerContentWrapper .subscribeNewsletter{ max-width: 48rem; width: 100%; } } @media screen and (max-width:544px) { .footer .wrapper{ padding-left: 1.25rem; padding-right: 1.25rem; } } @media screen and (max-width:420px) { .footer .footerContentWrapper, .footer .footerActionWrapper { width: 100%; display: block; } .footer .footerContentWrapper .footerActionWrapper{ display: none; } .footer .footerContentWrapper .ListLinkList{ width: 100%; } .footer .wrapper{ padding-bottom: 1.25rem; } } .poweredByCellms { width: 100%; background-color: var(--color_cSemiLightGray); } .poweredByCellms .wrapper { padding: 0 5rem; max-width: 120rem; margin: 0 auto; box-sizing: border-box; position: relative; } .poweredByCellms img { height: 4rem; width: 4rem; float: left; } .poweredByCellms .info{ display: inline; vertical-align: middle; text-align: right; line-height: 4rem; } @media screen and (min-width:1920px) { .poweredByCellms .wrapper { padding-left: 7.5rem; padding-right: 7.5rem; } } @media all and (max-width: 768px) { .poweredByCellms .wrapper { padding: 0 3rem; } } @media all and (max-width: 544px) { .poweredByCellms .wrapper{ padding: 0 1.25rem; text-align: center; } .poweredByCellms .info{ width: 50%; } .poweredByCellms img{ display: block; padding: 0; } } .menuMobile { display:none; position:fixed; left:-100%; bottom:0; width:100%; background-color:var(--color_cWhite); -o-transition:left .5s; -ms-transition:left .5s; -moz-transition:left .5s; -webkit-transition:left .5s; transition:left .5s; z-index:2100; overflow-y:auto; -webkit-overflow-scrolling: touch; text-transform: uppercase; } .menuMobile > .wrapper { padding: 1rem 2rem 2.5rem 2rem; box-sizing:border-box; } .Page.menuOpened .menuMobile { left:0; } .menuMobile a.selected{ color:var(--color_cLink); } .menuMobile .ListLinkList ul{ margin: 0; } .menuMobile .ListLinkList li{ display: block; } .menuMobile .centeredLine{ width:100%; overflow:hidden; display:inline-block; vertical-align:middle; margin-bottom: 3rem; padding: 0 1rem; box-sizing:border-box; } .menuMobile .searchWidget{ margin:0; padding:0; } .menuMobile .searchWidget input[type=text]{ background-color: var(--color_cSemiLightGray); } .menuMobile .navHeader{ margin-bottom: 2rem; padding: 0 1rem; box-sizing:border-box; } .menuMobile .navHeader .SetLink{ display: inline-block; font-size: 1.75rem; line-height: 2em; } .menuMobile .navHeader .children{ padding-left: 1.5rem; } .menuMobile .navHeader .children a{ font-size: 1.5rem; text-transform: none; } .menuMobile .actionWrapper { font-family: "Typold-Book"; font-size: 1.125rem; line-height: 1.625rem; text-decoration: none; text-transform: uppercase; } .menuMobile .actionWrapper > div{ padding-bottom: 0.5rem; display: inline-block; overflow: hidden; } .menuMobile .actionWrapper li{ display: inline-block; } .menuMobile .actionWrapper a{ padding: 0 1rem; border-right: solid 1px var(--color_cText60); color: var(--color_cText60); line-height: 1em; font-size: 1rem; } .menuMobile .actionWrapper > div:last-child a { border-right: solid 1px var(--color_cWhite); } .menuMobile .actionWrapper .CustomUserLogin .userName, .menuMobile .actionWrapper .CustomUserLogin .text, .menuMobile .actionWrapper .CustomUserLogin .myPageLink{ display: none; } .menuMobile .BasicLanguageBox a:first-child { padding-left: 1.25rem; } .menuMobile .BasicLanguageBox a { padding-left: 0; } @media screen and (max-width:768px) { .menuMobile { display: block; } } @media screen and (max-width:544px) { .menuMobile>.wrapper { padding-left: 0.75rem; padding-right: 0.75rem; } .menuMobile .navHeader, .menuMobile .centeredLine{ padding-left: 0.5rem; padding-right: 0.5rem; } .menuMobile .navHeader .SetLink{ font-size: 1.125rem; line-height: 2.625rem; } .menuMobile .navHeader .children a{ font-size: 1.125rem; line-height: 2em; } .menuMobile .actionWrapper { font-size: 0.625rem; line-height: 0.875rem; } .menuMobile .actionWrapper a{ padding: 0 0.5rem; font-size: 0.8rem; } } .pageOverlay { background-color: rgba(0, 0, 0, 0.5); position: fixed; top: 0; width: 100%; z-index: 3100; opacity: 0; transition: opacity 0.5s; text-align: center; overflow: hidden; cursor:pointer; } .pageOverlay:not(.opened) { height: 0 !important; } .pageOverlay.opened { opacity: 1; height:100%; } .pageOverlay .overlayContent { display:inline-block; vertical-align:middle; text-align:left; width:100%; cursor:default; box-sizing:border-box; } .overlaySearch .overlayContent{ padding:0 2.5rem; } .overlaySearch .searchInputWrapper input[name="inputSearch"]{ background-color: var(--color_cSemiDarkGray); } @media screen and (max-width:768px) { .overlaySearch { display:none; } } .Page{ color: var(--color_cText); font-family: "Typold-Book"; padding-top: 0; overflow: hidden; min-height:550px; } .Page > .content, .Page #pageContent { min-height: 25rem; font-size:1.125rem; line-height:1.444em; } @media screen and (max-width:768px) { .Page > .content, .Page #pageContent { font-size:1rem; line-height:1.375em; } .Page{ padding-top: 5.5rem; } } @media screen and (max-width:676px) { .Page > .content, .Page #pageContent { font-size:0.9375rem; line-height:1.333em; } } .fixedGoUp { display:none; position:fixed; bottom:33%; right:0; height:2rem; width:2rem; background-color:var(--color_cText60); text-align:center; cursor:pointer; } .fixedGoUp .goUp { color:var(--color_cWhite); text-align:center; height:0.875rem; font-size:0.75rem; } .Page a{ color: var(--color_cText); -o-transition:all .5s; -ms-transition:all .5s; -moz-transition:all .5s; -webkit-transition:all .5s; transition:all .5s; } .Page a.selected{} #waitbox{ display:none; } .Page a .arrow{ height: 0.625rem; width: 3.375rem; margin-left: 0.5rem; overflow: hidden; display: inline-block; -o-transition:width .5s; -ms-transition:width .5s; -moz-transition:width .5s; -webkit-transition:width .5s; transition:width .5s; } .Page .arrow img{ float: right; height: 0.625rem; } .Page h1, .Page h2 { font-family: "Typold-Book"; font-size: 2.75rem; line-height: 3.25rem; margin-bottom: 2rem; } .Page h3 { font-family: "Typold-Book"; font-size: 2.25rem; line-height: 2.875rem; margin-bottom: 2rem; } .Page h4 { font-family: "Typold-Medium"; font-size: 1.75rem; line-height: 2rem; margin-bottom: 2rem; } .Page h5 { font-family: "Typold-Bold"; font-size: 1.25rem; line-height: 1.3em; margin-bottom: 1.25rem; } .Page h6 { font-family: "Typold-Medium"; font-size: 1.125rem; line-height: 1.375rem; } .Page b{ font-weight: bold; } .Page i{ font-style: italic; } .Page b i, .Page i b{ font-weight: bold; font-style: italic; } @media screen and (max-width:768px) { .Page h1, .Page h2 { font-size: 2.25rem; line-height: 2.625rem; } .Page h3 { font-size: 2rem; line-height: 2.875rem; } } @media screen and (max-width:676px) { .Page h1, .Page h2 { font-size: 1.625rem; line-height: 2rem; } .Page h3 { font-size: 1.5rem; line-height: 1.875rem; } .Page h4 { font-size: 1.375rem; line-height: 1.625rem; } .Page h5 { font-size: 0.875rem; line-height: 1.25rem; } } .BasicAudio audio { width: 100%; } .BasicDownload.inactive a { text-decoration:line-through; } .BasicDownload.extendedInformation .BasicGraphic, .BasicDownload.extendedInformation a.graphicLink, .BasicDownload.extendedInformation .textCaptionWrapper { float:left; } .BasicDownload.extendedInformation { clear:both; position:relative; overflow:hidden; } .BasicDownload.extendedInformation .BasicGraphic, .BasicDownload.extendedInformation a.graphicLink { display:block; border:none; width:128px; max-height:128px; /*in order to have the width of 128px so that the caption has it's 'margin' even if no picture is here */ min-height:1px; } .BasicDownload.extendedInformation .BasicGraphic img { max-width:100%; max-height:100%; width:auto; margin: 0 auto; } .BasicDownload.extendedInformation .textCaptionWrapper { overflow:hidden; margin-left:96px; /*position:absolute; bottom:0;*/ } .BasicGraphic, .centerFix { text-align:center; } .BasicGraphic img, .centerFix img { max-height:100%; max-width:100%; height:auto; } .centerFix img { vertical-align:middle; display:inline-block; } .centerFix:before { content:""; height:100%; vertical-align:middle; display:inline-block; } .BasicHtmlContent { margin: 32px 32px 0 32px; } .BasicLanguageBox.interferer { display: none; z-index: 9000; height: 0; background-color: var(--color_cRed); position: fixed; top: 0; left: 0; right: 0; } .BasicLanguageBox.interfererInner { } .BasicLanguageBox.interferer .captionTitle, .BasicLanguageBox.interferer .captionTitle > * { display: inline-block; vertical-align: top; height: 100%; } .BasicLanguageBox.interferer .captionTitle img { margin-right: 1rem; height: 1.125rem; } .BasicLanguageBox.interferer .item > * { display: inline-block; vertical-align: middle; } .BasicLanguageBox.interferer .item img { height: 1.25rem; margin-right: 1rem; } .BasicSpacerContentLoader{ width:100%; overflow:hidden; position:relative; } .BasicSpacerContentLoader .closeButton { position:absolute; top:10px; right:10px; font-size:16px; cursor:pointer; display:none; } .BasicSpacerContentLoader.opened .closeButton { display:block; } .wrapperContentLoader { overflow:hidden; } .BasicSpacerContentLoader .waitBox { background-image: url("/Ressource/Graphic/loading.gif"); background-repeat:no-repeat; background-position:center; display:none; } .BasicSpacerContentLoader.wait .waitBox { background-image: url("/Ressource/Graphic/loading.gif"); background-repeat:no-repeat; background-position:center; display:block; margin:64px 0; height: 32px; } html.noScroll { position:fixed; overflow-y:scroll; overflow-x: hidden; width:100vw; } .overlayWrapper { background-color:rgba(0,0,0,0); -o-transition: background-color 0.5s; -ms-transition:background-color 0.5s; -moz-transition:background-color 0.5s; -webkit-transition:background-color 0.5s; transition:background-color 0.5s; position:fixed; top:100%; left:0; right:0; height:100%; z-index:9999; cursor:pointer; } html.overlayWaiting .overlayWrapper, html.overlayOpened .overlayWrapper { top:0; background-color:rgba(0,0,0,0.7); } html.overlayClosing .overlayWrapper { top:0; } .overlayWrapper .wrapperContentLoader { cursor:auto; padding:0.5rem; opacity:0; } .overlayWrapper .BasicSpacerContentLoader .closeButton { top:0.5rem; right:0.5rem; font-size: 2rem; height: 2rem; line-height: 2rem; padding: 0.5rem; text-align: center; width: 2rem; z-index: 1000; } .overlayWrapper #overlay, .overlayWrapper #overlay .scrollWrapper { height:100%; } .overlayWrapper #overlay .scrollWrapper { margin: 0 auto; max-width:576px; overflow-y:auto; -webkit-overflow-scrolling: touch; } .overlayWrapper #overlay .scrollWrapper:before { content:""; height:100%; display:inline-block; vertical-align:middle; } .overlayWrapper .scrollWrapper > .wrapper { display:inline-block; vertical-align:middle; position:relative; width:100%; } .overlayWrapper .BasicSpacerContentLoader.wait .waitBox { height:100%; margin:0; text-align:center; background-image:none; } #loadingAnim { width:64px; display:inline-block; vertical-align:middle; } .loadingAnim_blockG { background-color:var(--color_cWhite); border:2px solid var(--color_cBlack); float:left; height:46px; margin-left:3px; width:12px; opacity:0.1; -moz-animation-name:bounceG; -moz-animation-duration:1.5s; -moz-animation-iteration-count:infinite; -moz-animation-direction:normal; -moz-transform:scale(0.7); -webkit-animation-name:bounceG; -webkit-animation-duration:1.5s; -webkit-animation-iteration-count:infinite; -webkit-animation-direction:normal; -webkit-transform:scale(0.7); -ms-animation-name:bounceG; -ms-animation-duration:1.5s; -ms-animation-iteration-count:infinite; -ms-animation-direction:normal; -ms-transform:scale(0.7); -o-animation-name:bounceG; -o-animation-duration:1.5s; -o-animation-iteration-count:infinite; -o-animation-direction:normal; -o-transform:scale(0.7); animation-name:bounceG; animation-duration:1.5s; animation-iteration-count:infinite; animation-direction:normal; transform:scale(0.7); } #blockG_1{ -moz-animation-delay:0.45s; -webkit-animation-delay:0.45s; -ms-animation-delay:0.45s; -o-animation-delay:0.45s; animation-delay:0.45s; } #blockG_2 { -moz-animation-delay:0.6s; -webkit-animation-delay:0.6s; -ms-animation-delay:0.6s; -o-animation-delay:0.6s; animation-delay:0.6s; } #blockG_3 { -moz-animation-delay:0.75s; -webkit-animation-delay:0.75s; -ms-animation-delay:0.75s; -o-animation-delay:0.75s; animation-delay:0.75s; } @-moz-keyframes bounceG { 0%{ -moz-transform:scale(1.2); opacity:1} 100%{ -moz-transform:scale(0.7); opacity:0.1} } @-webkit-keyframes bounceG { 0%{ -webkit-transform:scale(1.2); opacity:1} 100%{ -webkit-transform:scale(0.7); opacity:0.1} } @-ms-keyframes bounceG { 0%{ -ms-transform:scale(1.2); opacity:1} 100%{ -ms-transform:scale(0.7); opacity:0.1} } @-o-keyframes bounceG { 0%{ -o-transform:scale(1.2); opacity:1} 100%{ -o-transform:scale(0.7); opacity:0.1} } @keyframes bounceG { 0%{ transform:scale(1.2); opacity:1} 100%{ transform:scale(0.7); opacity:0.1} } .overlayWrapper #overlay .scrollWrapper{ max-width: 100%; text-align: center; } #overlay .scrollWrapper > .wrapper{ max-width: 100%; width: auto; } #overlay .scrollWrapper .wrapperContentLoader{ margin: 0 auto; overflow: visible; padding: 0; } #overlay .scrollWrapper .closeButton{ line-height: normal; } #overlay .scrollWrapper .logoWrapper{ display: none; position: absolute; top: 0; z-index: 99; } #overlay .scrollWrapper .logoWrapper a { padding: 1.875rem 0; } #overlay .wrapperContentLoader .formTitle, #overlay .wrapperContentLoader h1{ text-align: left; margin-bottom: 3.75rem; padding-left: 1rem; padding-right: 1rem; } #overlay .wrapperContentLoader input[type=text], #overlay .wrapperContentLoader input[type=email], #overlay .wrapperContentLoader input[type=password]{ border-color: var(--color_cLine); } #overlay .wrapperContentLoader button{ background-color: var(--color_cTurkis); border-color: var(--color_cTurkis); color: var(--color_cWhite); } #overlay .wrapperContentLoader .CustomUserNavigation{ padding: 0; } #overlay .wrapperContentLoader .CustomUserNavigation ul, #overlay .wrapperContentLoader .CustomUserNavigation ol{ margin: 0; } #overlay.userNavigation .navigationLink{ background-color: var(--color_cPurple); color: var(--color_cWhite); position: relative; width: 50%; box-sizing: border-box; text-align: left; z-index: 99; margin-top: -2rem; margin-left: 2.5rem; } #overlay.userNavigation .customUserNavigationLink{ padding: 1.25rem; box-sizing: border-box; width: 100%; } #overlay.userNavigation .navigationLink h4{ margin-bottom: 0.5rem; } #overlay.userNavigation .navigationLink a{ color: var(--color_cWhite); font-size: 1.125rem ; line-height: 1.5em; } #overlay.userNavigation .navigationLink a:hover{ text-decoration: none; } #overlay.userNavigation .navigationLink span{ display: inline-block; } #overlay.userNavigation .CustomUserResetPassword, #overlay.userNavigation .CustomUserProfile, #overlay.userNavigation .CustomUserLogin{ position: relative; padding: 8.125rem 11.75rem; box-sizing: border-box; background-color: var(--color_cTurkis); } #overlay.userNavigation .CustomUserResetPassword .BasicForm, #overlay.userNavigation .CustomUserProfile .BasicForm, #overlay.userNavigation .CustomUserLogin .BasicForm{ background-color: var(--color_cWhite); padding: 0; } #overlay.userNavigation .CustomUserResetPassword .wrapperBgcolor, #overlay.userNavigation .CustomUserProfile .wrapperBgcolor, #overlay.userNavigation .CustomUserLogin .wrapperBgcolor{ background-color: var(--color_cWhite); padding: 3.75rem 1.5rem; box-sizing: border-box; max-width: 50rem; min-width: 27rem; text-align: left; position:relative; } #overlay.userNavigation .CustomUserNavigation li, #overlay.userNavigation .CustomUserNavigation a{ width: 100%; } #overlay.userNavigation .password_reset_link{ top: -1.5rem; margin-left: 50%; } #overlay.userNavigation .password_reset_link li{ width: auto; } #overlay.userNavigation .password_reset_link a{ color: var(--color_cFormGray); text-decoration: none; -o-transition:all .5s; -ms-transition:all .5s; -moz-transition:all .5s; -webkit-transition:all .5s; transition:all .5s; } #overlay.userNavigation input[type="text"], #overlay.userNavigation input[type="email"], #overlay.userNavigation input[type="password"], #overlay.userNavigation textarea{ border-color: var(--color_cLine); } #overlay.userNavigation .formSubmitMessage { min-height: 2.25rem; } #overlay.userNavigation .formSubmitMessage #submitMessage.error { padding: 0rem; min-height } /*Standart Layout für: 1280px*/ @media screen and (max-width:1280px) { #overlay.userNavigation .CustomUserResetPassword, #overlay.userNavigation .CustomUserProfile, #overlay.userNavigation .CustomUserLogin{ padding-left: 8rem; padding-right: 8rem; } } @media screen and (max-width:1024px) { #overlay.userNavigation .CustomUserResetPassword, #overlay.userNavigation .CustomUserProfile, #overlay.userNavigation .CustomUserLogin{ padding-left: 6rem; padding-right: 6rem; } } @media screen and (max-width:768px) { #overlay.userNavigation .CustomUserResetPassword, #overlay.userNavigation .CustomUserProfile, #overlay.userNavigation .CustomUserLogin{ height: 100%; min-height: 100vh; padding-left: 3rem; padding-right: 3rem; } #overlay .scrollWrapper .logoWrapper{ display: block; left: 3rem; } #overlay .wrapperContentLoader h1{ margin-bottom: 3rem; } #overlay.userNavigation .CustomUserResetPassword .wrapperBgcolor, #overlay.userNavigation .CustomUserProfile .wrapperBgcolor, #overlay.userNavigation .CustomUserLogin .wrapperBgcolor{ /*position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); left: 6rem; right: 6rem;*/ } #overlay .scrollWrapper > .wrapper{ width: 100%; } } @media screen and (max-width:620px) { #overlay.userNavigation .CustomUserResetPassword, #overlay.userNavigation .CustomUserProfile, #overlay.userNavigation .CustomUserLogin{ padding-left: 2rem; padding-right: 2rem; } } @media screen and (max-width:544px) { #overlay.userNavigation .CustomUserResetPassword, #overlay.userNavigation .CustomUserProfile, #overlay.userNavigation .CustomUserLogin { padding-left: 1.25rem; padding-right: 1.25rem; } #overlay.userNavigation .CustomUserResetPassword .wrapperBgcolor, #overlay.userNavigation .CustomUserProfile .wrapperBgcolor, #overlay.userNavigation .CustomUserLogin .wrapperBgcolor{ /*left: 1.25rem; right: 1.25rem;*/ } #overlay .scrollWrapper .closeButton{ top: 0.5rem; } #overlay .scrollWrapper .logoWrapper{ left: 1.25rem; } #overlay .scrollWrapper .logoWrapper a { padding-top: 1rem; } #overlay .wrapperContentLoader .submit, #overlay .wrapperContentLoader button{ width: 100%; } #overlay .wrapperContentLoader h1{ margin-bottom: 2rem; padding-left: 0rem; padding-right: 0rem; } #overlay .wrapperContentLoader .navigationLink{ width: auto; margin-left: 1.25rem; margin-right: 1.25rem; } #overlay.userNavigation .password_reset_link{ margin-left: 0; } #overlay.userNavigation .CustomUserResetPassword .wrapperBgcolor, #overlay.userNavigation .CustomUserProfile .wrapperBgcolor, #overlay.userNavigation .CustomUserLogin .wrapperBgcolor{ padding: 1.25rem; margin-left: 0rem; margin-right: 0rem; min-width: 15rem; } } .BasicText{ line-height:1.45em; max-width:70rem; box-sizing:border-box; margin:0 auto; } .BasicText a{ text-decoration: underline; } .BasicText a[href^='mailto:']{ padding-left: 1.75rem; position:relative; } .BasicText a[href^='mailto:']:before{ position: absolute; left: 0; top: 0; font-family:"SSGizmo"; content: "\2709"; line-height: 1.8em; } .BasicText a[href^='tel:']{ padding-left: 1.75rem; position:relative; } .BasicText a[href^='tel:']:before{ position: absolute; left: 0; top: 0; font-family:"SSGizmo"; content:"\1F4DE"; line-height: 1.8em; } .BasicText ul { margin-bottom:0.75rem; } .BasicText:not(.properties) ul li{ list-style:none; padding-left: 2rem; position:relative; font-family: "Typold-Medium"; font-size: 1.125rem; line-height: 1.9rem; } .BasicText:not(.properties) ul li::before{ font-family:"SSGizmo"; position:absolute; left: 0; top:0.25rem; content: "\2713"; height:1.375rem; width:1.375rem; font-size: 1.5rem; line-height: 1.1em; color: var(--color_cTurkis); border-radius: 100%; border: solid 1px var(--color_cLightGray); background-color: var(--color_cLightGray); } .BasicText ol { margin-left: 2em; } .Tracking .newsletterTrackingWrapper { z-index: 101; position: fixed; bottom: -400px; left: 0; right: 0; height: 400px; transition: bottom 1s; opacity: 0; } .Tracking .newsletterTrackingWrapper.hover { opacity: 1; bottom: 0; } .Tracking .newsletterTracking { background-color: var(--color_cWhite); width: 688px; margin: 0 auto; padding-bottom: 40px; overflow: hidden; position: relative; transition: bottom 1s, opacity 500ms; -webkit-transition: bottom 1s, opacity 500ms; -moz-transition: bottom 1s, opacity 500ms; -o-transition: bottom 1s, opacity 500ms; -ms-transition: bottom 1s, opacity 500ms; } .Tracking .newsletterTracking .icon { position: absolute; top: 30px; right: 20px; width: 50px; height: 50px; cursor: pointer; } .Tracking .newsletterTracking .caption { color: var(--color_cBlack); text-align: center; font-size: 25px; margin: 25px 40px; padding-bottom: 25px; border-bottom: 1px solid var(--color_cWhite); letter-spacing: 0; float: none; } .Tracking .newsletterTracking .newsletterText { padding: 0 40px; font-size: 16px; color: var(--color_cBlack); } .Tracking .newsletterTracking .BasicForm { margin: 16px 0 0; width: 100%; } .Tracking .newsletterTracking form { overflow: hidden; } .Tracking .newsletterTracking .wrapper.text { width: 100%; text-align: center; } .Tracking .newsletterTracking .wrapper.submit { margin: 0; width: 100%; } .Tracking .newsletterTracking .wrapper.submit button { margin-right: 40px; } .Tracking .newsletterTracking h1, .Tracking .newsletterTracking label, .Tracking .newsletterTracking .wrapper:last-child { display: none; } .Tracking .newsletterTracking input, .Tracking .newsletterTracking .BasicForm.ProjectForm .wrapper.text input, .Tracking .newsletterTracking .BasicForm.ProjectForm .wrapper.text.large input { width: 598px; margin-left: 40px; margin-right: 40px; margin-bottom: 8px; padding-left: 4px; padding-right: 4px; } .Tracking .newsletterTracking .validationMessage { margin: 4px 0 0; width: 100%; } .Tracking .newsletterTracking .formSubmitMessage { font-size: 16px; padding: 0 40px; color: var(--color_cBlack); } .BasicFileUpload.frontend .notAuthorized{ display: block; width: 100%; text-align: center; } .BasicFileUpload.frontend .fileInputField { display:none; } .BasicFileUpload.frontend .dropZone.ui-dropzone-highlight { background-color: var(--color_cWhite); color: var(--color_cBlack); } .BasicFileUpload.frontend .dropZone { font-style:italic; color: var(--color_cText); width: 100%; height: 100%; padding: 10px 0px 10px 0px; border:2px dotted var(--color_cBlack); background-color: var(--color_cWhite); cursor:pointer; text-align: center; font-size: 16px; } .BasicFileUpload.frontend .fileUploadSize_info{ font-size: 12px; color: var(--color_cText); margin-bottom: 0.25rem; } .BasicFileUpload.frontend .fileUploadState{ clear:both; padding:0px; } .BasicFileUpload.frontend .fileUploadState ul{ margin-left:0px; } .BasicFileUpload.frontend .fileUploadState li{ list-style: none; border-bottom:1px solid var(--color_cBlack); margin-bottom:0px; clear: both; display: block; height: 32px; background-color:var(--color_cWhite); } .BasicFileUpload.frontend .fileUploadState .loadingIcon { display: none; } .BasicFileUpload.frontend .fileUploadState .loadingIcon .icon { background-image: url("File/skeleton_html/loading.gif"); width: 2rem; height: 2rem; margin: 0 auto; float: none; } .BasicFileUpload.frontend .hiddenTemplate { display: none !important; } .BasicFileUpload.frontend .fileUploadState li > div{ width:20%; /*display:inline;*/ float: left; font-size:12px; color:var(--color_cText); line-height: 1.75em; margin-right: 16px; } .BasicFileUpload.frontend .fileUploadState .filename{ width: 50%; } .BasicFileUpload.frontend .fileUploadState .filesize{ width: 10%; } .BasicFileUpload.frontend .fileUploadState .loadingIndicator{ width: 10%; } .BasicFileUpload.frontend .fileUploadState .progressWrapper{ height:16px; border:1px solid var(--color_cBlack); background-color:var(--color_cWhite); margin-left: 16px; margin-top:8px; text-align:left !important; } .BasicFileUpload.frontend .fileUploadState .progressBar { width: 0%; height: 16px; margin-left:0px; } .BasicFileUpload.frontend .progressBarComplete { background-color:var(--color_cText); } .BasicFileUpload.frontend .fileUploadSingleGraphic{ max-width: 100%; max-height: 50%; } .BasicFileUpload.frontend .fileUploadSingleGraphic .graphic{ max-width: 100%; max-height: 50%; } .BasicFileUpload.frontend .rules { float: left; clear: both; } .BasicFileUpload.frontend .rules ul { display: block; float: left; margin: 0; } .BasicFileUpload.frontend .rules li { display: block; float: left; clear: both; } .BasicFileUpload.frontend .rules input { width: 400px; } .BasicFileUpload.frontend .fileUploadErrorState { clear:both; padding:0px; } .BasicFileUpload.frontend .fileUploadErrorState ul { margin-left:0px; } .BasicFileUpload.frontend .fileUploadErrorState li { list-style: none; border-bottom:1px solid var(--color_cBlack); margin-bottom:0px; clear: both; display: block; height: auto; background-color:var(--color_cWhite); overflow: hidden; } .BasicFileUpload.frontend .fileUploadErrorState li > div { float: left; font-size:12px; color:var(--admin_color_cCaption); line-height: 1.75em; margin-right: 16px; } .BasicFileUpload.frontend .fileUploadErrorState .filename { width: 50%; } .BasicFileUpload.frontend .fileUploadErrorState .filesize { width: 10%; } .BasicFileUpload.frontend .fileUploadErrorState .message { width: 100%; margin: 0; color: var(--color_cError); } .subscription_step1_footerForm .chegroup{ display: none; } .subscription_step1_footerForm form.open .chegroup{ display: block; } .BasicForm.multiStep { margin: 0 auto 2rem; width: 60rem; box-sizing: border-box; max-width: 100%; overflow: hidden; padding: 1.5rem 1rem 0.5rem; } .BasicForm.multiStep .multiStepNav { text-align:center; margin-bottom: 2.5rem; } .BasicForm.multiStep .multiStepNav .navElt { display:inline-block; color: #c5c5c8; } .BasicForm.multiStep .multiStepNav .navElt::after{ content: "-"; padding: 0 0.5rem; } .BasicForm.multiStep .multiStepNav .navElt:last-child::after{ content: ""; } .BasicForm.multiStep .multiStepNav .navElt.valid + .navElt:not(.valid), .BasicForm.multiStep .multiStepNav .navElt.valid { cursor:pointer; } .BasicForm.multiStep .multiStepNav .navElt.active { color: #c5c5c8; cursor:auto; } .BasicForm.multiStep .multiStepNav .idx{ background-color: var(--color_bcArea); padding: 0.25rem 0.75em; border-radius: 100%; line-height: 2.25em; } .BasicForm.multiStep .multiStepNav .navElt.valid .idx{ background-color: var(--color_cLink); color: var(--color_cWhite); } .BasicForm.multiStep .multiStepNav .navElt.active .idx{ background-color: #8c8c8a; color: var(--color_cWhite); } .BasicForm.multiStep form > .container { display:none; } .BasicForm.multiStep form > .container.active { display:block; } .BasicForm.multiStep .wrapperForm:not(.lastStep) .multiStepControls button.submit, .BasicForm.multiStep .firstStep .multiStepControls button.previous, .BasicForm.multiStep .lastStep .multiStepControls button.next, .BasicForm.multiStep form button[type="submit"] { display:none; } .BasicForm .multiStepControls { margin-bottom: 2rem; overflow: hidden; } .BasicForm.multiStep form[name=crm_user_registerForm]{ margin-bottom: 2.5rem; } .BasicForm.multiStep .container h2{ margin-bottom: 1.25rem; padding: 0 0.5rem; color: #505050; } .BasicForm.multiStep .container span[data-type=radgroup].required, .BasicForm.multiStep .container span[data-type=chegroup].required, .BasicForm.multiStep .container h2 + .simple_text{ margin-bottom: 1.25rem; display: block; width: 100%; font-size: 0.75rem; } .BasicForm.multiStep .container .wrapper{ padding: 0 1rem; } .BasicForm.multiStep .container .container{ width:50%; float:left; padding: 0; } .BasicForm.multiStep .container .leftColumn, .BasicForm.multiStep .container .rightColumn{ display: inline-block; width: 50%; vertical-align: top; box-sizing: border-box; } .BasicForm.multiStep .container .leftColumn{ padding-right: 2rem; } .BasicForm.multiStep .container .container .radio, .BasicForm.multiStep .container .container .checkbox{ padding-left: 1.75rem; } .BasicForm.multiStep .container .container input[type="radio"] + label::before, .BasicForm.multiStep .container .container input[type="checkbox"] + label::before{ left: 0.75rem; } .crm_user_registerForm button { float: right; margin-bottom: 2rem; margin-left: 1.25rem; margin-right: 1.25rem; min-width: 6rem; } @media screen and (max-width:544px){ .BasicForm.multiStep .container .container{ width:100%; clear:both; } .BasicForm.multiStep .container .leftColumn, .BasicForm.multiStep .container .rightColumn{ display: block; width: 100%; } .BasicForm.multiStep .container .leftColumn{ padding-right: 0rem; } } .triStateCheckbox[role="checkbox"] .triStateCheckbox__icon { border: 1px solid var(--color_cLine); background-color: var(--color_cWhite); box-sizing:border-box; height: 1.5rem; width: 1.5rem; color:transparent; text-align:center; } .triStateCheckbox[role="checkbox"] .triStateCheckbox__icon::before { color: var(--color_cLink); text-align: center; line-height: 1rem; font-size:1.31rem; transition: none; } .triStateCheckbox[role="checkbox"] .triStateCheckbox__icon--checked::before { font-family: "SSGizmo"; content: "\2713"; } .triStateCheckbox[role="checkbox"] .triStateCheckbox__icon--unchecked::before {} .triStateCheckbox[role="checkbox"] .triStateCheckbox__icon--mixed::before { box-sizing:border-box; height: 0.9rem; width: 0.9rem; position: absolute; top:0.25rem; right:0.2rem; background-color: var(--color_cLink); } .panelContentForm label[for="duplicableContent"] { margin-right: 5px; } .panelContentForm label[for="duplicableContent"] + i { font-size: 14px; text-align: center; margin-top: 12px; margin-bottom: 16px; margin-left: 5px; margin-right: 12px; float: left; } .panelContentForm .BasicFormFormProperty .oneColumn .info { font-size: 12px; border: 1px solid var(--color_cCellmsBlue); padding: 0.5rem; } .panelContentForm .BasicFormFormProperty .oneColumn .infoIcon { margin-right: 2px; } .BasicFormLink { text-decoration: none; cursor: pointer; } [data-form-inplace-id] { cursor: pointer; } .BasicForm { clear: both; margin: 0 auto; overflow: hidden; } .BasicForm select, .BasicForm input, .BasicForm textarea, .BasicForm button{ font-family: inherit; } .BasicForm formwysiwyg { display: block; } .BasicForm form { overflow: hidden; } .BasicForm.ui-dialog-content { width: 100%; } .BasicForm .wrapper { display: block; float:left; } .BasicForm .wrapper.hidden { display: none; } .BasicForm .wrapper.newLine { clear: both; } .BasicForm .wrapper.small { width: 25%; } .BasicForm .wrapper.medium { width: 50%; } .BasicForm .wrapper.large { width: 100%; } .BasicForm label a{ display:inline; } .BasicForm label .captionMandatory { display: none; } .BasicForm .required + label .captionMandatory, .BasicForm .select_with_label.required .captionMandatory { display: inline; } .BasicForm input { display: block; } .BasicForm input[type=text], .BasicForm input[type=email], .BasicForm input[type=password], .BasicForm textarea { box-sizing:border-box; clear: both; border:1px solid var(--color_cLine); } .BasicForm textarea { line-height: 1.5em; } .BasicForm textarea[rows] { height: auto; } .BasicForm textarea, .BasicFormFormProperty textarea { resize: vertical; } .BasicForm input[type="radio"], .BasicForm input[type="checkbox"] { float:left; } .BasicForm input[type="radio"] { width: auto; height: auto; } .BasicForm .validationMessage { clear: both; display: block; color: var(--color_cError); } .BasicForm .wrapper button { float:right; } .BasicForm .hideIfNotRequired { display: none; } .BasicForm .hideIfNotRequired.required { display: block; } .BasicForm .submitMessage { display: none; } .BasicFormTextProperty .first { clear: both; } .BasicForm select { width: 100%; border: 0.5px solid var(--color_cBorderGray); background-color: var(--color_cWhite); } #formOverlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--color_cWhite); opacity: 0.7; z-index: 99999; } #formContainer { background-color: var(--color_cWhite); border: 1px solid var(--color_cBlack); box-shadow: 0 0 15px var(--color_cBlack); color: #666666; font-size: 13px; font-weight: bold; min-height: 200px; left: 50%; margin-left: -300px; margin-top: -50px; padding-top: 20px; position: fixed; text-align: center; top: 50%; width: 600px; z-index: 99999; } input + label + input[name$="_checkboxInput"], input + label + input[name$="_radioInput"] { display:none; } input:checked + label + input[name$="_checkboxInput"], input:checked + label + input[name$="_radioInput"] { display:block; } .BasicForm .wrapper.checkbox_image label { height: 128px; width: 90%; } .BasicForm .wrapper.checkbox_image label>div { width: 50%; float: left; } .BasicForm .wrapper.checkbox_image label .SetImage input { display: none; } .BasicForm .wrapper.checkbox_image label .SetImage .BasicGraphic { height: 128px; width: 128px; } .BasicForm .wrapper.checkbox_image label .SetImage .BasicText { position: relative; bottom: 0; min-width: 100px; bottom: 0; float: left; text-align: left; } .BasicForm .wrapper.simple_text .BasicText { overflow: hidden; } .BasicForm .wrapper.withInput input[type="text"]{ margin-left: 1.5rem; margin-bottom: 0rem; min-height: 1.875rem; width: calc(100% - 1.5rem); } .BasicForm .wrapper.withInput input[type=text] ~ .validationMessage{ margin-bottom: 0; } .BasicForm .wrapper.withInput.invalid .validationMessage{ margin-left: 1.5rem; margin-bottom: 0rem; min-height: 1.875rem; width: calc(100% - 1.5rem); padding: 0.5rem 0; } .BasicForm .container .wrapper.withInput input[type="radio"]:checked + label, .BasicForm .container .wrapper.withInput input[type="checkbox"]:checked + label{ margin-bottom: 0.5rem; display: inline-block; } .BasicForm .wrapper:has(> .fihp), .BasicForm .fihp { display: none; } .BasicForm.subscription_step1_footerForm.subscription { background-color: transparent; padding: 0; } .BasicForm.subscription_step1_footerForm.subscription .wrapperForm{ position: relative; } .BasicForm.subscription_step1_footerForm.subscription .wrapper.email { padding: 0 3.125rem 0 0; } .BasicForm.subscription_step1_footerForm.subscription .wrapper.submit { position: absolute; right: 0; top: 0.7rem; padding: 0; } .BasicForm.subscription_step1_footerForm.subscription .text label { left: 0; top: 1.3rem; right: inherit; background-color: var(--color_cLightGray); } .BasicForm.subscription_step1_footerForm.subscription input[type="email"]{ border-color: var(--color_cLine); font-size: 0.75rem; padding-top: 0.5rem; } .BasicForm.subscription_step1_footerForm.subscription button { color: var(--color_cWhite); background-color: var(--color_cPink); line-height: 1rem; width: 2rem; min-width: 100%; height: 2rem; } .BasicForm.subscription_step1_footerForm.subscription button::after { position: absolute; content: "▻"; font-family: "SSGizmo" !important; font-size: 1rem; line-height: 2rem; right: 0; top: 0; left:0; bottom: 0; border:solid 1px var(--color_cPink); } .BasicForm.subscription_step1_footerForm.subscription button:hover{ color: var(--color_cPink); background-color: var(--color_cWhite); } .BasicForm.subscription_step1_footerForm .chegroup, .BasicForm.subscription_step1_footerForm .mandatory_field_desciption{ display: none; padding-left:0; } .BasicForm.subscription_step1_footerForm form.open .chegroup{ display: block; } .BasicForm.subscription_step1_footerForm.subscription .validationMessage{ font-size: 0.75rem; padding-left: 0; } .BasicForm.subscription_step1_footerForm.subscription #submitMessage{ font-size: 0.75rem; padding-top: 1rem; } .BasicForm.subscription_step1_footerForm.subscription ::-webkit-input-placeholder { font-size: 0.75rem; } .BasicForm.subscription_step1_footerForm.subscription :-ms-input-placeholder { font-size: 0.75rem; } .BasicForm.subscription_step1_footerForm.subscription :-moz-placeholder { font-size: 0.75rem; } .BasicForm.subscription_step1_footerForm.subscription ::-moz-placeholder { font-size: 0.75rem; } .input-placeholder { font-size: 0.75rem; } @media screen and (max-width:544px){ .BasicForm.subscription_step1_footerForm.subscription{ padding: 0rem; } .BasicForm.subscription_step1Form.subscription button{ font-size: 0.75rem; } .BasicForm.subscription_step1_footerForm.subscription .wrapper.submit { width: 2rem; } } .BasicForm.subscription_step1_widgetForm.subscription { background-color: transparent; padding: 0; max-width: 35.5rem; } .BasicForm.subscription_step1_widgetForm.subscription .wrapperForm{ position: relative; } .BasicForm.subscription_step1_widgetForm.subscription .wrapper.email { padding: 0 10.5rem 0 0; } .BasicForm.subscription_step1_widgetForm.subscription .wrapper.submit { position: absolute; right: 0; top: 0.5rem; padding: 0; } .BasicForm.subscription_step1_widgetForm.subscription .text label { left: 0; top: 1.3rem; color: var(--color_cWhite); background-color: transparent; } .BasicForm.subscription_step1_widgetForm.subscription .checkbox label{ text-align: left; color: var(--color_cWhite); } .BasicForm.subscription_step1_widgetForm.subscription input[type="email"]{ border-color: var(--color_cWhite); color: var(--color_cWhite); font-size: 0.75rem; padding-top: 0.5rem; } .BasicForm.subscription_step1_widgetForm.subscription button { color: var(--color_cWhite); border-color: var(--color_cWhite); } .BasicForm.subscription_step1_widgetForm.subscription button:hover{ color: var(--color_cPink); background-color: var(--color_cWhite); } .BasicForm.subscription_step1_widgetForm .chegroup, .BasicForm.subscription_step1_widgetForm .mandatory_field_desciption{ display: none; padding-left: 0; } .BasicForm.subscription_step1_widgetForm form.open .chegroup{ display: block; } .BasicForm.subscription_step1_widgetForm.subscription ::-webkit-input-placeholder { font-size: 0.75rem; color: var(--color_cWhite); } .BasicForm.subscription_step1_widgetForm.subscription :-ms-input-placeholder { font-size: 0.75rem; color: var(--color_cWhite); } .BasicForm.subscription_step1_widgetForm.subscription :-moz-placeholder { font-size: 0.75rem; color: var(--color_cWhite); } .BasicForm.subscription_step1_widgetForm.subscription ::-moz-placeholder { font-size: 0.75rem; color: var(--color_cWhite); } .input-placeholder { font-size: 0.75rem; color: var(--color_cWhite); } @media screen and (max-width:544px){ .BasicForm.subscription_step1_widgetForm.subscription{ padding: 0rem; } .BasicForm.subscription_step1_widgetForm.subscription .wrapper.email{ padding-right: 0; } .BasicForm.subscription_step1Form.subscription button{ font-size: 0.75rem; } .BasicForm.subscription_step1_widgetForm.subscription .wrapper.submit { position: relative; top: initial; } } .Page input[type="text"], .Page input[type="email"], .Page input[type="password"], .Page textarea { -webkit-appearance: none; } @media screen and (max-width:544px) { .Page input[type="text"], .Page input[type="email"], .Page input[type="password"], .Page textarea { font-size: 1rem; } } .BasicForm.Widget { background-color: var(--color_cSemiLightGray); padding: 2.25rem 1.25rem; } .BasicForm .wrapperForm { overflow: hidden; } .BasicForm .wrapper { position:relative; padding: 0 1rem 0 1rem; box-sizing: border-box; } .BasicForm .wrapperForm .wrapper span.description { margin: 0; } .BasicForm label { float: none; width: auto; margin: 0; color: var(--color_cFormGray); } .BasicForm .text label, .BasicForm .password label{ position: absolute; left: 1rem; right: 1rem; top: 1.1rem; z-index: 100; transition: transform 150ms ease-out, font-size 150ms ease-out; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; } .BasicForm .text label span, .BasicForm .password label span{ padding-left: 0.125rem; } .BasicForm .focused label, .BasicForm .filled label { transform: translateY(-90%); font-size: 0.75em; } .BasicForm input[type="text"], .BasicForm input[type="email"], .BasicForm input[type="password"], .BasicForm textarea { position: relative; outline: 0; color: var(--color_cText); background-image: none; background-color: transparent; border-color: var(--color_cWhite); border-width: 0 0 1px 0; clear: both; height: 2rem; line-height: 1.3em; font-size: 1.125rem; -webkit-appearance: none; box-sizing:border-box; margin: 1rem 0 0 0; padding: 0; width: 100%; } .BasicForm textarea { background-color: var(--color_cWhite); padding: 0.5rem 0.75rem; height: 7rem; margin-top: 0.5rem; } .BasicForm .invalid .dropDown .caption, .BasicForm .invalid input, .BasicForm .invalid textarea { border-color: var(--color_cPink); } .BasicForm input[type="radio"], .BasicForm input[type="checkbox"] { margin-top:0.25rem; } .BasicForm button { font-size: 1.125rem; height: auto; padding: 0.4rem 1rem; min-width: 9.375rem; border: solid 2px var(--color_cPink); background-color: transparent; color: var(--color_cPink); -o-transition: all .5s; -ms-transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; } .BasicForm .wrapper.submit{ float: right; } .BasicForm .chegroup.agreement{ padding: 0 0 0 0; font-size: 1rem; } .BasicForm .wrapper.chegroup .wrapper.agreement { position: relative; margin-left: 0; } .BasicForm .agreement.agreement input{ display: none; } .BasicForm #submitMessage { padding: 0; font-size: 1rem; text-align: left; position:relative; -webkit-transition-duration: 333ms; -moz-transition-duration: 333ms; -ms-transition-duration: 333ms; -o-transition-duration: 333ms; transition-duration: 333ms; -webkit-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -moz-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -ms-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -o-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -webkit-transition-property: max-height, opacity, margin; -moz-transition-property: max-height, opacity, margin; -ms-transition-property: max-height, opacity, margin; -o-transition-property: max-height, opacity, margin; transition-property: max-height, opacity, margin; } .BasicForm #submitMessage.error { margin: 1rem 0; padding: 0rem 1rem 0rem 2rem; display: block; color: var(--color_cPink); position: relative; } .BasicForm #submitMessage.error::before{ content: ""; position: absolute; left: 0; top: 0; background-image: none; } .BasicForm #submitMessage > * { margin-bottom: 2.5rem; } .BasicForm .wrapper.mandatory_field_desciption{ font-size: 1rem; padding-top: 0.5rem; } .BasicForm .validationMessage { font-size: 1rem; font-family: "Typold-Book"; line-height: 1.5rem; text-align: left; min-height: 2.1875rem; max-height: none; width: 100%; box-sizing: border-box; padding: 0 0.5rem; border-radius: 0.25rem; float: left; -webkit-transition-duration: 333ms; -moz-transition-duration: 333ms; -ms-transition-duration: 333ms; -o-transition-duration: 333ms; transition-duration: 333ms; -webkit-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -moz-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -ms-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -o-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -webkit-transition-property: max-height, opacity, margin; -moz-transition-property: max-height, opacity, margin; -ms-transition-property: max-height, opacity, margin; -o-transition-property: max-height, opacity, margin; transition-property: max-height, opacity, margin; } .BasicForm .invalid .validationMessage { padding: 0.25rem; display: block; color: var(--color_cPink); } @media screen and (max-width: 768px){ .BasicForm input[type="text"], .BasicForm input[type="email"], .BasicForm input[type="password"], .BasicForm textarea, .BasicForm .validationMessage, .BasicForm #submitMessage{ font-size: 0.875rem; } } @media all and (max-width: 544px) { .BasicForm .wrapper.small, .BasicForm .wrapper.medium { width: 100%; clear: both; } .BasicForm .wrapper { padding-left:0; padding-right:0; } .BasicForm .wrapper.submit, .BasicForm .wrapper button{ width: 100%; } .BasicForm .text label, .BasicForm .password label{ left: 0; } } .BasicForm.pageElt { margin: 0 auto; padding: 0 1.5rem 2.5rem; max-width: 48rem; box-sizing: border-box; } @media screen and (min-width: 1920px){ .BasicForm.pageElt { max-width: 52rem; } } .BasicForm .wrapper.chegroup [data-type="chegroup"] { font-family: "Typold-Book"; font-size: 1.125rem; line-height: 2rem; margin-bottom: 1rem; display:block; color: var(--color_cText); } .BasicForm .wrapper.agreement, .BasicForm .wrapper.checkbox_image, .BasicForm .wrapper.checkbox, .BasicForm .wrapper.radio { padding:0; } .BasicForm .wrapper.agreement label, .BasicForm .wrapper.checkbox_image label, .BasicForm .wrapper.checkbox label, .BasicForm .wrapper.radio label { margin-left: 2.5rem; display: block; font-size: 1rem; line-height: 1.5em; font-family: "Typold-Book"; color: var(--color_cText); transform: none; } .BasicForm .wrapper.aqgreement label a, .BasicForm .wrapper.checkbox_image label a, .BasicForm .wrapper.checkbox label a, .BasicForm .wrapper.radio label a{ color: var(--color_cText); text-decoration: underline; } .BasicForm .wrapper.agreement, .BasicForm .wrapper.checkbox, .BasicForm .wrapper.checkbox_image{ position:relative; } .BasicForm .wrapper.agreement input[type="checkbox"], .BasicForm .wrapper.checkbox_image input[type="checkbox"], .BasicForm .wrapper.checkbox input[type="checkbox"] { display:none; } .BasicForm input[type="checkbox"]+label{ -o-transition:all .5s; -ms-transition:all .5s; -moz-transition:all .5s; -webkit-transition:all .5s; transition:all .5s; } .BasicForm input[type="checkbox"]+label::before{ content: ""; position: absolute; left: 0; top: 0; background-image: url("/Ressource/Graphic/checkbox.svg"); background-size: 1.5rem 1.5rem; background-repeat: no-repeat; background-position: center; border-radius: 100%; width: 1.5rem; height: 1.5rem; background-color: var(--color_cWhite); color: var(--color_cSemiLightGray); -o-transition:all .5s; -ms-transition:all .5s; -moz-transition:all .5s; -webkit-transition:all .5s; transition:all .5s; } .BasicForm input[type="checkbox"]:checked + label::before{ background-image: url("/Ressource/Graphic/checkbox_active.svg"); } @media screen and (max-width:768px){ .BasicForm .wrapper.agreement label, .BasicForm .wrapper.checkbox_image label, .BasicForm .wrapper.checkbox label, .BasicForm .wrapper.radio label{ font-size: 0.875rem; } } .BasicForm .chegroup > span{ font-size: 0.75rem; } .BasicForm .wrapper.chegroup > .validationMessage { min-height: 0; height: auto; } .BasicForm .wrapper.checkselectbox.radgroup{ overflow:visible; } .BasicForm .dropDown{ width: 100%; box-sizing:border-box; background-color:var(--color_cWhite); } .BasicForm .dropDown .dropIcon{ position: absolute; right: 0.5rem; top: 0.0625rem; line-height: 3rem; width: 1rem; font-size: 0.75rem; } .BasicForm .dropDown .caption{ padding: 0 0.75rem; position: relative; border: solid 1px var(--color_cLine); -webkit-border-radius: 0.1875rem; -moz-border-radius: 0.1875rem; border-radius: 0.1875rem; font-size: 1rem; line-height: 2.875em; } .BasicForm .dropDown .caption .icon{ float: right; } .BasicForm .dropDown ul{ border-width: 0; } .BasicForm .dropDown .item, .BasicForm .dropDown a{ box-sizing:border-box; color:var(--color_cText); font-size:0.75rem; padding:0.5rem 0.75rem; line-height: 1rem; border-style: solid; border-width: 1px; border-color: var(--color_cLine); border-top-width: 0; background-color:var(--color_cWhite); } .BasicForm .dropDown .item.selected{ color:var(--color_cWhite); background-color:var(--color_cPink); } .BasicForm .dropDown .item:focus, .BasicForm .dropDown .item:active, .BasicForm .dropDown a:focus, .BasicForm .dropDown a:active{ color:var(--color_cWhite); } @media screen and (max-width: 768px){ .BasicForm .dropDown .caption{ font-size: 0.875rem; } } .BasicForm input:invalid, .BasicForm textarea:invalid { box-shadow:none; } *::-webkit-input-placeholder { opacity: 1; color: var(--color_cFormGray); font-size: 1.125rem; font-family: "Typold-Book"; } *:-ms-input-placeholder { opacity: 1; color: var(--color_cFormGray); font-size: 1.125rem; font-family: "Typold-Book"; } *:-moz-placeholder { opacity: 1; color: var(--color_cFormGray); font-size: 1.125rem; font-family: "Typold-Book"; } *::-moz-placeholder { opacity: 1; color: var(--color_cFormGray); font-size: 1.125rem; font-family: "Typold-Book"; } .input-placeholder { opacity: 1; color: var(--color_cFormGray); font-size: 1.125rem; font-family: "Typold-Book"; } input::-ms-clear { width: 0px; height: 0px; } @media all and (max-width:544px) { *::-webkit-input-placeholder { font-size: 1rem; } *:-ms-input-placeholder { font-size: 1rem; } *:-moz-placeholder { font-size: 1rem; } *::-moz-placeholder { font-size: 1rem; } .input-placeholder { font-size: 1rem; } } .BasicForm input:focus, .BasicForm input:active, .BasicForm textarea:focus, .BasicForm textarea:active { border-color: var(--color_cPink); } *:focus::-webkit-input-placeholder { color: var(--color_cFormGray); } *:focus:-ms-input-placeholder { color: var(--color_cFormGray); } *:focus:-moz-placeholder { color: var(--color_cFormGray); } *:focus::-moz-placeholder { color: var(--color_cFormGray); } .input-placeholder:focus { color: var(--color_cFormGray); } .pagination{ overflow:hidden; clear:both; } .pagination .wrapper{ float:right; } .cookieWarning { background-color:var(--color_bcFond); position:fixed; left:0; right:0; bottom:0; display:none; margin:0 auto; } .cookieWarning.opened { display:block; } .cookieWarning .wrapper { width:95rem; max-width:100%; box-sizing:border-box; padding: 1.25rem 8rem 1.25rem 2.5rem; margin:0 auto; position:relative; } .cookieWarning .text { min-height:3rem; } .cookieWarning button { position: absolute; right: 2.5rem; top: 1.25rem; } @media screen and (max-width:544px) { .cookieWarning .wrapper { padding: 0.75rem 1rem 1.25rem 1rem; overflow: hidden; } .cookieWarning button { position: relative; display: inline-block; float: right; right: 1rem; margin-bottom: 1rem; } } .waitAnimationBullets { width: 2rem; text-align: center; display:inline-block; vertical-align:middle; } .waitAnimationBullets > div { width: 0.5rem; height: 0.5rem; background-color: #333; border-radius: 100%; display: inline-block; margin: 0 1px; -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both; animation: sk-bouncedelay 1.4s infinite ease-in-out both; } .waitAnimationBullets .bullet1 { -webkit-animation-delay: -0.32s; animation-delay: -0.32s; } .waitAnimationBullets .bullet2 { -webkit-animation-delay: -0.16s; animation-delay: -0.16s; } @-webkit-keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0) } 40% { -webkit-transform: scale(1.0) } } @keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); } 40% { -webkit-transform: scale(1.0); transform: scale(1.0); } } .ajaxPagination { } .ajaxPagination .page { display:inline-block; border-radius:100%; width:2rem; height:2rem; line-height:2rem; color:var(--color_cBlack); background-color:var(--crm_color_bcAreaMainLight); text-align:center; -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; } .ajaxPagination .page[data-page]:not(.active) { cursor:pointer; } .ajaxPagination .page.active { color:var(--color_cWhite); background-color:var(--color_cIconAction); font-family:"Open Sans Bold"; } .ajaxPagination .page:not(:last-child) { position:relative; margin-right:1.75rem; } .ajaxPagination .page:not(:last-child)::after { position:absolute; right:-1.5rem; top:50%; content:""; width:1.25rem; border-top:1px solid var(--color_bcFond); } .cookieServiceForbidden { width: 100%; height: 100%; background-color: var(--color_bcInfoBox70); position: absolute; z-index: 200; text-align: center; box-sizing: border-box; padding: 0 1rem; } .js-cookieServiceForbidden-hidden { display: none !important; } .cookieServiceForbidden .wrapper{ position: relative; top: calc(50% - 3rem); } .cookieServiceForbidden .info{ display: block; margin-bottom: 1.5rem; color: var(--color_cWhite); } .cookieServiceForbidden a:active, .cookieServiceForbidden a:focus { color: var(--color_cOnClick); text-decoration: underline; } @media screen and (max-width: 544px) { .cookieServiceForbidden .wrapper{ top: calc(50% - 5.5rem); } } @media screen and (max-width: 440px) { .cookieServiceForbidden .info{ margin-bottom: 0.5rem; } } .roundIcon { border: 0.0625rem solid var(--color_cText); -webkit-border-radius: 1.5rem; -moz-border-radius: 1.5rem; border-radius:1.5rem; display:inline-block; height:2rem; text-align:center; width:2rem; line-height: 2rem; background-color:var(--color_cWhite); cursor: pointer; } .roundIcon:before { content: ""; display: inline-block; height: 100%; vertical-align: middle; } .roundIcon [class*="ss-"] { display: inline-block; vertical-align: middle; float:none; margin:0; height:1rem; width:1rem; color:var(color_cText); } .roundIcon, .roundIcon [class*="ss-"] { -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; } .intro { position: relative; margin-top: -15rem; margin-bottom: 8rem; } .intro .wrapper { min-height: 32rem; height: 66vh; padding-bottom: 4rem; } .intro .graphicWrapper { width: 100%; height: 100%; min-height: 50vh; background-repeat: no-repeat; background-size: cover; background-position: top center; } .intro .textBox { right: 5rem; left: 50%; max-width: 52.5rem; box-sizing: border-box; padding: 1.75rem 2.1875rem; color: var(--color_cWhite); background-color: var(--color_cTurkis); font-size: 1.375rem ; line-height: 1.875rem ; position: absolute; bottom: 0; z-index: 30; } .intro .textBox>* { margin-bottom: 0.5rem; } @media screen and (max-width:1024px) { .intro .textBox { right: 3rem; left: 33.333%; padding: 1.75rem; font-size: 1.25rem ; line-height: 1.75rem ; } } @media screen and (max-width:768px) { .intro { margin-top: -7rem; } } @media screen and (max-width:768px) and (max-height:544px) { .intro .wrapper { min-height: 2rem; } .intro h2 { font-size: 1.625rem; } .intro .textBox { right: 0rem; top: -2rem; position: relative; padding: 1.125rem; font-size: 1.125rem; line-height: 1.45em; left: 1.25rem; width: calc(100% - 1.25rem); } } @media screen and (max-width:544px) { .intro { margin-bottom: 3.375rem; } .intro .wrapper { height: auto; padding-bottom: 0; } .intro .graphicWrapper { height: 66vh; } .intro .textBox { top: -2rem; right: 0rem; position: relative; padding: 1.125rem; font-size: 1.0625rem ; line-height: 1.375rem ; left: 1.25rem; width: calc(100% - 1.25rem); } } .styledBrowser{ box-shadow: 0.45rem 0.75rem 1.25rem -0.5rem var(--admin_color_cLine); position: relative; } .styledBrowser::before{ background-color: var(--color_cStyledBrowser); /*background: url(fallback.png);*/ background-image: url('/Ressource/Graphic/browser.svg'); background-size: cover; background-repeat: no-repeat; background-position: top left; padding-bottom: 4%; box-sizing: border-box; border-radius: 5px 5px 0px 0px; position: relative; bottom: 0; vertical-align: bottom; max-width: 80rem; width: 100%; min-height: 1rem; max-height: 1.25rem; height: 100%; } .snippetScreenshot.Widget { max-width: 80rem; box-sizing: border-box; padding: 0 5rem 6rem; margin: 0 auto; } .snippetScreenshot.Widget::after { content: ""; height: 100%; vertical-align: middle; display: block; clear: both; } @media screen and (max-width:768px) { .snippetScreenshot.Widget { padding-left: 3rem; padding-right: 3rem; } } @media screen and (max-width:544px) { .snippetScreenshot.Widget { padding-left: 0; padding-right: 0; } } .snippetScreenshot.Widget .imgContainer, .snippetScreenshot.Widget .textContainer { width: 50%; } .snippetScreenshot.Widget:not(.right) .imgContainer, .snippetScreenshot.Widget.right .textContainer { float: left; } .snippetScreenshot.Widget:not(.right) .textContainer, .snippetScreenshot.Widget.right .imgContainer { float: right; } .snippetScreenshot.Widget:not(.right) .imgContainer .innerWrapper { padding-right: 10px; } .snippetScreenshot.Widget:not(.right) .textContainer .innerWrapper { padding-left: 105px; } .snippetScreenshot.Widget.right .textContainer .innerWrapper { padding-right: 105px; } .snippetScreenshot.Widget.right .imgContainer .innerWrapper { padding-left: 10px; } @media screen and (max-width:768px) { .snippetScreenshot.Widget .imgContainer, .snippetScreenshot.Widget .textContainer { width: 100%; } .snippetScreenshot.Widget .innerWrapper { padding-left: 0 !important; padding-right: 0 !important; } .snippetScreenshot.Widget .imgContainer .innerWrapper { padding-top: 3rem; } } @media screen and (max-width:544px) { .snippetScreenshot.Widget .innerWrapper { padding-left: 1.25rem !important; padding-right: 1.25rem !important; } .snippetScreenshot.Widget .imgContainer .innerWrapper { padding-top: 2.25rem; } } .snippetScreenshot.Widget .browserWrapper::before { content: ""; height: 100%; vertical-align: middle; display: inline-block; } .snippetScreenshot.Widget .SetSeparator.Widget { margin-bottom: 4rem; padding: 0; } @media screen and (max-width:768px) { .snippetScreenshot.Widget .SetSeparator.Widget { margin-bottom: 2.5rem; } } @media screen and (max-width:544px) { .snippetScreenshot.Widget .SetSeparator.Widget { margin-bottom: 1.125rem; } } .snippetScreenshot.Widget .BasicText { margin: 0; } .snippetScreenshot.Widget .imgContainer .graphic { position: relative; } .snippetScreenshot.Widget .innerWrapper > a { margin-top: 2.25rem; } @media screen and (max-width:768px) { .snippetScreenshot.Widget .innerWrapper > a { margin-top: 1.375rem; } } .snippetScreenshot.Widget .SetSeparator .BasicText.subtitle { font-size: 1.25rem; line-height: 1.375rem; font-family: 'Typold-Bold'; margin: 0; } .snippetScreenshot.Widget h3.title { margin-bottom: 2rem; text-transform: inherit; } @media screen and (max-width:768px) { .snippetScreenshot.Widget h3.title { margin-bottom: 1rem; } } @media screen and (max-width:544px) { } .snippetScreenshot.Widget .BasicText.content { font-size: 1.125rem; line-height: 1.625rem; font-family: 'Typold-Book'; } select[name="color"] option{ color: var(--color_cWhite); } .BasicVideo .VideoBox video, .BasicVideo .VideoBox img, .BasicVideo .VideoBox object { max-width: 100%; } .BasicVideo.hover .cookieServiceForbidden:not(.js-cookieServiceForbidden-hidden){ display: block; } .BasicVideo .previewImageWrapper { position: relative; cursor:pointer; } .BasicVideo .previewImageWrapper .videoIcon { margin: 0; } .BasicVideo .previewImageWrapper .videoIcon { position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 100%; background: url(File/basic_video/button_play_inaktiv.png) no-repeat; background-position: center center; width: 100%; } .BasicVideo .previewImageWrapper:hover .videoIcon { background-image: url(File/basic_video/button_play_aktiv.png); } .BasicVideo:hover .cookieServiceForbidden{ display: block; } .CustomAgreement { margin: 0 auto; overflow:hidden; } .CustomAgreement h1 { margin-bottom:1.5rem; } .CustomAgreement input[type="checkbox"] { vertical-align:middle; float:left; margin: 0.25rem 0; cursor:pointer; } .CustomAgreement label { margin-left:2rem; display:block; } .CustomAgreement input[disabled] + label { cursor:auto; } .CustomAgreement .defaultButton { float: right; margin-left:1rem; } .CustomAgreement.agreementList { } .CustomAgreement.agreementList .agreementContent, .CustomAgreement.agreementList .historyContent { display:none; } .CustomAgreement.agreementList .open .agreementContent, .CustomAgreement.agreementList .history.open .historyContent { display:block; } .CustomAgreement .click { cursor: pointer; } .CustomAgreement .agreementWrapper { border-top-width: 1px; } .CustomAgreement .agreementWrapper:last-child { border-bottom-width: 1px; } .CustomAgreement.agreementList .open .agreementLine .openIcon .opened, .CustomAgreement.agreementList .agreementLine .openIcon .closed, .CustomAgreement.agreementList .history.open .openIcon .opened, .CustomAgreement.agreementList .history .openIcon .closed { display:block; } .CustomAgreement.agreementList .open .agreementLine .openIcon .closed, .CustomAgreement.agreementList .agreementLine .openIcon .opened, .CustomAgreement.agreementList .history.open .openIcon .closed, .CustomAgreement.agreementList .history .openIcon .opened { display:none; } .CustomAgreement.agreementList .agreementLine, .CustomAgreement.agreementList .historyCaption { overflow: hidden; padding: 0.5rem; } .CustomAgreement.agreementList .caption { float: left; } .CustomAgreement.agreementList .openIcon { float: right; padding-top:0.25rem; } .CustomAgreement.agreementList .agreementLine .state { text-align: right; padding-right: 1.5rem; } .CustomAgreement.agreementList .agreementContent { padding:0.5rem; } .CustomAgreement.agreementList .newest { margin-bottom:1.5rem; } .CustomAgreement.agreementList .lastEdited { margin-bottom:1.5rem; } .CustomAgreement.agreementList .lastEdited .info { margin-bottom:0.5rem; } .CustomAgreement.agreementList .history { background-color:var(--color_bcArea); margin-bottom:0.5rem; } .CustomAgreement.agreementList .historyContent { padding:0.5rem; } .CustomAgreement.agreementList .history .infos { float:left; width:8rem; } .CustomAgreement.agreementList .history .text { padding-left: 9rem; } .CustomAgreement.agreementList .history .entry:not(:last-child) .text { margin-bottom:1rem; } .CustomAgreement.agreementList form { margin-bottom:1rem; } .newest{ position: relative; } .CustomAgreement.agreementList input[type="checkbox"]{ display: none; } .CustomAgreement.agreementList input[type="checkbox"] + label::before{ content: ""; position: absolute; left: 0; top: 0; border-radius: 100%; background-image: url("/Ressource/Graphic/checkbox.svg"); background-size: 1.1875rem 1.1875rem; background-repeat: no-repeat; background-position: center; width: 1.1875rem; height: 1.1875rem; } .CustomAgreement.agreementList input[type="checkbox"]:checked + label::before{ background-image: url("/Ressource/Graphic/checkbox_active.svg"); color: var(--color_cWhite); } .CustomAgreement.agreementList .history{ background-color: var(--color_cLightGray); } .CustomAgreement.agreementList .historyContent{ font-size: 0.875rem; } @media screen and (max-width: 544px) { .CustomAgreement.agreementList .historyContent, .CustomAgreement.agreementList { font-size:0.75rem; line-height:1.5em; } .CustomAgreement.agreementList .history .infos { width:6rem; } .CustomAgreement.agreementList .history .text { padding-left:6.5rem; } } .CustomAgreement.doiStep1 { max-width:45rem; margin:0 auto 2rem; padding:0 1rem; } .CustomAgreement.doiStep1 .intro { margin:0 0.5rem 1.5rem; } .CustomAgreement.doiStep1 .submitMessage { text-align:center; } .CustomAgreement.agreementListRequired .requiredWrapper { margin-bottom:1.5rem; } .CustomAgreement.agreementListRequired .caption { margin-bottom:0.75rem; } .CustomAgreement.agreementListRequired .message { margin-bottom:1.5rem; } .CustomAgreement.doiStep1, .CustomAgreement { overflow: hidden; box-sizing: border-box; max-width: 70rem; padding: 2.5rem 5rem; margin: 0 auto 4rem; } .CustomAgreement .agreementWrapper { border-top: solid 1px var(--color_cLine); } .CustomAgreement .agreementWrapper:last-child { border-bottom: solid 1px var(--color_cLine); } .CustomAgreement .intro{ margin: 0 0 1.5rem 0; } .CustomAgreement:not(.doiStep1) .intro{ display: none; } .CustomAgreement.doiStep1 .wrapper.email label{ left: 0; } .CustomAgreement.doiStep1 .wrapper.email, .CustomAgreement.doiStep1 .validationMessage{ padding: 0; } .CustomAgreement.doiStep1 .mandatory_field_desciption{ display: none; } .CustomAgreement label{ margin-left: 0; } .CustomAgreement .defaultButton{ border-color: var(--color_cPink); background-color: var(--color_cPink); } .CustomAgreement.agreementList label, .CustomAgreement.agreementListRequired label{ margin-left: 2rem; } @media screen and (max-width: 768px) { .CustomAgreement.doiStep1, .CustomAgreement { padding-right: 3rem; padding-left: 3rem; } } @media screen and (max-width: 544px) { .CustomAgreement.doiStep1, .CustomAgreement { margin-right: 0; margin-left: 0; padding-right: 1.25rem; padding-left: 1.25rem; } .CustomAgreement.validation h1, .CustomAgreement.validation .content{ margin-left:1rem; margin-right:1rem; } } .announcementContent.banner { z-index: 9997; position: relative; width: 100%; overflow: hidden; box-sizing: border-box; } .announcementContent.banner .contentWrapper { overflow: hidden; box-sizing: border-box; margin: auto; padding: 1rem; } .announcementContent.banner .messageWrapper { float: left; box-sizing: border-box; max-width: calc(100% - 2.5rem); } .announcementContent.banner a{ text-decoration: none; } .announcementContent.banner .linkArrow{ font-size: 1rem; } .announcementContent.banner span{ padding-right: 0.25rem; display: inline; } .announcementContent.banner .close{ float: right; text-align: center; cursor: pointer; } .announcementContent.banner .close img{ height: 1rem; padding: 0.25rem 0.75rem; } #wysiwyg .announcementContent.banner .BasicText.editMode { display: inline-block; min-width: 1.25rem; } .announcementContent.modal .overlay { top: 0; background-color: rgba(0, 0, 0, 0.7); transition: background-color 0.5s; position: fixed; left: 0; right: 0; height: 100%; z-index: 9998; } .announcementContent.modal .contentWrapper{ margin: auto; display: flex; flex-direction: column; justify-content: center; position: relative; top: calc(50% - 15rem); overflow-y: auto; -webkit-overflow-scrolling: touch; text-align: center; height: 100%; max-height: 30rem; width: 100%; max-width: 30rem; } .announcementContent.modal .close { z-index: 9999; position: absolute; right: calc(50% - 15rem); top: calc(50% - 15rem); font-size: 2rem; line-height: 1em; padding: 0.5rem; } .announcementContent.modal .linkText, .announcementContent.modal .linkArrow{ display: inline; padding-right: 0.25rem; } .announcementContent.modal .linkArrow{ font-family: 'Font Awesome 6 Free'; } @media all and (max-width: 520px) { .announcementContent.modal .contentWrapper { left: 0; max-width: calc(100% - 2.4rem); max-height: calc(100vw - 2.4rem); top: calc(50% - 50vw); } .announcementContent.modal .close{ right: 0; top: calc(50% - 50vw); } } #wysiwyg .announcementContent.modal{ position: relative; height: 30rem; background-color: var(--color_cWhite) !important; } #wysiwyg .announcementContent.modal .overlay{ position: relative; background-color: var(--color_cWhite); } .CustomAnnouncement.Widget { position: relative; width: 100%; overflow: hidden; } .announcementContent button.close{ background-color: transparent; border: none; padding: 0; margin: 0; min-width: auto; font-family: 'Font Awesome 6 Free'; } .maintenanceLoader{ background-color: var(--color_cLine); width: 100%; overflow: hidden; color: var(--color_cText); } .maintenanceLoader:not(.noMessages){ padding-top:1rem; margin-bottom: 6rem; } .maintenanceLoader a:focus, .maintenanceLoader a:active { text-decoration: none; } .maintenanceMessage{ margin-bottom: 1rem; } .maintenanceMessage .messageWrapper{ background-color: var(--color_cLine); padding: 1rem 5.5rem; position: relative; text-decoration: none; } .maintenanceMessage .messageIcon { position: absolute; font-size: 2rem; top: 1rem; left: 1rem; } .maintenanceMessage .icon { transition: color .3s; } .maintenanceMessage .close { position: absolute; font-size: 1.75rem; top: 0; right: 0; cursor: pointer; padding: 1rem; } .maintenanceMessage .title{ font-size: 1.5rem; margin-bottom: 1rem; } .maintenanceMessage .message{ font-size: 1rem; } @media screen and (max-width:544px) { .maintenanceMessage .messageWrapper{ background-color: var(--color_cLine); padding: 4rem 1.5rem 0 0; position: relative; text-decoration: none; } .maintenanceMessage .messageIcon { left: 0; } .maintenanceMessage .close{ right: -1rem; } .maintenanceMessage .title{ font-size: 1.25rem; } .maintenanceMessage .message{ font-size: 0.875rem; } } .jconfirm.jconfirm-dialog .jconfirm-bg { background-color: var(--filemanager_bcOverlay); } .jconfirm.jconfirm-dialog .jconfirm-box { border: solid 1px var(--filemanager_cDialogBorder); background-color: var(--filemanager_bcDialog); padding: 0; } .jconfirm.jconfirm-dialog .jconfirm-box .jconfirm-closeIcon { color: var(--admin_color_cAdminButton); } .jconfirm.jconfirm-dialog .jconfirm-box .jconfirm-title-c { color: var(--color_cWhite); background: var(--filemanager_bcDialogHeader); padding: 8px 4px 8px 8px; font-size: 0.875rem; line-height: 1em; } .jconfirm.jconfirm-dialog .jconfirm-box .jconfirm-content-pane { padding: 8px 8px 0 8px; box-sizing: border-box; margin-bottom: 8px; font-size: 0.75rem; } .jconfirm.jconfirm-dialog .jconfirm-box .jconfirm-buttons { padding: 0; } .jconfirm.jconfirm-dialog .jconfirm-box .jconfirm-buttons button { padding: 0.5rem 1rem; background-color: var(--filemanager_bcDialogBtn); border: solid 1px var(--filemanager_cDialogBorder); border-radius: 4px; transition: all 0.3s; margin-left: 0.5rem; margin-top: 0; color: var(--color_cBlack); } .jconfirm.jconfirm-dialog .jconfirm-box .jconfirm-buttons button:last-child { margin-left: 0; } .CustomFileManager.explorer .filemanagerDialogWrapper .infoContent{ padding: 1rem; min-height: 2rem; } .CustomFileManager.explorer .filemanagerDialogWrapper .actionWrapper{ margin: 0 1rem 1rem; overflow: hidden; } #select2-drop.filemanagerSelect2{ z-index: 99999999; } .CustomFileManager.filetree #fileManagerWrapper { border: solid 1px var(--filemanager_cDialogBorder); background-color: var(--color_cWhite); margin-bottom: 1rem; padding: 1rem 0 1rem 1rem; } .CustomFileManager.filetree .intro { margin-bottom: 1rem; } .CustomFileManager.filetree li { list-style-position: inside; } .CustomFileManager.filetree .jstreeWrapper { max-height: 30vh; min-height: 10rem; overflow-y: auto; box-sizing: border-box; } .CustomFileManager.filetree .adressBarWrapper{ padding-bottom: 0; align-items: center; } .CustomFileManager.filetree .adressBarWrapper .introPath{ padding-right: 1rem; } .CustomFileManager.filetree .adressBarWrapper .adressPath { background-color: var(--color_cWhite); border: solid 1px var(--filemanager_cDialogBorder); } .CustomFileManager.detail { min-width: 74rem; min-height: 22rem; font-size: 0.75rem; border: solid 1px var(--filemanager_cDialogBorder); background-color: var(--color_cWhite); box-sizing: border-box; } .CustomFileManager.detail #nodeTab{ display: grid; grid-template-columns: 50% 50%; } .CustomFileManager.detail #nodeTab > div{ box-sizing: border-box; padding: 1rem; } .CustomFileManager.detail #nodeTab .leftDialogContent{ padding-right: 0.5rem; } .CustomFileManager.detail #nodeTab .rightDialogContent{ padding-left: 0.75rem; } .CustomFileManager.detail .SetSeparator .title{ font-size: 0.875rem; line-height: 1.1em; } .CustomFileManager.detail .ui-tabs{ border: none; } .CustomFileManager.detail .ui-tabs-nav{ background-color: var(--color_cWhite); padding: 0; } .CustomFileManager.detail li[role="tab"]{ margin: 0; padding: 0; border: none; box-sizing: border-box; } .CustomFileManager.detail li[role="tab"] a{ width: 100%; box-sizing: border-box; font-size: 1rem; line-height: 1.1em; } .CustomFileManager.detail li.ui-state-default{ background-color: var(--filemanager_bcDialog) !important; border:solid 1px var(--admin_color_cAdminButtonBorder); border-top-width: 0; border-right-width: 0; } .CustomFileManager.detail li.ui-state-default a{ color: var(--admin_color_cAdminButton); } .CustomFileManager.detail li.ui-state-active{ background-color: var(--color_cWhite) !important; border-right-width:0; border-bottom-width:0; } .CustomFileManager.detail li.ui-state-active a{ color: var(--admin_color_cCaption); } .CustomFileManager.detail .generalInfos, .CustomFileManager.detail .fileMetadatas, .CustomFileManager.detail .nodeMetadatas{ margin-bottom: 1.5rem; } .CustomFileManager.detail label { font-size: 0.75rem; line-height: 1.3em; } .CustomFileManager.detail input { border: solid 1px var(--admin_color_bcInputGradient); border-radius: 2px; padding: 0.25rem 0.5rem; width: 100%; box-sizing: border-box; } .CustomFileManager.detail .info { text-align: left; margin-bottom: 1rem; overflow: hidden; font-size: 0.875rem; line-height: 1.3em; } .CustomFileManager.detail .info > div{ margin-bottom: 0.5rem; } .CustomFileManager.detail button { padding: 0.25rem; font-size: 0.75rem; line-height: 1em; } .CustomFileManager.detail #contentWrapper > ul > li[role="tab"]:first-child { border-left-width: 0; } .CustomFileManager.detail #contentWrapper > ul > li[role="tab"] { width: 50%; } .CustomFileManager.detail #contentWrapper > ul > li[role="tab"] a { padding: 0.75rem 1rem; font-size: 0.875rem; } .CustomFileManager.detail #languageTabs{ border: solid 1px var(--filemanager_cDialogBorder); } .CustomFileManager.detail #languageTabs > ul{ border-bottom: solid 1px var(--filemanager_cDialogBorder); } .CustomFileManager.detail #languageTabs li[role="tab"] a{ font-size: 0.75rem; } .CustomFileManager.detail #languageTabs .tab{ padding: 0 0.5rem 0.5rem; } .CustomFileManager.detail #languageTabs .ui-state-default{ border-bottom: 0; border-left: 0; border-right: solid 1px var(--admin_color_bcInputGradient); } .CustomFileManager.detail .add-metadata select{ width: 30%; margin-right: 0.5rem; height: 1.5rem; background-color: var(--color_cWhite); border: solid 1px var(--filemanager_cDialogBorder); border-radius: 2px; } .filemanagerDialogWrapper .CustomFileManager.detail .add-metadata button{ border: none; padding: 0.25rem 0.5rem; border-radius: 2px; height: 1.5rem; width: calc(70% - 0.5rem); } .CustomFileManager.detail table{ width: 100%; } .CustomFileManager.detail .leftDialogContent th{ text-align: left; border-bottom: solid 1px var(--filemanager_cDialogBorder); } .CustomFileManager.detail .leftDialogContent tr{ display: grid; grid-template-columns: 30% auto; column-gap: 0.5rem; font-size: 0.75rem; line-height: 1.3em; margin-bottom: 0.5rem; align-items: center; } .CustomFileManager.detail .rightDialogContent .upload { margin-bottom: 1rem; } .CustomFileManager.detail .rightDialogContent a{ color: var(--color_cLink); text-decoration: underline; font-size: 0.875rem; line-height: 1.3em; transition: all 0.3s; } .CustomFileManager.detail .permissions { padding: 1rem; box-sizing: border-box; } .CustomFileManager.detail .permissions .info::before{ content: "\f05a"; font-size: 1.25rem; line-height: 1em; position: absolute; left: 0; font-family: 'Font Awesome 5 Free'; font-weight: 900; color: var(--filemanager_cDialogBorder); } .CustomFileManager.detail .permissions .info{ position: relative; margin-bottom: 2rem; padding-left: 2rem; padding-bottom: 0.5rem; border-bottom: solid 1px var(--filemanager_cDialogBorder); } .CustomFileManager.detail .permissions .info button:last-child{ margin-right: 0; } .CustomFileManager.detail .permissions .info button{ margin-right: 0.5rem; margin-top: 0.5rem; padding: 0.5rem; } .CustomFileManager.detail .permissions .tableWrapper { overflow-y: auto; max-height: 22rem; font-size: 0.875rem; } .CustomFileManager.detail .permissions th { padding: 0 0.5rem; max-width: 4.5rem; } .CustomFileManager.detail .permissions tr:not(.add-permissions) hr { border-bottom: solid 1px var(--filemanager_cDialogBorder); border-width: 2px; } .CustomFileManager.detail .permissions tr:not(.permission) td { font-weight: bold; padding-top: 0.5rem; } .CustomFileManager.detail .permissions tr.permission { background-color: var(--filemanager_bcTr); } .CustomFileManager.detail .permissions tr.permission:nth-child(2n) { background-color: var(--filemanager_bcTr2n); } .CustomFileManager.detail tr.permission td{ padding: 0.25rem; } .CustomFileManager.detail tr.permission td:first-child{ float:left; width: 1.5rem; } .CustomFileManager.detail .permissions .inactive button, .CustomFileManager.detail .permissions .inactive { color: var(--color_cIconPassive); } .CustomFileManager.detail .permissions .tableWrapper button { line-height: 1.3em; } .CustomFileManager.detail .permissions .tableWrapper button.far { font-family: 'Font Awesome 5 Free'; border: none; background-color: transparent; } .CustomFileManager.detail .permissions input[type="checkbox"] { vertical-align: middle; } .CustomFileManager.detail .permissions .select2-container, .CustomFileManager.detail .permissions input[type="text"] { width: calc(100% - 5.5rem); max-width: 11rem; } .CustomFileManager.explorer{ box-sizing: border-box; padding: 1.5rem; font-family: DIN-Regular, sans-serif !important; } .CustomFileManager.explorer .fileManagerWrapper{ display: grid; grid-template-columns: auto 20%; column-gap: 1rem; } .CustomFileManager.explorer .leftContent{ display: grid; grid-template-columns: 20% 80%; grid-template-rows: auto; grid-template-areas: "adressbar adressbar" "tree explorer"; } .CustomFileManager.explorer .jstreeWrapper, .CustomFileManager.explorer .searchResultWrapper, .CustomFileManager.explorer .fileexplorerWrapper { max-height: 50vh; min-height: 30rem; overflow-y: auto; } .CustomFileManager.explorer .adressBarWrapper{ grid-area: adressbar; border-bottom: solid 1px var(--admin_color_cLine); } .CustomFileManager.explorer .adressBarWrapper .adress-up{ background-position: -1px -25px; } .CustomFileManager.explorer .adressBarWrapper .adress-forward{ background-position: 59px -1px; } .CustomFileManager.explorer .adressBarWrapper .adress-back{ background-position: -5px -1px; } .CustomFileManager.explorer .adressBarWrapper .reload{ padding: 0 0.5rem; color: var(--color_cIconAction); } .CustomFileManager.explorer .jstreeWrapper{ grid-area: tree; } .CustomFileManager.explorer .fileexplorerWrapper{ grid-area: explorer; border-left: solid 1px var(--admin_color_cLine); } .CustomFileManager.explorer .fe_fileexplorer_wrap .fe_fileexplorer_inner_wrap{ border: none; } .CustomFileManager.explorer .fe_fileexplorer_wrap .fe_fileexplorer_item_wrap{ width: 6.7em; } .CustomFileManager.explorer .fileexplorerWrapper .fe_fileexplorer_folder_tool_new_folder:not(.create_node), .CustomFileManager.explorer .fileexplorerWrapper .fe_fileexplorer_folder_tool_paste, .CustomFileManager.explorer .fileexplorerWrapper .fe_fileexplorer_folder_tool_cut, .CustomFileManager.explorer .fileexplorerWrapper .fe_fileexplorer_folder_tools button:last-child, .CustomFileManager.explorer .fileexplorerWrapper .fe_fileexplorer_toolbar{ display: none; } .CustomFileManager.explorer .fe_fileexplorer_folder_tools button { font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size: 1rem; line-height: 1.5rem; color: var(--color_cIconAction); } .CustomFileManager.explorer button.fe_fileexplorer_folder_tool_new_folder::before { background-image: none; font-size: 1.125rem; line-height: 1em; content: "\f65e"; } .CustomFileManager.explorer button.rename_node::before { content: "\f044"; } .CustomFileManager.explorer button.move_node::before { content: "\f31e"; } .CustomFileManager.explorer button.fe_fileexplorer_folder_tool_delete::before { background-image: none; font-size: 1.125rem; line-height: 1em; content: "\f2ed"; } .CustomFileManager.explorer button.details::before { content: "\f05a"; } .CustomFileManager.explorer .fe_fileexplorer_disabled{ opacity: 0.4; } .CustomFileManager.explorer .fe_fileexplorer_inner_wrap:not(.fe_fileexplorer_inner_wrap_focused) .fe_fileexplorer_item_selected .fe_fileexplorer_item_wrap_inner{ background-color: var(--filemanager_bcSelected); } .CustomFileManager.explorer .searchInputWrapper { margin-bottom: 1.25rem; border: 1px solid var(--admin_color_cLine); border-radius: 4px; } .CustomFileManager.explorer .clearButton, .CustomFileManager.explorer .searchButton{ border: 0; border-radius: 4px; padding: 0; background-color: var(--color_cWhite); width: 2rem; height: 2rem; font-family: 'Font Awesome 5 Free'; color: var(--color_cIconAction); } .CustomFileManager.explorer .searchInput{ border: 0; padding: 0.5rem; width: calc(100% - 5rem); } .CustomFileManager.explorer .searchResultWrapper { padding: 0 1rem; box-sizing: border-box; } .CustomFileManager.explorer .searchResultWrapper .title { font-size: 1rem; line-height: 1.3em; font-weight: bold; margin-bottom: 0.5rem; } .CustomFileManager.explorer .searchInfo { padding-top: 1rem; margin-bottom: 2.5rem; } .CustomFileManager.explorer .searchResult{ list-style: none; border-bottom: solid 1px var(--filemanager_cDialogBorder); padding: 0.5rem 0; cursor: pointer; } .CustomFileManager.explorer .fileuploadWrapper .SetSeparator .title{ font-size: 1rem; line-height: 1.3em; } .CustomFileManager.explorer .fileuploadWrapper .fileManagerPathNames, .CustomFileManager.explorer .fileuploadWrapper .fileUploadHeader{ display: none; } .CustomFileManager { width: 100%; } .CustomFileManager .fileManagerUploadPath { font-size: 0.8rem; padding: 0 1rem 0 1rem; color: var(--admin_color_cInput); width: 70%; } .CustomFileManager .BasicFileUpload { width: 100% !important; } .CustomFileManager.disabled .BasicFileUpload{ display: none; } .CustomFileManager .fileManagerIdWrapper { display: flex; background-color: var(--color_bcBeigeDark); align-items: center; border: 1px solid var(--admin_color_cAdminButton); } .CustomFileManager .uploadButtons { margin: 0.5rem 1rem 0.5rem 0; } .CustomFileManager .fileUploadHeader { display: flex; background: var(--admin_color_bcToolbar); color: var(--admin_color_cLine); margin-top: 0.5rem; } .CustomFileManager .SetSeparator { margin-bottom: 1rem; border-width: 2px; border-bottom-style: solid; border-color: var(--admin_color_cAdminButtonBorder); display: flex; justify-content: space-between; overflow: unset; } .CustomFileManager .SetSeparator .title { font-weight: bold; font-size: 1.25rem; line-height: 1.1em; margin-bottom: -5px; background-color: var(--color_cWhite); border-color: var(--color_cWhite); border-width: 0; padding-right: 0.5rem; padding-bottom: 0rem; } .CustomFileManager .adressBarWrapper { width: 100%; box-sizing: border-box; padding: 0 0 0.75rem 0; display: flex; justify-content: space-between; align-items: flex-end; } .CustomFileManager .adressBarWrapper button { height: 1.5rem; background-color: var(--color_cWhite); transition: color 0.3s; border: none; } .CustomFileManager .adressBarWrapper .adressPath { background-color: var(--admin_color_bcPropertyTooltip); flex-grow: 1; min-height: 1.625rem; padding: 0 0.5rem; box-sizing: border-box; } .CustomFileManager .adressBarWrapper li:before { content: "\f105"; font-family: 'Font Awesome 5 Free'; font-weight: 900; padding-right: 4px; vertical-align: middle; } .CustomFileManager .adressBarWrapper li { display: inline-block; padding: 4px; list-style: none; cursor: pointer; } .CustomFileManager .adressBtns button.inactive { opacity: 0.3; } .CustomFileManager .adressBtns button { width: 1.5rem; border: 0; image-rendering: pixelated; background-image: url(/Ressource/ThirdParty/js-fileexplorer/2023_02_14/fileexplorer_sprites.png); } #wysiwyg .CustomFlyout.panelContent { width: 506px; margin:0 auto 60px; } #wysiwyg .CustomFlyout.panelContent .BasicGraphic:before { display:none; } .CustomFlyout.panel { z-index:9010; width: 506px; background-color:white; max-width:100%; box-sizing:border-box; } .CustomFlyout.panel .BasicSpacerContentLoader .closeButton { top:0; font-size:22px; right:8px; height: 40px; line-height:40px; } .CustomFlyout.panel .wrapperContentLoader { width: auto; } .CustomFlyout.panel .BasicForm { width: 100%; } .CustomFlyout.panelContent { background-color:var(--color_cWhite); overflow:hidden; border-width:1px; } .CustomFlyout.panelContent .closeWrapper { cursor:pointer; } .CustomFlyout.panelContent .closeTargeting { padding:0 24px 24px; font-size: 12px; } .CustomFlyout.panelContent .articleWrapper { margin:0 8px; } .CustomFlyout.panelContent .title { background-color:var(--color_bcArea); font-size:14px; overflow:hidden; padding:8px 36px 8px 16px; line-height:24px; } .CustomFlyout.panelContent .contentWrapper { margin:32px 24px 8px 24px; background-color:var(--color_cWhite); overflow:hidden; } .CustomFlyout.panelContent .flyoutHead { margin-bottom:24px; } .CustomFlyout.panelContent .flyoutGraphic { float:left; width:144px; height:144px; margin-bottom:24px; margin-right:32px; } .CustomFlyout.panelContent .content { margin-bottom:24px; } .CustomFlyout.panelContent form h1 { display:none; } .CustomFlyout.panelContent .BasicForm { margin-bottom:24px; } .CustomFlyout.panelContent .BasicForm .formSubmitMessage { font-weight:normal; padding:0; margin:0 8px; } .CustomFlyout.wishlistHint .defaultButton, .CustomFlyout.addProductToWishlist .defaultButton { display:block; float:right; margin-bottom:24px; } .CustomFlyout .subtitle { clear:both; margin-bottom:24px; } .CustomFlyout.newsletter .submit + .wrapper, .CustomFlyout.afterCheckoutNLSubscription .submit + .wrapper { display:none; } #wysiwyg[data-lock-state="true"] .BasicForm.ProjectForm.dialogForm .wrapper.medium { float:left !important; } .edit .BasicForm.dialogForm .wrapper.medium { width:50%; } #wysiwyg .Page .pageContentElement .CustomFlyout.panelContent { box-shadow:none; margin:0; } #wysiwyg .CustomFlyout.panel { display:block; } #wysiwyg .Page .pageContentElement .CustomFlyout.panel { margin:0 auto 24px; } .Page .pageActionBar { position:fixed; bottom:40px; right:0; text-align:center; z-index:1; } .Page .pageActionBar [class*="ss-"] { color:var(--color_cWhite); font-size: 14px; line-height: 21px; } .Page .pageActionBar .pageAction.hidden { display:none; } .Page .pageActionBar .pageAction { display:block; height:40px; width:40px; margin-bottom:4px; text-align:center; font-size:12px; background-color: rgba(80,80,80,0.5); cursor:pointer; } .Page .pageActionBar .pageAction.hover, .Page .pageActionBar .pageAction.selected { background-color:var(--color_cBlack); } .Page .CustomFlyout.panel { position: fixed; right: 44px; bottom: 44px; } #wysiwyg .Page .pageContentElement .CustomFlyout.panel { position:static; } .Page .pageActionBar { -o-transition:right .3s; -ms-transition:right .3s; -moz-transition:right .3s; -webkit-transition:right .3s; transition:right .3s; z-index:9011; } .Page .pageActionBar .pageAction { background-color:var(--color_cText60); } .Page .pageActionBar [class*="ss-"]{ font-size: 1.5rem; line-height: 2.1875rem; } @media screen and (max-width: 1096px) { .Page .pageActionBar { right:0; } .Page.scrollDown .pageActionBar { right:-2.5rem; } } @media screen and (max-width: 544px) { .Page .pageActionBar { bottom:1rem; } } .CustomMail.properties .formVariables { clear:both; float: left; margin-left:120px; font-size:14px; margin-top:32px; margin-bottom:32px; overflow: hidden; } .CustomMail.properties .formVariables .caption { font-weight:bold; margin-bottom:8px; } .CustomNavigationPath { color:var(--color_cText60); overflow: hidden; text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; font-size: 1.25rem; color:var(--color_cText60); } .CustomNavigationPath a:last-child{ color: var(--color_cText); } @media screen and (max-width:544px) { .CustomNavigationPath { font-size: 0.75rem; } } .CustomNews.newsNotFound { margin-left: 20px; } /***************************** includes ****************************/ .CustomNews.teaserList { display: inline; clear:none; float:left; } .CustomNews.teaserList > .CustomNews.CustomNewsTeaser{ float:left; } .CustomNews .overview .overviewIcon { width: 54px; height: 40px; margin-right: 20px; float: left; clear: left; background-image: url('File/custom_news/buttons_CIO_liste_passiv.png'); background-position: center; background-repeat: no-repeat; } .CustomNews .overview .overviewIcon:hover { background-image: url('File/custom_news/buttons_CIO_liste_aktiv.png'); } .CustomNews .overview { float: left; clear: left; text-align: center; } /************************* pagination *****************************************/ .CustomNews.teaserList > .pagination { clear:both; float:right; } .CustomNews .pagination { width: 33%; float: right; clear: both; text-align: center; } .CustomNews .pagination .caption { } .CustomNews .pagination.previous { width: 54px; height: 40px; float: left; clear: left; background-image: url('File/custom_news/buttons_CIO_pfeil_l_passiv.png'); background-position: center; background-repeat: no-repeat; } .CustomNews .pagination>a>.pagination.previous:hover { background-image: url('File/custom_news/buttons_CIO_pfeil_l_aktiv.png'); } .CustomNews .pagination.next { width: 54px; height: 40px; float: right; clear: right; background-image: url('File/custom_news/buttons_CIO_pfeil_r_passiv.png'); background-position: center; background-repeat: no-repeat; } .CustomNews .pagination>a>.pagination.next:hover { background-image: url('File/custom_news/buttons_CIO_pfeil_r_aktiv.png'); } .CustomNews.CustomNewsTeaser.inactive { } .CustomNewsTeaser a { display: inline-block; } .CustomNews .NewsDetailFooter { clear: both; width: 100%; } .CustomNewsletter.properties.statisticsV2 #statistic_print{ float: right; } .CustomNewsletter.properties.statisticsV2 #cancelJob{ float: right; width: 10rem; } .CustomNewsletter.properties.SendV2Property .sendingInfo { color: red; font-size: 12px; clear: both; text-align: center; margin-bottom: 1rem; } /* the following rules are necessary in order to have the background stripes at the bottom if the height of the CustomNewsletterRecipient is smaller than 100%*/ html,body { height: auto; } .Page.NewsletterSubscription { min-height: 100%; } /************************ CustomNewsletterRecipient ***************************/ .Page.NewsletterSubscription, .CustomNewsletterRecipient .stripe { background-color: #F0F0F0; } .content.NewsletterSubscription { background-color: var(--color_cWhite); margin: 0 auto; max-width: 992px; } .CustomNewsletterRecipient { min-width: 696px; /*768 - 36*2 */ padding: 36px; } .CustomNewsletterRecipient>div { clear: both; width: 100%; overflow: hidden; /*so that the divs take the side of the children*/ margin-bottom: 2%; } .CustomNewsletterRecipient .stripe { height: 12px; } /***************************** header *****************************************/ .CustomNewsletterRecipient>.subscriptionHeader { } .CustomNewsletterRecipient>.subscriptionHeader>div { float: left; width: 50%; } .CustomNewsletterRecipient>.subscriptionHeader .logo { min-width: 384px; margin-top: 6px; /*because the other logos have height = 48px, so we center this one vertically*/ height: 37px; background-image: url('File/custom_newsletterRecipient/logo.png'); background-repeat: no-repeat; } .CustomNewsletterRecipient>.subscriptionHeader .BasicGraphic { text-align: center; } .CustomNewsletterRecipient>.subscriptionHeader .companyNameWrapper { text-align: center; font-size: 37px; } /***************************** body *****************************************/ .CustomNewsletterRecipient>.subscriptionBody { } .CustomNewsletterRecipient>.subscriptionBody>.title { font-weight: bold; } .CustomNewsletterRecipient .subscriptionBody .error { color: #FF0000; font-weight: bold; } .CustomNewsletterRecipient .subscriptionBody .BasicForm { width: 100%; } .CustomNewsletterRecipient .subscriptionBody .BasicForm h1 { margin-bottom: 32px; } .CustomNewsletterRecipient .subscriptionBody .BasicForm h2 { margin-bottom: 16px; } .CustomNewsletterRecipient .subscriptionBody .BasicForm .wrapper.text.title { color: inherit; font-size: inherit; margin-bottom: 0; margin-right: 0; text-align: left; } .CustomNewsletterRecipient>.subscriptionBody>.legals, .CustomNewsletterRecipient>.subscriptionBody>.privacy { width:100%; margin:0 auto; font-size:11px; } .subscriptionBody>.legals,.subscriptionBody>.privacy { display: none; } /***************************** footer *****************************************/ .CustomNewsletterRecipient > .subscriptionFooter { } .CustomNewsletterRecipient > .subscriptionFooter > div { width: 50%; } .CustomNewsletterRecipient > .subscriptionFooter > .BasicGraphic { float: left; } .CustomNewsletterRecipient > .subscriptionFooter > .BasicGraphic > img { max-width: 80%; } .CustomNewsletterRecipient > .subscriptionFooter > .BasicText { float: right; font-family: Verdana, Arial, sans-serif; color: grey; } .CustomNewsletterRecipient > .subscriptionFooter .powered { opacity: 0.6; } .CustomNewsletterRecipient > .subscriptionFooter .powered:hover { opacity: 1; } .CustomNewsletterSender.Widget.properties.nlV2 .fileUploadSingleGraphic{ width: 78%; } .CustomNewsletterSender.Widget.properties.nlV2 .twoColumnsInLang{ width: 36.75rem; float: left; } .CustomNewsletterSender.Widget.properties.nlV2 .twoColumnsInLang textarea{ width: 28rem; } .CustomNewsletterSender.Widget.properties.nlV2 #languageTabsLogo textarea{ height: 2rem; resize: none; padding: 0.5rem 0 0 0.5rem; box-sizing: border-box; } .CustomNewsletterSender.Widget.properties.nlV2 #mainColor { width: 24.5rem !important; } .CustomNewsletterSender.Widget.properties.nlV2 .mainColorBox { width: 2.2rem; height: 2.2rem; border: 1px solid lightgrey; margin-right: 0.15rem; float: right; box-sizing: border-box; } .CustomNewsletterSender.Widget.properties.nlV2 .enterInfo { margin-left: 7.5rem; float: left; } .semantic.AdminRelation #refreshSemantic { width: auto; margin-left: 16px; padding: 0 10px; } .CustomSocialMedia.List { width: 100%; float: left; } .CustomSocialMedia.socialFeeds li { float: left; } .CustomStyla { } .CustomUserLogin a { width: auto; position: relative; background-position: right; background-repeat: no-repeat; } .CustomUserLogin #userLoginMessage { color: var(--color_cError) ; text-align: center; } .CustomUserLogin .userLoginForm .mandatory_field_desciption { display: none; } .CustomUserLogin .fihp { display: none !important; } .CustomUserLogin.alreadyLoggedIn.ui-widget-boxshadow{ box-shadow: none; } #overlay.userNavigation .CustomUserLogin.alreadyLoggedIn.ui-widget-boxshadow{ background-color: var(--color_cWhite); } /* page_user is inactive */ .CustomUserLogin.stateLogout .myPageLink{ display: none; } .CustomUserLogin.stateLogout .userName{ padding-right: 1.25rem; } .CustomUserProfile .error { color: var(--color_cError); } .CustomUserProfile .valid { color: var(--color_cValid); } .CustomUserProfile .userProfileRegisterForm .mandatory_field_desciption { display: none; } .BasicSpacerContentLoader .CustomUserProfile.register h1, .BasicSpacerContentLoader .CustomUserProfile.register h2 { margin: 0 0 1.5rem; } .BasicSpacerContentLoader .CustomUserProfile .BasicForm .formSubmitMessage { padding: 0; } .BasicSpacerContentLoader .CustomUserProfile .BasicForm .formSubmitMessage .submitMessage { padding: 0 0.5rem 2rem; } .CustomUserProfileFooter { max-width:928px; height:auto; margin: 0 auto; overflow: hidden; padding:16px 32px 16px 32px; } .CustomUserProfileFooter .project { float: left; margin-right: 32px; } .CustomUserProfileFooter .company { width: 50%; height: auto; float: right; } .CustomUserProfileFooter .company img { margin-bottom: 8px; max-height: 48px; max-width: 100%; } .CustomUserProfileFooter .company .abstand { height: 8px; width: 10px; } .CustomUserProfile.Widget.update { margin: 0 auto; max-width:928px; overflow: hidden; } .user_updateForm.ProjectForm.BasicForm { width:100%; } .CustomUserProfileProperty .historyWrapper { max-height: 20rem; overflow: scroll; margin-bottom: 2rem; font-size: 0.75rem; } .CustomUserProfileProperty .historyWrapper .entry { border-bottom: 1px solid gray; padding: 0.5rem; } .CustomUserProfileProperty .historyWrapper .headline { font-family: OpenSans-Bold; } .CustomUserProfileJs { margin: 0 1rem 2.75rem; } .CustomUserProfileJs .title { margin: 0 0 2rem; padding: 1rem 1rem 2rem; overflow: hidden; border-bottom-width: 0.25rem; overflow: hidden; box-sizing: border-box; } .CustomUserProfileJs .title h3 { display: inline-block; margin-top: 0.25rem; } .CustomUserProfileAddressJs { } .CustomUserProfileAddressJs .addressList { } .CustomUserProfileAddressJs .addressList .tax{ margin-top: 0.5rem; } .CustomUserProfileAddressJs .wrapperAddress { padding: 1.9325rem; margin: 1rem; border-width: 0.0625rem; min-height: 18.5rem; box-sizing: border-box; max-width: 18rem; } .CustomUserProfileAddressJs .addressOverview .wrapperAddress { min-height: 14.5rem; } .CustomUserProfileAddressInDialog .addressEntry.onRequest .wrapperAddress, .CustomUserProfileAddressJs .addressEntry.onRequest .wrapperAddress { background-color:var(--color_bcArea); } .CustomUserProfileAddressJs .addressEntry .hint_on_request, .CustomUserProfileAddressJs .hint_new_address { color: var(--color_cLink); margin-top: 1rem; } .CustomUserProfileAddressJs .hint_new_address { margin-bottom: 1rem; } .CustomUserProfileAddressJs .addressEntry { width: 33.33%; display:inline-block; vertical-align:top; } .CustomUserProfileAddressJs .wrapperData { min-height: 10.5em; overflow: hidden; } .CustomUserProfileAddressJs .wrapperData .data { margin-bottom: 1.5em; } .CustomShopCheckoutJs.overview .CustomUserProfileAddressJs .title { float: right; border: none; margin: 1rem 0; padding: 0 1rem 0 0; } .CustomShopCheckoutJs.overview .CustomUserProfileAddressJs h3 { display: none; } @media screen and (min-width: 849px) { .CustomShopCheckoutJs.overview .CustomUserProfileAddressJs .title { height: 14.5rem; } .CustomShopCheckoutJs.overview .addressOverview .wrapperButton { height: 100%; } .CustomShopCheckoutJs.overview .addressOverview .wrapperButton:before { content:""; height:100%; vertical-align:bottom; display:inline-block; } .CustomShopCheckoutJs.overview #address_list_open { vertical-align: bottom; display:inline-block; } } @media screen and (max-width: 848px) { .CustomShopCheckoutJs.overview .CustomUserProfileAddressJs .title, .CustomUserProfileAddressJs .addressList { width: 100%; box-sizing: border-box; } .CustomUserProfileAddressJs .addressEntry { width: 50%; } } @media screen and (max-width: 544px) { .CustomUserProfileAddressJs .addressEntry { width: 100%; min-width: initial; } .CustomUserProfileAddressJs .wrapperAddress { margin: 1rem auto; min-height: initial; } .CustomUserProfileAddressJs .wrapperData { min-height: initial; } } .CustomUserProfileJs .wrapperButton { float: right; overflow: hidden; } .CustomUserProfileJs .wrapperAddress .roundIcon { margin: 0 0 0.5rem; } .addressButtons input[type="radio"] { display: none; } .CustomUserProfileJs .addressButtons .roundIcon { margin: 0; } .CustomUserProfileJs .wrapperAddress .stateButton { margin: 0.5rem 0 0; } .addressOverview { overflow: hidden; } .CustomUserProfileJs.open .addressOverview { display: none; } .wrapperAddress h4 { margin: 0 0 1rem; } .CustomUserProfileJs .editContent { display: none; } .CustomUserProfileJs.open .editContent { display: block; } .CustomUserProfileJs form { } .CustomUserProfileJs form::after { content: ""; width: 100%; display: block; clear: both; height: 1px; } #addressEdit .cancel { float: left; } #addressEdit .submit { float: right; } .CustomUserProfileJs .noShipping { margin: 1rem; clear: both; float: left; margin: 1rem; width: 100%; } .CustomUserProfileJs .addAddress { cursor: pointer; } .CustomUserProfileJs .addAddress .icon { display: block; font-size: 5rem; line-height: 15rem; height: 14rem; text-align: center; } @media screen and (max-width: 544px) { .CustomUserProfileJs .addAddress .icon { line-height: 3rem; height: 2rem; } } .CustomUserProfileJs .BasicForm { background-color: inherit; width: auto; } .CustomUserProfileJs .BasicForm .closeButton { display: none; } .CustomUserProfileAddressJs.suggestion { border-width: 0.0625rem; padding: 2rem; margin: 1rem; font-weight: normal; } .CustomUserProfileAddressJs.suggestion .address { overflow: hidden; margin-top: 1rem; } .CustomUserProfileAddressJs.suggestion .forceAddress, .CustomUserProfileAddressJs.suggestion .actionButton.right { float: right; } .CustomUserProfileAddressJs.suggestion .info { display: inline; } @media screen and (max-width: 544px) { .CustomUserProfileAddressJs.suggestion { margin: 1rem 0; } } @media screen and (max-width: 768px) { .CustomUserProfileAddressJs.suggestion .message { display: inline-block; margin-top: 0.5rem; } } .addressTypeDropDown { position: relative; margin-right: 0.5rem; display: inline-block; width: 100%; } .addressTypeDropDown .icon.addressType_b2b_retailshop { color: var(--addressType_b2b_retailshop); } .addressTypeDropDown .icon.addressType_b2b_warehouse { color: var(--addressType_b2b_warehouse); } .addressTypeDropDown .icon.addressType_b2b_administration { color: var(--addressType_b2b_administration); } .addressTypeDropDown .icon.addressType_company { color: var(--addressType_company); } .addressTypeDropDown .icon.addressType_private { color: var(--addressType_private); } .addressTypeDropDown .icon.addressType_unknown { color: var(--addressType_unknown); } .addressTypeDropDown .caption { position: relative; background-color: var(--color_bcFond); font-size: 12px; padding: 0.25rem 2rem 0.25rem; border: none; border-radius: 3px; -o-transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; transition: .3s; } .addressTypeDropDown:not(.readonly) .caption { cursor: pointer; } .addressTypeDropDown.open .caption { background-color: var(--color_cGrey); } .addressTypeDropDown .iconWrapper.iconType, .addressTypeDropDown .item .iconWrapper { position: absolute; top: 0; left: 0; bottom: 0; width: 2rem; text-align: center; } .addressTypeDropDown .caption .surtitle { font-size: 0.625rem; color: var(--color_cIconAction); line-height: 0.875rem; } .addressTypeDropDown .caption .captionTitle { white-space: nowrap; width: 100%; overflow: hidden; text-overflow: ellipsis; } .addressTypeDropDown .caption .iconWrapper.chevron { color: var(--color_cIconAction); position: absolute; right: 0; top: 0; text-align: center; height: 100%; width: 2rem; font-size: 1rem; } .addressTypeDropDown .iconWrapper .icon { font-size: 0.5rem; } .addressTypeDropDown .caption .icon { display: inline-block; vertical-align: middle; -o-transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; transition: .3s; } .addressTypeDropDown.open .caption .iconWrapper.chevron .icon { color: var(--color_cText); } .addressTypeDropDown .itemList { width: 100%; height: 0; overflow: hidden; position: absolute; z-index: 900; background-color: var(--color_cGrey); margin-top: 0.5rem; border-radius: 3px; -webkit-box-shadow: 0 0.375 0.5rem 0px rgba(0, 0, 0, 2.5); -moz-box-shadow: 0 0.375rem 0.5rem 0px rgba(0, 0, 0, 2.5); box-shadow: 0 0.375rem 0.5rem 0px rgba(0, 0, 0, .25); } .addressTypeDropDown .itemList .item { display: block; padding: 0.375rem 0.625rem 0.375rem 2rem; position: relative; cursor: pointer; font-size: 0.75rem; -o-transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; transition: .3s; } .addressTypeDropDown .itemList .item.hidden { display: none; visibility: hidden; } .addressTypeDropDown .itemList li.selected { background-color: var(--color_cWhite); } .CustomUserProfilePaymentJs .paymentOverview { float: left; } .CustomUserProfilePaymentJs .title h3 { line-height: 2.5rem; margin-top: 0; float: left; } .CustomUserProfilePaymentJs .wrapperPayment .data { overflow: hidden; line-height: 2.5rem; } .CustomUserProfilePaymentJs .wrapperPayment .BasicGraphic { float: right; margin-left: 1rem; height: 2.5rem; } @media screen and (max-width: 544px) { .CustomUserProfilePaymentJs .title h3 { line-height: 1.5em; } .CustomUserProfilePaymentJs .paymentOverview { clear: both; } } .CustomUserProfilePaymentJs .closeButton, .CustomUserProfilePaymentJs.open .openButton { display: none; } .CustomUserProfilePaymentJs.open .closeButton, .CustomUserProfilePaymentJs .openButton { display: block; } @media screen and (max-width: 414px) { .CustomUserProfilePaymentJs .openButton .info { display: none; } } .CustomUserProfilePaymentJs .descriptionBox { padding: 2.5rem; margin-top: 1.5rem; overflow: hidden; } @media screen and (max-width: 544px) { .CustomUserProfilePaymentJs .descriptionBox { padding: 1rem; } } .CustomUserProfilePaymentJs .wrapperPaymentMethod { box-sizing: border-box; padding: 0.5rem 0; width: 100%; max-width: 27.5rem; } @media screen and (min-width: 544px) { .CustomUserProfilePaymentJs .wrapperPaymentMethod { padding: 1rem 3rem; } } @media screen and (min-width: 698px) { .CustomUserProfilePaymentJs .wrapperPaymentMethod { padding: 1.5rem; width: 50%; float: left; } } @media screen and (min-width: 864px) { .CustomUserProfilePaymentJs .wrapperPaymentMethod { padding: 1.5rem 3rem; } } .CustomUserProfilePaymentJs .wrapperPaymentMethod input { display: none; } .CustomUserProfilePaymentJs .wrapperPaymentMethod .stateButton { width: 100%; margin: 0; padding: 0; } .CustomUserProfilePaymentJs .wrapperPaymentMethod .BasicGraphic { float: right; width: 5rem; } .CustomUserProfilePaymentJs .paymentMethod label { margin-left: 0.25rem; } .mailManagement .actionWrapper .action .displayMailManagement, .mailManagement input[type="button"]{ width: auto; } .mailManagement #template{ width: 100%; } .mailManagement .mailDataWrapper input[type="text"], .mailManagement .mailDataWrapper textarea{ padding: 2px 8px; } .mailManagement .fileWrapper{ display:block; overflow:hidden; padding-left: 100px } .mailManagement .fileWrapper .linkWrapper{ padding-top:10px; padding-right: 2rem; word-break: break-all; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } .mailManagement .fileWrapper input[type="checkbox"]{ float:right; margin-bottom: 0; } .mailManagement .buttonWrapper{ padding-left: 120px; } .CustomUserProfileProperty.property .mailManagement .buttonWrapper input[type="button"]{ width: 220px; } .CustomUserProfileProperty.property .userDocument label{ margin-left: 0.5rem; text-align: left; } .CustomUserProfileProperty.property .userDocument label + div{ margin-left: 0.5rem; } .CustomUserProfileProperty.property .fileUploadWrapper { padding-bottom: 0.8rem; display: inline-block; } .CustomUserProfileProperty.property .wrapperLeft { display: inline-block; } .CustomUserProfileProperty.property .customerGroupWrapper { margin-left: 5rem; } .CustomUserProfileProperty.property .customerGroupTitle{ font-size: 0.9rem !important; } .CustomUserProfileProperty.property .clientSinceWrapper { float: right; } .CustomUserProfileProperty.property .borderLeftWrapper { border-left: 1px solid var(--color_cGreyBorder); box-sizing: border-box; margin-bottom: 1rem; padding-left: 0.5rem; } .CustomUserProfileProperty.property .borderLeftWrapper input[type="text"]{ width: 13.5rem !important; } .CustomUserProfileProperty.property .borderLeftWrapper select{ width: 14.6rem !important; } .CustomUserProfileProperty.property .borderLeftWrapper textarea{ width: 14rem !important; } .CustomUserProfileProperty.property .channelTitle { width: 100% !important; } .CustomUserProfileProperty.property .roleSsc { width: 50%; } .CustomUserProfileProperty.property .aboutPerson { width: 100%; } .CustomUserProfileProperty.property .restrictionInfoIcon::before { content: "\f05a"; font-family: "Font Awesome 5 Free"; font-weight: 900; padding-right: 0.25rem; color: var(--color_bcBlueTrans); } .CustomUserProfileProperty.property .selectAccountType { width: 6rem; display: flex; } .CustomUserProfileProperty.property[data-account-type=business] .b2cWrapper { display: none; } .CustomUserProfileProperty.property[data-account-type=user] .b2bWrapper { display: none; } .CustomUserProfileProperty.property .debtorNumberWrapper input[data-debtor-input-hidden="true"] { display: none; } .CustomUserProfileProperty.property .debtorNumberWrapper input[data-debtor-button-hidden] { width: 238px; } .CustomUserProfileProperty.property .debtorNumberWrapper input[data-debtor-button-hidden="true"] { display: none; } .CustomUserProfileProperty.property .discountBlendInButtonIcon, .CustomUserProfileProperty.property .discountBlendOutButtonIcon, .CustomUserProfileProperty.property .paymentTermsBlendInButtonIcon, .CustomUserProfileProperty.property .paymentTermsBlendOutButtonIcon { float: right; font-size: 1.25rem; } .CustomUserProfileProperty.property .discountBlendInButton:hover, .CustomUserProfileProperty.property .discountBlendOutButton:hover, .CustomUserProfileProperty.property .paymentTermsBlendInButton:hover, .CustomUserProfileProperty.property .paymentTermsBlendOutButton:hover { cursor: pointer; } .CustomUserProfileProperty.property .discountUserWrapper, .CustomUserProfileProperty.property .paymentTermsWrapper { overflow: hidden; } .CustomUserProfileProperty.property .userDiscountInfoWrapper, .CustomUserProfileProperty.property .paymentTermsInfoWrapper { margin-bottom: 0.5rem; font-size: 0.75rem; } .CustomUserResetPassword.landingPage.Widget { background-color: var(--color_cTurkis); padding: 5rem 0 8rem; overflow: hidden; margin-bottom: 5rem; } .CustomUserResetPassword.landingPage.Widget .wrapper { width: 60rem; max-width: 100%; margin: 0 auto; position: relative; } .CustomUserResetPassword.landingPage.Widget .wrapperBgcolor { box-sizing: border-box; padding: 3.75rem 1.5rem; background-color: var(--color_cWhite); overflow: visible; } .CustomUserResetPassword.landingPage.Widget .BasicForm{ background-color: var(--color_cWhite); padding: 0; } .CustomUserResetPassword.landingPage.Widget input[type="text"], .CustomUserResetPassword.landingPage.Widget input[type="email"], .CustomUserResetPassword.landingPage.Widget input[type="password"], .CustomUserResetPassword.landingPage.Widget textarea{ border-color: var(--color_cLine); } .CustomUserResetPassword.landingPage.Widget .formTitle { padding-left: 1rem; padding-right: 1rem; margin-left: 0rem; margin-right: 0rem; } .CustomUserResetPassword.landingPage.Widget .formSubmitMessage { min-height: 2.25rem; } .CustomUserResetPassword.landingPage.Widget #submitMessage.error { padding-left: 1rem; } .CustomUserResetPassword.landingPage.Widget .navigationLink{ background-color: var(--color_cPurple); color: var(--color_cWhite); position: relative; width: 50%; box-sizing: border-box; text-align: left; z-index: 99; margin-top: -2rem; margin-left: 2.5rem; } .CustomUserResetPassword.landingPage.Widget .CustomUserNavigation{ padding: 1.25rem; box-sizing: border-box; width: 100%; } .CustomUserResetPassword.landingPage.Widget .CustomUserNavigation ul, .CustomUserResetPassword.landingPage.Widget .CustomUserNavigation ol{ margin: 0; } .CustomUserResetPassword.landingPage.Widget .navigationLink h4{ margin-bottom: 0.5rem; } .CustomUserResetPassword.landingPage.Widget .navigationLink a{ color: var(--color_cWhite); font-size: 1.125rem ; line-height: 1.5em; } .CustomUserResetPassword.landingPage.Widget .navigationLink a:hover{ text-decoration: none; } .CustomUserResetPassword.landingPage.Widget .navigationLink span{ display: inline-block; } /*Standart Layout für: 1280px*/ @media screen and (max-width: 1280px) { .CustomUserResetPassword.landingPage.Widget { padding-left: 5rem; padding-right: 5rem; } .CustomUserResetPassword.landingPage.Widget .navigationLink h3{ font-size: 1.75rem; margin-bottom: 0.25rem; } } @media screen and (max-width: 768px) { .CustomUserResetPassword.landingPage.Widget { padding-left: 3rem; padding-right: 3rem; } } @media screen and (max-width: 544px) { .CustomUserResetPassword.landingPage.Widget { padding-left: 1.25rem; padding-right: 1.25rem; } .CustomUserResetPassword.landingPage.Widget .navigationLink{ width: auto; margin-left: 1.25rem; margin-right: 1.25rem; } .CustomUserResetPassword.landingPage.Widget .formTitle { padding-left: 0rem; padding-right: 0rem; } } .CustomUserResetPassword.BasicForm { overflow: visible; } .CustomUserResetPassword.BasicForm form { overflow: hidden; } /* HJW:20150616:do not use anymore Christian Allihn added more widgets on this page to make it longer .content .CustomUserResetPassword { margin-bottom:8rem; } */ .content .CustomUserResetPassword .title { text-align:left; padding-left:0.5rem; } .CustomUserResetPassword .title, .CustomUserResetPassword h1 { margin: 0 0.5rem 1.5rem; } .CustomUserResetPassword .userRequestPasswordForm .mandatory_field_desciption, .CustomUserResetPassword .userEnterPasswordForm .mandatory_field_desciption { display: none; } .BasicSpacerContentLoader .CustomUserResetPassword .BasicForm .formSubmitMessage { padding: 0; } .BasicSpacerContentLoader .CustomUserResetPassword .BasicForm .formSubmitMessage .submit_message { padding: 3.5rem 0.5rem 2rem; } .CustomShopBasket.Checkout .wrapperButton { float: right; } .CustomShopBasket.Basket, .CustomShopBasket.WishList { width: 992px; margin: 20px auto; overflow: hidden; } .CustomShopBasket.Basket td { padding-right:10px; } .CustomShopBasket .BasketEntry, .CustomShopBasket .BasketSummary, .CustomShopBasket .WishListTeaser { clear: both; width: 100%; overflow: hidden; border-top: 3px solid #000000; padding: 10px 0; } .CustomShopBasket h1 { margin: 10px 0; } .CustomShopBasket .actions > div { cursor: pointer; float: right; clear: both; } .CustomShopBasket .BasketEntry.on_request .actions > .addToBasket { display: none; } .CustomShopBasket .ProductTeaser { width: 350px; margin-left: 0; float: left; } .CustomShopBasket .setParts .ProductTeaser { float: right; } .CustomShopBasket .setParts .ProductTeaser .productTitle { width: 100%; } .CustomShopBasket .setParts > td { padding: 0.5rem 1rem; } .CustomShopBasket .CustomProduct.SingleTeaser { width: 100%; margin: 0; } .CustomShopBasket .ProductTeaser a { display: block; overflow: hidden; } .CustomShopBasket .SetArticle { margin: 0; overflow: hidden; } .CustomShopBasket .CustomProduct.SingleTeaser .BasicGraphic { min-height: 0; margin: 0 22px 0 0; float: left; width: 128px; } .CustomShopBasket .CustomProduct.SingleTeaser img { max-width: 100%; } .CustomShopBasket .CustomPrice, .CustomShopBasket .CustomShopBasket.AddTo { display: none; } .CustomShopBasket .BasketEntry.service .BasicText.subtitle { display:block; } /* BASKET */ /* BASKET ENTRY */ .CustomShopBasket.Basket .BasketEntry > * { float: left; margin-left: 50px; width: 100px; } /* BASKET SUMMARY */ .CustomShopBasket .BasketSummary { padding-top: 10px; border-bottom: 3px solid #000000; } .CustomShopBasket .total_price { float: right; } /* WISHLIST */ .CustomShopBasket.WishList { width: 850px; } .CustomShopBasket.WishList > div { float: left; } .CustomShopBasket.WishList .wishListNav { width: 268px; margin-right: 40px; } .CustomShopBasket.WishList .WishListSingle { width: 542px; } /* WISHLIST ENTRY */ .CustomShopBasket.WishListTeaser { display: block; float: left; cursor: pointer; } .CustomShopBasket.WishListTeaser .isStandardBasket { clear: both; } /* BASKET / WISHLIST ENTRY ACTIONS */ .CustomShopBasket .BasketEntry .actions { width: 152px; float: left; margin-left: 40px; } /* WISHLIST SINGLE */ .WishListSingle > .actions { float: right; clear: both; } .WishListSingle > .actions .isStandard { cursor: default; } .WishListSingle .title { clear: both; width: 100%; margin-bottom: 0; padding-bottom: 10px; border-bottom: 3px solid #000000; overflow: hidden; } .WishListSingle .BasketEntry { border-top: 0; border-bottom: 3px solid #000000; } .WishListSingle .title input.titleInput { display: none; width: 536px; height: 24px; } .WishListSingle .title h1 { float: left; width: 100%; white-space: nowrap; overflow: hidden; } .WishListSingle .title .editTitle { float: right; cursor: pointer; display: none; margin-left: 12px; } .WishListSingle .title:hover h1 { width: 400px; } .WishListSingle .title:hover .editTitle { display: block; } @media screen and (max-width: 960px) { .CustomShopBasket .BasketEntry.legend .tax, .CustomShopBasket .setParts .availabilityWrapper, .CustomShopBasket .setParts .amount, .CustomShopBasket .setParts .sum_price, .CustomShopBasket .setParts .tax { display: none; } .CustomShopBasket .BasketEntry .tax .mobileMetaInfos, .CustomShopBasket .setParts .mobileMetaInfos.tax { display: inherit; } .CustomShopBasket .setParts .mobileMetaInfos.tax { padding: 0 1rem; } .CustomShopBasket .setParts .ProductTeaser { width: 100%; } .CustomShopBasket .legend td:first-child { overflow: hidden; } .CustomShopBasket.WishList .legend td.actions, .CustomShopBasket.WishList .legend td.single_price { display: none; } .CustomShopBasket.Basket .legend td.product_key, .CustomShopBasket.Basket .legend td.availabilityCol, .CustomShopBasket.Basket .legend td.availability, .CustomShopBasket.Basket .legend td.single_price, .CustomShopBasket.Basket .legend td.amount, .CustomShopBasket.Basket .legend td.sum_price { display: none; } .CustomShopBasket.WishList td.actions, .CustomShopBasket.WishList td.single_price { margin-left: 2rem; padding-left: 18.18%; padding-top: 0; position: absolute; } .CustomShopBasket.WishList td.actions { bottom: 0; margin-left: 1.75rem; } .CustomShopBasket.WishList td.single_price { bottom: 3.125rem; } .CustomShopBasket.Basket .availabilityWrapper { padding: 0; } .CustomShopBasket.Basket .BasketEntry > .availabilityWrapper .availabilityWrapper { float: left; } .CustomShopBasket.Basket .availabilityWrapper .ss-icon { position: absolute; top: 1.25rem; right: 0.25rem; } .CustomShopBasket.Basket td { padding-right: 0; } .CustomShopBasket.Basket td.amount { float: left; padding: 0.25rem 0 1rem 40%; margin-left: 1rem; margin-top: 0.8125rem; } .CustomShopBasket.Basket td.sum_price { float: right; padding: 1rem 0; width: 50%; text-align: right; } .CustomShopBasket.Basket .BasketEntry:not(.legend) .amount { padding-top:0; float: left; width: 50%; margin-left: 0; text-align: left; } .CustomShopBasket.Basket .actions .actionButton.productAction { float: left; } .CustomShopBasket.Basket .BasketEntry > .single_price { width: 50%; padding: 0; float: right; text-align: right; } .CustomShopBasket.Basket td.availabilityWrapper { position: static !important; text-align: left; float: left; width: 50% !important; max-height: 1rem; } .CustomShopBasket.Basket td.availabilityCol { padding: 0; } .CustomShopBasket.Basket td.availabilityCol ul:after { display: none; } .CustomShopBasket.Basket td.availabilityCol ul, body.b2b .CustomShopBasket.Basket td.availabilityWrapper ul { text-align: right; position: absolute; top: 0.5rem; right: 0; } body.b2b .CustomShopBasket.Basket .BasketSingleTeaser > .text { padding-right: 6rem; } .CustomShopBasket.Basket td.availabilityCol .actions, .CustomShopBasket.Basket td.availabilityWrapper .actions, .CustomShopBasket.Basket.Return td.availabilityWrapper .actions { position: absolute; margin-top: 0.25rem; width: 8.5rem; left: 0.75rem; bottom: 1.5rem; } .CustomShopBasket.WishList .wishlistTable, .CustomShopBasket.Basket table, .CustomShopBasket.WishList .wishlistTable tbody, .CustomShopBasket.Basket table tbody, .CustomShopBasket .BasketEntry, .CustomShopBasket .BasketEntry > td { display: block; } .CustomShopBasket .BasketEntry > td { padding: 0.5rem 0; } .CustomShopBasket .BasketEntry { position: relative; } .CustomShopBasket.Basket .BasketEntry .amount input{ margin-top: 0; float: right; } .CustomShopBasket.Basket .single_price_mobile { display: block; float: left; width: 100%; } .CustomShopBasket.Basket .BasketEntry .amount { padding-left: 0; } } .checkout_address_add_editForm form { overflow:hidden; } .CustomShopCheckout .BasicForm.checkout_address_add_editForm .formSubmitMessage { padding-bottom:12px; } #checkoutJsBasket .CustomShopBasket.Checkout.open .BasketList { display: block; } .checkoutWait { position: relative; } .checkoutWait:before { content: ''; zoom: 1; /* Increase this for a bigger symbole*/ display: block; width: 16px; height: 16px; position: absolute; left: calc(50% - 8px); bottom: calc(50% - 8px); z-index: 2; animation: wait .80s steps(1, start) infinite; background: linear-gradient(0deg, #f4f5fa 1px, transparent 0, transparent 8px, #f4f5fa 8px), /* 6 */ linear-gradient(90deg, #f4f5fa 1px, #f6f9fb 0, #f6f9fb 3px, #f4f5fa 3px), linear-gradient(0deg, #ececf5 1px, transparent 0, transparent 8px, #ececf5 8px), /* 5 */ linear-gradient(90deg, #ececf5 1px, #f2f3f9 0, #f2f3f9 3px, #ececf5 3px), linear-gradient(0deg, #e7eaf4 1px, transparent 0, transparent 8px, #e7eaf4 8px), /* 4 */ linear-gradient(90deg, #e7eaf4 1px, #eef1f8 0, #eef1f8 3px, #e7eaf4 3px), linear-gradient(0deg, #b9bedd 1px, transparent 0, transparent 10px, #b9bedd 10px), /* 3 */ linear-gradient(90deg, #b9bedd 1px, #d0d5e8 0, #d0d5e8 3px, #b9bedd 3px), linear-gradient(0deg, #9fa6d2 1px, transparent 0, transparent 15px, #9fa6d2 15px), /* 2 */ linear-gradient(90deg, #9fa6d2 1px, #c0c5e1 0, #c0c5e1 3px, #9fa6d2 3px), linear-gradient(0deg, #8490c6 1px, transparent 0, transparent 15px, #8490c6 15px), /* 1 */ linear-gradient(90deg, #8490c6 1px, #aeb5da 0, #aeb5da 3px, #8490c6 3px); background-repeat: no-repeat; background-size: 4px 9px, /* 6 */ 4px 9px, 4px 9px, /* 5 */ 4px 9px, 4px 9px, /* 4 */ 4px 9px, 4px 11px, /* 3 */ 4px 11px, 4px 16px, /* 2 */ 4px 16px, 4px 16px, /* 1 */ 4px 16px; background-position: -4px 3px, -4px 3px, -4px 3px, -4px 3px, -4px 3px, -4px 3px, -4px 2px, -4px 2px, -4px 0, -4px 0, -4px 0, -4px 0; } /* Transparent Overlay */ .checkoutWait:after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.75); z-index: 1; } @keyframes wait { 12.5%{ background-position: -4px, /* 6 */ -4px, -4px, /* 5 */ -4px, -4px, /* 4 */ -4px, -4px, /* 3 */ -4px, -4px, /* 2 */ -4px, 0, /* 1 */ 0; } 25%{ background-position: -4px, /* 6 */ -4px, -4px, /* 5 */ -4px, -4px, /* 4 */ -4px, -4px, /* 3 */ -4px, 0, /* 2 */ 0, 6px, /* 1 */ 6px; } 7.5%{ background-position: -4px, /* 6 */ -4px, -4px, /* 5 */ -4px, -4px, /* 4 */ -4px, 0, /* 3 */ 0, 6px, /* 2 */ 6px, 12px, /* 1 */ 12px; } 50%{ background-position: -4px, /* 6 */ -4px, -4px, /* 5 */ -4px, 0, /* 4 */ 0, 6px, /* 3 */ 6px, 12px, /* 2 */ 12px, -4px, /* 1 */ -4px; } 62.5%{ background-position: -4px, /* 6 */ -4px, 0, /* 5 */ 0, 6px, /* 4 */ 6px, 12px, /* 3 */ 12px, -4px, /* 2 */ -4px, -4px, /* 1 */ -4px; } 75%{ background-position: 0, /* 6 */ 0, 6px, /* 5 */ 6px, 12px, /* 4 */ 12px, -4px, /* 3 */ -4px, -4px, /* 2 */ -4px, -4px, /* 1 */ -4px; } 87.5%{ background-position: 6px, /* 6 */ 6px, 12px, /* 5 */ 12px, -4px, /* 4 */ -4px, -4px, /* 3 */ -4px, -4px, /* 2 */ -4px, -4px, /* 1 */ -4px; } 100%{ background-position: 12px, /* 6 */ 12px, -4px, /* 5 */ -4px, -4px, /* 4 */ -4px, -4px, /* 3 */ -4px, -4px, /* 2 */ -4px, -4px, /* 1 */ -4px; } } .CustomShopCheckoutSingleStepAddress .addressEntry { box-sizing: border-box; width: 50%; float: left; } .CustomShopCheckoutSingleStepAddress .addressEntry .addressWrapperInner { border: 1px solid; padding: 1rem; margin-top: 1rem; } .CustomShopCheckoutSingleStepAddress .addressEntry:nth-child(2n+1) { clear: both; } .CustomShopCheckoutSingleStepAddress .addressEntry:nth-child(1) .addressWrapperInner, .CustomShopCheckoutSingleStepAddress .addressEntry:nth-child(2) .addressWrapperInner { margin-top: 0; } .CustomShopCheckoutSingleStepAddress .addressEntry:nth-child(2n+1) .addressWrapperInner { margin-right: 0.5rem; } .CustomShopCheckoutSingleStepAddress .addressEntry:nth-child(2n+2) .addressWrapperInner { margin-left: 0.5rem; } .CustomShopCheckoutSingleStepAddress .addressEntry .stateButton, .CustomShopCheckoutSingleStepAddress .addressEntry .actionButton { padding: 0; margin: 0.5rem 0 0; } .CustomShopCheckoutSingleStepAddress .addressEntry .actionButton { display: inline-block; margin-right: 0.5rem; } .CustomShopCheckoutSingleStepAddress .addressEntry.addAddress { } .CustomShopCheckoutSingleStepAddress .addressEntry.addAddress .addressWrapperInner { position: relative; padding: 100% 0 0; cursor: pointer; } .CustomShopCheckoutSingleStepAddress .addressEntry.addAddress .icon { position: absolute; left: 50%; top: 50%; font-size: 5rem; line-height: 5rem; margin-top: -25px; margin-left: -40px; } .editAddressPlaceholder.checkoutWait { width: 100%; height: 15rem; } #CustomShopCheckoutSingleStepAddressAddEdit.Page { min-height: auto; color: inherit; } .CustomShopCheckoutSingleStepAddress .addressEntry .data.email { word-wrap: break-word; } @media screen and (max-width:1120px) and (min-width:769px), screen and (max-width:554px) { .CustomShopCheckoutSingleStepAddress .addressEntry { width:100%; } .CustomShopCheckoutSingleStepAddress .addressEntry:nth-child(2n+1) .addressWrapperInner { margin-right:0; } .CustomShopCheckoutSingleStepAddress .addressEntry .addressWrapperInner { margin-bottom: 1rem; } .CustomShopCheckoutSingleStepAddress .addressEntry:nth-child(2n+2) .addressWrapperInner { margin-left: 0; } } .CustomShopCheckoutSingleStep #posSingleStepCustomerSelect{ padding-left: 3rem; padding-right: 2rem; box-sizing: border-box; position: relative; } @media screen and (max-width:440px) { .CustomShopCheckoutSingleStep #posSingleStepCustomerSelect{ padding-left: 0rem; } } @media screen and (max-width:512px) { #select2-drop.userDd { width: 100% !important; left:0 !important; } } .CustomShopCheckoutSingleStep #s2id_posSingleStepCustomerId{ min-width: 51%; width: 100%; padding-top: 0.25rem; padding-right: 0.75rem; display: inline-block; vertical-align: middle; } .CustomShopCheckoutSingleStep .roundIcon { margin-right: 0.5rem; } .CustomShopCheckoutSingleStep #posSingleStepCustomerId_new, .CustomShopCheckoutSingleStep #posSingleStepCustomerChangeBasketToUser{ display: inline-block; vertical-align: middle; width: 50%; min-height: 2.2rem; position: relative; box-sizing: border-box; margin-top: 0.8rem; padding-left: 2.75rem; padding-right: 0.25rem; padding-top: 0.5rem; line-height: 1.5em; } .CustomShopCheckoutSingleStep .infoWarningMessage { color: var(--color_cWhite); line-height: 1.5rem; background-color: var(--color_cError); padding: 0.1rem 0.75rem; box-sizing: border-box; margin: 0 0.75rem 0.1rem 0; } .CustomShopCheckoutSingleStep .infoWarningMessage::before { content: "\f05a"; font-family: "Font Awesome 5 Pro"; font-weight: bold; padding-right: 0.25rem; } @media screen and (max-width:440px) { .CustomShopCheckoutSingleStep #posSingleStepCustomerId_new, .CustomShopCheckoutSingleStep #posSingleStepCustomerChangeBasketToUser{ width: 100%; padding-right: 0; } } .CustomShopCheckoutSingleStep #posSingleStepCustomerId_new .roundIcon, .CustomShopCheckoutSingleStep #posSingleStepCustomerChangeBasketToUser .roundIcon{ position: absolute; left: 0; top: 0; margin-right: 0; } .CustomShopCheckoutSingleStep .removeUserSelection { cursor: pointer; margin-right: 0; position: absolute; right: 0; top: 0; } #CustomShopCheckoutSingleStepUserNew { padding-top:1.5rem; box-sizing: border-box; } #CustomShopCheckoutSingleStepUserNew .email { padding:0; } #CustomShopCheckoutSingleStepUserNew .mandatory_field_desciption { display:none; } .newUserPlaceholder.checkoutWait { width:100%; height:5rem; } .CustomShopCheckoutSingleStep #s2id_posSingleStepVoucherId{ min-width: 50%; padding-right: 0.75rem; display: inline-block !important; vertical-align: middle; max-width: 11rem; } @media screen and (max-width:512px) { #select2-drop.voucherDd { width: 100% !important; left:0 !important; } } .CustomShopCheckoutSingleStep #posSingleStepVoucherId_new{ display: inline-block; vertical-align: middle; width: 50%; min-height: 2.2rem; padding-left: 2.5rem; position: relative; box-sizing: border-box; } .CustomShopCheckoutSingleStep #posSingleStepVoucherId_new .roundIcon{ position: absolute; left: 0; } .CustomShopCheckoutSingleStep #posSingleStepVoucherSelect{ margin-bottom: 1rem; } .CustomShopCheckoutSingleStep .posSingleStepVoucherList .title{ font-weight: bold; letter-spacing: 0.1em; font-size: 0.8rem; margin-bottom: 0.25rem; } .CustomShopCheckoutSingleStep .voucherList .voucherElement{ font-size: 0.85rem; line-height: 1.5rem; margin-bottom: 0.25rem; } .CustomShopCheckoutSingleStep .voucherList .roundIcon{ height: 1.125rem; width: 1.125rem; line-height: 1.125rem; margin-left: 0.25rem; } .CustomShopCheckoutSingleStep .voucherList [class*="ss-"] { font-size: 0.75rem; } .CustomShopCheckoutSingleStep .wrapperPaymentMethod { box-sizing: border-box; width: 50%; max-width: 27.5rem; padding-right: 1rem; margin-bottom: 0.5rem; display: inline-block; vertical-align: top; } .CustomShopCheckoutSingleStep .wrapperPaymentMethod input { display: none; } .CustomShopCheckoutSingleStep .wrapperPaymentMethod .stateButton { width: 100%; margin: 0; padding: 0.5rem 0.5rem 0 2.5rem; min-height: 2.5rem; line-height: 1.5rem; box-sizing: border-box; position: relative; } .CustomShopCheckoutSingleStep .wrapperPaymentMethod .BasicGraphic { float: left; width: 5rem; height: 100%; margin-top: -0.25rem; } .CustomShopCheckoutSingleStep .wrapperPaymentMethod .roundIcon { position: absolute; top: 2px; left: 0; } @media screen and (min-width: 769px) and (max-width: 1024px) { .CustomShopCheckoutSingleStep .wrapperPaymentMethod { width: 100%; padding: 0; } } @media screen and (max-width: 544px) { .CustomShopCheckoutSingleStep .wrapperPaymentMethod { width: 100%; padding: 0; } } .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout h1 { display:none; } .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout .BasketList { display:block; } .CustomShopCheckoutSingleStep .CustomShopBasket.Basket .packaging label { cursor:inherit; } .CustomShopCheckoutSingleStep .CustomShopBasket.Basket .checkoutButtons { display:none; } .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout, .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout .info { margin:0; } .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout .mobileMetaInfos { display:block; } .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout td.availability, .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout td.single_price, .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout td.amount, .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout td.sum_price { display:none; } .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout .type_simple .subtitle, .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout .type_set .subtitle { display:none; } .CustomShopCheckoutSingleStep .content.productBlock{ border-bottom-width: 1px; } .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout .desiredPriceLabel{ display: inline; } .CustomShopCheckoutSingleStep .CustomShopBasket.Checkout #desiredPrice{ float: right; } .CustomShopCheckoutSingleStepBasket .blockTitle h2{ display: inline-block; } .CustomShopCheckoutSingleStepBasket .blockTitle #basketOfOtherUserNote{ display: inline-block; margin-left: 0.3rem; color: var(--color_cError); } .CustomShopCheckoutSingleStep .CustomShopCheckoutSingleStepBasket input:not([name=productIdinBasketCheckout]){ display: block; width: 3rem; border-radius: 4px; margin-top: 0.2rem; border: 1px solid var(--color_cLine); -webkit-appearance: none; margin: 0; -moz-appearance: textfield; text-align: center; padding: 0.2rem; line-height: 1.5rem; } .CustomShopCheckoutSingleStepBasket .productSelectWrapper{ display: inline-block !important; width: calc(100% - 11rem); padding-right: 0.75rem; vertical-align: middle; } .CustomShopCheckoutSingleStepBasket .productSelectWrapper label{ display: inline-block !important; vertical-align: middle; width: 8rem; margin-bottom: 0 !important; } .CustomShopCheckoutSingleStepBasket .productSelectWrapper .select2-container{ width: calc(100% - 8rem); } .CustomShopCheckoutSingleStepBasket .amountWrapper, .CustomShopCheckoutSingleStepBasket .amountInputWrapper{ display: inline-block; margin-right: 0.5rem; vertical-align: middle; } .CustomShopCheckoutSingleStepBasket .buttonWrapper { display: inline-block; vertical-align: middle; } .CustomShopCheckoutSingleStepBasket .deleteFromBasket { display: inline-block; } .CustomShopCheckoutSingleStepBasket .deleteFromBasket .deleteFromBasketButton{ border: 1px solid var(--color_cLine); border-radius: 4px; cursor: pointer; } .CustomShopCheckoutSingleStepBasket .SetArticle.BasketSingleTeaser > .wrapper, .CustomShopCheckoutSingleStepBasket .CustomShopBasket.Basket .productGraphic{ float:left; } .CustomShopCheckoutSingleStep .SetArticle.BasketSingleTeaser .product_key_mobile{ display: block !important; } .CustomShopCheckoutSingleStepBasket .smallButton{ padding: 4px !important; } .CustomShopCheckoutSingleStepBasket .fileUploadBlock { border-bottom-width: 1px; } .CustomShopCheckoutSingleStepBasket .fileUploadBlock label[for=uploadNoMerge]{ display: inline-block; margin: 0 0 0 0.3rem; vertical-align: middle; } .CustomShopCheckoutSingleStepBasket .fileUploadBlock #uploadNoMerge { width: 1rem; display: inline-block; vertical-align: middle; } .CustomShopCheckoutSingleStepBasket .fileUploadBlock .noMergeWrapper { float: right; } @media screen and (max-width: 1000px) { .CustomShopCheckoutSingleStepBasket .productSelectWrapper{ width: calc(100% - 5rem); } } @media screen and (max-width: 768px) { .CustomShopCheckoutSingleStepBasket .productSelectWrapper { width: calc(100% - 11rem); } } @media screen and (max-width: 736px) { .CustomShopCheckoutSingleStep .BasketSingleTeaser > .text { padding-bottom: 0rem !important; } } @media screen and (max-width: 544px) { .CustomShopCheckoutSingleStepBasket .productSelectWrapper { width: calc(100% - 5rem); margin-bottom: 0.75rem; } .CustomShopCheckoutSingleStepBasket .productSelectWrapper .select2-container{ width: 100%; } .CustomShopCheckoutSingleStepBasket .amountInputWrapper{ margin-right: 0; } } .CustomShopCheckoutSingleStepInfo .checks input[disabled] + label, .CustomShopCheckoutSingleStepInfo .checks input[disabled] + label + .validationMessage { display:none; } .CustomShopCheckoutSingleStepInfo .submitMessage.error { text-align:center; padding-top:1rem; color:var(--color_cRed); } .CustomShopCheckoutSingleStepPreselection{ text-align: center; } .CustomShopCheckoutSingleStepPreselection .contentWrapper{ box-sizing: border-box; display: inline-block; } .CustomShopCheckoutSingleStepPreselection .contentWrapper h1{ margin-bottom: 2rem; } .CustomShopCheckoutSingleStepPreselection .contentWrapper button{ margin: 2rem; } .CustomShopCheckoutSingleStepSupplier .content .select2-container{ width: 100%; box-sizing: border-box; } .CustomShopCheckoutSingleStep .select2 { width: 100% !important; } .CustomShopCheckoutSingleStep { margin: 0; position: relative; } .CustomShopCheckoutSingleStep .pageTitleWrapper{ margin-bottom: 1rem; text-align: center; display: inline-block; } .CustomShopCheckoutSingleStep .pageTitleWrapper .checkoutPageTitle{ display: inline-block; margin-left: 7rem; vertical-align: middle; } .CustomShopCheckoutSingleStep .columnWrapper { position: relative; overflow: hidden; } .CustomShopCheckoutSingleStep .leftColumn, .CustomShopCheckoutSingleStep .rightColumn { display: block; width: 50%; box-sizing: border-box; padding: 0 1rem; } .CustomShopCheckoutSingleStep .leftColumn { float:left; padding-right: 1rem; opacity: 1 !important; /*this value is set due to a bug with the nimbus screenshot tool in firefox*/ } .CustomShopCheckoutSingleStep .rightColumn { float: right; } @media screen and (max-width:768px) { .CustomShopCheckoutSingleStep .leftColumn { margin-bottom:0; } } .CustomShopCheckoutSingleStep .blockWrapper label { margin-bottom: 0.5rem; display: block; } .CustomShopCheckoutSingleStep .blockWrapper .content { position: relative; overflow: hidden; padding: 0.5rem; } .CustomShopCheckoutSingleStep .checkoutButtons { padding: 2rem 0 1rem; } .CustomShopCheckoutSingleStep .checkoutButtons #checkoutsinglestep_submit{ float: right; margin-right: 1rem; } .CustomShopCheckoutSingleStep .select2-drop{ max-width: 26rem; } .CustomShopCheckoutSingleStep .validationMessageSingleStep{ color: var(--color_cError); padding: 0 0.5rem; font-size: 0.75rem; display: block; height: 1rem; line-height: 1rem; } .CustomShopCheckoutSingleStep #checkoutSingleStepGoToPreselection, .CustomShopCheckoutSingleStep #checkoutSingleStepGoToPreselectionUp{ margin: 1rem; } @media screen and (max-width: 768px) { .CustomShopCheckoutSingleStep .leftColumn, .CustomShopCheckoutSingleStep .rightColumn{ display: block; max-width: 100%; width: 100%; position: relative; float: left; } } .CustomComplaint.main #complaintTable .deleteButton:hover{ cursor: pointer; color: var(--color_cGreyBorder); } .CustomComplaint.main .wrapper{ width: 100%; margin-top: 2rem; padding: 1rem; box-sizing: border-box; } .CustomComplaint.main .select2-choice{ line-height: 2rem !important; height: 2rem !important; font-size: 1rem !important; } .CustomComplaint.main .upperSelectWrapper .select2-container{ width: calc(100% - 8rem); } .CustomComplaint.main label{ font-size: 1rem !important; line-height: 2rem; } .CustomComplaint.main .labelWrapperTop{ float: left; width: 8rem; } .CustomComplaint.main .labelWrapper{ float: left; width: 7rem; text-align: right; } .CustomComplaint.main .halfWrapper{ display: inline-block; width: 50%; vertical-align: middle; } .CustomComplaint.main .halfWrapper .select2-container{ width: calc(100% - 10rem); } .CustomComplaint.main .halfWrapper .dateWrapper{ margin-top: 0.2rem; } .CustomComplaint.main .halfWrapper #datePicker{ width: calc(100% - 10rem); padding-left: 2rem; font: inherit; font-size: 1rem; height: 2.4rem; } .CustomComplaint.main .commentAndIoDWrapper{ display: inline-block; } .CustomComplaint.main .commentAndIoDWrapper input{ resize: none; width: calc(100% - 10rem) !important; height: 2.4rem !important; padding-left: 2rem; font: inherit; font-size: 1rem; } .CustomComplaint.main .commentAndIoDWrapper .commentLabel{ margin-top: 0.1rem; } .CustomComplaint.main .wrapperBorder{ border: 1px solid var(--color_cGrey); } .CustomComplaint.main .productChoiceWrapper{ display: inline-block; } .CustomComplaint.main .productChoiceWrapper h3{ margin-bottom: 2rem; } .CustomComplaint.main .productChoiceWrapper .productChoiceTable{ table-layout: fixed; text-align: center; width: 100%; } .CustomComplaint.main .productChoiceTable .leftCell{ width: 8rem; } .CustomComplaint.main .productChoiceTable .rightCell{ width: calc((100% - 8rem)/ 2); box-sizing: border-box; padding: 0.1rem 1rem; } .CustomComplaint.main .productChoiceTable .select2-container{ width: 100%; } .CustomComplaint.main .productChoiceWrapper #amount{ line-height: 2rem !important; height: 2rem !important; font-size: 1rem !important; border: 1px solid var(--color_cGreyBorder); border-radius: 0.25rem; width: 70%; } .CustomComplaint.main .productChoiceWrapper #onlyActiveProducts{ vertical-align: middle; margin-right: 0.5rem; margin-bottom: 0.15rem; } .CustomComplaint.main .buttonWrapper{ float: right; margin-top: 1.5rem; } .CustomComplaint.main .productTableWrapper{ width: 100%; padding: 1rem; box-sizing: border-box; display: inline-block; } .CustomComplaint.main .productTableWrapper #complaintTable{ border: 1px solid var(--color_cGreyBorder); width: 100%; } .CustomComplaint.main .productTableWrapper #complaintTable th, .CustomComplaint.main .productTableWrapper #complaintTable td{ font-size: 1rem; border: 1px solid var(--color_cGreyBorder); padding: 1rem; } .CustomComplaint.main .productTableWrapper #complaintTable th{ font-weight: bold; } .CustomComplaint.main .productTableWrapper #complaintTable .amountCell{ text-align: center; } .CustomComplaint.main .productTableWrapper #complaintTable .amountInTable{ border: 1px solid var(--color_cGreyBorder); border-radius: 0.25rem; width: 6rem; } .CustomComplaint.main .productTableWrapper #complaintTable .deleteColumn{ width: 1rem; } .CustomComplaint.main #resetSelections{ margin-right: 1rem; } .CustomComplaint.main #saveComplaintButton[disabled='disabled']{ background-color: var(--color_cGrey); } .CustomComplaintWrapper .userNotPermittedWrapper{ text-align: center; padding: 5rem; } .CustomCrm.customerOverview { margin-bottom:2.5rem; } .CustomCrm.customerOverview .crmMap { margin-bottom:2.5rem; } .CustomCrm.customerOverview .intro, .customerFilters .filtersWrapper, .customerList, .mapActions { box-sizing:border-box; width:100%; max-width:80rem; margin:0 auto 2.5rem; padding:0 3rem; } .customerFilters .filtersWrapper { margin-bottom:0; } .customerFilters.extended .filtersWrapper { min-height:2.375rem; } .CustomCrm.customerOverview .intro { padding-top:2rem; } .CustomCrm.customerOverview .intro .title { font-size:1.75rem; margin-bottom:1.75rem; } .CustomCrm.customerOverview .intro .description { margin: 0 0 1.75rem 20rem; font-size: 0.8125rem; } .CustomCrm.customerOverview.simpleFilter .filters { float:right; margin-bottom:1rem; } .CustomCrm.customerOverview.simpleFilter .summary { float:left; } .CustomCrm.customerOverview.simpleFilter .list { float:left; clear: both; width: 100%; } .CustomCrm.customerOverview.simpleFilter .legend { clear: both; } @media screen and (max-width:864px) { .CustomCrm.customerOverview .intro .description { margin-left:0; } } @media screen and (max-width:544px) { .CustomCrm.customerOverview .intro .title { padding-top:0.5rem; } .CustomCrm.customerOverview .crmMap { margin-bottom:0.5rem; } .CustomCrm.customerOverview .intro, .customerFilters .filtersWrapper, .customerList, .mapActions { padding:0 1rem; margin-bottom:1rem; } } .crmMap { } .crmMap, .crmMap > .wrapper, .google_map { height:40rem; } @media screen and (max-width:928px) { .crmMap, .crmMap > .wrapper, .google_map { height:28rem; } } @media screen and (max-width:544px) { .crmMap, .crmMap > .wrapper, .google_map { height:23rem; } } .crmMap .gm-style .gm-style-iw-c { border-radius:0.25rem; padding: 1.5rem 1.75rem; max-width:20rem !important; } .crmMap .gm-style .gm-style-iw-c button { top:0 !important; right:0 !important; height:2rem !important; width:2rem !important; } .crmMap .gm-style .gm-style-iw-c button img { -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; opacity:0.6; height:1.25rem !important; width:1.25rem !important; margin:0.375rem !important; } .crmMap .dialogContent { font-size:0.6875rem; line-height: 1.5em; } .crmMap .dialogContent h3 { font-size:0.875rem; line-height: 1.5em; margin-bottom:0.75rem; } .crmMap .dialogContent .infos { margin-bottom: 0.75rem; overflow:hidden; } .crmMap .dialogContent .infos a { display:block; float:left; clear:both; color:var(--color_cText); } .crmMap .dialogContent .actions a { display:inline-block; } .crmMap .dialogContent .actions .detail { margin-right:1rem; } .mapSearchTextWrapper { float: left; } .mapSearchTextWrapper label { min-height: 1.5rem; margin: 0 2rem 0 0; display: inline-block; } .mapSearchTextWrapper .inputWrapper { position: relative; display: inline-block; } .mapSearchTextWrapper .icon { position: absolute; top: 0; right: 0; height: 100%; color: #000000; line-height: 2.5rem; width: 2rem; text-align: center; } @media screen and (max-width:864px) { .mapSearchTextWrapper { float: none; margin-bottom: 0.5rem; } .mapSearchTextWrapper label { float: right; padding-top: 0.8rem; margin-right: 0; } .mapSearchTextWrapper .inputWrapper { width: calc(100% - 7.2rem); } .mapSearchTextWrapper .inputWrapper input { width: 100%; } } .mapActions { overflow:hidden; } .BasicForm.mapActions .wrapper.mapAction { float:right; } .BasicForm.mapActions .wrapper.checkbox label { min-height: 1.5rem; padding: 0 2rem 0 0; color: var(--crm_color_cMain); position:relative; } .BasicForm.mapActions .wrapper.checkbox label span { left: auto; right: 0; top:0; position:absolute; font-size:1.125rem; display:none; } .BasicForm.mapActions .wrapper.checkbox input:checked + label .checked, .BasicForm.mapActions .wrapper.checkbox input:not(:checked) + label .unchecked { display:block; } .customerFilters { margin-bottom: 3rem; } .customerFilters .filtersWrapper { padding: 0 3rem; } .customerFilters.extended { padding-top: 2.25rem; padding-bottom: 2.25rem; background-color: var(--crm_color_bcAreaMainLight); } .customerFilters.extended label { font-size: 0.625rem; color: var(--crm_color_cMain); line-height:0.875rem; display:block; } .customerFilters button { padding-left:1.25rem; padding-right:1.25rem; float:right; } .customerFilters.extended .wrapper{ height:2.5rem; width: 10rem; box-sizing:border-box; position: relative; margin-right: 0.5rem; display: inline-block; background-color:var(--color_cWhite); font-size: 12px; padding: 0.25rem 2rem 0.25rem 0.625rem; border:none; border-radius:3px; vertical-align:top; } .customerFilters.extended .wrapper input{ background: none; border: none; padding:0; height:1.125rem; } .customerFilters.extended .wrapper .iconWrapper{ color:var(--color_cIconAction); position: absolute; right:0; top:0; text-align:center; height:100%; width:2rem; font-size:1rem; cursor:pointer; } .customerFilters .searchTextWrapper { display: inline-block; position:relative; margin-right: 0.5rem; } .customerFilters .searchTextWrapper input { padding: 0.625rem 2rem 0.625rem 0.625rem; font-size: 0.75rem; line-height: 1.25rem; height: 2.5rem; box-sizing: border-box; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; } .customerFilters .searchTextWrapper .icon { position: absolute; top: 0; right: 0; height:100%; color: var(--color_cBlack); line-height: 2.5rem; width: 2rem; text-align: center; } .customerFilters .dropDownCrm { width:9rem; vertical-align:top; } .customerFilters .dropDownCrm .itemList { width:12.5rem; } @media screen and (max-width:1088px) { .customerFilters.extended .filtersWrapper { padding: 0 2.5rem; } .customerFilters.extended .wrapper, .customerFilters.extended .dropDownCrm, .customerFilters.extended .searchTextWrapper, .customerFilters.extended button { width:calc(33.333% - 1rem); margin: 0 0.5rem 0.75rem; } .customerFilters.extended .searchTextWrapper input { width:100%; } .customerFilters.extended button { padding-left:0; padding-right:0; } } @media screen and (max-width:608px) { .customerFilters.extended .wrapper, .customerFilters.extended .dropDownCrm { width:calc(50% - 1rem); } .customerFilters.extended .searchTextWrapper { width:calc(70% - 1rem); } .customerFilters.extended button { width:calc(30% - 1rem); } } @media screen and (max-width:544px) { .customerFilters.extended { padding-top:1rem; padding-bottom:0.25rem; margin-bottom: 1.75rem; } .customerFilters.extended .filtersWrapper { padding: 0 0.5rem; margin-bottom:0; } .customerFilters.simple { overflow:hidden; margin-bottom:0; } .customerFilters.simple .filtersWrapper { padding: 0 1rem; margin-bottom: 0; overflow:hidden; } .customerFilters.simple .filters { width:100%; } .customerFilters.simple .filters .searchTextWrapper { width:calc(100% - 6.5rem); } .customerFilters.simple .filters .searchTextWrapper input { width: 100%; } .customerFilters.simple .filters .submit { width:6rem; } } .customerList .summary { margin-bottom:3rem; text-align:center; font-size:0.8125rem; overflow:hidden; } .customerList .summary .summaryTitle { float:left; font-weight: 800; font-size:1rem; margin-bottom:1rem; } .customerList .summary .entryWrapper { float:right; text-align:left; } .customerList .summary .entry { display:inline-block; vertical-align: middle; } .customerList .summary .entry:not(:last-child), .customerList .summary a:not(:last-child) { margin-right:1.25rem; } .customerList .summary .caption { margin-right:0.75rem; } .customerList .summary .entry:not(.action) .caption { } .customerList .summary .action, .customerList .summary .icon { color:var(--crm_color_cMain); cursor:pointer; } .customerList .summary .action{ vertical-align: top; } .customerList .summary .action .caption, .customerList .summary .icon.fa-cloud-download-alt{ vertical-align: middle; } .customerList .summary .icon.fa-cloud-download-alt{ font-size: 1.25rem; } @media screen and (max-width:768px) { .customerList .summary .entryWrapper { float:none; clear:both; } } @media screen and (max-width:544px) { .customerList .summary { margin-bottom:1rem; width:100%; } .customerList .summary .entry { float:left; display:block; margin-bottom:0.5rem; } .customerList .summary .entryWrapper a { display:block; float:left; clear:both; } .customerList .summary .entry.totalSalesVolume { margin-right:0; } } .customerList .mobile { display:none; color:var(--color_cIconAction); } .customerList table { border-collapse: collapse; font-size:0.8125rem; width:100%; margin-bottom: 3rem; } .customerList th { border-box:box-sizing; } .customerList th.sortableCol { cursor:pointer; } .customerList .list .type { width: 3.2rem; } .customerList .list .addressType, .customerList .list .isBillingAddress, .customerList .list .hasComment { width:2.5rem; } .customerList .list .zip { width:3.25rem; } .customerList .list .city { width:8rem; } .customerList .list .lastOrder { width:5.75rem; } .customerList .list .userId, .customerList .list .volumeOfSales { width:6.5rem; } .customerList .list .actions { width:4rem; } .customerList th > .caption, .customerList th > .sortBlock { display:inline-block; } .customerList th > .caption { margin-right: 0.25rem; } .customerList table tr { border-bottom-width:1px; } .customerList table td { padding: 0.75rem 0.375rem; vertical-align: top; } .customerList table th { padding: 0.75rem 0.375rem; vertical-align: bottom; text-align:left; font-weight:600; line-height:1.25rem; } .customerList table .volumeOfSales { text-align:right; } .customerList table tr, .customerList .actions .icon { -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; } .customerList .listWrapper { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } .customerList .icon { font-size:0.9375rem; color:var(--crm_color_cGreyLight); line-height:1.25rem; } .customerList th.addressType .caption .icon, .customerList td.addressType .icon { font-size:0.5rem; } .customerList table td.actions { padding-top: 0.25rem; padding-bottom: 0.25rem; } .customerList .actions .icon { padding: 0.25rem; color:var(--crm_color_cGrey); cursor:pointer; } .customerList .list { margin-bottom: 3.5rem; } @media screen and (max-width:1088px) { .customerList .userId, .customerList .type { display: none; } } @media screen and (max-width:1024px) { .customerList .volumeOfSales , .customerList .lastOrder { display: none; } } @media screen and (max-width:768px) { .customerList .hasComment, .customerList .isBillingAddress, .customerList .addressType, .customerList .firstName, .customerList .lastName { display: none; } .customerList .mobile { display: block; } } @media screen and (max-width:608px) { .customerList .zip, .customerList .actions .order { display: none; } .customerList .list .actions { width:2.25rem; } .customerList .list .city { width: auto; } .customerList .list .company, .customerList .list .city { width: auto; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; word-break: break-word; } } @media screen and (max-width:608px) { .customerList table td { padding: 0.5rem 0.25rem; } } .customerList th:not([data-order]) .sort.asc { visibility:hidden; } .customerList th:not([data-order]) .sort.desc, .customerList th[data-order="asc"] .sort.desc, .customerList th[data-order="desc"] .sort.asc { display:none; } .customerList th[data-order] .sort .icon { color:var(--color_cText); } .customerList .ajaxPaginationWrapper { text-align: center; } .customerList .ajaxPagination { display:inline-block; } .customerList .legend { font-size: 0.6875rem; text-align: center; margin-bottom:3rem; } .customerList .legend .line { margin-bottom: 1.5rem; } .customerList .legend .item { display: inline-block; margin :0 1rem 1.25rem; } .customerList .legend .icon { display: inline-block; margin-right: 1rem; } .customerList .legend .b2bCandidate .icon { color:var(--crm_color_cMain); } .customerList .legend .addressType .icon { font-size:1rem; } .customerList .legend .order .icon, .customerList .legend .detail .icon { color: var(--color_cIconAction); } .CustomCrm.customerDetail { width: 100%; max-width: 80rem; box-sizing: border-box; padding: 0 2rem; margin: 3rem auto; overflow: hidden; font-Size:0.8125rem; } .CustomCrm.customerDetail .warning { text-align: center; font-size: 1rem; vertical-align: middle; font-weight:600; margin: 3rem 0; } .CustomCrm.customerDetail .warning .icon { display:inline-block; vertical-align:middle; } .CustomCrm.customerDetail .warning.loading .icon { display:inline-block; vertical-align:middle; margin-right: 1rem; animation: spin-anticlockwise 2s infinite linear; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cg transform='matrix(0.95238095,0,0,0.95238095,0,-962.24984)'%3E%3Cpath d='m 36.147008,1051.331 c -6.6e-4,0.013 -10e-4,0.034 -10e-4,0.047 0,0.5431 0.44076,0.9841 0.983809,0.9844 l 3.885784,0 c 0.5434,0 0.984399,-0.441 0.984399,-0.9844 l 0,-16.4349 c 0,-0.5434 -0.440999,-0.9844 -0.984399,-0.9844 l -16.424216,0 c -0.543369,0 -0.984369,0.441 -0.984369,0.9844 l 0,3.889 0,0 c 0,0.5434 0.441,0.9844 0.984369,0.9844 0.0129,0 0.0338,-5e-4 0.0467,-10e-4 l 8.322868,-0.3986 c -2.367287,3.5211 -7.732229,6.3789 -11.975213,6.3789 -6.274011,0 -12.558872,-4.9503 -14.0286199,-11.0498 -0.0982,-0.4188 -0.5270293,-0.7591 -0.9572887,-0.7596 l -4.0236142,0 c -0.5433692,0 -0.98436862,0.441 -0.98436862,0.9844 0,0.05 0.007,0.1298 0.0164,0.1788 1.7735174,9.4254 10.0438854,16.5555 19.9778414,16.5555 l 0.0233,0 c 5.184613,0 12.113273,-3.2097 15.465798,-7.1646 z M 20.98603,1016.9247 c 6.275141,0 12.562562,4.9517 14.02977,11.0529 0.0982,0.4188 0.527029,0.7591 0.957289,0.7596 l 4.023614,0 c 0.543369,0 0.984368,-0.441 0.984368,-0.9844 0,-0.05 -0.007,-0.1298 -0.0164,-0.1788 -1.773517,-9.4254 -10.043795,-16.5555 -19.978661,-16.5555 l -0.0192,0 c -5.178523,0 -12.1020327,3.2034 -15.4543179,7.1506 l 0.3403795,-6.7733 c 7.2e-4,-0.014 10e-4,-0.036 10e-4,-0.049 0,-0.5434 -0.4409993,-0.9844 -0.9843686,-0.9844 l -0.001,0 -3.88413441,0 C 0.44099937,1010.3622 0,1010.8032 0,1011.3466 l 0,16.4333 c 0,0.5434 0.44099937,0.9844 0.98436859,0.9844 l 16.42261641,0 c 0.543369,0 0.984369,-0.441 0.984369,-0.9844 l 0,-3.8883 0,0 c 0,-0.5434 -0.441,-0.9844 -0.984369,-0.9844 -0.0129,0 -0.0339,6e-4 -0.0468,10e-4 l -8.3507679,0.3995 c 2.3624769,-3.5228 7.7224489,-6.382 11.9642329,-6.382 l 0.0123,0 z' style='fill:var(--crm_color_cMain|replace:"#":"%23");fill-opacity:1'/%3E%3C/g%3E%3C/svg%3E%0A"); height: 1.5rem; width: 1.5rem; background-size: 1.5rem; background-repeat: no-repeat; } @media screen and (max-width:1024px) { .CustomCrm.customerDetail { padding:0; } } .CustomCrm.customerDetail > .logo { display: none; } .CustomCrm.customerDetail > .logo, .CustomCrm.customerDetail > .title, .CustomCrm.customerDetail > .information1, .CustomCrm.customerDetail > .information2 { width: 33.333%; float: left; margin-bottom: 3rem; } @media screen and (max-width:768px) { .CustomCrm.customerDetail > .title { width: 100%; } .CustomCrm.customerDetail > .logo, .CustomCrm.customerDetail > .information1, .CustomCrm.customerDetail > .information2 { width: 50%; } } @media screen and (max-width:544px) { .CustomCrm.customerDetail > .logo { width:33.333%; } .CustomCrm.customerDetail > .information1, .CustomCrm.customerDetail > .information2 { width: 100%; margin-bottom:1rem; } } .CustomCrm.customerDetail > .logo .uploadButtons::before, .CustomCrm.customerDetail .dropZone::before, .CustomCrm.customerDetail .fa-pen { -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; } .CustomCrm.customerDetail .blockCaption { font-weight:600; font-size:0.875rem; margin-bottom:1rem; } .CustomCrm.customerDetail > .logo .logoInner { background-color: var(--color_cWhite); margin: 0 1rem; } .CustomCrm.customerDetail > .logo .fileUploadSingleGraphic { position:relative; } .CustomCrm.customerDetail > .logo .graphicWrapper { text-align: center; } .CustomCrm.customerDetail > .logo .graphic { max-width: 100%; display: inline-block; } .CustomCrm.customerDetail > .logo .dropZone p, .CustomCrm.customerDetail > .logo .graphicWrapper input, .CustomCrm.customerDetail > .logo .resetGraphic { display: none; } .CustomCrm.customerDetail > .logo .uploadButtons, .CustomCrm.customerDetail > .logo .removeGraphic, .CustomCrm.customerDetail > .logo .dropZone { height:2.5rem; width:2.5rem; position:absolute; bottom:0; right:0; cursor:pointer; } .CustomCrm.customerDetail > .logo .uploadButtons { right:2.5rem; } .CustomCrm.customerDetail > .logo .removeGraphic { opacity:0; z-index:2; } .CustomCrm.customerDetail > .logo .uploadButtons::before, .CustomCrm.customerDetail > .logo .dropZone::before { content:"\f304"; height:2.5rem; width:2.5rem; line-height:2.5rem; font-size:1rem; text-align:center; color:var(--color_cIconAction); font-family: "Font Awesome 5 Pro"; font-weight: 400; position:absolute; left:0; top:0; } .CustomCrm.customerDetail > .logo .uploadButtons::before { content:"\f1f8"; z-index:1; } @media screen and (max-width:544px) { .CustomCrm.customerDetail > .logo { margin-bottom:1.25rem; } .CustomCrm.customerDetail > .logo .dropZone, .CustomCrm.customerDetail > .logo .uploadButtons { display:none; } } .CustomCrm.customerDetail > .title { font-weight:600; font-size:0.875rem; box-sizing: border-box; float: left; padding: 0 1rem; } .CustomCrm.customerDetail > .information1 { box-sizing: border-box; padding: 0 1.25rem 0 1.5rem; } .CustomCrm.customerDetail > .information1 [data-type=chegroup], .CustomCrm.customerDetail > .information1 .wrapper.checkbox input[type=checkbox], .CustomCrm.customerDetail > .information1 .wrapper.checkbox input[type=checkbox]:not(:checked) + label, .CustomCrm.customerDetail > .information1 .wrapper.checkbox .validationMessage { display: none; } .CustomCrm.customerDetail > .information1 .wrapper.chegroup, .CustomCrm.customerDetail > .information1 .wrapper.checkbox, .CustomCrm.customerDetail > .information1 .wrapper.checkbox input[type=checkbox]:checked + label + input[name$="_checkboxInput"] { display: inline; } .CustomCrm.customerDetail > .information2 { box-sizing: border-box; padding: 0 1rem 0 1.25rem; } .CustomCrm.customerDetail .entry { margin-bottom:0.75rem; } .CustomCrm.customerDetail .entry.editable { padding-right: 2.5rem; position:relative; } .CustomCrm.customerDetail .entry .icon{ position:absolute; top:0; right:0; height:2.5rem; width:2.5rem; text-align:center; line-height:2.5rem; color:var(--crm_color_cGrey); font-size:1rem; -o-transition: color .3s; -ms-transition:color .3s; -moz-transition:color .3s; -webkit-transition:color .3s; transition:color .3s; } .CustomCrm.customerDetail .entry .icon.edit{ cursor:pointer; } .CustomCrm.customerDetail .entry.empty { padding-left:2.5rem; position:relative; } .CustomCrm.customerDetail .entry.empty .handRight { color:var(--crm_color_cMain); font-size:1.25rem; left:0; right:auto; text-align:left; } .CustomCrm.customerDetail .entry:not(.empty) .handRight { display:none; } .CustomCrm.customerDetail .entry .caption { color:var(--color_cIconAction); font-size:0.625rem; font-weight:600; } .CustomCrm.customerDetail .entry .value { } .CustomCrm.customerDetail .entry.perc50 { float: left; width: 50%; text-align: left; margin-bottom: 2rem; } .CustomCrm.customerDetail > .information2 { text-align:center; } .CustomCrm.customerDetail > .information2 .orderAction { display:inline-block; margin-bottom:1rem; } .CustomCrm.customerDetail .addresses { clear:both; } .CustomCrm.customerDetail .addresses .address { width: 33.333%; display:inline-block; box-sizing: border-box; vertical-align:top; } @media screen and (max-width:1024px) { .CustomCrm.customerDetail .addresses .address { width: 50%; } .CustomCrm.customerDetail .addresses .address .addressBorder { margin-bottom:1rem; } } @media screen and (max-width:1024px) and (min-width:769px){ .CustomCrm.customerDetail .addresses .address:nth-child(2n+1) .addressBorder{ margin-right:0.5rem; } .CustomCrm.customerDetail .addresses .address:nth-child(2n) .addressBorder{ margin-left:0.5rem; } } @media screen and (max-width:768px) { .CustomCrm.customerDetail .addresses .address { width: 100%; } .CustomCrm.customerDetail .addresses .address .addressBorder{ min-height:0; } } @media screen and (max-width:544px) { .CustomCrm.customerDetail .addresses .address .addressBorder { padding: 1rem; } } .CustomCrm.customerDetail .addressBorder { border: 1px solid var(--crm_color_cGreyLight); margin: 0 1rem 2rem; padding: 1.5rem 2rem; min-height: 14rem; position:relative; } @media screen and (max-width:768px) { .CustomCrm.customerDetail .addressBorder { height: auto; } } .CustomCrm.customerDetail .addressBorder .actionWrapper { position:absolute; top:0.75rem; right:1rem; } .CustomCrm.customerDetail .addressBorder .editAddress, .CustomCrm.customerDetail .addressBorder .removeAddress { float:left; } .CustomCrm.customerDetail .addressBorder .actionWrapper .icon { height: 2.5rem; width: 2rem; text-align: center; line-height: 2.5rem; color: var(--crm_color_cGrey); font-size: 1rem; cursor:pointer; -o-transition: color .3s; -ms-transition:color .3s; -moz-transition:color .3s; -webkit-transition:color .3s; transition:color .3s; } .CustomCrm.customerDetail .addressData { margin-bottom:0.5rem; } .CustomCrm.customerDetail .addressBorder > .caption { font-weight:600; margin-bottom:1rem; } .CustomCrm.customerDetail .address .addressType { width: calc(100% + 2rem); margin: 0 0 0.75rem -1rem; } .CustomCrm.customerDetail .dropDownCrm .itemList { width:100%; } .CustomCrm.customerDetail .dropDownCrm .caption, .CustomCrm.customerDetail .dropDownCrm .item { padding-left:3rem; position:relative; } .CustomCrm.customerDetail .dropDownCrm .item .iconWrapper, .CustomCrm.customerDetail .dropDownCrm .iconWrapper.iconType { position:absolute; top:0; left:0; bottom:0; width:3rem; text-align:center; } .CustomCrm.customerDetail .dropDownCrm .item .iconWrapper .icon, .CustomCrm.customerDetail .dropDownCrm .iconWrapper.iconType .icon { font-size:0.5rem; } .CustomCrm.customerDetail .addressButtons { overflow:hidden; } .CustomCrm.customerDetail .addressButtons label { float:left; clear:both; min-height: 1.5rem; padding: 0 0 0 2rem; color: var(--crm_color_cMain); position:relative; } .CustomCrm.customerDetail .addressButtons label span { left: auto; left: 0; top:0; position:absolute; font-size:1.125rem; display:none; } .CustomCrm.customerDetail .addressButtons input:checked + label .checked, .CustomCrm.customerDetail .addressButtons input:not(:checked) + label .unchecked { display:block; } .CustomCrm.customerDetail .newAddress { cursor:pointer; font-size:5rem; text-align:center; color:var(--crm_color_cMain); height:14rem; -o-transition: color .3s; -ms-transition:color .3s; -moz-transition:color .3s; -webkit-transition:color .3s; transition:color .3s; } .CustomCrm.customerDetail .newAddress .icon { display:inline-block; vertical-align:middle; } .CustomCrm.customerDetail .history { width: 50%; float: left; padding: 0 1rem; box-sizing: border-box; margin-bottom: 3rem; } @media screen and (max-width:768px) { .CustomCrm.customerDetail .history { width: 100%; } } .CustomCrm.customerDetail .history .CTANoData { height:18rem; } .CustomCrm.customerDetail .history .activity{ margin-left:0.25rem; margin-bottom:0.25rem; } .CustomCrm.customerDetail .historyWrapper{ margin-bottom:0.5rem; } .CustomCrm.customerDetail .historyWrapper:not(.empty) { margin-bottom:1.5rem; height:18rem; overflow-x: auto; } .CustomCrm.customerDetail .entry{ margin-bottom:1em; } .CustomCrm.customerDetail .entry .type, .CustomCrm.customerDetail .entry .date{ display:inline-block; color:var(--color_cIconAction); margin-right:0.25rem; } .CustomCrm.customerDetail .entry .type { text-decoration: underline; } .CustomCrm.customerDetail .entry .type .wrapper { color:var(--color_cText); } .CustomCrm.customerDetail .activities { box-sizing:border-box; padding-left:0.75rem; } .CustomCrm.customerDetail .activities .caption{ float: left; line-height: 2.5rem; margin-right: 1rem; } @media screen and (max-width:544px) { .CustomCrm.customerDetail .activities { overflow-x: scroll; overflow-y: hidden; white-space: nowrap; } .CustomCrm.customerDetail .activity { display: inline-block; } } .CustomCrm.customerDetail .notes { width: 50%; float: left; padding: 0 1rem; box-sizing: border-box; margin-bottom: 3rem; overflow:hidden; } @media screen and (max-width:768px) { .CustomCrm.customerDetail .notes { width: 100%; } } .CustomCrm.customerDetail .notes .notesWrapper { margin-bottom:0.5rem; } .CustomCrm.customerDetail .notes textarea { width: 100%; display:block; height: 18rem; box-sizing: border-box; padding: 0.5rem 0.75rem; background-color: transparent; border: none; resize: vertical; } .CustomCrm.customerDetail .notes textarea:not([disabled]) { background-color:var(--color_cWhite); } .CustomCrm.customerDetail .notes .CTANoData, .CustomCrm.customerDetail .notes:not(.unlocked).empty textarea { display:none; } .CustomCrm.customerDetail .notes:not(.unlocked).empty .CTANoData { display:block; height:18rem; } .CustomCrm.customerDetail .notes:not(.unlocked) .unlocked, .CustomCrm.customerDetail .notes.unlocked .locked { display: none; } .CustomCrm.customerDetail .notes button { float:right; position:relative; } .CustomCrm.customerDetail .notes button span { line-height: 1em; } .CustomCrm.customerDetail .notes.unlocked button { margin-left:2rem; } .CustomCrm.customerDetail .notes.unlocked button::before { content: "\f0a4"; line-height: 2.5rem; font-size: 1.25rem; color: var(--crm_color_cMain); font-family: "Font Awesome 5 Pro"; font-weight: 900; position: absolute; left: -2rem; top: 0; } .CustomCrm.customerDetail .analyse { clear:both; padding: 0; margin-bottom:2rem; } .CustomCrm.customerDetail .analyseContentWrapper { width:100%; overflow-x:auto; } .CustomCrm.customerDetail .analyseContentWrapper > * { padding:0 1rem; } .CustomCrm.customerDetail .analyse .summary { margin-bottom:1.5rem; } .CustomCrm.customerDetail .analyse .caption { font-weight: 600; margin-bottom:1rem; } .CustomCrm.customerDetail .analyse .tr { width: 100%; overflow: hidden; border-bottom: 1px solid var(--crm_color_cGreyLight); } .CustomCrm.customerDetail .analyse .td { width: 25%; float: left; padding: 0.5rem 0.5rem; box-sizing: border-box; } .CustomCrm.customerDetail .top_products .tr:first-child { border-top: 1px solid var(--crm_color_cGreyLight); } .CustomCrm.customerDetail .analyse:not(.showAll) .top_products .tr:nth-child(n+6) { display:none; } .CustomCrm.customerDetail .analyse .actions { text-align:center; } .CustomCrm.customerDetail .analyse .action { color:var(--crm_color_cMain); display:inline-block; padding:1rem 0; cursor:pointer; } .CustomCrm.customerDetail .analyse:not(.showAll) .action.showLess, .CustomCrm.customerDetail .analyse.showAll .action.showMore { display:none; } @media screen and (max-width:672px) { .CustomCrm.customerDetail .analyseContentWrapper > * { width:42rem; } } @media screen and (max-width:608px) { .CustomCrm.customerDetail .analyse .td { padding:0.25rem 0.25rem; } } .CustomCrm.customerDetail .analyse + .orderAction { float:right; margin-right:1rem; } .CustomCrm.customerDetail .lastOrders { padding: 0 1rem; } .CustomCrm.customerDetail .lastOrders .CustomShopOrder { width:100%; margin: 0; padding: 0; } .CustomCrm.customerDetail .lastOrders .return { display: none; } .CustomCrm.customerDetail .orderTable.empty { display: none; } .CustomCrm .customerNavigation { display: flex; margin-bottom: 2rem; padding: 0 1rem; } .CustomCrm .customerNavigation li { flex-grow: 1; } .CustomCrm .customerNavigation li.previous { margin-right: 0.5rem; } .CustomCrm .customerNavigation li.overview { text-align: center; margin-left: 0.5rem; margin-right: 0.5rem; } .CustomCrm .customerNavigation li.next { text-align: right; margin-left: 0.5rem; } .CustomCrm .customerNavigation a { color:var(--crm_color_cMain); } @media screen and (max-width:450px) { .CustomCrm .customerNavigation { flex-wrap: nowrap; } } .dropDownCrm { position:relative; margin-right:0.5rem; display: inline-block; } .dropDownCrm .caption { position: relative; background-color:var(--color_cWhite); font-size: 12px; padding: 0.25rem 2rem 0.25rem 0.625rem; border:none; border-radius:3px; height: 2.5rem; box-sizing: border-box; -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; } .dropDownCrm:not(.disabled) .caption { cursor:pointer; } .dropDownCrm .caption .captionTitle { white-space: nowrap; width: 100%; overflow: hidden; text-overflow: ellipsis; } .dropDownCrm .caption .surtitle { font-size:0.625rem; color:var(--color_cIconAction); line-height:0.875rem; } .dropDownCrm .caption .iconWrapper.chevron { color:var(--color_cIconAction); position: absolute; right:0; top:0; text-align:center; height:100%; width:2rem; font-size:1rem; } .dropDownCrm .caption .icon { display:inline-block; vertical-align:middle; -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; } .dropDownCrm.open .caption { background-color:var(--crm_color_bcDropDown); } .dropDownCrm.open .caption .iconWrapper.chevron .icon { color:var(--color_cText); } .dropDownCrm .itemList { height: 0; overflow: hidden; position:absolute; z-index: 900; background-color: var(--crm_color_bcDropDown); margin-top:0.5rem; border-radius:3px; -webkit-box-shadow: 0 0.375 0.5rem 0px rgba(0, 0, 0, 2.5); -moz-box-shadow: 0 0.375rem 0.5rem 0px rgba(0, 0, 0, 2.5); box-shadow: 0 0.375rem 0.5rem 0px rgba(0, 0, 0, .25); } .dropDownCrm .itemList li.selected { background-color:var(--color_cWhite); } .dropDownCrm .itemList .item { display: block; padding: 0.375rem 0.625rem; cursor: pointer; font-size:0.75rem; -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; } .dropDownCrm .itemList .item.hidden { display: none; visibility: hidden; } .ui-datepicker.crmDatepicker{ padding: 0.625rem; border-radius:3px; -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; -webkit-box-shadow: 0 0.375 0.5rem 0px rgba(0, 0, 0, 2.5); -moz-box-shadow: 0 0.375rem 0.5rem 0px rgba(0, 0, 0, 2.5); box-shadow: 0 0.375rem 0.5rem 0px rgba(0, 0, 0, .25); min-width: 15.625rem; margin-left:-0.625rem; margin-top:0.75rem; border:none; } .ui-datepicker.crmDatepicker, .crmDatepicker .ui-widget-header { background: var(--crm_color_bcDropDown); color: var(--color_cBlack) } .crmDatepicker .ui-datepicker-title, .crmDatepicker.ui-datepicker th { font-weight: 600; font-weight:normal; } .crmDatepicker .ui-datepicker-calendar a { -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; transition:.3s; } .crmDatepicker .ui-datepicker-calendar a.ui-state-hover { background-color:var(--color_cWhite); } .ui-datepicker.crmDatepicker thead{ color: var(--color_cIconAction); } .ui-datepicker.crmDatepicker table{ font-size: 0.625rem; font-weight:600; } .ui-datepicker.crmDatepicker th { padding: 0.5rem; font-size: 10px; } .ui-datepicker.crmDatepicker .ui-datepicker-title{ font-size: 13px; } .ui-datepicker.crmDatepicker td span, .ui-datepicker td a { text-align: center; } .crmDatepicker .ui-datepicker-calendar .ui-state-default { background-color: var(--crm_color_bcDropDown) !important; color:var(--color_cText); border: none; padding: 0.5rem 10px; } .crmDatepicker .ui-datepicker-calendar .ui-state-highlight, .crmDatepicker .ui-datepicker-calendar .ui-state-hover, .crmDatepicker .ui-datepicker-calendar .ui-state-active{ background-color: var(--color_cWhite) !important; } .jconfirm-crmdialog .jconfirm-bg { background-color: rgba(0,0,0,0.35); } .jconfirm-crmdialog .jconfirm-box-container { padding: 3rem; } .jconfirm-crmdialog .jconfirm-box { max-width:58rem; border-radius:0; background-color:var(--color_bcFond); padding: 2rem 2.5rem; box-sizing: border-box; } .jconfirm-crmdialog .jconfirm-box div.jconfirm-title-c .jconfirm-title { color:var(--color_cTextAmount); font-size:1rem; font-weight:600; } .jconfirm-crmdialog .jconfirm-box .jconfirm-buttons > button { float:right; margin: 0 0 0 1rem; } @media screen and (max-width:960px) { .jconfirm-crmdialog .jconfirm-box-container { padding: 1rem; } } @media screen and (max-width:544px) { .jconfirm-crmdialog .jconfirm-box { padding:1rem; } } .jconfirm-crmdialog .BasicForm.multiStep { margin:0; padding:0; width:100%; } .jconfirm-crmdialog .BasicForm.multiStep form > .container { display:block; } .jconfirm-crmdialog .BasicForm.multiStep span.required { margin-left:-1rem; } .jconfirm-crmdialog .intro { margin-bottom: 1.5rem; } .jconfirm-activity textarea { box-sizing:border-box; width:100%; height:16rem; resize: vertical; } .volumeOfSales.Yago { display:none; } .CustomCrm.wait::before { z-index: 1000; position: fixed; top: 0; right: 0; left: 0; bottom: 0; content: ""; background-color: rgba(255,255,255,0.75); } .CustomCrm.wait::after { z-index: 1001; position: fixed; top: 50%; left: 50%; margin-top: -1.25rem; margin-left: -1.25rem; content: ""; color: var(--crm_color_cMain); animation: spin-anticlockwise 2s infinite linear; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cg transform='matrix(0.95238095,0,0,0.95238095,0,-962.24984)'%3E%3Cpath d='m 36.147008,1051.331 c -6.6e-4,0.013 -10e-4,0.034 -10e-4,0.047 0,0.5431 0.44076,0.9841 0.983809,0.9844 l 3.885784,0 c 0.5434,0 0.984399,-0.441 0.984399,-0.9844 l 0,-16.4349 c 0,-0.5434 -0.440999,-0.9844 -0.984399,-0.9844 l -16.424216,0 c -0.543369,0 -0.984369,0.441 -0.984369,0.9844 l 0,3.889 0,0 c 0,0.5434 0.441,0.9844 0.984369,0.9844 0.0129,0 0.0338,-5e-4 0.0467,-10e-4 l 8.322868,-0.3986 c -2.367287,3.5211 -7.732229,6.3789 -11.975213,6.3789 -6.274011,0 -12.558872,-4.9503 -14.0286199,-11.0498 -0.0982,-0.4188 -0.5270293,-0.7591 -0.9572887,-0.7596 l -4.0236142,0 c -0.5433692,0 -0.98436862,0.441 -0.98436862,0.9844 0,0.05 0.007,0.1298 0.0164,0.1788 1.7735174,9.4254 10.0438854,16.5555 19.9778414,16.5555 l 0.0233,0 c 5.184613,0 12.113273,-3.2097 15.465798,-7.1646 z M 20.98603,1016.9247 c 6.275141,0 12.562562,4.9517 14.02977,11.0529 0.0982,0.4188 0.527029,0.7591 0.957289,0.7596 l 4.023614,0 c 0.543369,0 0.984368,-0.441 0.984368,-0.9844 0,-0.05 -0.007,-0.1298 -0.0164,-0.1788 -1.773517,-9.4254 -10.043795,-16.5555 -19.978661,-16.5555 l -0.0192,0 c -5.178523,0 -12.1020327,3.2034 -15.4543179,7.1506 l 0.3403795,-6.7733 c 7.2e-4,-0.014 10e-4,-0.036 10e-4,-0.049 0,-0.5434 -0.4409993,-0.9844 -0.9843686,-0.9844 l -0.001,0 -3.88413441,0 C 0.44099937,1010.3622 0,1010.8032 0,1011.3466 l 0,16.4333 c 0,0.5434 0.44099937,0.9844 0.98436859,0.9844 l 16.42261641,0 c 0.543369,0 0.984369,-0.441 0.984369,-0.9844 l 0,-3.8883 0,0 c 0,-0.5434 -0.441,-0.9844 -0.984369,-0.9844 -0.0129,0 -0.0339,6e-4 -0.0468,10e-4 l -8.3507679,0.3995 c 2.3624769,-3.5228 7.7224489,-6.382 11.9642329,-6.382 l 0.0123,0 z' style='fill:var(--crm_color_cMain|replace:"#":"%23");fill-opacity:1'/%3E%3C/g%3E%3C/svg%3E%0A"); height: 2.5rem; width: 2.5rem; } @-webkit-keyframes spin-anticlockwise { 0% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes spin-anticlockwise { 0% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } body.crm .navWrapper .selected.descendantSelected { border-bottom-color:transparent !important; } .customerList .actions .icon.b2b_retailshop, .addressType .icon.b2b_retailshop { color: var(--addressType_b2b_retailshop); } .customerList .actions .icon.b2b_warehouse, .addressType .icon.b2b_warehouse { color: var(--addressType_b2b_warehouse); } .customerList .actions .icon.b2b_administration, .addressType .icon.b2b_administration { color: var(--addressType_b2b_administration); } .customerList .actions .icon.company, .addressType .icon.company { color: var(--addressType_company); } .customerList .actions .icon.private, .addressType .icon.private { color: var(--addressType_private); } .customerList .actions .icon.unknown, .addressType .icon.unknown { color: var(--addressType_unknown); } .CTANoData { background-color:var(--crm_color_bcAreaGreyLight); font-size: 1rem; font-weight:600; text-align:center; padding: 4rem 2rem; box-sizing:border-box; } .CTANoData::before { content:""; vertical-align:middle; display:inline-block; height:100%; } .CTANoData .wrapper { display:inline-block; vertical-align:middle; } .CTANoData .icon { color:var(--crm_color_cMain); font-size: 2rem; width:100%; margin-bottom:2rem; } .CustomCrm .user-register-link { text-align: right; margin-bottom: 2rem; padding: 0 3rem; } .jconfirm-crmdialog button, .CustomCrm button { font-size: 0.875rem; height: 2.5rem; text-transform: none; letter-spacing: 0; color:var(--color_cWhite); background-color: var(--crm_color_cMain); border:none; } /************************** Widget ********************************/ .CustomShopMarketingCampaign { margin-top: 2rem; display: grid; grid-template-columns: repeat(4, 1fr); align-content: stretch; gap: 1.5rem; max-width: 58rem; } .CustomShopMarketingCampaign .basketTeaserCard { text-align: left; box-sizing: border-box; align-self: stretch; padding: 0; grid-column: span 2; } .CustomShopMarketingCampaign .basketTeaserCard.cursor { cursor: pointer; } .CustomShopMarketingCampaign .basketTeaserCard .innerWrapper { background-color: var(--color_cWhite); border: solid 0.5px var(--color_cLine); border-radius: 3px; height: 100%; display: flex; } .CustomShopMarketingCampaign .basketTeaserCard a { height: 100%; } .CustomShopMarketingCampaign .basketTeaserCard:last-child:nth-child(2n - 1){ grid-column-end: 4; } .CustomShopMarketingCampaign .basketTeaserCard .imageWrapper { align-self: center; width: 10rem; padding: 2rem 0 1.5rem 0; display: inline-block; box-sizing: border-box; background-color: var(--color_cLine); height: 100%; } .CustomShopMarketingCampaign .basketTeaserCard img { display: inline-block; width: 10rem; max-width: 12.5rem; padding: 0; } .CustomShopMarketingCampaign .basketTeaserCard .textWrapper { display: inline-block; width: 60%; padding: 1.25rem; box-sizing: border-box; vertical-align: top; color: var(--color_cTextPassive); } .CustomShopMarketingCampaign .basketTeaserCard .title{ font-size: 1.0625rem; color: var(--color_cText); padding-bottom: 1rem; margin: 0; } .CustomShopMarketingCampaign .basketTeaserCard .description{ padding-bottom: 1rem; } .CustomShopMarketingCampaign .basketTeaserCard .actionButton { border: solid 0.5px var(--color_cLine); border-radius: 3px; color: var(--color_cTextPassive); padding: 0 1rem 0 1rem; } .CustomShopMarketingCampaign .basketTeaserCard .actionButton .icon { font-size: 1rem; line-height: 1.3em; color: var(--color_cTextPassive); transition: all 0.3s ease 0s; } @media screen and (max-width: 950px) { .CustomShopMarketingCampaign { grid-template-columns: repeat(2, 1fr); } .CustomShopMarketingCampaign .basketTeaserCard:last-child:nth-child(2n - 1){ grid-column-end: initial; } .CustomShopMarketingCampaign .basketTeaserCard img { display: block; width: 100%; max-width: 100% !important; } .CustomShopMarketingCampaign .basketTeaserCard .innerWrapper { height:100%; } .CustomShopMarketingCampaign .basketTeaserCard .textWrapper { display: block; width: 100%; text-align: center; } } @media screen and (max-width: 630px) { .CustomShopMarketingCampaign .basketTeaserCard .textWrapper { padding-left: 0.5rem; padding-right: 0.5rem; } } @media screen and (max-width: 580px) { .CustomShopMarketingCampaign .basketTeaserCard { padding-right: 0; padding-left: 0; } .CustomShopMarketingCampaign { margin-left: 0; margin-right: 0; } } /*************************** SINGLE *******************************/ .CustomMarketingCampaignProperty.single .date{ width: 9.7rem !important; margin-right: 1rem; } .CustomMarketingCampaignProperty.single .time { width: 3rem !important; } .CustomMarketingCampaignProperty.single textarea { padding: 0.5rem !important; } .CustomMarketingCampaignProperty.single #notifyLinkProduct { color: red; } .CustomMarketingCampaignProperty.single input[type="number"] { height: 2rem; font-size: 0.95rem; } .CustomMarketingCampaignProperty.single input#productId{ width: 2.5rem; margin-right: 0.6rem; } .CustomMarketingCampaignProperty.single input#productTitle { width: 23rem; } .CustomMarketingCampaignProperty.single textarea#productCustomerGroups{ width: 27.1rem; height: 6rem; border: 2px dotted var(--color_bcInfoBox); font-size: 0.75rem; color: var(--color_cTextPassive); background-color: white; resize: vertical; } .CustomMarketingCampaignProperty.single .fileUploadSingleGraphic{ width: 28rem; } .CustomMarketingCampaignProperty.single .leftTargetGroupWrapper select{ width: 12rem; } .CustomMarketingCampaignProperty.single input#amount{ width: 27.2rem; } .CustomMarketingCampaignProperty.single .historyWrapper { max-height: 14rem; overflow: scroll; margin-bottom: 2rem; font-size: 0.75rem; float: left; max-width: 38.5%; } .CustomMarketingCampaignProperty.single .historyWrapper .entry { border-bottom: 1px solid gray; padding: 0.5rem; } .CustomMarketingCampaignProperty.single .historyWrapper .headline { font-family: OpenSans-Bold; } .CustomMarketingCampaignProperty.single .productsCheckbox { margin-right: 1rem; float: right; } .CustomMarketingCampaignProperty.single #s2id_country_keys.select2-container-multi a.select2-search-choice-close { height: 0.75rem; } /*************************** NEW *******************************/ .CustomMarketingCampaignProperty.new #replaceSaveButton { position: absolute; right: 8.35rem; box-shadow: none; z-index: 2; } .CustomShopOrder table { width: 100%; } .CustomShopOrder .orderLine > .col.date { text-align:left; } .CustomShopOrder .orderLine > .col.totalPrice, .CustomShopOrder .orderLine > .col.orderId { text-align: right; } .CustomShopOrder .orderLine > .col.shipping_state, .CustomShopOrder .orderLine > .col.payment, .CustomShopOrder .orderLine > .col.payment_state { text-align: center; } .CustomShopOrder .orderLine .col.openIcon { width:2rem; text-align:center; padding:0.75rem 0 0; } .CustomShopOrder .hidden { height: 0; } .CustomShopOrder .animate { overflow: hidden; } .CustomShopOrder .orderTable .icon.minus { display:none; } .CustomShopOrder .orderTable .open .icon.plus { display:none; } .CustomShopOrder .orderTable .open .icon.minus { display:inline-block; } .CustomShopOrder .orderTable { border-bottom-width: 1px; } .CustomShopOrder .click { border-top-width: 1px; } .CustomShopOrder .orderSummary { display:none; padding: 0.5rem 0; } .CustomShopOrder .legend > .col, .CustomShopOrder .subtotal .position td, .CustomShopOrder .amountPayable .position td { padding:0.25rem 0; box-sizing:border-box; } .CustomShopOrder .orderSummary .caption { float:left; width:8rem; } .CustomShopOrder .subtotal, .CustomShopOrder .amountPayable { border-top-width: 1px; } .CustomShopOrder .amountPayable { border-bottom-width: 1px; } .CustomShopOrder .subtotal .value, .CustomShopOrder .amountPayable .value { text-align:right; } .CustomShopOrder .note { padding-top:1rem; } .CustomShopOrder .invoicePositions { margin-bottom:2rem; } .CustomShopOrder .invoiceInfos { margin-bottom:1rem; } .CustomShopOrder .CustomUserProfileAddressJs { width: 100%; padding: 0; } .CustomShopOrder .CustomUserProfileAddressJs .wrapperAddress { max-height:16.5rem; margin: 0 0.5rem 1rem; max-width:none; } .CustomShopOrder .addressEntry.files .wrapperAddress div { overflow: hidden; } .CustomShopOrder .loadMore { text-align:center; } @media screen and (max-width: 1024px) { .CustomShopOrder .orderSummary { display:block; } .CustomShopOrder .orderSummary .caption { width:6rem; } } @media screen and (max-width: 928px) { .CustomShopOrder .orderLine > .col.payment, .CustomShopOrder .orderLine > .col.payment_state, .CustomShopOrder .orderLine > .col.orderId { display:none; } .CustomShopOrder .orderSummary { display:block; } } .CustomShopOrder .shipping_state [class*="ss-"] { font-size: 1.5rem; line-height: 2.25rem; } .CustomShopOrder .productTable .col:not(:last-child) { padding-right: 0.5rem; box-sizing: border-box; } .CustomShopOrder .productTable .teaser.col { text-align:left; width:50% } .CustomShopOrder .productTable .humanReadableId.col { width:17.743%; text-align:left; } .CustomShopOrder .productTable .unitPrice.col { width:12.096%; text-align:center; } .CustomShopOrder .productTable .quantity.col { width:10.484%; text-align:center; } .CustomShopOrder .productTable .totalPrice.col { width:9.677%; text-align:right; } .CustomShopOrder .productTable .productGraphic { float:left; width:8rem; } .CustomShopOrder .productTable .productGraphic img { overflow: hidden; } .CustomShopOrder .productTable .productTitle, .CustomShopOrder .productTable .setPart .teaser, .CustomShopOrder .productTable .personInfos.col, .CustomShopOrder .productTable .periodOfPerformance.col { padding-left: 8rem; } .CustomShopOrder .productTable .setPart { font-size: 0.75rem; } .CustomShopOrder .productTable .setPart .teaser { padding-left: 1rem; } .CustomShopOrder .productTable .mobileMetaInfos{ display: none; width: 100%; } .CustomShopOrder .productTable .mobileMetaInfos .humanReadableId, .CustomShopOrder .productTable .mobileMetaInfos .quantity, .CustomShopOrder .productTable .mobileMetaInfos .unitPrice { float: none; width: 50%; text-align: left; padding: 0; margin: 0 } .CustomShopOrder .productTable .mobileMetaInfos .quantity{ float: left; } .CustomShopOrder .productTable .mobileMetaInfos .totalPrice{ float: right; width: 50%; text-align:right; } .CustomShopOrder .productTable .orderPosition > .col, .CustomShopOrder .productTable .setPart > .col, .CustomShopOrder .productTable .personInfos.col, .CustomShopOrder .productTable .periodOfPerformance.col { padding-top:0.5rem; } .CustomShopOrder .productTable .legend, .CustomShopOrder .productTable .orderPosition { border-top-width: 1px; } @media screen and (max-width: 1024px) { .CustomShopOrder .productTable .humanReadableId.col, .CustomShopOrder .productTable .unitPrice.col, .CustomShopOrder .productTable .quantity.col, .CustomShopOrder .productTable .totalPrice.col { display:none; } .CustomShopOrder .productTable .mobileMetaInfos.totalPrice.col { display: inherit; float: right; width: 10% !important; } .CustomShopOrder .productTable .mobileMetaInfos { display:block; } .CustomShopOrder .productTable .setPart .teaser, .CustomShopOrder .productTable .personInfos.col, .CustomShopOrder .productTable .periodOfPerformance.col { padding-left:0.5rem; } .CustomShopOrder .productTable .productGraphic { width:6rem; } .CustomShopOrder .productTable .productTitle { padding-left: 6rem; } } .CustomShopOrder.returnRequest { width: 58rem; margin: 40px auto; overflow: hidden; max-width: 100%; padding: 0 1rem; box-sizing: border-box; } .CustomShopOrder.returnRequest h1 { font-size: 1.75rem; } .CustomShopOrder.returnRequest .intro { padding: 1rem 0 2rem; } .CustomShopOrder.returnRequest > table { width:100%; } .CustomShopOrder.returnRequest td { vertical-align:top; padding: 1rem 0.5rem; } .CustomShopOrder.returnRequest .legend td { font-size:0.75rem; } .CustomShopOrder.returnRequest .Entry { border-top-width: 1px; overflow:hidden; } .CustomShopOrder.returnRequest .Entry.empty { padding-top: 2rem; margin-bottom: 2rem; } @media screen and (max-width: 736px) { .CustomShopOrder.returnRequest td { padding: 0.5rem 0; } .CustomShopOrder.returnRequest table, .CustomShopOrder.returnRequest table tbody, .CustomShopOrder.returnRequest .Entry, .CustomShopOrder.returnRequest .Entry > td { display: block; } .CustomShopOrder.returnRequest .Entry.legend > td.actions, .CustomShopOrder.returnRequest .Entry.legend > td.amount, .CustomShopOrder.returnRequest .Entry.legend > td.sum_price, .CustomShopOrder.returnRequest .Entry > td.product_key, .CustomShopOrder.returnRequest .Entry > td.single_price { display:none; } } .CustomShopOrder.returnRequest .single_price, .CustomShopOrder.returnRequest .amount, .CustomShopOrder.returnRequest .sum_price { text-align:right; } .CustomShopOrder.returnRequest .legend .amount { text-align: center; } .CustomShopOrder.returnRequest .product_key_mobile { display: none; } @media screen and (max-width: 800px) { .CustomShopOrder.returnRequest .product_key_mobile { display: block; } .CustomShopOrder.returnRequest .product_key { display: none; } } .CustomShopOrder.returnRequest .Entry:not(.legend) .amount { padding-top: 0.5rem; } .CustomShopOrder.returnRequest input[type="text"] { width: 3.375rem; height: 2.25rem; box-sizing: border-box; text-align:center; } .CustomShopOrder.returnRequest .single_price_mobile { display: none; } .CustomShopOrder.returnRequest .Entry td.actionsWrapper { width:6.5rem; padding-top:0.5625rem; } @media screen and (max-width: 736px) { .CustomShopOrder.returnRequest .single_price_mobile { display: block; } .CustomShopOrder.returnRequest .Entry .actionsWrapper, .CustomShopOrder.returnRequest .Entry .amount { float:left; } .CustomShopOrder.returnRequest .Entry .sum_price { float:right; padding-top:1rem; } .CustomShopOrder.returnRequest .Entry td.actionsWrapper { width:7rem; } } .CustomShopOrder.returnRequest .ProductTeaser a { display:block; } .CustomShopOrder.returnRequest .productGraphic, .CustomShopOrder.returnRequest .BasketSingleTeaser > .graphic { float:left; box-sizing:border-box; margin: 0; } .CustomShopOrder.returnRequest .BasketSingleTeaser>.graphic { width: 8rem; } .CustomShopOrder.returnRequest .productGraphic{ width: 9rem; } .CustomShopOrder.returnRequest .BasketSingleTeaser > .graphic { margin-right: 1rem; } .CustomShopOrder.returnRequest .BasketSingleTeaser > .graphic .graphic { float: none; } .CustomShopOrder.returnRequest .graphicWrapper img { max-height: none; } .CustomShopOrder.returnRequest .ProductTeaser .text { box-sizing:border-box; padding:0 0 0 9rem; float:none; width:auto; } .CustomShopOrder.returnRequest .BasketSingleTeaser .text .BasicText { float:none; } @media screen and (max-width: 736px) { .CustomShopOrder.returnRequest .ProductTeaser .text { padding:0 0 0 7rem; } .CustomShopOrder.returnRequest .CustomProduct.BasketSingleTeaser .BasketSingleTeaser > .graphic { width: 6rem; margin-right: 0.5rem; } .CustomShopOrder.returnRequest .legend .productGraphic { margin-right: 0; width:7.5rem; } } @media screen and (max-width: 560px) { .CustomShopBasket .legend .productGraphic { width: 6rem; } } .CustomShopOrder.returnRequest .setParts { overflow: hidden; float: none; max-width: 100%; padding-top: 0.5rem; } .CustomShopOrder.returnRequest .setPart .text { padding: 0.5rem 0 0 1rem; margin: 0; width: 100%; box-sizing: border-box; } @media screen and (max-width: 960px) { .CustomShopOrder.returnRequest .setPart .text { padding: 0 0 0.5rem; } } .CustomShopOrder.returnRequest .OrderSummary { border-top-width: 1px; padding: 1rem 0; } .CustomShopOrder.returnRequest .reasons > .caption { padding: 0.5rem 0; /*font-family: "Open Sans Bold";*/ } .CustomShopOrder.returnRequest .reasonsWrapper { -webkit-column-count: 2; /* Chrome, Safari, Opera */ -moz-column-count: 2; /* Firefox */ column-count: 2; } @media screen and (max-width: 768px) { .CustomShopOrder.returnRequest .reasonsWrapper { -webkit-column-count: 1; /* Chrome, Safari, Opera */ -moz-column-count: 1; /* Firefox */ column-count: 1; } } .CustomShopOrder.returnRequest .BasicForm .reason_retoure > .required { display:none; } .CustomShopOrder.returnRequest .BasicForm .wrapper, .CustomShopOrder.returnRequest .BasicForm h1, .CustomShopOrder.returnRequest .BasicForm h2 { padding:0; } .CustomShopOrder.returnRequest .BasicForm h1, .CustomShopOrder.returnRequest .BasicForm h2 { font-size: 1rem; /*font-family: Open Sans Semibold;*/ } .CustomShopOrder.returnRequest .BasicForm .mandatory_field_desciption { clear:both; } .CustomShopOrder.returnRequest .reasons label { display:block; } .CustomShopOrder.returnRequest .reasons input[type=radio] { margin-right: 1rem; } .CustomShopOrder.returnRequest .reasons .returnReasonOwnWrapper { padding-top: 1rem; padding-left: 29px; } .CustomShopOrder.returnRequest .reasons textarea { width: 100%; height: 7.5em; box-sizing: border-box; } .CustomShopOrder.returnRequest .reasons .textarea label { margin-bottom:0.5rem; } @media screen and (max-width: 414px) { .CustomShopOrder.returnRequest .reasons textarea { height: 10em; } } .CustomShopOrder.returnRequest .orderActions { margin-top: 1rem; overflow: hidden; } .CustomShopOrder.returnRequest .orderActions .action{ float:right; margin-left:1rem; } @media screen and (max-width: 414px) { .CustomShopOrder.returnRequest .orderActions { margin-bottom: 7.75rem; } } .CustomShopOrder.returnRequest .submitted.message { padding: 2rem 0; } .CustomShopOrder.returnRequest .cancelled.message { padding: 2rem 0; } .checkoutWait { position: relative; } .checkoutWait:before { content: ''; zoom: 1; /* Increase this for a bigger symbole*/ display: block; width: 16px; height: 16px; position: absolute; left: calc(50% - 8px); bottom: calc(50% - 8px); z-index: 2; animation: wait .80s steps(1, start) infinite; background: linear-gradient(0deg, #f4f5fa 1px, transparent 0, transparent 8px, #f4f5fa 8px), /* 6 */ linear-gradient(90deg, #f4f5fa 1px, #f6f9fb 0, #f6f9fb 3px, #f4f5fa 3px), linear-gradient(0deg, #ececf5 1px, transparent 0, transparent 8px, #ececf5 8px), /* 5 */ linear-gradient(90deg, #ececf5 1px, #f2f3f9 0, #f2f3f9 3px, #ececf5 3px), linear-gradient(0deg, #e7eaf4 1px, transparent 0, transparent 8px, #e7eaf4 8px), /* 4 */ linear-gradient(90deg, #e7eaf4 1px, #eef1f8 0, #eef1f8 3px, #e7eaf4 3px), linear-gradient(0deg, #b9bedd 1px, transparent 0, transparent 10px, #b9bedd 10px), /* 3 */ linear-gradient(90deg, #b9bedd 1px, #d0d5e8 0, #d0d5e8 3px, #b9bedd 3px), linear-gradient(0deg, #9fa6d2 1px, transparent 0, transparent 15px, #9fa6d2 15px), /* 2 */ linear-gradient(90deg, #9fa6d2 1px, #c0c5e1 0, #c0c5e1 3px, #9fa6d2 3px), linear-gradient(0deg, #8490c6 1px, transparent 0, transparent 15px, #8490c6 15px), /* 1 */ linear-gradient(90deg, #8490c6 1px, #aeb5da 0, #aeb5da 3px, #8490c6 3px); background-repeat: no-repeat; background-size: 4px 9px, /* 6 */ 4px 9px, 4px 9px, /* 5 */ 4px 9px, 4px 9px, /* 4 */ 4px 9px, 4px 11px, /* 3 */ 4px 11px, 4px 16px, /* 2 */ 4px 16px, 4px 16px, /* 1 */ 4px 16px; background-position: -4px 3px, -4px 3px, -4px 3px, -4px 3px, -4px 3px, -4px 3px, -4px 2px, -4px 2px, -4px 0, -4px 0, -4px 0, -4px 0; } /* Transparent Overlay */ .checkoutWait:after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.75); z-index: 1; } @keyframes wait { 12.5%{ background-position: -4px, /* 6 */ -4px, -4px, /* 5 */ -4px, -4px, /* 4 */ -4px, -4px, /* 3 */ -4px, -4px, /* 2 */ -4px, 0, /* 1 */ 0; } 25%{ background-position: -4px, /* 6 */ -4px, -4px, /* 5 */ -4px, -4px, /* 4 */ -4px, -4px, /* 3 */ -4px, 0, /* 2 */ 0, 6px, /* 1 */ 6px; } 7.5%{ background-position: -4px, /* 6 */ -4px, -4px, /* 5 */ -4px, -4px, /* 4 */ -4px, 0, /* 3 */ 0, 6px, /* 2 */ 6px, 12px, /* 1 */ 12px; } 50%{ background-position: -4px, /* 6 */ -4px, -4px, /* 5 */ -4px, 0, /* 4 */ 0, 6px, /* 3 */ 6px, 12px, /* 2 */ 12px, -4px, /* 1 */ -4px; } 62.5%{ background-position: -4px, /* 6 */ -4px, 0, /* 5 */ 0, 6px, /* 4 */ 6px, 12px, /* 3 */ 12px, -4px, /* 2 */ -4px, -4px, /* 1 */ -4px; } 75%{ background-position: 0, /* 6 */ 0, 6px, /* 5 */ 6px, 12px, /* 4 */ 12px, -4px, /* 3 */ -4px, -4px, /* 2 */ -4px, -4px, /* 1 */ -4px; } 87.5%{ background-position: 6px, /* 6 */ 6px, 12px, /* 5 */ 12px, -4px, /* 4 */ -4px, -4px, /* 3 */ -4px, -4px, /* 2 */ -4px, -4px, /* 1 */ -4px; } 100%{ background-position: 12px, /* 6 */ 12px, -4px, /* 5 */ -4px, -4px, /* 4 */ -4px, -4px, /* 3 */ -4px, -4px, /* 2 */ -4px, -4px, /* 1 */ -4px; } } .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout h1 { display:none; } .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout .BasketList { display:block; } .CustomShopAgentPreOrderEdit .CustomShopBasket.Basket .packaging label { cursor:inherit; } .CustomShopAgentPreOrderEdit .CustomShopBasket.Basket .checkoutButtons { display:none; } .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout, .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout .info { margin:0; } .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout .mobileMetaInfos { display:block; } .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout td.availability, .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout td.single_price, .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout td.amount, .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout td.sum_price { display:none; } .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout .type_simple .subtitle, .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout .type_set .subtitle { display:none; } .CustomShopAgentPreOrderEdit .content.productBlock{ border-bottom-width: 1px; } .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout .desiredPriceLabel{ display: inline; } .CustomShopAgentPreOrderEdit .CustomShopBasket.Checkout #desiredPrice{ float: right; } .CustomShopAgentPreOrderEditBasket .blockTitle h2{ display: inline-block; } .CustomShopAgentPreOrderEditBasket .blockTitle #basketOfOtherUserNote{ display: inline-block; margin-left: 0.3rem; color: var(--color_cError); } .CustomShopAgentPreOrderEdit .CustomShopAgentPreOrderEditBasket input:not([name=productIdinBasketCheckout]){ display: block; width: 3rem; border-radius: 4px; margin-top: 0.2rem; border: 1px solid var(--color_cLine); -webkit-appearance: none; margin: 0; -moz-appearance: textfield; text-align: center; padding: 0.2rem; line-height: 1.5rem; } .CustomShopAgentPreOrderEditBasket .productSelectWrapper{ display: inline-block; width: calc(100% - 11rem); padding-right: 0.75rem; } .CustomShopAgentPreOrderEditBasket .productSelectWrapper label{ float: left; width: 8rem; } .CustomShopAgentPreOrderEditBasket .productSelectWrapper .select2-container{ width: calc(100% - 8rem); } .CustomShopAgentPreOrderEditBasket .amountWrapper, .CustomShopAgentPreOrderEditBasket .amountInputWrapper{ display: inline-block; margin-right: 0.5rem; margin-bottom: 0.75rem; } .CustomShopAgentPreOrderEditBasket .buttonWrapper, .CustomShopAgentPreOrderEditBasket .deleteFromBasket { display: inline-block; } .CustomShopAgentPreOrderEditBasket .deleteFromBasket .deleteFromBasketButton{ border: 1px solid var(--color_cLine); border-radius: 4px; cursor: pointer; } .CustomShopAgentPreOrderEditBasket .SetArticle.BasketSingleTeaser > .wrapper, .CustomShopAgentPreOrderEditBasket .CustomShopBasket.Basket .productGraphic{ float:left; } .CustomShopAgentPreOrderEdiBasket .SetArticle.BasketSingleTeaser .product_key_mobile{ display: block !important; } .CustomShopAgentPreOrderEditBasket .smallButton{ padding: 4px !important; } .CustomShopAgentPreOrderEditBasket .fileUploadBlock { border-bottom-width: 1px; } .CustomShopAgentPreOrderEditBasket .fileUploadBlock label[for=uploadNoMerge]{ display: inline-block; margin: 0 0 0 0.3rem; vertical-align: middle; } .CustomShopAgentPreOrderEditBasket .fileUploadBlock #uploadNoMerge { width: 1rem; display: inline-block; vertical-align: middle; } .CustomShopAgentPreOrderEditBasket .fileUploadBlock .noMergeWrapper { float: right; } @media screen and (max-width: 1000px) { .CustomShopAgentPreOrderEditBasket .productSelectWrapper{ width: calc(100% - 5rem); } } @media screen and (max-width: 768px) { .CustomShopAgentPreOrderEditBasket .productSelectWrapper { width: calc(100% - 11rem); } } @media screen and (max-width: 736px) { .CustomShopAgentPreOrderEdit .BasketSingleTeaser > .text { padding-bottom: 0rem !important; } } @media screen and (max-width: 544px) { .CustomShopAgentPreOrderEditBasket .productSelectWrapper { width: calc(100% - 5rem); margin-bottom: 0.75rem; } .CustomShopAgentPreOrderEditBasket .productSelectWrapper .select2-container{ width: 100%; } .CustomShopAgentPreOrderEditBasket .amountInputWrapper{ margin-right: 0; } } .CustomShopAgentPreOrderEditInfo .checks input[disabled] + label, .CustomShopAgentPreOrderEditInfo .checks input[disabled] + label + .validationMessage { display:none; } .CustomShopAgentPreOrderEditInfo .submitMessage.error { text-align:center; padding-top:1rem; color:var(--color_cRed); } .CustomShopAgentPreOrderEdit .select2 { width: 100% !important; } .CustomShopAgentPreOrderEdit { margin: 0; position: relative; } .CustomShopAgentPreOrderEdit .pageTitleWrapper{ margin-bottom: 1rem; text-align: center; display: inline-block; } .CustomShopAgentPreOrderEdit .pageTitleWrapper .checkoutPageTitle{ display: inline-block; margin-left: 7rem; vertical-align: middle; } .CustomShopAgentPreOrderEdit .columnWrapper { position: relative; overflow: hidden; } .CustomShopAgentPreOrderEdit .leftColumn, .CustomShopAgentPreOrderEdit .rightColumn { display: block; width: 50%; box-sizing: border-box; padding: 0 1rem; } .CustomShopAgentPreOrderEdit .leftColumn { float:left; padding-right: 1rem; opacity: 1 !important; /*this value is set due to a bug with the nimbus screenshot tool in firefox*/ } .CustomShopAgentPreOrderEdit .rightColumn { float: right; } @media screen and (max-width:768px) { .CustomShopAgentPreOrderEdit .leftColumn { margin-bottom:0; } } .CustomShopAgentPreOrderEdit .blockWrapper label { margin-bottom: 0.5rem; display: block; } .CustomShopAgentPreOrderEdit .blockWrapper .content { position: relative; overflow: hidden; padding: 0.5rem; } .CustomShopAgentPreOrderEdit .checkoutButtons { padding: 2rem 0 1rem; } .CustomShopAgentPreOrderEdit .checkoutButtons #agentPreOrderEdit_submit{ float: right; margin-right: 1rem; } .CustomShopAgentPreOrderEdit .select2-drop{ max-width: 26rem; } .CustomShopAgentPreOrderEdit .validationMessageSingleStep{ color: var(--color_cError); padding: 0 0.5rem; font-size: 0.75rem; display: block; height: 1rem; line-height: 1rem; } .CustomShopAgentPreOrderEdit #AgentPreOrderEditGoToPreselection, .CustomShopAgentPreOrderEdit #AgentPreOrderEditGoToPreselectionUp{ margin: 1rem; } @media screen and (max-width: 768px) { .CustomShopAgentPreOrderEdit .leftColumn, .CustomShopAgentPreOrderEdit .rightColumn{ display: block; max-width: 100%; width: 100%; position: relative; float: left; } } .CustomShopOrder { margin: 0 auto; } .CustomShopOrder .click { cursor: pointer; } .CustomShopPayment.message { margin: 1rem 2rem 2.75rem; } .CustomShopPayment.message .defaultButton { margin: 0.5rem 0.25rem; } .CustomShopPayment iframe { width:100%; height:608px } #paypalexpress_confirm { float:right; } .CustomPosRecord.begin .cashCount .sectionTitle { overflow:hidden; margin-bottom:2rem; } .CustomPosRecord.begin .cashCount h2 { float:left; } .CustomPosRecord.begin .cashCount #useLastCashCount { float:right; } .CustomPosRecord.end .title .warning { padding-top:1rem; color:var(--color_cRed); margin-bottom:1rem; } .CustomPosRecord.end .comment_end_lastBusinessDay { margin-bottom:1rem; } .CustomPosRecord.end .control .sectionTitle { overflow:hidden; } .CustomPosRecord.end .control h2 { float:left; } .CustomPosRecord.end #reload, .CustomPosRecord.end #goToOrders { float:right; margin-left:1rem; } .CustomPosRecord.end .inputWrapper.expenses { clear:both; } .CustomPosRecord.end .cashCount .inputWrapper.expenses, .CustomPosRecord.end .cashCount .inputWrapper.bankDeposit { width:50%; } .CustomPosRecord.businessDay .cashCount .expenses input, .CustomPosRecord.businessDay .cashCount .bankDeposit input { text-align:left; } .CustomPosRecord.businessDay { background-color:var(--color_cWhite); padding:2.5rem; box-sizing:border-box; min-width:54rem; } .CustomPosRecord.businessDay .title { text-align:center; margin-bottom:2rem; } .CustomPosRecord.businessDay .section { } .CustomPosRecord.businessDay .sectionTitle { margin-bottom:1rem; } .CustomPosRecord.businessDay .sectionContent { overflow:hidden; margin-bottom:2rem; } .CustomPosRecord.businessDay .sectionContent .column { float:left; width:50%; box-sizing:border-box; } .CustomPosRecord.businessDay .sectionContent .column:nth-child(2n+1) { padding-right:4rem; } .CustomPosRecord.businessDay .sectionContent .column:nth-child(2n) { padding-left:4rem; } .CustomPosRecord.businessDay .cashCount { max-width:62rem; } .CustomPosRecord.businessDay .cashCount .inputWrapper { float:left; margin-bottom:1rem; width:12.5%; padding-right:2rem; box-sizing:border-box; } .CustomPosRecord.businessDay .cashCount label { margin-bottom: 0.25rem; display:block; } .CustomPosRecord.businessDay .cashCount input { width: 100%; text-align:center; height:2rem; border-width:0.125rem; font-weight:800; font-size:0.875rem; } .CustomPosRecord.businessDay .control .controlValue { overflow:hidden; margin-bottom:0.25rem; } .CustomPosRecord.businessDay .control .caption { float:left; width:75%; } .CustomPosRecord.businessDay .control .value { float:left; width:25%; font-weight:800; text-align:right; } .CustomPosRecord.businessDay .control .difference.valid { color:green; } .CustomPosRecord.businessDay .control .difference:not(.valid) { color:red; } .CustomPosRecord.businessDay .infos .caption { margin-right:0.5rem; } .CustomPosRecord.businessDay .infos .value { font-weight:800; } .CustomPosRecord.businessDay .infos label { margin-bottom:0.5rem; display:block; } .CustomPosRecord.businessDay .infos textarea { box-sizing:border-box; width: 100%; height:8rem; border-width:0.125rem; } .CustomPosRecord.businessDay #finalize { margin:0 auto; width:20rem; } .CustomPosRecord.notLoggedIn { min-height: 9rem; } .CustomPrice .normal { text-decoration: line-through; } .CustomPrice .lineThrough { text-decoration: line-through; } .CustomPrice .brutto { display: block; } .CustomPrice .netto { display: none; } .isVatExempt .CustomPrice .brutto { display: none; } .isVatExempt .CustomPrice .netto { display: block; } .CustomProduct.NotFound { margin: 100px 0 140px; text-align: center; } .CustomProduct.List .pager { padding: 12px; } .CustomProduct.List .pager:after { content: "."; display: block; clear: both; font-size: 0; height: 0; visibility: hidden; } .CustomProduct.List .pager > div { float: left; margin-right: 24px; } .CustomProduct.List .pager .pagination { margin-right: 12px; } .CustomProduct.List .pagination > * { float: left; margin-right: 12px; } .CustomProduct.List .pagination .next{ margin:0; } .CustomProduct.List .pager .tags { margin-right: 0; } .CustomProduct.List .pager .tagGroup { float: left; margin-right: 24px; } .CustomProduct.List .pager .tagGroup a { display: block; clear: both; } .CustomProduct.SingleTeaser { float: left; width: 168px; margin-right: 8px; } .CustomProduct.SingleTeaser.br { clear: both; } .CustomProduct.SingleTeaser a { display: block; overflow: hidden; } .CustomProduct.SingleTeaser .BasicGraphic { min-height: 128px; } .CustomProduct.SingleTeaser img { margin: 0 auto; } .CustomProduct.SingleTeaser .CustomShopBasket.AddTo { text-align: center; /* margin-top: 20px; */ } .CustomProduct.SingleTeaser .CustomShopBasket.AddTo .actionButton { background-color: rgba(0, 0, 0, 0); padding: 0; } .CustomProduct.SingleTeaser .CustomShopBasket.AddTo .amount { display: none; } .CustomProduct.SingleTeaser .CustomPrice { text-align: center; } .CustomProduct.Single .column { float: left; } .CustomProduct.Single .firstColumn { width: 312px; } .CustomProduct.Single .firstColumn > .ListImageGallery { margin-left: 4px; } .CustomProduct.Single .firstColumn > .ListImageGallery li { display: block; width: 69px; margin: 6px 0 0 8px; } .CustomProduct.Single .firstColumn > .ListImageGallery a { margin: 0; } .CustomProduct.Single .firstColumn > .BasicGraphic { margin-left: 12px; } .CustomProduct.Single .secondColumn { margin-left: 12px; } .CustomProduct.Single .SingleProductSubnavigation { clear: both; margin-left: 12px; margin-bottom: 24px; overflow: hidden; } .CustomProduct.Single .SingleProductSubnavigation > * { display: block; float: left; margin-right: 24px; } .CustomProduct.Single .propertiesWrapper .custom_made, .CustomProduct.Single .propertiesWrapper .not_available, .CustomProduct.Single .propertiesWrapper .on_request, .CustomProduct.Single .propertiesWrapper .CustomShopBasket.AddTo.AddToDetail .on_request, .CustomProduct.Single.on_request .propertiesWrapper .CustomShopBasket.AddTo.AddToDetail .add_to_basket { display: none; } .CustomProduct.Single.custom_made .propertiesWrapper .custom_made, .CustomProduct.Single.not_available .propertiesWrapper .not_available, .CustomProduct.Single.on_request .propertiesWrapper .on_request, .CustomProduct.Single.on_request .CustomShopBasket.AddTo.AddToDetail .on_request { display: block; } .CustomProduct.Teaserlist > .title { padding: 24px 16px 12px; } .CustomProduct.Single .priceWrapper > * { float:left; } .ListImageGallery.Configurator { margin: 0; } .CustomProduct.ConfigurableAttribute .image_big td + td, .CustomProduct.ConfigurableAttribute .image_small td + td { display: none; } .CustomProduct.ConfigurableAttribute .imgStar { display: block; position: absolute; top: 0; right: 0; } .CustomProduct.ConfigurableAttribute .availableConfigurations { visibility: hidden; } .CustomProduct.ConfigurableAttribute .availableConfigurations.visible { visibility: visible; } .CustomInspire.screenshot .point { position: absolute; margin-top: -0.75rem; margin-left: -0.75rem; } .CustomInspire.screenshot .point .icon { background-image: url("/Ressource/Graphic/Icon/plus.png"); background-size: 1.5rem 1.5rem; background-repeat: no-repeat; background-position: center; width: 1.5rem; height: 1.5rem; cursor: pointer; -o-transition: all .5s; -ms-transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; } .CustomInspire.screenshot .point.rotate .icon { transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); } .CustomInspire.screenshot .point .box { padding: 0.25rem 0.5rem; border: 5px var(--color_cYellow) solid; position: absolute; top: -14px; left: 52px; background-color: white; display: none; min-height: 2.5rem; z-index: 10; opacity: 0; transition: opacity .5s; } .CustomInspire.screenshot .point.rotate .box { opacity: 1; } .CustomInspire.screenshot .point .box.show { display: block; } .CustomInspire.screenshot .point .box::before { content: " "; display: block; position: absolute; width: 0; height: 0; border-color: var(--color_cYellow) transparent transparent transparent; border-style: solid; border-width: 20px; left: -21px; top: 0; transform: rotate(-135deg) translate3d( 0, 0, 1px); -moz-transform: rotate(-135deg) translate3d( 0, 0, 1px); -webkit-transform: rotate(-135deg) translate3d( 0, 0, 1px); } .CustomInspire.screenshot .point .box::after { content: " "; display: block; position: absolute; width: 0; height: 0; border-color: white transparent transparent transparent; border-style: solid; border-width: 13px; left: -12px; top: 12px; transform: rotate(-135deg) translate3d( 0, 0, 1px); -moz-transform: rotate(-135deg) translate3d( 0, 0, 1px); -webkit-transform: rotate(-135deg) translate3d( 0, 0, 1px); } .CustomInspire.screenshot .point .box.left { left: auto; right: 52px; } .CustomInspire.screenshot .point .box.left::before { left: auto; right: -20px; transform: rotate(135deg) translate3d( 0, 0, 1px); -moz-transform: rotate(135deg) translate3d( 0, 0, 1px); -webkit-transform: rotate(135deg) translate3d( 0, 0, 1px); } .CustomInspire.screenshot .point .box.left::after { left: auto; right: -12px; transform: rotate(135deg) translate3d( 0, 0, 1px); -moz-transform: rotate(135deg) translate3d( 0, 0, 1px); -webkit-transform: rotate(135deg) translate3d( 0, 0, 1px); } .CustomInspire.screenshot .point .box.top { top: auto; bottom: -21px; } .CustomInspire.screenshot .point .box.top::before { top: auto; bottom: 10px; } .CustomInspire.screenshot .point .box.top::after { top: auto; bottom: 12px; } .CustomInspire.screenshot .pointDummy { display: none; } .searchResults { width: 100%; } .searchResults .noData { text-align: center; } .searchResults > ul { clear: both; } .searchResults > ul > li { display: block; } .searchResults > ul > li > div { float: left; clear: both; } .searchResults .gif { background-image: url("/Ressource/Graphic/loading.gif"); width: 32px; height: 32px; margin: 16px auto; display: none; } .searchWidget label, .searchWidget input[type="submit"] { display:none; } .searchWidget form{ text-align: center; } .searchWidget .searchInputWrapper{ width: 100%; max-width: 80rem; position: relative; margin: 0 auto; } .searchWidget input[name=inputSearch]{ box-sizing: border-box; font-size: 1.375rem; background-color: var(--color_cSemiLightGray); border: 0; height: 3.125rem; margin: 0; padding: 0.5rem 3.75rem 0.5rem 1rem; } .searchWidget .ss-search { cursor: pointer; font-size: 1.75rem; line-height: 1em; color: var(--color_cWhite); background-color: var(--color_cTurkis); padding: 0.85rem; box-sizing: border-box; position: absolute; right: 0; top:0; width: 3.125rem; height: 3.125rem; } .searchWidget ::-webkit-input-placeholder { font-size: 1.375rem; } .searchWidget :-ms-input-placeholder { font-size: 1.375rem; } .searchWidget :-moz-placeholder { font-size: 1.375rem; } .searchWidget ::-moz-placeholder { font-size: 1.375rem; } .searchWidget .input-placeholder { font-size: 1.375rem; } .searchWidget input[name="inputSearch"]:active::placeholder, .searchWidget input[name="inputSearch"]:focus::placeholder{ color: var(--color_cFormGray); } /*Standart Layout für: 1280px*/ @media screen and (max-width:544px) { .searchWidget input[name=inputSearch]{ height: 2.5rem; font-size: 1.125rem; } .searchWidget .ss-search { font-size: 1.25rem; line-height: 1em; padding: 0.75rem; width: 2.5rem; height: 2.5rem; } .searchWidget ::-webkit-input-placeholder { font-size: 1.125rem; } .searchWidget :-ms-input-placeholder { font-size: 1.125rem; } .searchWidget :-moz-placeholder { font-size: 1.125rem; } .searchWidget ::-moz-placeholder { font-size: 1.125rem; } .searchWidget .input-placeholder { font-size: 1.125rem; } } .searchResults { overflow: auto; max-width: 80rem; width: 100%; box-sizing: border-box; margin: 0 auto; padding: 0 5rem; overflow: hidden; } .searchResults .resultWrapper { padding: 0 6rem; max-width: 68rem; margin: 0 auto; } .searchResults h1 { font-family: "Typold-Bold"; font-size: 1.25rem; line-height: 1.375rem; text-transform: uppercase; margin-top: 2.5rem; margin-bottom: 2.5rem; } .searchResult h1 .icon{ font-size: 2.125rem; position: relative; top: 0.65rem; padding-right: 0.5rem; } .searchResults .searchHeader { margin-bottom: 2.5rem; border-bottom: solid 1px var(--color_cLine); } .searchResults .searchHeader div { display: inline-block; padding-right: 0.5rem; } .searchResults .searchHeader .totalHits:before{ content:"("; } .searchResults .searchHeader .totalHits:after{ content:")"; } .searchResults ul { list-style-type: none; } .searchResults .suggestionWrapper { padding: 0.5rem 0 0 0; } .searchResults .suggestionWrapper a.suggestion { padding-right: 0.25rem; } .searchResults .searchWidget.redirect { margin-top: 1.75rem; float: left; padding: 0; } .searchResults .searchWidget.redirect input { border-width: 2px; background-color: var(--color_cWhite); color: var(--color_cLink); margin: 0 0 1.75rem 0; width: 100%; max-width: 100%; } .searchResults .searchInputWrapper { overflow: auto; position: relative; } .searchResults .searchWidget.redirect .searchInputWrapper { display: block; } .searchResults .searchData { margin-bottom: 2.5rem; } .searchResults .noData { padding: 2rem 0; } .searchResults .searchData li { border-bottom: solid 1px var(--color_cLine); margin-bottom: 2.5rem; } .searchResults .searchData .context { line-height: 1.75rem; max-height: 5.25rem; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; /*kürz text im chrome nach 3 zeilen*/ -webkit-box-orient: vertical; margin-bottom: 1.25rem; } .searchResults .searchData a { position: relative; color: var(--color_cText); width: 100%; display: block; text-decoration: none; } .searchResults .searchData .more { color: var(--color_cLink); margin-bottom: 2.5rem; } .searchResults .searchData h3 { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; margin-bottom: 1.25rem; } .searchResults .searchData span { background-color: var(--color_cLink); } .searchResults .searchData .more span { background-color: transparent; display: inline-block; } .searchResults .searchFooter { overflow: auto; margin-bottom: 2.75rem; } .searchResults .searchFooter .counter { color: var(--color_cLink); float: left; line-height: 2.375rem; } .searchResults .searchFooter .showMore { float: right; } [data-page-hri="page_404"] .searchResults .searchWidget { float: none; display: inline-block; } /*Standart Layout für: 1280px*/ @media screen and (min-width:1920px) { .searchResults { padding: 0 7.5rem; } } @media screen and (max-width:1024px) { .searchResults .resultWrapper { padding-left:3rem; padding-right:3rem; } } @media screen and (max-width:768px) { .searchResults { padding-left:3rem; padding-right:3rem; } .searchResults .resultWrapper { padding: 0; } } @media screen and (max-width:544px) { .searchResults { padding-left: 1.25rem; padding-right: 1.25rem; } } @media screen and (max-width: 414px) { .searchResults .searchData a { min-height: 0; } .searchResults .searchData h3 { padding-right: 0; } .searchResults .searchFooter .counter, .searchResults .searchFooter .showMore { clear: both; width: 100%; text-align: center; } } .CustomUserNavigation { clear: both; width: 100%; padding-top: 24px; overflow: hidden; display:block; } .CustomUserNavigation ul, .CustomUserNavigation ol { margin-left: 25%; } .CustomUserNavigation li { font-size: 11px; margin-right:12px; list-style: none; float: left; } .CustomUserNavigation a { padding: 0; } .SetDownload.properties .BasicFileUpload.Widget { width: 100%; margin-bottom: 1rem; } .SetSeparator.Widget{ width: 80rem; max-width: 100%; margin: 0 auto 5rem; padding: 0 5rem; box-sizing: border-box; } .SetSeparator .title{ text-transform: uppercase; position: relative; padding-left: 2.5rem; } .SetSeparator h5.title{ margin-bottom: 0; } .SetSeparator h5.title::before{ content: ""; font-family: "SSGizmo"; width: 2rem; height: 3px; background-color: var(--color_cBlack); margin-right: 0.5rem; position: absolute; top: 49%; left: 0; } .SetSeparator .title p{ display: inline; } @media screen and (max-width: 768px) { .SetSeparator.Widget { padding-left: 3rem; padding-right: 3rem; } .SetSeparator h5.title::before{ width: 1.5rem; height: 2px; } .SetSeparator .title{ padding-left: 2rem; } } @media screen and (max-width: 544px) { .SetSeparator.Widget { padding-left: 1.25rem; padding-right: 1.25rem; } } .SetTeaserProperty.property #linkLanguageTabs { width: 100%; } .SetTeaserProperty.property textarea { height: 3rem; resize: vertical; } .SetArticle.Widget .wrapper { width: 70rem; max-width: 100%; margin: 0 auto 5rem; padding: 0 5rem; box-sizing: border-box; } .SetArticle.Widget .widgetHeaderSeparator .title, .SetArticle.Widget .contentWrapper{ margin-bottom: 2.625rem; } .SetArticle.Widget .title{ text-transform: uppercase; } @media screen and (max-width: 768px) { .SetArticle.Widget .widgetHeaderSeparator .title, .SetArticle.Widget .contentWrapper{ margin-bottom: 2.25rem; } .SetArticle.Widget .wrapper { padding: 0 3rem; } } @media screen and (max-width: 544px) { .SetArticle.Widget .widgetHeaderSeparator .title, .SetArticle.Widget .contentWrapper{ margin-bottom: 2rem; } .SetArticle.Widget .wrapper { padding: 0 1.25rem; } } .SetImage.blocks{ margin-bottom: 5rem; } .SetImage.blocks .widthWrapper{ width: 80rem; margin: 0 auto; padding: 0rem 5rem 0 0; max-width: 100%; box-sizing: border-box; position: relative; clear: both; overflow: hidden; } .SetImage.blocks.right .widthWrapper{ padding-left: 5rem; padding-right: 0rem; } .SetImage.blocks .graphicWrapper div.graphic{ position : relative; padding-left: 5rem; margin-bottom: 0; width: 69%; box-sizing: border-box; } .SetImage.blocks.right .graphicWrapper div.graphic{ padding-left: 0rem; padding-right: 5rem; float: right; } .SetImage.blocks .textBox{ position: relative; max-width: 38%; width: 38%; display: inline-block; vertical-align: top; box-sizing: border-box; padding: 2.25rem; background-color: var(--color_cTurkis); color: var(--color_cWhite); font-size: 1.375rem ; line-height: 1.875rem ; z-index: 40; margin-top: -4rem; float: right; } .SetImage.blocks .textBox a{ color: var(--color_cWhite); } .SetImage.blocks .textBox div{ margin-bottom: 0.5rem; } .SetImage.blocks .textBox .arrow{ display: inline-block; } .SetImage.blocks h2{ margin-bottom: 0.5rem; } .SetImage.blocks .subtitle{ margin-bottom: 1.75rem 2.1875rem; text-transform: uppercase; } .SetImage.blocks h5.subtitle::before{ content: "minus"; font-family: "SSGizmo"; } .SetImage.blocks .subtitle p{ display: inline; } .SetImage.blocks .textWrapper{ padding-top: 1.5rem; box-sizing: border-box; } .SetImage.blocks .textWrapper .BasicText{ padding-left: 6.25rem; width: 69%; margin: 0; } .SetImage.blocks.right .textWrapper .BasicText{ padding-right: 6.25rem; padding-left: 0; float: right; } /* großes bildformat */ .SetImage.blocks > .graphicWrapper.large + .textWrapper, .SetImage.blocks > .graphicWrapper.large{ width: 120rem; } .SetImage.blocks:not(.right) > .graphicWrapper.large{ padding-left: 0; } .SetImage.blocks.right > .graphicWrapper.large{ padding-right: 0; } .SetImage.blocks .graphicWrapper.large div.graphic{ width: 75%; padding-left: 0rem; } .SetImage.blocks.right .graphicWrapper.large div.graphic{ padding-right: 0rem; } .SetImage.blocks .graphicWrapper .textBox, .SetImage.blocks.right .graphicWrapper.large div.graphic{ float: right; } .SetImage.blocks.right .graphicWrapper.large .textBox, .SetImage.blocks.right .textBox{ float: inherit; } .SetImage.blocks .graphicWrapper.large + .textWrapper .BasicText{ width: 75%; max-width: 82rem; } .SetImage.blocks .graphicWrapper.large + .widthWrapper.textWrapper { padding-right: 5rem; padding-left: 0; } .SetImage.blocks.right .graphicWrapper.large + .widthWrapper.textWrapper { padding-left: 5rem; padding-right: 0; } /* box positionierung */ .SetImage.blocks.textIsSmaller div.graphic, .SetImage.blocks.textIsSmaller .textBox { vertical-align: bottom; } @media screen and (min-width:1281px){ .SetImage.blocks .graphicWrapper.large .textBox{ left: -5rem; width: 39.5rem; } .SetImage.blocks.right .graphicWrapper.large .textBox{ left: 5rem; } } @media screen and (min-width:1920px){ .SetImage.blocks .graphicWrapper.large{ padding-right: 7.5rem; } .SetImage.blocks .graphicWrapper.large + .widthWrapper.textWrapper { padding-right: 7.5rem; } .SetImage.blocks.right .graphicWrapper.large + .widthWrapper.textWrapper { padding-left: 7.5rem; padding-right: 0rem; } } @media screen and (max-width:1180px){ .SetImage.blocks .graphicWrapper.large .textBox, .SetImage.blocks .textBox{ padding: 1.75rem; font-size: 1.25rem ; line-height: 1.75rem ; } .SetImage.blocks h5{ font-size: 0.875rem; line-height: 1.25rem; } .SetImage.blocks h2{ font-size: 2.25rem; line-height: 2.625rem; } } @media screen and (min-width:1025px){ .SetImage.blocks .textWrapper .BasicText{ padding-left: 11.25rem; } .SetImage.blocks.right .textWrapper .BasicText{ padding-right: 11.25rem; } .SetImage.blocks .graphicWrapper.large + .textWrapper .BasicText{ padding-left: 11.25rem; } .SetImage.blocks.right .graphicWrapper.large + .textWrapper .BasicText{ padding-left: 0rem; } } @media screen and (max-width:1024px){ .SetImage.blocks .textWrapper{ padding-left: 3rem; padding-right: 6.5rem; } .SetImage.blocks.right .textWrapper .BasicText{ padding-right: 9.25rem; } .SetImage.blocks .textBox{ max-width: 50%; width: 50%; } } @media screen and (max-width:768px){ .SetImage.blocks .widthWrapper{ padding-right: 3rem; } .SetImage.blocks.right .widthWrapper{ padding-right: 0rem; padding-left: 3rem; } .SetImage.blocks .textBox{ padding: 1.125rem; font-size: 1.0625rem ; line-height: 1.375rem ; max-width: 70%; width: 70%; } .SetImage.blocks h2 { font-size: 1.625rem; line-height: 2rem; } .SetImage.blocks h5 { font-size: 0.875rem; line-height: 1.25rem; } .SetImage.blocks.right .graphicWrapper.large .textBox, .SetImage.blocks.right .textBox{ } .SetImage.blocks .graphicWrapper div.graphic{ padding-left: 3rem; } .SetImage.blocks.right .graphicWrapper div.graphic{ padding-left: 0rem; padding-right: 3rem; } .SetImage.blocks .textWrapper{ padding-left: 0rem; } .SetImage.blocks.right .textWrapper .BasicText{ padding-right: 6.25rem; } } @media screen and (max-width:676px){ .SetImage.blocks.right .textWrapper .BasicText{ padding-right: 3rem; } .SetImage.blocks.right .graphicWrapper.large + .textWrapper .BasicText{ padding-right: 0rem; } .SetImage.blocks .graphicWrapper.large + .widthWrapper.textWrapper{ padding-right: 4.25rem; } .SetImage.blocks.right .graphicWrapper.large + .widthWrapper.textWrapper{ padding-right: 3rem; padding-left: 4.25rem; } } @media screen and (max-width:544px){ .SetImage.blocks.right .widthWrapper, .SetImage.blocks .widthWrapper{ padding-top: 0rem; padding-left: 0rem; padding-right: 0rem; } .SetImage.blocks .graphicWrapper.large div.graphic, .SetImage.blocks .graphicWrapper div.graphic{ width: 100%; padding-left: 0; } .SetImage.blocks.right .graphicWrapper div.graphic{ padding-right: 0; } .SetImage.blocks.right .textBox, .SetImage.blocks .graphicWrapper.large .textBox, .SetImage.blocks .textBox{ left: 0; width: calc(100% - 1.25rem); max-width: 100%; float: inherit; margin-left: 1.25rem; } .SetImage.blocks.right .textBox{ margin-left: 0; margin-right: 1.25rem; } .SetImage.blocks .graphicWrapper.large + .widthWrapper.textWrapper, .SetImage.blocks.right .graphicWrapper.large + .widthWrapper.textWrapper, .SetImage.blocks .widthWrapper.textWrapper{ padding: 1.5rem 1.25rem 0 1.25rem; } .SetImage.blocks .graphicWrapper.large + .textWrapper .BasicText, .SetImage.blocks .textWrapper .BasicText{ width: 100%; } .SetImage.blocks .textWrapper .BasicText{ padding-left: 0; } .SetImage.blocks.right .textWrapper .BasicText{ padding-right: 0; } } .SetImage.intro .graphicWrapper { width: 100%; height: 100%; min-height: 50vh; background-repeat: no-repeat; background-size: cover; background-position: top center; } @media screen and (max-width:544px) { .SetImage.intro .graphicWrapper { height: 66vh; } } .SetImage.quote{ display: block; box-sizing: border-box; width: 100%; max-width: 70rem; padding-top: 3.5rem; padding-left: 18rem; margin: 0 auto 5rem auto; position: relative; } .SetImage.quote .BasicGraphic{ max-width: 25rem; top: 0; left: 0; position: absolute; z-index: 1; } .SetImage.quote img { width: 100%; } .SetImage.quote .quote__box { box-sizing: border-box; padding: 8rem 2rem 2rem 11.5rem; min-height: 25.5rem; } .SetImage.quote .quote__text:before { content: '„'; font-size: 6.25rem; position: absolute; left: -3.75rem; top: -5.5rem; color: #FFFFFF; } .SetImage.quote .quote__text { position: relative; font-family: 'Nexus-Typewriter-Pro-Italic'; } .SetImage.quote .quote__quote { font-size: 1.75rem; line-height: 2.5rem; color: #FFFFFF; margin-bottom: 3rem; } .SetImage.quote .quote__author { font-size: 1.2rem; line-height: 1.6rem; color: #FFFFFF; } @media screen and (max-width:1200px) { .SetImage.quote{ padding: 0 5rem; margin-left: 0; margin-right: 0; max-width: inherit; } .SetImage.quote .quote__wrapper { padding: 4.25rem 0rem 0 12rem; } .SetImage.quote .BasicGraphic{ max-width: 16.5rem; /*265px*/ left: 5rem; } .SetImage.quote .quote__box { min-height: inherit; padding: 5rem 2rem 3rem 9.5rem; } .SetImage.quote .quote__text:before { left: -4.25rem; top: -4.5rem; } .SetImage.quote .quote__quote { margin-bottom: 2rem; } } @media screen and (max-width:1000px){ .SetImage.quote .BasicGraphic{ max-width: 13.5rem; } .SetImage.quote .quote__wrapper { padding-left: 9rem; } .SetImage.quote .quote__box { padding-left: 8rem; padding-top: 4rem; } .SetImage.quote .quote__text:before { font-size: 5rem; left: -2.8rem; top: -3.5rem; } .SetImage.quote .quote__quote { font-size: 1.375rem; line-height: 2.25rem; margin-bottom: 1.375rem; } .SetImage.quote .quote__author { font-size: 1rem; } } @media screen and (max-width:768px){ .SetImage.quote{ padding: 0 3rem; } .SetImage.quote .BasicGraphic{ max-width: 11.5rem; left: 3rem; } .SetImage.quote .quote__wrapper { padding-left: 1.5rem; padding-top: 7rem; } .SetImage.quote .quote__box { padding: 5.5rem 1.5rem 2.25rem 1.5rem; } .SetImage.quote .quote__text:before { font-size: 5rem; top: -4rem; left: 9.5rem; } .SetImage.quote .quote__quote { font-size: 1.125rem; line-height: 1.75rem; margin-bottom: 1.125rem; } .SetImage.quote .quote__author { font-size: 0.75rem; line-height: 1.125rem; } } @media screen and (max-width: 544px) { .SetImage.quote{ padding: 0 1.25rem; } .SetImage.quote .BasicGraphic{ left: 1.25rem; } } .SetImage.source.teaserSimple{ padding-top: 1.5rem; padding-bottom: 2rem; } .SetImage.source.teaserSimple .graphicWrapper, .SetImage.source.teaserSimple .textWrapper > *{ margin-bottom: 0rem; } .SetImage.source.teaserSimple .graphicWrapper{ padding-right: 1.25rem; } .SetImage.source.teaserSimple .copyrightLink, .SetImage.source.teaserSimple .copyright { display: inline-block; vertical-align: middle; } .SetImage.source.teaserSimple .copyrightLink .SetLink { color: var(--color_cCopyright); padding-left: 0.25rem; } .SetImage.source.teaserSimple a.copyrightLink::before, .SetImage.source.teaserSimple div.copyrightLink .SetLink::before { content: " ("; } .SetImage.source.teaserSimple a.copyrightLink::after, .SetImage.source.teaserSimple div.copyrightLink .SetLink::after { content: ") "; } #wysiwyg .SetImage.source.teaserSimple .copyrightLink a, #wysiwyg .SetImage.source.teaserSimple .copyrightLink, #wysiwyg .SetImage.source.teaserSimple .BasicText.copyright{ display: inline-block; } #wysiwyg.edit .SetImage.source.teaserSimple .BasicText.copyright { display: block; } @media screen and (max-width:544px){ .SetImage.source.teaserSimple{ padding-bottom: 1rem; padding-top: 1.5rem; } .SetImage.source.teaserSimple .graphicWrapper{ margin-bottom: 0rem; } .SetImage.source.teaserSimple .textWrapper{ text-align: center; padding-top: 0.75rem; } } .SetImage.Wide{ width: 80rem; margin: 0 auto 3rem; padding: 0rem 5rem; max-width: 100%; box-sizing: border-box; position: relative; clear: both; overflow: hidden; } .SetImage.Wide .graphic{ margin-bottom: 2rem; } .SetImage.Wide .textWrapper{ width: 70rem; padding: 0rem 6rem; max-width: 100%; box-sizing: border-box; } .SetImage.Wide .textWrapper .description{ margin-bottom: 1.5rem; } .SetImage.Wide .textWrapper a{ color: var(--color_cLink); } @media screen and (max-width:1024px){ .SetImage.Wide .textWrapper{ padding-left: 2rem; padding-right: 2rem; } } @media screen and (max-width:768px){ .SetImage.Wide{ padding-left: 3rem; padding-right: 3rem; } .SetImage.Wide h2, .SetImage.Wide .graphic{ margin-bottom: 1rem; } .SetImage.Wide .textWrapper{ padding-left: 3.5rem; padding-right: 3.5rem; } } @media screen and (max-width:676px){ .SetImage.Wide .textWrapper{ padding: 0rem; } } @media screen and (max-width:544px){ .SetImage.Wide{ padding-left: 1.25rem; padding-right: 1.25rem; } } .SetImage { margin-bottom: 5rem; } .SetImage > .graphicWrapper { box-sizing:border-box; position:relative; margin-bottom: 5rem; } .SetImage .BasicText{ margin-bottom: 0.5rem; } .SetText.pageTitle{ margin-bottom: 5rem; } .SetText.pageTitle .wrapper{ width: 70rem; max-width: 100%; margin: 0 auto; padding: 0 5rem; box-sizing: border-box; } .SetText.pageTitle h1{ margin-bottom: 0; } @media screen and (max-width:768px) { .SetText.pageTitle .wrapper{ padding: 0 3rem; } } @media screen and (max-width:544px) { .SetText.pageTitle .wrapper{ padding: 0 1.25rem; } } .SetText.formular{ overflow: hidden; margin-bottom: 5rem; } .SetText.formular .bgColor{ background-color: var(--color_cPurple); padding: 4.25rem 0rem; } .SetText.formular .wrapperWidth{ width: 80rem; max-width: 100%; margin: 0 auto; padding: 0 5rem; box-sizing: border-box; } .SetText.formular .wrapperDescription{ display: inline-block; width: 40%; padding-right: 1.25rem; box-sizing: border-box; } .SetText.formular .wrapperFormular{ max-width: 60%; z-index: 40; position: relative; float: right; } .SetText.formular a{ color: var(--color_cWhite); text-decoration: none; } .SetText.formular .BasicText.description, .SetText.formular h2{ margin-bottom: 4rem; color: var(--color_cWhite); } @media screen and (max-width:768px) { .SetText.formular .bgColor{ padding-top: 2rem; padding-bottom: 2rem; } .SetText.formular .wrapperWidth{ padding-left: 0rem; padding-right: 0rem; } .SetText.formular h2, .SetText.formular .wrapperDescription{ padding-left: 3rem; padding-right: 3rem; } .SetText.formular .BasicText.description, .SetText.formular h2{ margin-bottom: 2rem; } .SetText.formular .wrapperFormular, .SetText.formular .wrapperDescription{ width: 100%; max-width: 100%; } .SetText.formular .BasicForm.Widget{ padding-left: 2rem; padding-right: 2rem; } } @media screen and (max-width:544px) { .SetText.formular h2, .SetText.formular .wrapperDescription{ padding-left: 1.25rem; padding-right: 1.25rem; } .SetText.formular .wrapperWidth{ } .SetText.formular .BasicForm.Widget{ padding-left: 1.25rem; padding-right: 1.25rem; } } .SetText.newsletterSubscription { margin-bottom: 5rem; background-color: var(--color_cTurkis); color: var(--color_cWhite); overflow: hidden; } .SetText.newsletterSubscription > .wrapper{ width: 80rem; max-width: 100%; margin: 0 auto; padding: 4rem 5rem 2rem; box-sizing: border-box; text-align: center; } .SetText.newsletterSubscription .setTextTitle { margin-bottom: 1.875rem; } @media screen and (max-width: 1024px) {} @media screen and (max-width:768px) { .SetText.newsletterSubscription > .wrapper{ padding: 2rem 3rem 1.5rem; } } @media screen and (max-width:544px) { .SetText.newsletterSubscription > .wrapper{ padding-left: 1.25rem; padding-right: 1.25rem; } } #wysiwyg .SetVideo .wrapper { position: relative; } .properties .select2-drop.videoSelect2 { max-width: 64rem; } .SetVideo .wrapper .hintInactive { position: absolute; background-color: rgba(255, 255, 255, 0.75); top: 0; left: 0; right: 0; bottom: 0; text-align: center; color: var(--color_cBlack); font-size: 1.5rem; } .SetVideo .wrapper .hintInactive:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; } .SetVideo .wrapper .hintInactive .text { vertical-align: middle; display: inline-block; } .SetVideo.intro .BasicVideo { width: 100%; height: 100%; min-height: 50vh; overflow: hidden; position: relative; } .SetVideo.intro .VideoBox { width: 100%; height: 100%; } .SetVideo.intro video { width: 100%; z-index: 1; min-height: 100%; left: 50%; position: absolute; top: 50%; -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .SetVideo.intro .previewImageWrapper { background-size: cover; width: 100%; height: 100%; position: absolute; } .SetVideo.screencast { margin-bottom: 5rem; } .SetVideo.screencast .styledBrowser { background-color: var(--color_cStyledBrowser); /* background: url(fallback.png); */ background-image: url(/Ressource/Graphic/browser.svg); background-size: cover; background-repeat: no-repeat; background-position: top left; padding-bottom: 4%; box-sizing: border-box; border-radius: 5px 5px 0px 0px; position: relative; bottom: 0; vertical-align: bottom; max-width: 80rem; width: 100%; min-height: 1rem; max-height: 1.25rem; height: 100%; } .SetVideo.screencast .screencast__wrapper { width: 80rem; max-width: 100%; margin: 0 auto; padding: 0 5rem; box-sizing: border-box; } .SetVideo.screencast .screencast__wrapper.screencast__wrapper--video { height: 0; padding-bottom: 21rem; } .SetVideo.screencast .screencast__text .screencast__wrapper { padding: 4.5rem 13.5rem 0 13.5rem; transition: none; } .SetVideo.screencast .screencast__text { background-color: Purple; } .SetVideo.screencast .screencast__text * { transition: none; } .SetVideo.screencast .screencast__title { font-size: 2.25rem; line-height: 3rem; transition: none; color: var(--color_cWhite); } .SetVideo.screencast .screencast__description { font-size: 1.25rem; line-height: 1.75rem; color: var(--color_cWhite); } .SetVideo.screencast .screencast__text-gap { width: 100%; height: 0; padding: 0 0 45.5%; overflow: hidden; } .SetVideo.screencast .screencast__video-wrapper { transform:translateY(-50%); position: relative; -webkit-box-shadow: 0 0.3rem 0.3rem 0 var(--admin_color_cLine); -moz-box-shadow: 0 0.3rem 0.3rem 0 var(--admin_color_cLine); box-shadow: 0 0.3rem 0.3rem 0 var(--admin_color_cLine); } .SetVideo.screencast .BasicVideo { width: 100%; height: 0; padding: 0 0 56.25%; overflow: hidden; position: relative; background-color: var(--color_cWhite); } .SetVideo.screencast .VideoBox { width: 100%; height: 100%; } .SetVideo.screencast iframe, .SetVideo.screencast video { background-color: var(--color_cVideoGray); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .SetVideo.screencast .previewImageWrapper { background-size: cover; background-color: var(--color_cVideoGray); width: 100% !important; height: 100% !important; position: absolute; } .SetVideo.screencast img { width: 100% !important; height: 100% !important; } @media screen and (max-width:1184px) { .SetVideo.screencast .screencast__wrapper.screencast__wrapper--video { padding-bottom: 27%; } } @media screen and (max-width:1024px) { .SetVideo.screencast .screencast__text .screencast__wrapper { padding: 3rem 11rem 0 11rem; } .SetVideo.screencast .screencast__title { font-size: 1.5rem; line-height: 2rem; } .SetVideo.screencast .screencast__description { font-size: 1rem; line-height: 1.25rem; } } @media screen and (max-width:760px) { .SetVideo.screencast .screencast__wrapper { padding: 0 3rem; } .SetVideo.screencast .screencast__text .screencast__wrapper { padding: 2rem 3rem 0 3rem; } .SetVideo.screencast .screencast__description { font-size: 1rem; line-height: 1.25rem; margin-bottom: 2rem; } .SetVideo.screencast .screencast__text-gap { padding-bottom: 37%; } } @media screen and (max-width:544px) { .SetVideo.screencast .screencast__wrapper { padding-left: 1.25rem; padding-right: 1.25rem; } .SetVideo.screencast .screencast__title { font-size: 1.5rem; line-height: 2rem; margin-bottom: 1.25rem; } .SetVideo.screencast .screencast__text .screencast__wrapper { padding-left: 1.25rem; padding-right: 1.25rem; } } .ListDownloadList { margin-bottom: 4.75rem; overflow:hidden; } .ListDownloadList .title { margin-bottom: 1.625rem; } .ListDownloadList li { list-style: none; overflow: hidden; } .ListDownloadList .BasicDownload { margin-bottom: 0.5rem; position: relative; } .ListDownloadList .actionButton { color: var(--color_cLink); font-size: 1.125rem; padding-left: 0; } .ListDownloadList.simple .arrow, .ListDownloadList.simple .BasicText { display: inline-block; vertical-align: middle; } .ListDownloadList.simple .arrow { width: 1em; height: 1em; line-height: 1.75em; padding-left: 0; padding-right: 0.5rem; position: absolute; top: 0.5em; } .ListDownloadList.simple .arrow img{ height: auto; } .ListDownloadList.simple .BasicText:not(.title){ margin-left: 2rem; border-bottom: solid 1px var(--color_cWhite); } @media screen and (min-width: 768px) { .ListDownloadList { margin-bottom: 3rem; } .ListDownloadList .actionButton { font-size: 1rem; } .ListDownloadList .title { margin-bottom: 1.25rem; } } @media screen and (max-width: 544px) { .ListDownloadList .actionButton { font-size: 0.9375rem; } } /*****For the TeaserList Property-Dialogue*****/ .ListTeaserListProperty button.removeAction.editButton i { font-family: FontAwesome !important; } .ListImageGallery.extendedSlideshow .stage { overflow: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .ListImageGallery.extendedSlideshow .backstage { display: none; } .ListImageGallery.extendedSlideshow .SetImage { height: 100%; width: 100%; z-index: 5; display: none; } .ListImageGallery.extendedSlideshow .SetImage.active { z-index: 15; display: block; opacity: 1; } .ListImageGallery.extendedSlideshow .stage [data-change-slide] { cursor:pointer; } .ListImageGallery.extendedSlideshow .cssAnimation .SetImage, .ListImageGallery.extendedSlideshow .translateCss .SetImage { height: 100%; z-index: 1; overflow: hidden; display: inline-block; position: relative; margin-right: -100%; vertical-align: top; -moz-user-select: none; -webkit-user-select: none; -webkit-transition-duration: 333ms; -moz-transition-duration: 333ms; -ms-transition-duration: 333ms; -o-transition-duration: 333ms; transition-duration: 333ms; -webkit-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -moz-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -ms-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -o-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); } .ListImageGallery.extendedSlideshow .cssAnimation .SetImage.active { z-index: 15; } .ListImageGallery.extendedSlideshow .notransition, .ListImageGallery.extendedSlideshow .notransition .SetImage { -webkit-transition-duration: 0 !important; -moz-transition-duration: 0 !important; -ms-transition-duration: 0 !important; -o-transition-duration: 0 !important; transition-duration: 0 !important; -webkit-transition-delay: 0 !important; -moz-transition-delay: 0 !important; -ms-transition-delay: 0 !important; -o-transition-duration: 0 !important; transition-delay: 0 !important; } .ListImageGallery.extendedSlideshow .translateCss .SetImage { left: -100%; -webkit-transition-property: left; -moz-transition-property: left; -ms-transition-property: left; -o-transition-property: left; transition-property: left; } .ListImageGallery.extendedSlideshow .translateCss .SetImage.active { left: 0; } .ListImageGallery.extendedSlideshow .translateCss .SetImage.active ~ .SetImage { left: 100%; } .ListImageGallery.extendedSlideshow .fadeCss .SetImage { opacity: 0; -webkit-transition-property: opacity; -moz-transition-property: opacity; -ms-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity; } .ListImageGallery.extendedSlideshow .fadeCss .SetImage.active { opacity: 1; } /** animation progressbar **/ .ListImageGallery.extendedSlideshow .progressBar { width: 100%; height: 1px; background-color: var(--color_bcArea); } .ListImageGallery.extendedSlideshow .progressBar .progress { width: 0%; height: 100%; background-color: var(--color_cLink); } /** navigation **/ .ListImageGallery.extendedSlideshow .navigation { z-index: 100; right: 0; top: 0; position: absolute; } .ListImageGallery.extendedSlideshow .navigation ul { float: right; list-style-type: none; margin: 0; overflow: hidden; } .ListImageGallery.extendedSlideshow .navigationItems { width: 2em; height: 2em; } .ListImageGallery.extendedSlideshow .stage { position:relative; z-index: 20; } @media screen and (max-width: 664px) { .ListImageGallery.extendedSlideshow .translateCss .SetText, .ListImageGallery.extendedSlideshow .translateCss .SetText.active ~ .SetText, .ListImageGallery.extendedSlideshow .translateCss .SetImage, .ListImageGallery.extendedSlideshow .translateCss .SetImage.active ~ .SetImage{ left: 0 !important; display: block; } } /* Navigation bullets */ .ListImageGallery.extendedSlideshow .navigation { z-index: 100; right: 0; left: 0; top: inherit; bottom: 0; position: relative; height: auto; vertical-align: middle; text-align: center; margin: 5rem 0 0; } .ListImageGallery.extendedSlideshow .navigation > * { display: inline-block; } .ListImageGallery.extendedSlideshow .navigationTranslateWrapper { overflow: hidden; min-width: 4em; vertical-align: middle; } .ListImageGallery.extendedSlideshow .navigation ul { float: left; list-style-type: none; margin: 0; overflow: hidden; display: inline; max-width: 1.5em; text-align: right; line-height: 1em; } .ListImageGallery.extendedSlideshow .navigation li { display: none; line-height: 1em; } .ListImageGallery.extendedSlideshow .navigation li.active { display: inline-block; } .ListImageGallery.extendedSlideshow .navigationItems { width: 1.25em; height: auto; } .ListImageGallery.extendedSlideshow .imagesIndex { line-height: 1em; padding-left: 0.4em; } /* button left and right */ .ListImageGallery.extendedSlideshow [data-change-slide] { cursor: pointer; } .ListImageGallery.extendedSlideshow [data-change-slide]:before { content:""; height:100%; display:inline-block; vertical-align: bottom; } .ListImageGallery.extendedSlideshow [data-change-slide] span { background-color: rgba(0,0,0,0.3); border: solid 1px var(--color_cWhite); color: var(--color_cWhite); display: inline-block; vertical-align: middle; width: 3.125rem; height: 3.125rem; font-size: 1.5rem; line-height: 3.25rem; text-align: center; } .ListImageGallery.extendedSlideshow .visible[data-change-slide] span{ background-color: rgba(0,0,0,0.6); } .ListImageGallery.extendedSlideshow .visible[data-change-slide] span:hover{ color: rgba(0,0,0,0.6); background-color: var(--color_cWhite); } .ListImageGallery.extendedSlideshow .previousImage { left:0; text-align: right; } .ListImageGallery.extendedSlideshow .nextImage { right:0; text-align: left; } .ListImageGallery.extendedSlideshow .previousImage.mouseHover, .ListImageGallery.extendedSlideshow .nextImage.mouseHover { display: none; position: absolute; z-index: 10; top: 6rem; width: 0; } .ListImageGallery.extendedSlideshow .previousImage.mouseHover.visible, .ListImageGallery.extendedSlideshow .nextImage.mouseHover.visible { bottom: 4.25rem; width: 50%; } .ListImageGallery.extendedSlideshow .previousImage.mouseHover.visible { cursor: url("/Ressource/Graphic/Cursor/left-arrow.png"), url("/Ressource/Graphic/Cursor/left-arrow.cur"), auto; } .ListImageGallery.extendedSlideshow .nextImage.mouseHover.visible { cursor: url("/Ressource/Graphic/Cursor/right-arrow.png"), url("/Ressource/Graphic/Cursor/right-arrow.cur"), auto; } .ListImageGallery.extendedSlideshow .zoomIcon { display: none; z-index: 100; position: absolute; bottom: 0; right: 0; } .ListImageGallery.extendedSlideshow.showZoom .zoomIcon { display: block; } @media screen and (min-width: 1280px) { .ListImageGallery.extendedSlideshow .previousImage.mouseHover.visible, .ListImageGallery.extendedSlideshow .nextImage.mouseHover.visible{ display: initial; } } @media screen and (max-width: 768px) { } @media screen and (max-width: 664px) { .ListImageGallery.extendedSlideshow .navigation, .ListImageGallery.extendedSlideshow .navigationItems, .ListImageGallery.extendedSlideshow .navigation li.active, .ListImageGallery.extendedSlideshow .imagesIndex, .ListImageGallery.extendedSlideshow.showZoom .zoomIcon, .ListImageGallery.extendedSlideshow [data-change-slide], .ListImageGallery.extendedSlideshow [data-change-slide]::before{ display: none; } .ListImageGallery.extendedSlideshow .previousImage, .ListImageGallery.extendedSlideshow .nextImage, .ListImageGallery.extendedSlideshow .nextImage.visible{ cursor: auto; visibility: hidden; } } .svgTeaserList { max-width:90rem; box-sizing:border-box; margin:0 auto 3.5rem; text-align:center; padding: 0 4rem; } .svgTeaserList .svgTeaser { vertical-align:top; width:13rem; display:inline-block; padding: 0 1rem; box-sizing:border-box; margin-bottom: 2rem; } .svgTeaserList .svgTeaser:nth-child(2n) { margin-top:5rem; } .svgTeaserList .svgTeaser a { display: block; } .svgTeaserList .svgTeaser .wrapper > .graphicWrapper{ box-sizing: border-box; padding: 0 2.5rem; } .svgTeaserList .svgTeaser .BasicGraphic { height:10.5rem; margin-bottom:1rem; } .svgTeaserList .svgTeaser .arrow { display: inline-block; width: 1.75rem; margin-left:0; -o-transition: .5s; -ms-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; } #wysiwyg .svgTeaserList .svgTeaser .BasicGraphic { height:auto; } #wysiwyg .svgTeaserList .svgTeaser .BasicGraphic::before { content:none; } .svgTeaserList .svgTeaser .title { font-family:Typold-Medium; font-size:1.125rem; line-height:1.375rem; margin-bottom:0.5rem; } .svgTeaserList .svgTeaser .description { font-family:Typold-Book; font-size:0.9375rem; line-height:1.25rem; } @media screen and (min-width:1108px) { .svgTeaserList.count4 .svgTeaser { width:15rem; padding-left:2rem; padding-right:2rem; } .svgTeaserList.count3 .svgTeaser { width:17rem; padding-left:3rem; padding-right:3rem; } } @media screen and (max-width:1176px) { .svgTeaserList .svgTeaser { width:20%; } .svgTeaserList .svgTeaser .BasicGraphic { height:8.75rem; } } @media screen and (max-width:1107px) { .svgTeaserList .svgTeaser:nth-child(2n) { margin-top:0; } .svgTeaserList .svgTeaser { vertical-align:top; width:25%; } .svgTeaserList.count4 .svgTeaser, .svgTeaserList.count3 .svgTeaser { padding-left:0.75rem; padding-right:0.75rem; } .svgTeaserList .svgTeaser .BasicGraphic { height:8.75rem; } .svgTeaserList .svgTeaser .wrapper > .graphicWrapper{ max-width: 6.5rem; margin: auto; padding: 0; } } @media screen and (max-width:816px) { .svgTeaserList .svgTeaser { width:33.333%; } } @media screen and (max-width:768px) { .svgTeaserList { padding-left:2.25rem; padding-right:2.25rem; } } @media screen and (max-width:582px) { .svgTeaserList .svgTeaser { width:50%; } } @media screen and (max-width:544px) { .svgTeaserList { padding-left:0.25rem; padding-right:0.25rem; } } @media screen and (max-width:380px) { .svgTeaserList .svgTeaser { width:100%; } } .teaserListSimple { max-width: 70rem; box-sizing:border-box; margin:0 auto 6rem; padding: 0 5rem; overflow: hidden; } .teaserListSimple h3{ padding-bottom: 2.25rem; border-bottom: solid 1px var(--color_cLine); text-transform: uppercase; margin-bottom: 0; } .teaserListSimple .teaserSimple{ padding-top: 2.25rem; padding-bottom: 0.75rem; border-bottom: solid 1px var(--color_cLine); margin-bottom: 0; } .teaserListSimple .teaserSimple .graphicWrapper, .teaserListSimple .teaserSimple .textWrapper{ display: inline-block; vertical-align: top; box-sizing:border-box; } .teaserListSimple .teaserSimple .graphicWrapper, .teaserListSimple .teaserSimple .textWrapper > *{ margin-bottom: 1.5rem; } .teaserListSimple .teaserSimple a:hover{ color: black; text-decoration: none; } .teaserListSimple .teaserSimple span, .teaserListSimple .teaserSimple a:hover span{ color: var(--color_cLink); } .teaserListSimple .teaserSimple .graphicWrapper{ width: 11.75rem; padding-right: 1.75rem; } .teaserListSimple .teaserSimple .textWrapper{ width: calc(100% - 12rem); min-width: 18rem; } .teaserListSimple .teaserSimple .arrow{ display: inline-block; } @media screen and (max-width:768px){ .teaserListSimple{ padding-left: 3rem; padding-right: 3rem; } } @media screen and (max-width:544px){ .teaserListSimple{ padding-left: 1.25rem; padding-right: 1.25rem; } .teaserListSimple h3{ padding-bottom: 2rem; } .teaserListSimple .teaserSimple{ padding-bottom: 1rem; padding-top: 2rem; } .teaserListSimple .teaserSimple .graphicWrapper, .teaserListSimple .teaserSimple .textWrapper{ display: block; } .teaserListSimple .teaserSimple .graphicWrapper{ width: 100%; padding-right: 0; margin-bottom: 1.25rem; } .teaserListSimple .teaserSimple .textWrapper{ width: 100%; } .teaserListSimple .teaserSimple .BasicGraphic{ max-width: 9rem; margin: 0 auto; } .teaserListSimple .teaserSimple .graphicWrapper, .teaserListSimple .teaserSimple .textWrapper > *{ margin-bottom: 1rem; } } .screenshotGallery{ overflow: hidden; background-color: var(--color_cDarkGray); margin-bottom: 5rem; position: relative; } .screenshotGallery .wrapper{ max-width: 80rem; box-sizing:border-box; margin:0 auto; padding: 6rem 0 4.25rem 0; } .screenshotGallery .styledBrowser{ box-shadow: 0.45rem 0.75rem 1.25rem -0.5rem var(--color_cBlack); } .screenshotGallery .screenshotSlide .browserWrapper{ width: 64%; display: inline-block; float:left; z-index: 0; } .screenshotGallery .screenshotSlide .graphicWrapper{ background-color: var(--color_cWhite); } .screenshotGallery .screenshotSlide .BasicGraphic.graphic{ width: 100%; box-sizing: border-box; } .screenshotGallery .textBoxWrapper{ position: relative; z-index: 40; width: 35%; float: right; vertical-align: top; box-sizing: border-box; margin-top: 12%; margin-bottom: 5rem; left: -5rem; } .screenshotGallery .textBox{ box-sizing: border-box; padding: 1.75rem; background-color: var(--color_cWhite); color: var(--color_cText); } .screenshotGallery.textboxNotAnimate .screenshotSlide .textBoxWrapper.top, .screenshotGallery.textboxNotAnimate .screenshotSlide .textBoxWrapper.bottom, .screenshotGallery.textboxNotAnimate .textBoxWrapper.bottom, .screenshotGallery .textBoxWrapper.bottom{ display: none; } .screenshotGallery .screenshotSlide .graphic2, .screenshotGallery .screenshotSlide .graphic1, .screenshotGallery .textBox{ border:solid 1px var(--color_cBlack); } .screenshotGallery .textBox > *{ margin-bottom: 1.5rem; } .screenshotGallery .textBox h2{ font-size: 2.25rem; line-height: 2.625rem; } .screenshotGallery .textBox a{ margin-bottom: 0.5rem; color: var(--color_cLink); } .screenshotGallery .textBox .arrow{ display: inline-block; } .screenshotGallery .textBox .arrow.mobile{ display: none; } .screenshotGallery .textBox .SetSeparator.Widget { padding: 0; margin-bottom: 2.25rem; } .screenshotGallery.textboxNotAnimate .textBox.noAnimation{ display: block; margin-bottom: 0; } .screenshotGallery .screenshotSlide{ margin-bottom: 0; } .screenshotGallery .additionalGraphics{ padding: 0 5rem; margin-top: -2rem; position: relative; float:left; width: 50%; box-sizing: border-box; } .screenshotGallery .additionalGraphics .BasicGraphic{ display: inline-block; max-width: 44%; margin-right: 20px; vertical-align: top; } .screenshotGallery .additionalGraphics .graphic2{ margin-top: 4rem; } @media screen and (max-width:1024px){ .screenshotGallery .wrapper{ padding-top: 3.75rem; } .screenshotGallery .screenshotSlide .browserWrapper{ width: 100%; } .screenshotGallery .textBoxWrapper{ width: 100%; float: none; margin-top: -3rem; margin-bottom: 0; } .screenshotGallery .textBox{ float: right; width: 50%; padding-bottom: 0.5rem; } .screenshotGallery .textBoxWrapper.top{ display: none; } .screenshotGallery.textboxNotAnimate .textBoxWrapper.bottom, .screenshotGallery .textBoxWrapper.bottom{ display: inherit; } .screenshotGallery .textBox > *{ margin-bottom: 1.25rem; } .screenshotGallery .textBox h2{ font-size: 2rem; } .screenshotGallery .additionalGraphics { margin-top: -3rem; } .screenshotGallery .additionalGraphics .BasicGraphic{ max-width: 10rem; margin-right: 0px; display: block; } .screenshotGallery .additionalGraphics .graphic2{ margin-top: 1.5rem; margin-left: 3.5rem; } } @media screen and (max-width:768px){ .screenshotGallery .additionalGraphics{ padding-left: 3rem; padding-right: 3rem; margin-top: -2.75rem; } .screenshotGallery .textBoxWrapper{ left: -3rem; margin-top: -2.75rem; } .screenshotGallery .textBox{ padding: 1.25rem; } } @media screen and (max-width:664px){ .screenshotGallery .wrapper{ padding: 2rem 0 0 0; } .screenshotGallery.textboxNotAnimate .wrapper{ padding: 0; } .screenshotGallery .textBoxWrapper{ left: 0; margin-top: 0; } .screenshotGallery .textBox{ background-color: transparent; width: 100%; color: var(--color_cWhite); padding-top: 2.25rem; padding-bottom: 1.125rem; } .screenshotGallery.textboxNotAnimate .textBox.noAnimation{ float: none; } .screenshotGallery .textBox a{ color: var(--color_cWhite); } .screenshotGallery .textBox > *{ margin-bottom: 1rem; } .screenshotGallery .textBox h2 { font-size: 1.5rem; line-height: 1.875rem; } .screenshotGallery.textboxNotAnimate .textBoxWrapper.bottom, .screenshotGallery .textBox .arrow{ display: none; } .screenshotGallery.textboxNotAnimate .textBoxWrapper.top, .screenshotGallery .textBox .arrow.mobile{ display: inherit; } .screenshotGallery .SetSeparator h5.title::before{ background-color: var(--color_cWhite); } .screenshotGallery.textboxNotAnimate .screenshotSlide .BasicGraphic.graphic{ margin-bottom: 2.25rem; } .screenshotGallery .additionalGraphics { display: none; } } .ListImageGallery.extendedSlideshow .stage { overflow: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .ListImageGallery.extendedSlideshow .backstage { display: none; } .ListImageGallery.extendedSlideshow .SetImage { height: 100%; width: 100%; z-index: 5; display: none; } .ListImageGallery.extendedSlideshow .SetImage.active { z-index: 15; display: block; opacity: 1; } .ListImageGallery.extendedSlideshow .stage [data-change-slide] { cursor:pointer; } .ListImageGallery.extendedSlideshow .cssAnimation .SetImage, .ListImageGallery.extendedSlideshow .translateCss .SetImage { height: 100%; z-index: 1; overflow: hidden; display: inline-block; position: relative; margin-right: -100%; vertical-align: top; -moz-user-select: none; -webkit-user-select: none; -webkit-transition-duration: 333ms; -moz-transition-duration: 333ms; -ms-transition-duration: 333ms; -o-transition-duration: 333ms; transition-duration: 333ms; -webkit-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -moz-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -ms-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); -o-transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); transition-timing-function: cubic-bezier(0.1, 0.7, 0.7, 1); } .ListImageGallery.extendedSlideshow .cssAnimation .SetImage.active { z-index: 15; } .ListImageGallery.extendedSlideshow .notransition, .ListImageGallery.extendedSlideshow .notransition .SetImage { -webkit-transition-duration: 0 !important; -moz-transition-duration: 0 !important; -ms-transition-duration: 0 !important; -o-transition-duration: 0 !important; transition-duration: 0 !important; -webkit-transition-delay: 0 !important; -moz-transition-delay: 0 !important; -ms-transition-delay: 0 !important; -o-transition-duration: 0 !important; transition-delay: 0 !important; } .ListImageGallery.extendedSlideshow .translateCss .SetImage { left: -100%; -webkit-transition-property: left; -moz-transition-property: left; -ms-transition-property: left; -o-transition-property: left; transition-property: left; } .ListImageGallery.extendedSlideshow .translateCss .SetImage.active { left: 0; } .ListImageGallery.extendedSlideshow .translateCss .SetImage.active ~ .SetImage { left: 100%; } .ListImageGallery.extendedSlideshow .fadeCss .SetImage { opacity: 0; -webkit-transition-property: opacity; -moz-transition-property: opacity; -ms-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity; } .ListImageGallery.extendedSlideshow .fadeCss .SetImage.active { opacity: 1; } /** animation progressbar **/ .ListImageGallery.extendedSlideshow .progressBar { width: 100%; height: 1px; background-color: var(--color_bcArea); } .ListImageGallery.extendedSlideshow .progressBar .progress { width: 0%; height: 100%; background-color: var(--color_cLink); } /** navigation **/ .ListImageGallery.extendedSlideshow .navigation { z-index: 100; right: 0; top: 0; position: absolute; } .ListImageGallery.extendedSlideshow .navigation ul { float: right; list-style-type: none; margin: 0; overflow: hidden; } .ListImageGallery.extendedSlideshow .navigationItems { width: 2em; height: 2em; } .ListImageGallery.extendedSlideshow .stage { position:relative; z-index: 20; } @media screen and (max-width: 664px) { .ListImageGallery.extendedSlideshow .translateCss .SetText, .ListImageGallery.extendedSlideshow .translateCss .SetText.active ~ .SetText, .ListImageGallery.extendedSlideshow .translateCss .SetImage, .ListImageGallery.extendedSlideshow .translateCss .SetImage.active ~ .SetImage{ left: 0 !important; display: block; } } /* Navigation bullets */ .ListImageGallery.extendedSlideshow .navigation { z-index: 100; right: 0; left: 0; top: inherit; bottom: 0; position: relative; height: auto; vertical-align: middle; text-align: center; margin: 5rem 0 0; } .ListImageGallery.extendedSlideshow .navigation > * { display: inline-block; } .ListImageGallery.extendedSlideshow .navigationTranslateWrapper { overflow: hidden; min-width: 4em; vertical-align: middle; } .ListImageGallery.extendedSlideshow .navigation ul { float: left; list-style-type: none; margin: 0; overflow: hidden; display: inline; max-width: 1.5em; text-align: right; line-height: 1em; } .ListImageGallery.extendedSlideshow .navigation li { display: none; line-height: 1em; } .ListImageGallery.extendedSlideshow .navigation li.active { display: inline-block; } .ListImageGallery.extendedSlideshow .navigationItems { width: 1.25em; height: auto; } .ListImageGallery.extendedSlideshow .imagesIndex { line-height: 1em; padding-left: 0.4em; } /* button left and right */ .ListImageGallery.extendedSlideshow [data-change-slide] { cursor: pointer; } .ListImageGallery.extendedSlideshow [data-change-slide]:before { content:""; height:100%; display:inline-block; vertical-align: bottom; } .ListImageGallery.extendedSlideshow [data-change-slide] span { background-color: rgba(0,0,0,0.3); border: solid 1px var(--color_cWhite); color: var(--color_cWhite); display: inline-block; vertical-align: middle; width: 3.125rem; height: 3.125rem; font-size: 1.5rem; line-height: 3.25rem; text-align: center; } .ListImageGallery.extendedSlideshow .visible[data-change-slide] span{ background-color: rgba(0,0,0,0.6); } .ListImageGallery.extendedSlideshow .visible[data-change-slide] span:hover{ color: rgba(0,0,0,0.6); background-color: var(--color_cWhite); } .ListImageGallery.extendedSlideshow .previousImage { left:0; text-align: right; } .ListImageGallery.extendedSlideshow .nextImage { right:0; text-align: left; } .ListImageGallery.extendedSlideshow .previousImage.mouseHover, .ListImageGallery.extendedSlideshow .nextImage.mouseHover { display: none; position: absolute; z-index: 10; top: 6rem; width: 0; } .ListImageGallery.extendedSlideshow .previousImage.mouseHover.visible, .ListImageGallery.extendedSlideshow .nextImage.mouseHover.visible { bottom: 4.25rem; width: 50%; } .ListImageGallery.extendedSlideshow .previousImage.mouseHover.visible { cursor: url("/Ressource/Graphic/Cursor/left-arrow.png"), url("/Ressource/Graphic/Cursor/left-arrow.cur"), auto; } .ListImageGallery.extendedSlideshow .nextImage.mouseHover.visible { cursor: url("/Ressource/Graphic/Cursor/right-arrow.png"), url("/Ressource/Graphic/Cursor/right-arrow.cur"), auto; } .ListImageGallery.extendedSlideshow .zoomIcon { display: none; z-index: 100; position: absolute; bottom: 0; right: 0; } .ListImageGallery.extendedSlideshow.showZoom .zoomIcon { display: block; } @media screen and (min-width: 1280px) { .ListImageGallery.extendedSlideshow .previousImage.mouseHover.visible, .ListImageGallery.extendedSlideshow .nextImage.mouseHover.visible{ display: initial; } } @media screen and (max-width: 768px) { } @media screen and (max-width: 664px) { .ListImageGallery.extendedSlideshow .navigation, .ListImageGallery.extendedSlideshow .navigationItems, .ListImageGallery.extendedSlideshow .navigation li.active, .ListImageGallery.extendedSlideshow .imagesIndex, .ListImageGallery.extendedSlideshow.showZoom .zoomIcon, .ListImageGallery.extendedSlideshow [data-change-slide], .ListImageGallery.extendedSlideshow [data-change-slide]::before{ display: none; } .ListImageGallery.extendedSlideshow .previousImage, .ListImageGallery.extendedSlideshow .nextImage, .ListImageGallery.extendedSlideshow .nextImage.visible{ cursor: auto; visibility: hidden; } } .ListLinkList li{ list-style-type: none; } .ListLinkList.simple { overflow:hidden; margin-bottom: 4.75rem; } .ListLinkList.simple > .title { margin-bottom: 1.625rem; } .ListLinkList.simple li{ position: relative; display: block; } .ListLinkList.simple .SetLink { text-decoration: none; text-transform: none; color: var(--color_cLink); font-size: 1.125rem; padding-left: 0; } .ListLinkList.simple .SetLink .arrow{ display: inline-block; width: 1rem; padding-left: 0; padding-right: 0.5rem; } .ListLinkList.simple .SetLink:hover{ text-decoration: underline !important; } .ListLinkList.simple .SetLink:hover .arrow{ width: 1rem; } @media screen and (min-width: 768px) { .ListLinkList.simple { margin-bottom: 3rem; } .ListLinkList.simple .SetLink { font-size: 1rem; } .ListLinkList > .title { margin-bottom: 1.25rem; } } @media screen and (max-width: 544px) { .ListLinkList.simple .SetLink { font-size: 0.9375rem; } } .ListLinkList { overflow:hidden; } .ListLinkList li{ display: inline-block; } .ListLinkList .SetLink { text-decoration: none; text-transform: uppercase; } .ListLinkList .actionButton { margin-bottom:0.5rem; } .ListLinkList > .title { } .ListLinkList.horizontalScroll li { display: inline-block; margin: 0.5rem; } .ListLinkList.horizontalScroll .link { overflow: hidden; } @media screen and (min-width: 544px) { .ListLinkList.horizontalScroll li { float: left; } .ListLinkList.horizontalScroll .link { width: 66.67%; padding-left: 0.5rem; } } @media screen and (max-width: 544px) { .ListLinkList.horizontalScroll { overflow-x: scroll; } .ListLinkList.horizontalScroll li { margin: 1rem 0.5rem; } } .ListTextList.Footnote ul.footnoteList { list-style: none; } .moduleGallery{ overflow: hidden; margin-bottom: 5rem; } .moduleGallery > .wrapper{ max-width: 80rem; box-sizing:border-box; margin:0 auto; padding: 0 5rem; position: relative; } .moduleGallery h3{ text-align: center; } .moduleGallery.ListTextList.extendedSlideshow .visible[data-change-slide] span:hover{ color: var(--color_cWhite); background-color: var(--color_cLink); } .moduleGallery.ListImageGallery.extendedSlideshow .navigation{ margin-bottom: 0; } .moduleGallery .SetText{ box-sizing: border-box; } .moduleGallery .ListTextList.blocks .wrapper{ display: grid; grid-gap: 0.5rem; grid-row-gap: 0.5rem; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; } .moduleGallery .SetText.block{ color: var(--color_cWhite); padding: 2.25rem; box-sizing: border-box; margin-bottom: 0; word-wrap: break-word; overflow-wrap: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; -webkit-hyphenate-limit-chars: auto 3; -moz-hyphenate-limit-chars: auto 3; -ms-hyphenate-limit-chars: auto 3; hyphenate-limit-chars: auto 3; height: 100%; } .moduleGallery a{ color: var(--color_cWhite); } .edit .moduleGallery a{ color: var(--color_cText); } .moduleGallery a:hover{ text-decoration: none; } .moduleGallery .linkWrapper{ vertical-align: bottom; } .moduleGallery .SetText.block .title{ font-family: "Typold-Book"; font-size: 2.25rem; line-height: 2.875rem; margin-bottom: 2rem; } .ListImageGallery.extendedSlideshow.moduleGallery .ListTextList.blocks a:hover{ color: var(--color_cWhite); } @media screen and (max-width:768px){ .moduleGallery > .wrapper{ padding-left: 3rem; padding-right: 3rem; } .moduleGallery .SetText.block{ padding: 1.5rem; margin-bottom: 0.5rem; } .moduleGallery .SetText.block .title{ font-size: 2rem; line-height: 2.875rem; } .ListImageGallery.ListTextList.extendedSlideshow.moduleGallery .translateCss .SetText.active { left: 0 !important; } .ListImageGallery.ListTextList.extendedSlideshow.moduleGallery .translateCss .SetText.active ~ .SetText, .ListImageGallery.ListTextList.extendedSlideshow.moduleGallery .translateCss .SetText{ left: 100% !important; display: inline-block; } .ListImageGallery.extendedSlideshow.moduleGallery .navigation, .ListImageGallery.extendedSlideshow.moduleGallery .navigationItems, .ListImageGallery.extendedSlideshow.moduleGallery .navigation li.active, .ListImageGallery.extendedSlideshow.moduleGallery .imagesIndex, .ListImageGallery.extendedSlideshow.moduleGallery.showZoom .zoomIcon, .ListImageGallery.extendedSlideshow.moduleGallery [data-change-slide], .ListImageGallery.extendedSlideshow.moduleGallery [data-change-slide]::before{ display: initial; } .ListImageGallery.extendedSlideshow.moduleGallery .previousImage, .ListImageGallery.extendedSlideshow.moduleGallery .nextImage, .ListImageGallery.extendedSlideshow.moduleGallery .nextImage.visible{ cursor: auto; visibility: inherit; } .ListImageGallery.extendedSlideshow.moduleGallery .ListTextList.blocks a, .ListImageGallery.extendedSlideshow.moduleGallery .ListTextList.blocks .SetText.block, .moduleGallery .ListTextList.blocks .wrapper{ display: block; } .ListImageGallery.extendedSlideshow.moduleGallery .navigationTranslateWrapper{ display: none; } } @media screen and (max-width:664px){ .moduleGallery > .wrapper{ padding-left: 1.25rem; padding-right: 1.25rem; } .moduleGallery h3{ margin-bottom: 1rem; } .moduleGallery .SetText.block{ } .moduleGallery .SetText.block .title{ font-size: 1.5rem; line-height: 1.875rem; } }