.form-control:disabled:active, .form-control:disabled.active, .open > .form-control:disabled.dropdown-toggle, .form-control.disabled:active, .form-control.disabled.active, .open > .form-control.disabled.dropdown-toggle, .form-control[readonly]:active, .form-control[readonly].active, .open > .form-control[readonly].dropdown-toggle, .btn:disabled:active, .boxInnerHeight193 .doubleCol .control a:disabled:active, .btn:disabled.active, .boxInnerHeight193 .doubleCol .control a:disabled.active, .open > .btn:disabled.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .open > a:disabled.dropdown-toggle, .btn.disabled:active, .boxInnerHeight193 .doubleCol .control a.disabled:active, .btn.disabled.active, .boxInnerHeight193 .doubleCol .control a.disabled.active, .open > .btn.disabled.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .open > a.disabled.dropdown-toggle, .bootstrap-select .btn.dropdown-toggle:disabled:active, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled:active, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled:active, .bootstrap-select .btn.dropdown-toggle:disabled.active, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.active, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled.active, .open > .bootstrap-select .btn.dropdown-toggle:disabled.dropdown-toggle, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle:disabled.dropdown-toggle, .bootstrap-select .btn.dropdown-toggle.disabled:active, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled:active, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled:active, .bootstrap-select .btn.dropdown-toggle.disabled.active, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.active, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled.active, .open > .bootstrap-select .btn.dropdown-toggle.disabled.dropdown-toggle, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle.disabled.dropdown-toggle, input:disabled:active, input:disabled.active, .open > input:disabled.dropdown-toggle, input.disabled:active, input.disabled.active, .open > input.disabled.dropdown-toggle, input[readonly]:active, input[readonly].active, .open > input[readonly].dropdown-toggle { color: #4f4b43; background-color: #FCFBF5; border-color: #ece9e2; } .form-control:disabled:active:hover, .form-control:disabled:active:focus, .form-control:disabled:active.focus, .form-control:disabled.active:hover, .form-control:disabled.active:focus, .form-control:disabled.active.focus, .open > .form-control:disabled.dropdown-toggle:hover, .open > .form-control:disabled.dropdown-toggle:focus, .open > .form-control:disabled.dropdown-toggle.focus, .form-control.disabled:active:hover, .form-control.disabled:active:focus, .form-control.disabled:active.focus, .form-control.disabled.active:hover, .form-control.disabled.active:focus, .form-control.disabled.active.focus, .open > .form-control.disabled.dropdown-toggle:hover, .open > .form-control.disabled.dropdown-toggle:focus, .open > .form-control.disabled.dropdown-toggle.focus, .form-control[readonly]:active:hover, .form-control[readonly]:active:focus, .form-control[readonly]:active.focus, .form-control[readonly].active:hover, .form-control[readonly].active:focus, .form-control[readonly].active.focus, .open > .form-control[readonly].dropdown-toggle:hover, .open > .form-control[readonly].dropdown-toggle:focus, .open > .form-control[readonly].dropdown-toggle.focus, .btn:disabled:active:hover, .boxInnerHeight193 .doubleCol .control a:disabled:active:hover, .btn:disabled:active:focus, .boxInnerHeight193 .doubleCol .control a:disabled:active:focus, .btn:disabled:active.focus, .boxInnerHeight193 .doubleCol .control a:disabled:active.focus, .btn:disabled.active:hover, .boxInnerHeight193 .doubleCol .control a:disabled.active:hover, .btn:disabled.active:focus, .boxInnerHeight193 .doubleCol .control a:disabled.active:focus, .btn:disabled.active.focus, .boxInnerHeight193 .doubleCol .control a:disabled.active.focus, .open > .btn:disabled.dropdown-toggle:hover, .boxInnerHeight193 .doubleCol .control .open > a:disabled.dropdown-toggle:hover, .open > .btn:disabled.dropdown-toggle:focus, .boxInnerHeight193 .doubleCol .control .open > a:disabled.dropdown-toggle:focus, .open > .btn:disabled.dropdown-toggle.focus, .boxInnerHeight193 .doubleCol .control .open > a:disabled.dropdown-toggle.focus, .btn.disabled:active:hover, .boxInnerHeight193 .doubleCol .control a.disabled:active:hover, .btn.disabled:active:focus, .boxInnerHeight193 .doubleCol .control a.disabled:active:focus, .btn.disabled:active.focus, .boxInnerHeight193 .doubleCol .control a.disabled:active.focus, .btn.disabled.active:hover, .boxInnerHeight193 .doubleCol .control a.disabled.active:hover, .btn.disabled.active:focus, .boxInnerHeight193 .doubleCol .control a.disabled.active:focus, .btn.disabled.active.focus, .boxInnerHeight193 .doubleCol .control a.disabled.active.focus, .open > .btn.disabled.dropdown-toggle:hover, .boxInnerHeight193 .doubleCol .control .open > a.disabled.dropdown-toggle:hover, .open > .btn.disabled.dropdown-toggle:focus, .boxInnerHeight193 .doubleCol .control .open > a.disabled.dropdown-toggle:focus, .open > .btn.disabled.dropdown-toggle.focus, .boxInnerHeight193 .doubleCol .control .open > a.disabled.dropdown-toggle.focus, .bootstrap-select .btn.dropdown-toggle:disabled:active:hover, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled:active:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled:active:hover, .bootstrap-select .btn.dropdown-toggle:disabled:active:focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled:active:focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled:active:focus, .bootstrap-select .btn.dropdown-toggle:disabled:active.focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled:active.focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled:active.focus, .bootstrap-select .btn.dropdown-toggle:disabled.active:hover, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.active:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled.active:hover, .bootstrap-select .btn.dropdown-toggle:disabled.active:focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.active:focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled.active:focus, .bootstrap-select .btn.dropdown-toggle:disabled.active.focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.active.focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled.active.focus, .open > .bootstrap-select .btn.dropdown-toggle:disabled.dropdown-toggle:hover, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.dropdown-toggle:hover, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle:disabled.dropdown-toggle:hover, .open > .bootstrap-select .btn.dropdown-toggle:disabled.dropdown-toggle:focus, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.dropdown-toggle:focus, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle:disabled.dropdown-toggle:focus, .open > .bootstrap-select .btn.dropdown-toggle:disabled.dropdown-toggle.focus, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.dropdown-toggle.focus, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle:disabled.dropdown-toggle.focus, .bootstrap-select .btn.dropdown-toggle.disabled:active:hover, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled:active:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled:active:hover, .bootstrap-select .btn.dropdown-toggle.disabled:active:focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled:active:focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled:active:focus, .bootstrap-select .btn.dropdown-toggle.disabled:active.focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled:active.focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled:active.focus, .bootstrap-select .btn.dropdown-toggle.disabled.active:hover, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.active:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled.active:hover, .bootstrap-select .btn.dropdown-toggle.disabled.active:focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.active:focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled.active:focus, .bootstrap-select .btn.dropdown-toggle.disabled.active.focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.active.focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled.active.focus, .open > .bootstrap-select .btn.dropdown-toggle.disabled.dropdown-toggle:hover, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.dropdown-toggle:hover, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle.disabled.dropdown-toggle:hover, .open > .bootstrap-select .btn.dropdown-toggle.disabled.dropdown-toggle:focus, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.dropdown-toggle:focus, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle.disabled.dropdown-toggle:focus, .open > .bootstrap-select .btn.dropdown-toggle.disabled.dropdown-toggle.focus, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.dropdown-toggle.focus, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle.disabled.dropdown-toggle.focus, input:disabled:active:hover, input:disabled:active:focus, input:disabled:active.focus, input:disabled.active:hover, input:disabled.active:focus, input:disabled.active.focus, .open > input:disabled.dropdown-toggle:hover, .open > input:disabled.dropdown-toggle:focus, .open > input:disabled.dropdown-toggle.focus, input.disabled:active:hover, input.disabled:active:focus, input.disabled:active.focus, input.disabled.active:hover, input.disabled.active:focus, input.disabled.active.focus, .open > input.disabled.dropdown-toggle:hover, .open > input.disabled.dropdown-toggle:focus, .open > input.disabled.dropdown-toggle.focus, input[readonly]:active:hover, input[readonly]:active:focus, input[readonly]:active.focus, input[readonly].active:hover, input[readonly].active:focus, input[readonly].active.focus, .open > input[readonly].dropdown-toggle:hover, .open > input[readonly].dropdown-toggle:focus, .open > input[readonly].dropdown-toggle.focus { color: #4f4b43; background-color: #FCFBF5; border-color: #ece9e2; } .form-control:disabled:active, .form-control:disabled.active, .open > .form-control:disabled.dropdown-toggle, .form-control.disabled:active, .form-control.disabled.active, .open > .form-control.disabled.dropdown-toggle, .form-control[readonly]:active, .form-control[readonly].active, .open > .form-control[readonly].dropdown-toggle, .btn:disabled:active, .boxInnerHeight193 .doubleCol .control a:disabled:active, .btn:disabled.active, .boxInnerHeight193 .doubleCol .control a:disabled.active, .open > .btn:disabled.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .open > a:disabled.dropdown-toggle, .btn.disabled:active, .boxInnerHeight193 .doubleCol .control a.disabled:active, .btn.disabled.active, .boxInnerHeight193 .doubleCol .control a.disabled.active, .open > .btn.disabled.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .open > a.disabled.dropdown-toggle, .bootstrap-select .btn.dropdown-toggle:disabled:active, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled:active, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled:active, .bootstrap-select .btn.dropdown-toggle:disabled.active, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.active, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled.active, .open > .bootstrap-select .btn.dropdown-toggle:disabled.dropdown-toggle, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle:disabled.dropdown-toggle, .bootstrap-select .btn.dropdown-toggle.disabled:active, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled:active, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled:active, .bootstrap-select .btn.dropdown-toggle.disabled.active, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.active, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled.active, .open > .bootstrap-select .btn.dropdown-toggle.disabled.dropdown-toggle, .open > .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .open > .bootstrap-select a.dropdown-toggle.disabled.dropdown-toggle, input:disabled:active, input:disabled.active, .open > input:disabled.dropdown-toggle, input.disabled:active, input.disabled.active, .open > input.disabled.dropdown-toggle, input[readonly]:active, input[readonly].active, .open > input[readonly].dropdown-toggle { background-image: none; } .form-control:disabled.disabled:hover, .form-control:disabled.disabled:focus, .form-control:disabled.disabled.focus, .form-control:disabled[disabled]:hover, .form-control:disabled[disabled]:focus, .form-control:disabled[disabled].focus, fieldset[disabled] .form-control:disabled:hover, fieldset[disabled] .form-control:disabled:focus, fieldset[disabled] .form-control:disabled.focus, .form-control.disabled.disabled:hover, .form-control.disabled.disabled:focus, .form-control.disabled.disabled.focus, .form-control.disabled[disabled]:hover, .form-control.disabled[disabled]:focus, .form-control.disabled[disabled].focus, fieldset[disabled] .form-control.disabled:hover, fieldset[disabled] .form-control.disabled:focus, fieldset[disabled] .form-control.disabled.focus, .form-control[readonly].disabled:hover, .form-control[readonly].disabled:focus, .form-control[readonly].disabled.focus, .form-control[readonly][disabled]:hover, .form-control[readonly][disabled]:focus, .form-control[readonly][disabled].focus, fieldset[disabled] .form-control[readonly]:hover, fieldset[disabled] .form-control[readonly]:focus, fieldset[disabled] .form-control[readonly].focus, .btn:disabled.disabled:hover, .boxInnerHeight193 .doubleCol .control a:disabled.disabled:hover, .btn:disabled.disabled:focus, .boxInnerHeight193 .doubleCol .control a:disabled.disabled:focus, .btn:disabled.disabled.focus, .boxInnerHeight193 .doubleCol .control a:disabled.disabled.focus, .btn:disabled[disabled]:hover, .boxInnerHeight193 .doubleCol .control a:disabled[disabled]:hover, .btn:disabled[disabled]:focus, .boxInnerHeight193 .doubleCol .control a:disabled[disabled]:focus, .btn:disabled[disabled].focus, .boxInnerHeight193 .doubleCol .control a:disabled[disabled].focus, fieldset[disabled] .btn:disabled:hover, fieldset[disabled] .boxInnerHeight193 .doubleCol .control a:disabled:hover, .boxInnerHeight193 .doubleCol .control fieldset[disabled] a:disabled:hover, fieldset[disabled] .btn:disabled:focus, fieldset[disabled] .boxInnerHeight193 .doubleCol .control a:disabled:focus, .boxInnerHeight193 .doubleCol .control fieldset[disabled] a:disabled:focus, fieldset[disabled] .btn:disabled.focus, fieldset[disabled] .boxInnerHeight193 .doubleCol .control a:disabled.focus, .boxInnerHeight193 .doubleCol .control fieldset[disabled] a:disabled.focus, .btn.disabled.disabled:hover, .boxInnerHeight193 .doubleCol .control a.disabled.disabled:hover, .btn.disabled.disabled:focus, .boxInnerHeight193 .doubleCol .control a.disabled.disabled:focus, .btn.disabled.disabled.focus, .boxInnerHeight193 .doubleCol .control a.disabled.disabled.focus, .btn.disabled[disabled]:hover, .boxInnerHeight193 .doubleCol .control a.disabled[disabled]:hover, .btn.disabled[disabled]:focus, .boxInnerHeight193 .doubleCol .control a.disabled[disabled]:focus, .btn.disabled[disabled].focus, .boxInnerHeight193 .doubleCol .control a.disabled[disabled].focus, fieldset[disabled] .btn.disabled:hover, fieldset[disabled] .boxInnerHeight193 .doubleCol .control a.disabled:hover, .boxInnerHeight193 .doubleCol .control fieldset[disabled] a.disabled:hover, fieldset[disabled] .btn.disabled:focus, fieldset[disabled] .boxInnerHeight193 .doubleCol .control a.disabled:focus, .boxInnerHeight193 .doubleCol .control fieldset[disabled] a.disabled:focus, fieldset[disabled] .btn.disabled.focus, fieldset[disabled] .boxInnerHeight193 .doubleCol .control a.disabled.focus, .boxInnerHeight193 .doubleCol .control fieldset[disabled] a.disabled.focus, .bootstrap-select .btn.dropdown-toggle:disabled.disabled:hover, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.disabled:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled.disabled:hover, .bootstrap-select .btn.dropdown-toggle:disabled.disabled:focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.disabled:focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled.disabled:focus, .bootstrap-select .btn.dropdown-toggle:disabled.disabled.focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.disabled.focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled.disabled.focus, .bootstrap-select .btn.dropdown-toggle:disabled[disabled]:hover, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled[disabled]:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled[disabled]:hover, .bootstrap-select .btn.dropdown-toggle:disabled[disabled]:focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled[disabled]:focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled[disabled]:focus, .bootstrap-select .btn.dropdown-toggle:disabled[disabled].focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled[disabled].focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled[disabled].focus, fieldset[disabled] .bootstrap-select .btn.dropdown-toggle:disabled:hover, fieldset[disabled] .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled:hover, .boxInnerHeight193 .doubleCol .control fieldset[disabled] .bootstrap-select a.dropdown-toggle:disabled:hover, fieldset[disabled] .bootstrap-select .btn.dropdown-toggle:disabled:focus, fieldset[disabled] .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled:focus, .boxInnerHeight193 .doubleCol .control fieldset[disabled] .bootstrap-select a.dropdown-toggle:disabled:focus, fieldset[disabled] .bootstrap-select .btn.dropdown-toggle:disabled.focus, fieldset[disabled] .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled.focus, .boxInnerHeight193 .doubleCol .control fieldset[disabled] .bootstrap-select a.dropdown-toggle:disabled.focus, .bootstrap-select .btn.dropdown-toggle.disabled.disabled:hover, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.disabled:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled.disabled:hover, .bootstrap-select .btn.dropdown-toggle.disabled.disabled:focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.disabled:focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled.disabled:focus, .bootstrap-select .btn.dropdown-toggle.disabled.disabled.focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.disabled.focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled.disabled.focus, .bootstrap-select .btn.dropdown-toggle.disabled[disabled]:hover, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled[disabled]:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled[disabled]:hover, .bootstrap-select .btn.dropdown-toggle.disabled[disabled]:focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled[disabled]:focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled[disabled]:focus, .bootstrap-select .btn.dropdown-toggle.disabled[disabled].focus, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled[disabled].focus, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled[disabled].focus, fieldset[disabled] .bootstrap-select .btn.dropdown-toggle.disabled:hover, fieldset[disabled] .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled:hover, .boxInnerHeight193 .doubleCol .control fieldset[disabled] .bootstrap-select a.dropdown-toggle.disabled:hover, fieldset[disabled] .bootstrap-select .btn.dropdown-toggle.disabled:focus, fieldset[disabled] .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled:focus, .boxInnerHeight193 .doubleCol .control fieldset[disabled] .bootstrap-select a.dropdown-toggle.disabled:focus, fieldset[disabled] .bootstrap-select .btn.dropdown-toggle.disabled.focus, fieldset[disabled] .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled.focus, .boxInnerHeight193 .doubleCol .control fieldset[disabled] .bootstrap-select a.dropdown-toggle.disabled.focus, input:disabled.disabled:hover, input:disabled.disabled:focus, input:disabled.disabled.focus, input:disabled[disabled]:hover, input:disabled[disabled]:focus, input:disabled[disabled].focus, fieldset[disabled] input:disabled:hover, fieldset[disabled] input:disabled:focus, fieldset[disabled] input:disabled.focus, input.disabled.disabled:hover, input.disabled.disabled:focus, input.disabled.disabled.focus, input.disabled[disabled]:hover, input.disabled[disabled]:focus, input.disabled[disabled].focus, fieldset[disabled] input.disabled:hover, fieldset[disabled] input.disabled:focus, fieldset[disabled] input.disabled.focus, input[readonly].disabled:hover, input[readonly].disabled:focus, input[readonly].disabled.focus, input[readonly][disabled]:hover, input[readonly][disabled]:focus, input[readonly][disabled].focus, fieldset[disabled] input[readonly]:hover, fieldset[disabled] input[readonly]:focus, fieldset[disabled] input[readonly].focus { background-color: #FCFBF5; border-color: #ece9e2; } .form-control:disabled .badge, .form-control.disabled .badge, .form-control[readonly] .badge, .btn:disabled .badge, .boxInnerHeight193 .doubleCol .control a:disabled .badge, .btn.disabled .badge, .boxInnerHeight193 .doubleCol .control a.disabled .badge, .bootstrap-select .btn.dropdown-toggle:disabled .badge, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:disabled .badge, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle:disabled .badge, .bootstrap-select .btn.dropdown-toggle.disabled .badge, .bootstrap-select .boxInnerHeight193 .doubleCol .control a.dropdown-toggle.disabled .badge, .boxInnerHeight193 .doubleCol .control .bootstrap-select a.dropdown-toggle.disabled .badge, input:disabled .badge, input.disabled .badge, input[readonly] .badge { color: #FCFBF5; background-color: #4f4b43; } .watchlistControls { background-color: #eaeaea; background-image: none; padding: 10px; vertical-align: top; box-sizing: border-box; } .watchlistControls:before, .watchlistControls:after { content: " "; display: table; } .watchlistControls:after { clear: both; } #Watchlist .productLine { padding: 10px 0px 10px; border-bottom: 1px solid #eaeaea; } #Watchlist .productLine:last-child { border-bottom: none; } #Watchlist .description { height: auto; width: auto; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance: textfield; } /* Anpassung Hintergrund in gefülten Formelementen in Chrome */ input, textarea, select { color: #7d7d7d; } input:-webkit-autofill, input:-webkit-autofill:focus, input:-webkit-autofill:active, input:-webkit-autofill:hover, textarea:-webkit-autofill, textarea:-webkit-autofill:focus, textarea:-webkit-autofill:active, textarea:-webkit-autofill:hover, select:-webkit-autofill, select:-webkit-autofill:focus, select:-webkit-autofill:active, select:-webkit-autofill:hover { background-color: #FCFBF5 !important; -webkit-box-shadow: 0 0 0 50px #FCFBF5 inset; -webkit-text-fill-color: #7d7d7d; } .section-label:hover { text-decoration: none; color: inherit; } .section-label p { margin: 20px 0 10px 0; padding-bottom: 0; } /* pagination */ .disabled-paginatin-element, .form-pagination .form-pagination-input-wrapper .form-pagination-input.disabled { opacity: 0.4; filter: alpha(opacity=40); pointer-events: none; } .disabled-paginatin-element:hover, .form-pagination .form-pagination-input-wrapper .form-pagination-input.disabled:hover, .disabled-paginatin-element:focus, .form-pagination .form-pagination-input-wrapper .form-pagination-input.disabled:focus { cursor: not-allowed; background-color: #fff; color: #4f4b43 !important; } .form-pagination { text-align: right; font-size: 0; } .form-pagination .form-pagination-arrow { display: inline-block; vertical-align: middle; color: #F2BD29; background-color: #fff; border-color: #F2BD29; } .form-pagination .form-pagination-arrow:hover, .form-pagination .form-pagination-arrow:focus, .form-pagination .form-pagination-arrow.focus { color: #7d7d7d; background-color: #F2BD29; border-color: #F2BD29; } .form-pagination .form-pagination-arrow.disabled, .form-pagination .form-pagination-arrow[disabled] { color: #7d7d7d; background-color: transparent; border-color: #7d7d7d; } .form-pagination .form-pagination-arrow.disabled:hover, .form-pagination .form-pagination-arrow.disabled:focus, .form-pagination .form-pagination-arrow.disabled.focus, .form-pagination .form-pagination-arrow[disabled]:hover, .form-pagination .form-pagination-arrow[disabled]:focus, .form-pagination .form-pagination-arrow[disabled].focus { color: #7d7d7d; background-color: transparent; border-color: #7d7d7d; } .form-pagination .form-pagination-arrow.disabled { opacity: .4; } .form-pagination .pagination-select-wrapper { float: left; } @media (min-width: 1024px) { .form-pagination .pagination-select-wrapper { float: right; max-width: 90px; } } @media (min-width: 1280px) { .form-pagination .pagination-select-wrapper { max-width: none; } } @media (max-width: 840px) { .form-pagination .pagination-select-wrapper { width: 50%; } } @media (max-width: 1023px) { .form-pagination .pagination-select-wrapper { padding-right: 0; } } @media (max-width: 767px) { .form-pagination .pagination-select-wrapper { width: auto; min-width: 100px; float: right; padding-right: 10px; } } @media (max-width: 500px) { .form-pagination .pagination-select-wrapper { min-width: 80px; padding-right: 0; } } .form-pagination .control-label-left, .form-pagination .control-label-right { display: inline-block; padding: 10px 10px 0 10px; } @media (max-width: 767px) { .form-pagination .control-label-left, .form-pagination .control-label-right { font-size: 13px !important; padding-left: 0; } } @media (max-width: 1023px) { .form-pagination .control-label-left { width: 100%; text-align: left; } } @media (max-width: 767px) { .form-pagination .control-label-left { width: auto; } } .form-pagination .control-label-right { float: right; padding-left: 0; } @media (min-width: 768px) { .form-pagination .control-label-right { padding-left: 10px; } } @media (min-width: 1024px) { .form-pagination .control-label-right { padding-left: 0; } } @media (max-width: 500px) { .form-pagination .control-label-right { display: none; } } .form-pagination .form-pagination-input-wrapper { position: relative; } .form-pagination .form-pagination-input-wrapper .form-pagination-input { font-size: 15px; width: 30px; height: 40px; margin: 0 5px; text-align: center; display: inline-block; border: 1px solid #ece9e2; border-radius: 4px 0 4px 0; outline: 0; vertical-align: middle; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } @media (max-width: 500px) { .form-pagination .form-pagination-input-wrapper .form-pagination-input { margin: 0; } } .form-pagination .form-pagination-input-wrapper .form-pagination-input:hover, .form-pagination .form-pagination-input-wrapper .form-pagination-input:focus { border-color: #F2BD29; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .form-pagination .form-pagination-input-wrapper span { font-size: 15px; } @media (min-width: 1024px) { .form-pagination .form-pagination-input-wrapper .form-pagination-input { width: 80px; padding-right: 50px; text-align: right; } .form-pagination .form-pagination-input-wrapper .form-pagination-input.large-page-number { width: 90px; padding-right: 60px; } .form-pagination .form-pagination-input-wrapper .form-pagination-input-pagecountlable-short { display: inline; position: absolute; line-height: 40px; left: 38px; top: 0; pointer-events: none; color: #7d7d7d; } .form-pagination .form-pagination-input-wrapper .form-pagination-input-pagecountlable-long { display: none; } } @media (max-width: 1023px) { .form-pagination .form-pagination-input-pagecountlable-short { display: none; } .form-pagination .form-pagination-input-pagecountlable-long { visibility: hidden; opacity: 0; transition: opacity 0.5s; display: inline-block; position: absolute; bottom: 50px; left: 50%; transform: translate(-50%, 0); border: 1px solid gray; background-color: white; padding: 2px 5px; width: 110px; text-align: center; } .form-pagination .form-pagination-input-pagecountlable-long:before { content: ' '; position: absolute; width: 0; height: 0; border-style: solid; border-width: 10px 10px 0 10px; border-color: #7d7d7d transparent transparent transparent; bottom: -10px; left: 0; right: 0; margin-left: auto; margin-right: auto; } .form-pagination .form-pagination-input-pagecountlable-long:after { content: ' '; position: absolute; width: 0; height: 0; border-style: solid; border-width: 8px 8px 0 8px; border-color: white transparent transparent transparent; bottom: -8px; left: 0; right: 0; margin-left: auto; margin-right: auto; } .form-pagination .form-pagination-input:focus + .form-pagination-input-pagecountlable-long { visibility: visible; opacity: 1; } .form-pagination.xs-text-center .form-pagination-input-wrapper .form-pagination-input { width: 80px; padding-right: 50px; text-align: right; } .form-pagination.xs-text-center .form-pagination-input-wrapper .form-pagination-input-pagecountlable-short { display: inline; position: absolute; line-height: 40px; left: 38px; top: 0; pointer-events: none; color: #7d7d7d; } .form-pagination.xs-text-center .form-pagination-input-wrapper .form-pagination-input-pagecountlable-long { display: none; } } .col-seperator-birthday:before, .col-seperator-birthday:after { content: "."; position: absolute !important; top: 0; display: block; width: 7%; text-align: center; line-height: 40px; } .col-seperator-birthday:after { right: -7px; } .col-seperator-birthday:before { left: -7px; } .form-myBader-popup i { font-weight: 700; line-height: 1; margin: 0 5px; vertical-align: middle; } .form-myBader-popup .col-seperator { padding-left: 0; } .form-myBader-popup .col-seperator input { width: 80%; margin-left: 20%; text-align: center; } @media (max-width: 500px) { .form-myBader-popup .col-seperator input { width: 70%; margin-left: 30%; } } .form-myBader-popup .col-seperator:before { content: "-"; float: left; display: block; width: 15%; text-align: center; line-height: 40px; } /* * === CSS 3 Radio === */ .custom-radio input[type=radio] { position: absolute; left: -10000px; } .custom-radio label { display: inline-block; cursor: pointer; position: relative; padding-left: 25px; } .custom-radio label:before { content: ""; display: inline-block; width: 17px; height: 17px; margin-right: 10px; position: absolute; top: 0; left: 1px; bottom: 0; margin: auto 0; background-color: #fff; border-radius: 50%; border: 1px solid #ece9e2; font-size: 0; z-index: 2; } .custom-radio label:after { display: inline-block; width: 17px; height: 17px; margin-right: 10px; position: absolute; top: 0; left: 5px; bottom: 0; margin: auto 0; background-color: #fff; border-radius: 50%; border: 1px solid #ece9e2; font-size: 0; } .custom-radio input[type=radio]:checked ~ label:before { content: "\2022"; background-color: #fff; border: 1px solid #7d7d7d; text-align: center; line-height: 8px; } .custom-radio input[type=radio]:checked ~ label:after { content: ""; background-color: #7d7d7d; text-align: center; line-height: 8px; z-index: 2; width: 9px; height: 9px; border: 1px solid #7d7d7d; } /* * === CSS 3 CHECKBOX === */ .custom-checkbox input[type=checkbox] { position: absolute; left: -10000px; } .custom-checkbox label { display: inline-block; cursor: pointer; position: relative; padding-left: 25px; } .custom-checkbox label:before { content: ""; display: inline-block; font-family: 'BADER-Iconfont' !important; width: 15px; height: 15px; border-radius: 4px 0; margin-right: 10px; position: absolute; top: 0; left: 0; bottom: 0; margin: auto 0; background-color: #fff; border: 1px solid #4f4b43; } .custom-checkbox input[type=checkbox]:checked ~ label:before { content: "\e904"; color: #4f4b43; font-size: 16px; font-weight: 700; text-align: center; line-height: 8px; } .custom-checkbox input[type=checkbox]:focus ~ label:before { border-color: #F2BD29; } .FreeSearchInput .input-group-addon { position: absolute; width: 100px; } @media (max-width: 767px) { input.form-control[name$=".town"] { margin-top: 8px; } } .alert.alert-availability { background: #eaeaea; } .alert span img { display: inline-block; } .price-draw-teaser { border: 1px solid #e6e6e6; background-color: #f6f4f1; padding: 15px; margin-bottom: 20px; border-radius: 5px 0; } .price-draw-teaser-headline { font-size: 16px; text-transform: uppercase; } .price-draw-teaser-desc { margin: 0; padding: 0; } .table-list { width: 100%; } .table-list td { width: 55%; line-height: 30px; vertical-align: top; word-break: break-word; } .table-list .list-name { width: 45%; } /* * === all helpers for xs === */ @media (max-width: 767px) { .table-responsive-01 { margin: 0; } .table-responsive-01 thead { display: none; } .table-responsive-01 tr { border-bottom: 1px solid #ece9e2; padding-bottom: 15px; margin-bottom: 15px; display: block; width: 100%; float: left; } .table-responsive-01 tr:last-child { border: 0; padding: 0; } .table-responsive-01 tbody tr td { display: block; width: 100%; float: left; clear: both; text-align: right; min-height: 35px; border: 0; } .table-responsive-01 tbody tr td:before { content: attr(data-th) ""; font-weight: bold; width: 6.5em; display: inline-block; float: left; text-align: left; } } @media (max-width: 1023px) { .js-simple-fade-slideshow { position: relative; width: 100%; } .js-simple-fade-slideshow div { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; text-align: center; display: none; } .js-simple-fade-slideshow div ul { display: inline-block; float: none !important; } .js-simple-fade-slideshow div ul li { float: none !important; display: inline-block; padding: 0; } } .header-top { background-color: #757571; height: 35px; line-height: 35px; font-size: 14px; overflow: hidden; } .header-top *, .header-top a { color: #fff; } .header-top a { text-decoration: none; } .header-top a.js-logout { font-size: 11px; } .header-top a:hover, .header-top a:focus { color: #F2BD29; text-decoration: none; } .header-top a:hover #numberOfWishlistItems, .header-top a:focus #numberOfWishlistItems { color: #F2BD29; text-decoration: none; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .header-top #numberOfWishlistItems { -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } @media (max-width: 767px) { .header-top { text-align: center; } } .header-top .list-center { text-align: center; } .header-top .list-center li { position: relative; margin: 0; padding-right: 20px; } @media (max-width: 1023px) { .header-top .list-center li { padding-right: 0; } } .header-top .list-center li:before { content: "."; right: 5px; position: absolute; line-height: 23px; } .header-top .list-center li:last-child:before { content: " "; } .header-top .header-top-inner { width: auto; max-width: 1600px; } @media (max-width: 767px) { .header-top .header-top-inner { width: auto; } } .header-middle.cheader-checkout { border-bottom: 1px solid #ddd; } .header-middle.cheader-checkout .header-middle-inner { margin-bottom: 0; padding: 10px; } @media (min-width: 768px) { .header-middle.cheader-checkout .header-middle-inner { padding: 20px 10px; } } .header-middle-inner { padding: 20px 10px; width: auto; max-width: 1600px; } @media (max-width: 1023px) { .header-middle-inner { padding: 20px 10px; } } @media (max-width: 767px) { .header-middle-inner { width: auto; padding: 20px 10px 0 10px; } } .header-middle-inner .HeaderLogo img { max-width: 160px; margin: 0 auto; } @media (min-width: 501px) { .header-middle-inner .HeaderLogo img { max-width: 40%; margin: 0 auto; } } @media (min-width: 768px) { .header-middle-inner .HeaderLogo img { max-width: 100%; margin: 0; } } @media (min-width: 1600px) { .header-middle-inner .area-wrapper { display: flex; flex-direction: row-reverse; justify-content: space-around; width: 45%; } } @media (max-width: 1023px) { .header-middle-inner .area-wrapper { width: 270px; } .header-middle-inner .area-wrapper li { margin-right: 0; width: 33%; overflow: hidden; word-wrap: break-word; text-align: center; } } @media (max-width: 767px) { .header-middle-inner .area-wrapper { width: 100%; height: 40px; background: rgba(236, 233, 226, 0.5); overflow: hidden; } .header-middle-inner .area-wrapper li { width: 20%; display: inline-block; margin: 0; border-right: 1px solid #ece9e2; } .header-middle-inner .area-wrapper li.area-wrapper-cart { border: 0; } .header-middle-inner .area-wrapper li.area-menu { -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; /* fixed gray line */ } .header-middle-inner .area-wrapper li.area-menu:hover { background-color: #ece9e2; cursor: pointer; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .header-middle-inner .area-wrapper li.area-menu i { font-size: 17px; } } @media (max-width: 767px) and (max-width: 500px) { .header-middle-inner .area-wrapper li.area-menu .mrm { margin-right: 0; } } @media (max-width: 767px) { .header-middle-inner .area-wrapper li .menuToggler { display: block; text-align: center; padding: 8px; line-height: 24px; color: #4f4b43; font-size: 16px; } } .header-middle-inner .header-additional-area { padding-top: 20px; } @media (max-width: 1023px) and (min-width: 768px) { .header-middle-inner .header-additional-area { padding-top: 0; } } @media (max-width: 767px) { .header-middle-inner .header-additional-area { padding-right: 0; padding-left: 0; } } .header-middle-inner .header-additional-area .area-item { display: table; transition: color 0.5s ease; text-decoration: none; } @media (max-width: 1023px) { .header-middle-inner .header-additional-area .area-item { width: 100%; } } .header-middle-inner .header-additional-area .area-item a:hover { text-decoration: none; } .header-middle-inner .header-additional-area .area-item:hover { text-decoration: none; } .header-middle-inner .header-additional-area .area-item:hover .area-icon, .header-middle-inner .header-additional-area .area-item:hover .area-name { color: #F2BD29; transition: color 0.5s ease; } @media (max-width: 767px) { .header-middle-inner .header-additional-area .area-item:hover .area-icon, .header-middle-inner .header-additional-area .area-item:hover .area-name { color: #4f4b43; } } .header-middle-inner .header-additional-area .area-item:hover .area-subline { color: #A3A3A3; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .header-middle-inner .header-additional-area .area-item.area-cart .area-icon { position: relative; } .header-middle-inner .header-additional-area .area-item.area-cart .cart-counter { display: block; width: 18px; height: 18px; line-height: 18px; background-color: #F2BD29; border-radius: 50%; color: #4f4b43; font-size: 11px; text-align: center; position: absolute; top: 7px; right: -7px; } @media (max-width: 767px) { .header-middle-inner .header-additional-area .area-item.area-cart .cart-counter { top: 15px; right: -20px; left: 0; margin: auto; } } @media (max-width: 767px) { .header-middle-inner .header-additional-area .area-item { display: block; text-align: center; } .header-middle-inner .header-additional-area .area-item:hover { background-color: #ece9e2; } .header-middle-inner .header-additional-area .area-item.active { background-color: #F2BD29; } } .header-middle-inner .header-additional-area .area-item .area-icon { width: 20px; padding-right: 20px; display: table-cell; vertical-align: middle; color: #4f4b43; font-size: 24px; transition: color 0.5s ease; } @media (max-width: 767px) { .header-middle-inner .header-additional-area .area-item .area-icon { color: #4f4b43; } } @media (max-width: 1023px) and (min-width: 768px) { .header-middle-inner .header-additional-area .area-item .area-icon { display: block; margin: 0 auto; } } @media (max-width: 767px) { .header-middle-inner .header-additional-area .area-item .area-icon { padding: 8px; height: 40px; line-height: 26px; width: 100%; margin: 0 auto; display: inline-block; font-size: 16px; } } .header-middle-inner .header-additional-area .area-block { display: inline-block; } .header-middle-inner .header-additional-area .area-block .area-name { display: block; color: #4f4b43; transition: color 0.5s ease; } .header-middle-inner .header-additional-area .area-block .area-subline { color: #A3A3A3; transition: color 0.5s ease; } .header-middle-inner .header-additional-area .user-infos-inner { padding: 10px; border-width: 1px 0; position: relative; } .header-middle-inner .header-additional-area .user-infos-inner .btn, .header-middle-inner .header-additional-area .user-infos-inner .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .header-middle-inner .header-additional-area .user-infos-inner a { width: 100%; } .header-middle-inner .header-search-wrapper { float: right; width: 50%; } @media (min-width: 1280px) { .header-middle-inner .header-search-wrapper { max-width: 600px; } } @media (max-width: 1599px) { .header-middle-inner .header-search-wrapper { margin-right: 3%; } } @media (max-width: 1279px) { .header-middle-inner .header-search-wrapper { width: 300px; } } @media (max-width: 1023px) and (min-width: 768px) { .header-middle-inner .header-search-wrapper { width: 260px; padding-top: 10px; margin-right: 10px; } } @media (max-width: 767px) { .header-middle-inner .header-search-wrapper { width: 100%; margin-right: 0; } } .header-middle-inner .header-search-wrapper .form-group { position: relative; } @media (max-width: 767px) { .header-middle-inner .header-search-wrapper .form-group { margin-bottom: 0; padding: 10px; } } .header-middle-inner .header-search-wrapper .form-group .input-group { width: 100%; } .header-middle-inner .header-search-wrapper .form-group:before { content: "\e90e"; font-family: 'BADER-Iconfont' !important; position: absolute; left: 0; top: 0; z-index: 10; color: #a3a3a3; line-height: 40px; padding: 0 10px; } @media (max-width: 767px) { .header-middle-inner .header-search-wrapper .form-group:before { left: 10px; top: 10px; } } .header-middle-inner .header-search-wrapper .form-group .input-group-addon { border: 0; border-radius: 0 0 5px 0; background: #F2BD29; color: #4f4b43; display: inline-block; width: 80px; height: 40px; position: absolute; top: 0; right: 0; z-index: 2; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } @media (max-width: 767px) { .header-middle-inner .header-search-wrapper .form-group .input-group-addon { border-radius: 0; } } @media (max-width: 767px), (min-width: 1280px) { .header-middle-inner .header-search-wrapper .form-group .input-group-addon { width: 120px; } } .header-middle-inner .header-search-wrapper .form-group .input-group-addon:hover { background: #A3A3A3; color: #fff; cursor: pointer; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .header-middle-inner .header-search-wrapper .form-control { border-radius: 5px 0 5px 0; padding: 6px 100px 6px 50px; width: 100%; z-index: 1; } @media (max-width: 767px) { .header-middle-inner .header-search-wrapper .form-control { border-radius: 0; } } @media (max-width: 767px), (min-width: 1280px) { .header-middle-inner .header-search-wrapper .form-control { padding-right: 140px; } } .boxPadding { padding: 10px; position: relative; } #Content { /* fix tables for cms pages agb */ } #Content #RestColMiddle .toggleContainer table { width: 100% !important; } #Content #RestColMiddle .toggleContainer table td { padding: 5px; } #Content #RestColMiddle p { font-size: 15px; } @media (max-width: 1023px) { .homepage .SidebarColRight { display: block !important; height: 570px; } } @media (max-width: 1023px) and (max-width: 1023px) { .homepage .SidebarColRight { display: none !important; } } @media (max-width: 1023px) { .homepage .SidebarColRight > div, .homepage .SidebarColRight > p { display: block; float: left; min-height: 280px; margin: 0; padding: 0; width: 25%; } .homepage .SidebarColRight br.spacer10 { clear: none; } } h3.dogEar, #RestColMiddle h3, .dogEarBoxHalf h3, .h3.dogEar, #RestColMiddle .h3, .dogEarBoxHalf .h3 { font-weight: 700; font-size: 16px; padding: 0; line-height: inherit; margin: 20px 0 10px; } #RestColRight p, #RestColLeft p, .registration p { max-width: 100%; } dl.services dd { margin-top: 0; } dl.services dd li { width: 165px; float: left; white-space: nowrap; margin: 0; padding: 0; } @media (max-width: 767px) { dl.services dd li { width: 100%; } } .socialBox { height: 20px; } @media (max-width: 767px) { p.textR a.refreshShopCart, p.textR a.print, #ShopCartAppend_ { display: inline-block; line-height: inherit; margin-bottom: 10px; float: right; clear: both; } #DeliveryAddressChoice div { display: block; } } h1.h1welcometext { font-size: 15px; margin: 20px 0 10px 0; } @media (max-width: 1023px) { h1.h1welcometext { text-align: center; } } #h1welcometext.with-breadcrumb { float: right; text-align: right; width: 50%; } #h1welcometext.with-breadcrumb h1.h1welcometext { text-align: right; } @media (max-width: 767px) { #h1welcometext.with-breadcrumb h1.h1welcometext { font-size: 12px; } } @media (min-width: 1024px) { .breadcrumb-wrapper { float: left; width: 100%; } .breadcrumb-wrapper #BreadCrumbTrail { float: left; } .breadcrumb-wrapper #h1welcometext .h1welcometext { margin: 20px 0 10px 0; } } .tpl-searchResult #RestColRight .headline-results-info { padding-bottom: 0; margin: 0 0 20px 0; text-align: center; } .tpl-searchResult #RestColRight .headline-results-info h1 { font-size: 20px; color: #7d7d7d; display: inline-block; float: none; font-weight: 500; padding-right: 0; } .tpl-searchResult #RestColRight .headline-results-info .resultInfo { font-size: 20px; color: #7d7d7d; } .tpl-searchResult #RestColRight .panel-transparent > .panel-heading { color: #7d7d7d; } .tpl-searchResult #RestColRight .panel-transparent > .panel-heading h3 { font-size: 14px; } .content-search-result { margin-bottom: 40px; } .content-search-result .content-search-headline { margin: 0 0 10px 0; padding: 0; font-weight: 700; font-size: 16px; color: #7d7d7d; } .content-search-result .content-result-list { float: left; padding: 0; width: 100%; } .content-search-result .content-result-list li { padding: 0; margin-bottom: 10px; } .content-search-result .content-result-list li:last-child { margin-bottom: 0; } .content-search-result .content-result-list li a { color: #7d7d7d; font-size: 16px; text-decoration: underline; } .content-search-result .content-result-list li a:hover, .content-search-result .content-result-list li a:focus { color: #F2BD29; } /* * === FOOTER SECTION TOP === */ footer.no-padding { padding-left: 0; padding-right: 0; margin-bottom: 20px; } .service-info-wrapper { box-shadow: inset 0px 30px 20px -25px rgba(0, 0, 0, 0.2); padding: 20px 10px 0 10px; color: #fff; } .service-info-wrapper .service-info-container { text-align: center; } .service-info-wrapper .service-info-container .service-info-col { margin-bottom: 20px; } .service-info-wrapper .service-info-container .service-info-light { color: #bab9b3; } .service-info-wrapper .service-info-container .service-info-name { font-size: 24px; } .service-info-wrapper .service-info-container .service-info-text { font-size: 24px; color: #fff; } .service-info-wrapper .service-info-container .service-info-text i { margin-right: 5px; vertical-align: middle; } .service-info-wrapper .service-info-container .service-info-text a { color: #fff; text-decoration: none; } .service-info-wrapper .service-info-container .service-info-text a:hover, .service-info-wrapper .service-info-container .service-info-text a:focus { color: #F2BD29; } .service-info-wrapper .service-info-container .service-info-col-company-data { text-align: center; } .service-info-wrapper .service-info-container .service-info-col-company-data .service-info-text { display: table; margin: 0 auto; } .service-info-wrapper .service-info-container .service-info-col-company-data .service-info-text i { display: table-cell; padding-right: 10px; padding-top: 5px; vertical-align: top; } .service-info-wrapper .service-info-container .service-info-col-company-data .service-info-text .service-info-text-name { display: table-cell; } @media (min-width: 768px) { .service-info-wrapper { padding: 50px 10px; } .service-info-wrapper .service-info-container { text-align: left; } .service-info-wrapper .service-info-container .service-info-col { margin-bottom: 0; } .service-info-wrapper .service-info-container .service-info-light { padding-left: 35px; } .service-info-wrapper .service-info-container .service-info-col-first { text-align: center; margin-bottom: 30px; /* if no service-info-light is available */ } .service-info-wrapper .service-info-container .service-info-col-first > span.service-info-name { margin-top: 22px; } } @media (min-width: 1024px) { .service-info-wrapper .service-info-container { text-align: left; } .service-info-wrapper .service-info-container .service-info-name { max-width: 280px; display: block; margin: 0 auto; } .service-info-wrapper .service-info-container .service-info-first-col { margin-bottom: 0; } .service-info-wrapper .service-info-container .service-info-col-company-data { text-align: left; } .service-info-wrapper .service-info-container .service-info-col-company-data .service-info-text { margin: 0; } } /* * === FOOTER SECTION MIDDLE === */ @media (max-width: 767px) { .footer-middle-wrapper { padding-top: 20px; background-color: #7d7d7d; } } .cms-footer-column-wrapper { float: right; } .static-footer-column-wrapper { float: right; margin-top: 20px; } .static-footer-column-content { text-align: center; } .static-footer-column-content .static-footer-column-content-headline { font-size: 18px; /* 18px */ color: #7d7d7d; } .static-footer-column-content .static-footer-other-font { font-size: 20px; color: #7d7d7d; font-family: "PT Serif", serif; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .cms-footer-column-component .btn, .cms-footer-column-component .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .cms-footer-column-component a, .static-footer-column-content .btn, .static-footer-column-content .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .static-footer-column-content a { background-color: transparent; border-color: #fff; color: #fff; min-width: 140px; margin-bottom: 20px; } .cms-footer-column-component .btn:hover, .cms-footer-column-component .boxInnerHeight193 .doubleCol .control a:hover, .boxInnerHeight193 .doubleCol .control .cms-footer-column-component a:hover, .cms-footer-column-component .btn:focus, .cms-footer-column-component .boxInnerHeight193 .doubleCol .control a:focus, .boxInnerHeight193 .doubleCol .control .cms-footer-column-component a:focus, .static-footer-column-content .btn:hover, .static-footer-column-content .boxInnerHeight193 .doubleCol .control a:hover, .boxInnerHeight193 .doubleCol .control .static-footer-column-content a:hover, .static-footer-column-content .btn:focus, .static-footer-column-content .boxInnerHeight193 .doubleCol .control a:focus, .boxInnerHeight193 .doubleCol .control .static-footer-column-content a:focus { background-color: #ece9e2; border-color: #ece9e2; color: #7d7d7d; } .cms-footer-column-component .btn-table, .static-footer-column-content .btn-table { display: inline-block; } .cms-footer-column-component .btn-table i, .static-footer-column-content .btn-table i { width: 20%; } .cms-footer-column-component .btn-table .btn-name, .static-footer-column-content .btn-table .btn-name { width: 80%; } @media (max-width: 767px) { .cms-footer-column-component .btn-table, .static-footer-column-content .btn-table { margin: 6px 0 10px 22px; } } .cms-footer-column-component .cms-footer-headline { height: 44px; line-height: 40px; padding: 0 20px; width: 100%; margin: 0 0 2px 0; background-color: #ece9e2; border: 1px solid #ece9e2; border-radius: 4px 0; color: #7d7d7d; font-size: 15px; position: relative; cursor: pointer; } .cms-footer-column-component .cms-footer-headline:before { content: "\e916"; font-family: 'BADER-Iconfont' !important; position: absolute; right: 20px; } .cms-footer-column-component ul { display: none; margin: 10px 0; } .cms-footer-column-component ul li a { color: #fff; display: block; text-decoration: none; } .cms-footer-column-component ul li a:hover, .cms-footer-column-component ul li a:focus { color: #bab9b3; } .cms-footer-column-component ul li a:not(.btn) { padding: 0 22px; } .cms-footer-column-component ul li.footer-icon-float { float: left; margin-right: 10px; } .cms-footer-column-component.in .cms-footer-headline:before { content: "\e90a"; } .cms-footer-column-component.in ul { display: block; } .cms-footer-column-component:last-child { padding-bottom: 20px; } @media (min-width: 768px) { .cms-footer-column-component:last-child { padding-bottom: 0; } } @media (min-width: 768px) { .static-footer-column-wrapper { margin-top: 0; } .footer-middle-wrapper { background-color: #FCFBF5; padding: 50px 60px 30px 60px; } .cms-footer-column-wrapper { float: left; } .static-footer-column-content { margin-bottom: 20px; } .static-footer-column-content.bottom { margin-bottom: 0; margin-top: 20px; } .static-footer-column-content .static-footer-other-font { text-align: right; margin: 20px; } .static-footer-column-content .static-footer-column-content-btn { display: inline-block; margin: 0 10px; } .cms-footer-column-component .cms-footer-headline { line-height: 19px; background-color: transparent; border-color: transparent; padding: 0; font-weight: 700; font-size: 16px; color: #7d7d7d; margin: 0; cursor: default; } .cms-footer-column-component .cms-footer-headline:before { content: ""; } .cms-footer-column-component.in .cms-footer-headline:before { content: ""; } .cms-footer-column-component ul { display: block; margin: 0; height: auto !important; } .cms-footer-column-component ul li { margin-bottom: 5px; } .cms-footer-column-component ul li a:not(.btn) { padding: 0; color: #7d7d7d; padding: 5px 0; } .cms-footer-column-component ul li a:not(.btn):hover, .cms-footer-column-component ul li a:not(.btn):focus { text-decoration: underline; color: #4f4b43; } .static-footer-column-content .btn, .static-footer-column-content .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .static-footer-column-content a, .cms-footer-column-component .btn, .cms-footer-column-component .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .cms-footer-column-component a { background-color: transparent; border-color: #7d7d7d; color: #7d7d7d; min-width: 140px; margin-bottom: 20px; } .static-footer-column-content .btn:hover, .static-footer-column-content .boxInnerHeight193 .doubleCol .control a:hover, .boxInnerHeight193 .doubleCol .control .static-footer-column-content a:hover, .static-footer-column-content .btn:focus, .static-footer-column-content .boxInnerHeight193 .doubleCol .control a:focus, .boxInnerHeight193 .doubleCol .control .static-footer-column-content a:focus, .cms-footer-column-component .btn:hover, .cms-footer-column-component .boxInnerHeight193 .doubleCol .control a:hover, .boxInnerHeight193 .doubleCol .control .cms-footer-column-component a:hover, .cms-footer-column-component .btn:focus, .cms-footer-column-component .boxInnerHeight193 .doubleCol .control a:focus, .boxInnerHeight193 .doubleCol .control .cms-footer-column-component a:focus { background-color: #7d7d7d; border-color: #7d7d7d; color: #fff !important; } } @media (min-width: 1024px) { .static-footer-column-wrapper { float: left; } .static-footer-column-wrapper .static-footer-column-content { text-align: right; } .static-footer-column-wrapper .static-footer-column-content.bottom { margin: 0; } .static-footer-column-wrapper .static-footer-column-content .static-footer-other-font { margin: 20px 0; } .static-footer-column-wrapper .static-footer-column-content .static-footer-column-content-btn { margin: 0 0 10px 0; text-align: center; } .static-footer-column-wrapper .static-footer-column-content .static-footer-column-content-btn a:not(.bnt) { margin: 0; display: block; min-width: 120px; } .cms-footer-column-wrapper { float: right; } } /* * === FOOTER SECTION BOTTOM === */ .footer-bottom-wrapper { padding-top: 20px; } .footer-bottom-wrapper .footer-bottom-container .hr-light { width: 95%; width: calc(100% - 20px); } .footer-bottom-wrapper .footer-bottom-container .section-one img { margin: auto; display: block; max-width: 100%; height: auto; } .footer-bottom-wrapper .footer-bottom-container .section-one .center-content { display: inline-block; vertical-align: middle; } .footer-bottom-wrapper .footer-bottom-container .section-center-content { text-align: center; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col { margin-bottom: 10px; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col a { text-decoration: none; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col img { max-height: 60px; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col.payment-bundle img { max-height: 70px; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col .section-col-img-list { text-align: center; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col .section-col-img-list li { display: inline-block; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col .section-col-img-list.center-vertical { max-width: 100%; white-space: nowrap; overflow: hidden; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col .section-col-img-list.center-vertical li { vertical-align: middle; line-height: 60px; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col .section-col-img-list.center-vertical li.dp-logo { max-width: 70%; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col .section-col-img-list.center-vertical li.vg-logo { max-width: 30%; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col.section-col-flags img { opacity: 1; filter: alpha(opacity=100); } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col.section-col-flags img:hover, .footer-bottom-wrapper .footer-bottom-container .section-second .section-col.section-col-flags img:focus { opacity: 0.6; filter: alpha(opacity=60); } .footer-bottom-wrapper .footer-bottom-container .section-col-link-list { text-align: center; margin-bottom: 20px; } .footer-bottom-wrapper .footer-bottom-container .section-col-link-list li { position: relative; display: inline-block; padding: 0 5px; margin-right: 5px; } .footer-bottom-wrapper .footer-bottom-container .section-col-link-list li:before { content: "|"; position: absolute; top: 0; right: -5px; color: #7d7d7d; } .footer-bottom-wrapper .footer-bottom-container .section-col-link-list li:last-child:before { content: ""; } .footer-bottom-wrapper .footer-bottom-container .section-col-link-list li a { text-decoration: none; } .footer-bottom-wrapper .footer-bottom-container .text-light { color: #bab9b3; } .footer-bottom-wrapper .footer-bottom-container .bader-slogan { font-size: 20px; color: #7d7d7d; font-family: "PT Serif", serif; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); margin: 20px 0; text-align: center; } .footer-bottom-wrapper .footer-bottom-container .bader-slogan a { text-decoration: none; display: inline-block; margin: 0 auto; } @media (min-width: 768px) { .footer-bottom-wrapper .footer-bottom-container .hr-light { width: 80%; } .footer-bottom-wrapper .footer-bottom-container .section-second { margin-bottom: 20px; } .footer-bottom-wrapper .footer-bottom-container .section-second .section-col { margin-bottom: 0; } .footer-bottom-wrapper .footer-bottom-container .bader-slogan { margin: 20px 0 0 0; } } /* * === GENERAL === */ .size-wrapper { display: none; } .pdp-overview-link, .pdp-onlinecatalog-link { margin-bottom: 5px; display: inline-block; } @media (min-width: 768px) { .pdp-overview-link, .pdp-onlinecatalog-link { margin-bottom: 20px; } } @media (min-width: 768px) { .pdp-onlinecatalog-link { display: inline-block; font-weight: normal; text-align: center; vertical-align: middle; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; height: 40px; padding: 9px 12px; font-size: 15px; line-height: 1.42857; border-radius: 4px 0 4px 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-decoration: none; text-transform: none; color: #7d7d7d; background-color: transparent; border-color: #7d7d7d; /* color: $color; background-color: $background; border-color: $border; */ } .pdp-onlinecatalog-link:hover, .pdp-onlinecatalog-link:focus, .pdp-onlinecatalog-link.focus { color: #4f4b43; text-decoration: none; } .pdp-onlinecatalog-link:active, .pdp-onlinecatalog-link.active { outline: 0; background-image: none; } .pdp-onlinecatalog-link i { margin-right: 10px; } .pdp-onlinecatalog-link .text-decoration { text-decoration: underline; } .pdp-onlinecatalog-link:hover span.text-decoration, .pdp-onlinecatalog-link:focus span.text-decoration { text-decoration: none; color: #F2BD29; } .pdp-onlinecatalog-link:focus, .pdp-onlinecatalog-link.focus { color: #fff; background-color: #7d7d7d; border-color: #7d7d7d; } .pdp-onlinecatalog-link:hover { color: #fff !important; background-color: #7d7d7d; border-color: #7d7d7d; } .pdp-onlinecatalog-link:active, .pdp-onlinecatalog-link.active, .open > .pdp-onlinecatalog-link.dropdown-toggle { color: #fff; background-color: #7d7d7d; border-color: #7d7d7d; } .pdp-onlinecatalog-link:active:hover, .pdp-onlinecatalog-link:active:focus, .pdp-onlinecatalog-link:active.focus, .pdp-onlinecatalog-link.active:hover, .pdp-onlinecatalog-link.active:focus, .pdp-onlinecatalog-link.active.focus, .open > .pdp-onlinecatalog-link.dropdown-toggle:hover, .open > .pdp-onlinecatalog-link.dropdown-toggle:focus, .open > .pdp-onlinecatalog-link.dropdown-toggle.focus { color: #fff; background-color: #7d7d7d; border-color: #7d7d7d; } .pdp-onlinecatalog-link:active, .pdp-onlinecatalog-link.active, .open > .pdp-onlinecatalog-link.dropdown-toggle { background-image: none; } .pdp-onlinecatalog-link.disabled:hover, .pdp-onlinecatalog-link.disabled:focus, .pdp-onlinecatalog-link.disabled.focus, .pdp-onlinecatalog-link[disabled]:hover, .pdp-onlinecatalog-link[disabled]:focus, .pdp-onlinecatalog-link[disabled].focus, fieldset[disabled] .pdp-onlinecatalog-link:hover, fieldset[disabled] .pdp-onlinecatalog-link:focus, fieldset[disabled] .pdp-onlinecatalog-link.focus { background-color: #7d7d7d; border-color: #7d7d7d; } .pdp-onlinecatalog-link .badge { color: #7d7d7d; background-color: #fff; } } .price-details-center-wrapper { display: table; width: 100%; } .price-details-center-wrapper .price-details-wrapper-left, .price-details-center-wrapper .price-details-wrapper-right { display: table-cell; } .price-details-center-wrapper .price-details-wrapper-left.preis-tipp { width: 80%; } .price-details-center-wrapper .price-details-wrapper-right { width: 20%; vertical-align: middle; } .price-details-center-wrapper .price-details-wrapper-right .preis-tipp-wrapper { width: 100%; max-width: 90px; float: right; padding-left: 20px; } .price-wrapper { text-align: right; } .price-wrapper .price-type, .price-wrapper .reduce { color: #7d7d7d; font-size: 16px; margin-right: 5px; } .price-wrapper .reduce { text-decoration: line-through; } .price-wrapper .price-sale { display: block; font-size: 30px; } .price-wrapper .price-sale .prefix { font-size: 16px; } @media (max-width: 767px) { .price-wrapper .price-sale { display: block; text-align: right; } } .price-wrapper .price-info-old { margin-top: 15px; display: block; } @media (max-width: 767px) { .price-wrapper .price-info-old { display: inline-block; text-align: right; } } .price-wrapper .monthly-rate { display: block; color: #7d7d7d; } .price-wrapper .monthly-rate a { color: #7d7d7d; } #energyLabelBox .layer-wrapper { width: 226px; } #energyLabelBox .layer-wrapper .layerContent { text-align: center; } #energyLabelBox .layer-wrapper .layerContent img { display: inline-block; } .tax-wrapper { color: #A3A3A3; font-size: 12px; text-align: right; display: block; } .predicates { text-align: center; margin-bottom: 30px; } .predicates li { background: none; display: inline-block; vertical-align: top; } .predicates li img { max-width: 100px; } .video-container { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; } .video-container .video-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .productSpecifications, .productSpecifications-linkContainer { width: 100%; display: inline-block; text-align: right; margin: 0 0 5px 0; } .productSpecifications img, .productSpecifications-linkContainer img { display: inline-block; } .variante-list-type-btn li { float: none; display: inline-block; margin: 0 4px 3px 0; } .variante-list-type-btn li a { display: inline-block; height: 33px; line-height: 26px; width: 33px; padding: 2px; background-color: #FFF; border: 1px solid #7d7d7d; border-radius: 4px 0; cursor: pointer; float: none; position: relative; text-align: center; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; font-size: 12px; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .variante-list-type-btn li a:hover, .variante-list-type-btn li a:focus { background-color: #7d7d7d; color: #fff; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .variante-list-type-btn li.selected a { background-color: #7d7d7d; color: #fff; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; pointer-events: none; } .variante-list-type-btn li.conditional a { opacity: 0.4; filter: alpha(opacity=40); cursor: not-allowed; } .variante-list-type-btn.variante-list-type-btn-feature li a { min-width: 51px; width: 100%; -webkit-transition: width 0s; transition: width 0s; } .pds-product-list-carousel .productListCarousel { text-align: center; color: #7d7d7d; font-size: 18px; } .pds-product-list-carousel .sliderProducts .js-sliderProducts-c-boxBody { background: transparent; border: 0; } .productDetailPage-top { margin-bottom: 20px; } .productDetailPage { /* * === LEFT === */ /* * === RIGHT === */ } .productDetailPage iframe { width: 100%; } @media (min-width: 768px) { .productDetailPage #pds-xsl-headline-placeholder { display: none; } } @media (min-width: 768px) { .productDetailPage .pds-headline { overflow: hidden; } } .productDetailPage .pds-headline .pds-headline-inner { width: calc(100% - 80px); float: left; } @media (max-width: 767px) { .productDetailPage .pds-headline .pds-headline-inner { margin-bottom: 20px; } } .productDetailPage .pds-headline .pds-headline-inner h1 { font-size: 18px; color: #7d7d7d; font-weight: 700; margin: 15px 0; } .productDetailPage .pds-headline .img-logo { float: left; } @media (max-width: 767px) { .productDetailPage .pds-headline .img-logo { margin-top: -15px; } } @media (min-width: 768px) { .productDetailPage-left { max-width: 530px; } } .productDetailPage-left .thumbnails { float: left; width: 82px; margin-right: 15px; /* fixed on load bug */ min-height: 1px; } .productDetailPage-left .thumbnails .slick-slide.slick-slide-selected img { border-color: #F2BD29; } .productDetailPage-left .pds-thumbnails-wrapper { margin: auto; /* required for pds thumbnail slider */ } .productDetailPage-left .pds-thumbnails-wrapper .slick-prev, .productDetailPage-left .pds-thumbnails-wrapper .slick-next { padding: 0; border: 0; } .productDetailPage-left .pds-thumbnails-wrapper .js-pds-thumbnails.with-prev-and-next-arrows { padding: 40px 0; } .productDetailPage-left .pds-thumbnails-wrapper .js-thumbnailLink { display: block; width: 80px; height: 80px; margin-bottom: 11px; } .productDetailPage-left .pds-thumbnails-wrapper img { opacity: 0.6; } .productDetailPage-left .pds-thumbnails-wrapper img.translucent { opacity: 0.6 !important; } .productDetailPage-left .pds-thumbnails-wrapper .slick-slide-selected img { opacity: 1; } .productDetailPage-left .pds-thumbnails-wrapper .slick-slide-selected img.translucent { opacity: 1 !important; } .productDetailPage-left .pds-thumbnails-wrapper .slick-slide img { margin: auto; border: 1px solid #ece9e2; } .productDetailPage-left .pds-thumbnails-wrapper .slick-next { right: 0; left: 0; margin: 0 auto; bottom: 0; top: inherit; } .productDetailPage-left .pds-thumbnails-wrapper .slick-next:before { content: "\e905"; } .productDetailPage-left .pds-thumbnails-wrapper .slick-prev { right: 0; left: 0; margin: 0 auto; top: 0; bottom: inherit; } .productDetailPage-left .pds-thumbnails-wrapper .slick-prev:before { content: "\e908"; } .productDetailPage-left .pds-main-image-wrapper { float: right; width: 80%; width: calc(100% - 97px); position: relative; } .productDetailPage-left .pds-main-image-wrapper .pds-main-image-slider { margin-bottom: 20px; text-align: center; } .productDetailPage-left .pds-main-image-wrapper .pds-main-image-slider.slick-dotted { margin-bottom: 50px; } .productDetailPage-left .pds-main-image-wrapper a { max-width: 100%; } .productDetailPage-left .pds-main-image-wrapper .image-badge-wrapper { display: inline-block; position: relative; max-width: 100%; } @media (min-width: 768px) { .productDetailPage-left .pds-main-image-wrapper .image-badge-wrapper img { flex: 1; max-width: 100%; max-height: 530px; } } .productDetailPage-right { float: right; padding-left: 50px; } .productDetailPage-right-inner-padding { padding: 0 20px; } .productDetailPage-right .product-details-short-description { padding: 0; margin-bottom: 5px; font-size: 15px; } .productDetailPage-right .hr-light { margin: 10px 0; } .productDetailPage-right .brand p { margin: 0; padding: 0; float: right; } .productDetailPage-right .tax-wrapper, .productDetailPage-right .monthly-rate { float: right; } .productDetailPage-right .tax-wrapper { padding-left: 5px; margin-left: 5px; position: relative; } .productDetailPage-right .tax-wrapper.extended:before { content: "|"; position: absolute; left: 0; top: 0; } .productDetailPage-right .pds-form-horizontal { padding: 0 10px; margin-bottom: 15px; } .productDetailPage-right .pds-form-horizontal .form-group { width: 50%; float: left; margin: 0 0 15px 0; } .productDetailPage-right .pds-form-horizontal .form-group .control-label { text-align: left; padding: 0 10px 0 10px; margin-bottom: 10px; color: #7d7d7d; } .productDetailPage-right .pds-form-horizontal .form-group .col-xs-12 { padding: 0; } .productDetailPage-right .pds-form-horizontal.form-attributes { padding-right: 0; margin-right: -10px; } .productDetailPage-right .price-info-old, .productDetailPage-right .price-sale { display: inline-block; } .productDetailPage-right .price-info-old { margin-right: 10px; } .productDetailPage-right .price { font-size: 30px; } .productDetailPage-right .product-availability { margin: 20px 0; } .productDetailPage-right .product-add-to-cart-wrapper .form-group { margin-bottom: 0; } .productDetailPage-right .panel-group-accordion { padding: 0 20px; } /* * === BOTTOM === */ .pds-payment-info img { max-width: 80%; } @media (min-width: 1024px) and (max-width: 1279px) { .pds-payment-info img { max-width: 90%; } } .pds-bottom-left-col-padding { padding-left: 10px; } @media (min-width: 768px) { .pds-bottom-left-col-padding { padding-left: 75px; max-width: 530px; } } @media (min-width: 1024px) { .pds-bottom-left-col-padding { padding-left: 105px; } } .pds-bottom-right-col-padding { padding-left: 10px; float: right; } @media (min-width: 1024px) { .pds-bottom-right-col-padding { padding-left: 50px; } } .product-detail-bottom h2 { font-size: 20px; } .product-detail-bottom .panel-group { margin-bottom: 5px; } .product-detail-bottom .panel-group-accordion.two-column { /* thumbnail width + margin & row margin = 95px */ /* main image margin-right + inner-padding pds details = 90px */ } .product-detail-bottom .panel-group-accordion.two-column .pds-left-colmn { padding-left: 85px; } .product-detail-bottom .panel-group-accordion.two-column .pds-right-colmn { padding-left: 90px; } .product-detail-bottom .accordionDescription ul { padding-left: 17px; margin-bottom: 15px; list-style-type: circle; } /* * fix for full-background-color(.bg-greyVlight) * added padding/margin only for proudct sliders * we don't know is the cms slot are empty or not */ .pds-product-list-carousel .sliderProducts { margin-bottom: 20px; padding: 20px 0; } @media (max-width: 1023px) { .productDetailPage-left .pds-main-image-wrapper { width: 85%; width: calc(100% - 70px); } .productDetailPage-left .thumbnails { width: 55px; } .productDetailPage-left .pds-thumbnails-wrapper .js-thumbnailLink { width: 50px; height: 50px; } .productDetailPage-right { padding: 0 10px; } .productDetailPage-right .pds-form-horizontal { margin: 0 -10px; } .productDetailPage-right .pds-form-horizontal .form-group { width: 100%; margin-bottom: 10px; padding-left: 15px; } .product-detail-bottom .panel-group-accordion.two-column .pds-left-colmn { padding-left: 65px; } .product-detail-bottom .panel-group-accordion.two-column .pds-right-colmn { padding-left: 95px; } } /* only screen xs styles */ @media (max-width: 767px) { .predicates li img { margin: 0 auto; } .productDetailPage-right { padding: 0 10px; } .productDetailPage-right .panel-group-accordion, .productDetailPage-right .pds-form-horizontal { padding: 0; } .productDetailPage-right .pds-form-horizontal .form-group { padding-left: 0; } .productDetailPage-right iframe { width: 100%; } .productDetailPage-right-inner-padding { padding: 0; } .productDetailPage-left .pds-main-image-wrapper { width: 100%; /* fix for empty images */ min-height: 250px; float: left; /* fix for touch devices */ } .productDetailPage-left .pds-main-image-wrapper img { max-height: 400px; margin: auto; } .productDetailPage-left .pds-main-image-wrapper #ProductDisplay { pointer-events: none; } .productDetailPage-left .thumbnails { width: 100%; margin-top: 20px; display: none; } .productDetailPage-left .thumbnails .js-pds-thumbnails.with-prev-and-next-arrows { padding: 0; } .productDetailPage-left .thumbnails .slick-list { text-align: center; padding: 0 !important; } .productDetailPage-left .thumbnails .slick-track { width: 100% !important; transform: none !important; } .productDetailPage-left .thumbnails .slick-slide, .productDetailPage-left .thumbnails .js-thumbnailLink { display: inline-block; float: none; width: 10px !important; height: 10px !important; border-radius: 50%; } .productDetailPage-left .thumbnails .slick-slide { margin: 0 5px; background-color: #ece9e2; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .productDetailPage-left .thumbnails .slick-slide.slick-slide-selected { background-color: #878682; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .productDetailPage-left .thumbnails .slick-arrow { display: none !important; } .productDetailPage-left .thumbnails img { display: none; } .productDetailPage-top { margin-bottom: 0; } .product-detail-bottom .panel-group-accordion.two-column .pds-left-colmn, .product-detail-bottom .panel-group-accordion.two-column .pds-right-colmn { padding: 0; width: 100%; } .zoomContainer, .zoomWindowContainer { display: none !important; } } /* end @media (max-width: $screen-xsl-max) */ @media (min-width: 768px) { .tabbedNav li { display: inline-block; margin-right: 10px; padding: 0 10px; border: 1px solid #ece9e2; border-radius: 4px 0 4px 0; } .tabbedNav li.active { border-bottom-color: #ece9e2; } .tabbedContainer { margin-top: -1px; padding: 10px; border: 1px solid #ece9e2; } } /* @media (min-width: $screen-sm-min) */ #RestColRight .headline-results-info { padding-bottom: 20px; } #RestColRight .headline-results-info h1 { font-size: 16px; font-weight: 700; margin: 0; float: left; padding-right: 6px; } #RestColRight .headline-results-info .resultInfo { white-space: nowrap; } .flex-row { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -moz-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: start; -webkit-align-content: flex-start; -ms-flex-line-pack: start; justify-content: flex-start; -webkit-box-align: stretch; -moz-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; } .flex-row:before, .flex-row:after { content: normal; } .flex-row .flex-col { display: inline-block; -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } .filter-facett-container { padding: 10px 0 0 0; margin-bottom: 20px; background-color: #ece9e2; margin-left: 0; margin-right: 0; } .filter-facett-container .more-facetts { display: none; } /* small btn's for selected filters */ .selected-facets .selected-facette-container .btn, .selected-facets .selected-facette-container .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .selected-facets .selected-facette-container a { margin-bottom: 10px; } .selected-facets .btn, .selected-facets .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .selected-facets a { padding: 2px 12px; height: 24px; font-size: 12px; } .selected-facets .btn i, .selected-facets .boxInnerHeight193 .doubleCol .control a i, .boxInnerHeight193 .doubleCol .control .selected-facets a i { font-size: 10px; margin-right: 0; margin-left: 6px; } /* pager for productlist pages */ .paginationWrapper { padding: 10px 0; margin-bottom: 20px; background-color: #ece9e2; } @media (max-width: 1023px) { .paginationWrapper { padding-top: 0; } } .paginationWrapper .page-size-wrapper label.control-label { text-align: left; } @media (max-width: 1279px) { .paginationWrapper .page-size-wrapper.width-auto { width: auto; } .paginationWrapper .page-size-wrapper.width-auto label { min-width: 110px; } .paginationWrapper .page-size-wrapper.width-auto .select-wrapper { width: auto; padding: 0; } } @media (max-width: 1023px) { .paginationWrapper .page-size-wrapper.width-auto { width: 25%; } .paginationWrapper .page-size-wrapper.width-auto .select-wrapper { width: 100%; padding: 0 10px; } } .paginationWrapper .form-pagination .form-pagination-arrow { vertical-align: top; } .paginationWrapper .form-pagination .form-pagination-arrow-right { margin-right: 10px; } @media (max-width: 1023px) { .paginationWrapper .form-pagination .form-pagination-arrow-left { float: left; margin-left: 10px; } } @media (max-width: 767px) { .sticky-nav-bottom-action .btn.form-pagination-arrow-right, .sticky-nav-bottom-action .boxInnerHeight193 .doubleCol .control a.form-pagination-arrow-right, .boxInnerHeight193 .doubleCol .control .sticky-nav-bottom-action a.form-pagination-arrow-right, .sticky-nav-bottom-action .btn.form-pagination-arrow-left, .sticky-nav-bottom-action .boxInnerHeight193 .doubleCol .control a.form-pagination-arrow-left, .boxInnerHeight193 .doubleCol .control .sticky-nav-bottom-action a.form-pagination-arrow-left { display: none; } } #js-toggle-more-facetts.open .icon-open:before { content: "\e90a"; } /* overwrite bootstrap for the smallest sm VP*/ @media (min-width: 768px) and (max-width: 1023px) and (max-width: 820px) { .paginationWrapper .pager-wrapper .form-pagination .form-pagination-input { margin: 0 3px; } } /* styling of product tile */ .product-wrapper { border: 1px solid white; transition: border 300ms ease-out; width: 100%; margin-bottom: 20px; padding: 5px; } .product-wrapper a { text-decoration: none; text-align: center; } .product-wrapper a:active, .product-wrapper a:focus { color: #4f4b43; } .product-wrapper:hover { border-color: #ece9e2; } .product-wrapper:hover a { color: #4f4b43; } .product-wrapper .outer-image-box { height: 0; position: relative; } .product-wrapper .outer-image-box.xx-tall { padding-bottom: 138.3721%; } .product-wrapper .outer-image-box.x-tall { padding-bottom: 135.2%; } .product-wrapper .outer-image-box.tall { padding-bottom: 123.464%; } .product-wrapper .outer-image-box.square { padding-bottom: 100%; } .product-wrapper .outer-image-box .inner-image-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(236, 233, 226, 0.4); overflow: hidden; } .product-wrapper .outer-image-box .inner-image-box .centered-image { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .product-wrapper .color-picker { padding-left: 16px; padding-right: 16px; margin-top: 10px; max-height: 30px; overflow: hidden; width: 154px; margin-left: auto; margin-right: auto; } @media (max-width: 767px) { .product-wrapper .color-picker { display: none; } } .product-wrapper .color-picker > .bubble-wrapper { display: inline-block; } @media (min-width: 851px) and (max-width: 1023px), (min-width: 1101px) and (max-width: 1279px) { .product-wrapper .color-picker { padding-left: 24px; padding-right: 24px; width: 170px; } } @media (min-width: 1280px) { .product-wrapper .color-picker { padding-left: 24px; padding-right: 24px; width: 200px; } } .product-wrapper .color-picker .slick-prev { left: 0; } .product-wrapper .color-picker .slick-next { right: 0; } .product-wrapper .color-picker .slick-arrow { background: none; border-width: 0; height: 24px; width: 16px; } @media (min-width: 851px) and (max-width: 1023px), (min-width: 1101px) and (max-width: 1279px), (min-width: 1280px) { .product-wrapper .color-picker .slick-arrow { width: 24px; } } .product-wrapper .color-picker .slick-arrow:before { font-size: 15px; font-weight: bolder; } .product-wrapper .color-picker .slick-arrow:hover { color: #A3A3A3; } .product-wrapper .color-picker .slick-arrow:focus { outline: none; } .product-wrapper .color-picker .slick-track { margin: auto; } .product-wrapper .color-picker .bubble-wrapper { margin: auto; } .product-wrapper .color-picker .bubble { background-size: cover; background-position: 50% 50%; display: inline-block; border: 1px solid #A3A3A3; border-radius: 50%; height: 24px; width: 24px; margin: 0 4px; } .product-wrapper .color-picker .bubble.active { border: 2px solid #4f4b43; } .product-wrapper .color-picker .bubble:hover, .product-wrapper .color-picker .bubble.active:hover { border: 2px solid #A3A3A3; } .product-wrapper .color-picker .more-link { display: inline-block; font-size: 12px; line-height: 24px; vertical-align: top; } .product-wrapper .brand { min-width: 10px; font-weight: 700; color: #A3A3A3; } .product-wrapper .product-name-wrapper { text-align: center; width: 100%; display: block; } .product-wrapper .product-name-wrapper h2 { font-size: 15px; line-height: 1.42857; margin-top: 0; margin-bottom: 0; } .product-wrapper .tile-actions { padding: 0 20px; } /******************************************* * * BADER Product tile sizes * ********************************************/ .product-container { float: left; position: relative; min-height: 1px; padding-left: 10px; padding-right: 10px; } @media (max-width: 350px) { .product-container { width: 100%; } } @media (min-width: 351px) and (max-width: 600px) { .product-container { width: 50%; } } @media (min-width: 601px) and (max-width: 1024px) { .product-container { width: 33.3333%; } } @media (min-width: 1025px) { .product-container { width: 25%; } } .bader-friends-list-page-inner .product-container { margin-bottom: 20px; } .bader-friends-list-page-inner .product-container .product-wrapper.bader-friends { position: relative; margin-bottom: 0; height: 100%; } .bader-friends-list-page-inner .product-container .product-wrapper.bader-friends .posAbs { position: absolute; top: 0; right: 0; } /* * === GENERAL === */ .account-info-box { background-color: #fff; text-align: center; padding: 15px 40px; margin-bottom: 20px; } @media (max-width: 767px) { .account-info-box { padding: 15px 0; } } .account-info-box-headline, .account-info-box h2 { font-size: 24px; color: #7d7d7d; margin: 0 0 10px 0; } .account-info-box-description, .account-info-box p { line-height: 20px; color: #7d7d7d; padding: 0; margin: 0; font-size: 15px; } .account-info-box-description p, .account-info-box p p { padding: 0; margin-bottom: 10px; } .account-info-box-description p:last-child, .account-info-box p p:last-child { margin: 0; } .account-info-box ol li, .account-info-box .account-info-box-description { font-size: 15px; } .panel-login .ssl { font-size: 15px; } /* * === Dashboard === */ .my-bader-welcome-container { background: url("/styles/common/images/dashboard-teaser.jpg") no-repeat center center #F2BD29; background-size: cover; padding: 5px; text-align: center; color: #fff; } .my-bader-welcome-container-inner { border: 1px dashed #f2bd29; padding: 20px 80px; } @media (max-width: 767px) { .my-bader-welcome-container-inner { padding: 10px; } } .my-bader-welcome-container-headline, .my-bader-welcome-container h2 { margin: 0 0 20px 0; text-transform: uppercase; font-size: 24px; } .my-bader-welcome-container-description p, .my-bader-welcome-container p { padding: 0; } .my-bader-welcome-container-description p:last-child, .my-bader-welcome-container p:last-child { margin: 0; } .my-bader-welcome-container ol { text-align: left; } .my-bader-welcome-container.type-02 { padding: 10px; } .my-bader-welcome-container.type-02 .my-bader-welcome-container-inner { border: 0; background-color: #fff; background: rgba(255, 255, 255, 0.6); color: #7d7d7d; } .second-container .panel { margin-bottom: 40px; } @media (max-width: 767px) { .second-container .panel { margin-bottom: 20px; } } .second-container .panel-section-description { font-size: 15px; } /* * === Wishlist === */ .wishlist-content .wishlist-entry-hidden { display: none; } .wishlist-content .product-line { padding: 0 30px; } @media (max-width: 767px) { .wishlist-content .product-line { padding: 0; } } .wishlist-content .product-line-content { border-bottom: 1px solid #ddd; padding: 30px 0; } .wishlist-content .product-line:last-child .product-line-content, .wishlist-content .product-line.last .product-line-content { border: 0; } .wishlist-content .product-line .product-price, .wishlist-content .product-line .product-number, .wishlist-content .product-line .product-name { margin-bottom: 10px; } .wishlist-content .product-line .product-name { color: #878682; font-weight: 700; font-size: 16px; text-decoration: none; display: block; } .wishlist-content .product-line .wishlist-link { display: inline-block; border: 1px solid #ece9e2; position: relative; } .wishlist-content .product-line .wishlist-link:hover, .wishlist-content .product-line .wishlist-link:focus { border-color: #4f4b43; } .wishlist-content .product-line .actions .btn, .wishlist-content .product-line .actions .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .wishlist-content .product-line .actions a { margin-bottom: 15px; } .wishlist-content .product-line .actions .btn-link { text-align: right; } @media (max-width: 767px) { .wishlist-content .product-line .actions { margin-top: 20px; padding: 0 20px; } } .checkout-panel-payment-mode-additional-info { padding: 0 25px; margin: 0 -10px; } .checkout-panel-col-wrapper { padding: 20px 15px; min-height: 120px; } @media (max-width: 767px) { .checkout-panel-col-wrapper { height: auto !important; } } .checkout-panel-col-wrapper .checkout-panel-col-content { position: relative; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section { margin-bottom: 15px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section:last-child { margin-bottom: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-name { margin-bottom: 15px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value { display: none; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-additional { background: #FCFBF5; padding: 20px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-additional .info-box label { background-color: #fff; border: 1px solid #ece9e2; border-radius: 4px 0; padding: 10px 10px 10px 35px; width: 100%; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-additional .info-box label:before { left: 10px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-additional .info-box label:after { left: 14px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-additional .info-box label:hover, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-additional .info-box label:focus { border-color: #F2BD29; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-additional .info-box input[type=checkbox]:focus ~ label { border-color: #F2BD29; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner { background: #FCFBF5; padding: 20px; margin-bottom: 20px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .form-control:-webkit-autofill, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .form-control:-webkit-autofill:focus, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .form-control:-webkit-autofill:active, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .form-control:-webkit-autofill:hover { background-color: #fff !important; -webkit-box-shadow: 0 0 0 50px #fff inset; -webkit-text-fill-color: #7d7d7d; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .DebitPayment:last-child .form-group { margin-bottom: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .CreditCard span.form-control { padding: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .col-seperator-birthday:before, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .col-seperator-birthday:after { width: 15%; } @media (min-width: 1024px) { .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .form-myBader-popup .col-seperator input { width: 70%; margin-left: 30%; } } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .col-error { width: 100%; margin: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner label { text-align: left; margin-bottom: 5px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner label:after { position: static; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner p { font-size: 15px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .col-sm-3:after { position: static; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-checkout-edit-finished { display: none; width: 100%; margin-top: 10px; } @media (min-width: 768px) { .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-checkout-edit-finished { width: auto; margin-top: 0; } } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-checkout-edit { line-height: 40px; margin: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .PaymentDelay span { font-weight: 700; font-size: 15px !important; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .PaymentDelay p { margin-bottom: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .info-box label { background-color: #fff; border: 1px solid #ece9e2; border-radius: 4px 0; padding: 10px 10px 10px 35px; width: 100%; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .info-box label:before { left: 10px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .info-box label:hover, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .info-box label:focus { border-color: #F2BD29; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .info-box input[type=checkbox]:focus ~ label { border-color: #F2BD29; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .Installment p { padding: 0; margin-bottom: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm { width: 100%; margin: 10px 0; display: block; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm p { padding: 0 10px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dl { float: left; width: 100%; margin: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dt { clear: both; margin-right: 5px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dt, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dd { width: auto; float: left; margin-bottom: 5px; } @media (min-width: 501px) { .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dt, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dd { margin-bottom: 0; } } @media (min-width: 767px) { .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dt, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dd { margin-bottom: 5px; } } @media (min-width: 1023px) { .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dt, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value .checkout-panel-col-value-inner .js-lightboxInstallments-c-paymentFormTerm dd { margin-bottom: 0; } } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-name input[type=radio]:checked ~ label:after { left: 25px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-name label { display: block; border: 1px solid #ece9e2; border-radius: 4px 0; padding: 10px 15px 10px 45px; outline: 0; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-name label:before { margin: auto 0 auto 20px; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-name label:hover, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-name label:focus { border-color: #F2BD29; cursor: pointer; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section input[type=radio]:checked + label { border-color: #878682; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section input[type=radio]:checked + label:hover, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section input[type=radio]:checked + label:focus { border-color: #F2BD29; cursor: default; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section input[type=radio]:checked:focus + label { border-color: #F2BD29; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section.in .checkout-panel-col-value { *display: block; } @media (min-width: 768px) { .checkout-panel-col-wrapper { padding: 20px 50px; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section:last-child .checkout-panel-col-name { margin-bottom: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-name { width: 50%; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-name { padding-right: 10%; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-panel-col-value { position: absolute; top: 0; right: 0; } .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .checkout-input, .checkout-panel-col-wrapper .checkout-panel-col-content .checkout-panel-col-section .inputIframe { padding: 0; } .checkout-panel-payment-mode-additional-info { padding: 0 50px; margin: 0; } } @media (min-width: 1024px) { .checkout-panel-col-wrapper { padding: 20px 90px; } .checkout-panel-payment-mode-additional-info { padding: 0 90px; } } /* * === CART === */ .cart-edit .panel-body { padding-bottom: 0; } .cart-edit .btn-collapse { margin: 10px -11px 0 -11px; padding: 9px 15px; width: calc(100% + 22px); border-radius: 0 0 10px 0; } .cart-edit .voucher-wrapper { border-radius: 10px 0px; padding: 15px; overflow: hidden; } .cart-edit .voucher-wrapper .voucher-content h3 { margin: 0 0 20px 0; font-size: 16px; color: #7d7d7d; font-weight: 700; } .cart-edit .voucher-wrapper .voucher-content .form-group p { margin: 0; padding: 0; color: #7d7d7d; font-size: 15px; } .cart-edit .voucher-wrapper .voucher-content .mbl { margin-top: 20px; margin-bottom: 10px; } @media (min-width: 768px) { .cart-edit .voucher-wrapper .voucher-content .mbl { margin-top: -20px; } } .cart-edit .voucher-wrapper .voucher-content .form-control { border-radius: 4px 0 4px 0; width: 100%; z-index: 1; } .cart-edit .voucher-wrapper .voucher-content .input-group-addon { display: inline-block; width: 100px; position: absolute; top: 0; right: 0; z-index: 2; } .cart-edit .voucher-wrapper .boxPadding { padding: 0; } .checkout-table-wrapper .checkout-table-content .input-group-addon.disabled { cursor: default; } .checkout-table-wrapper .checkout-table-content .input-group-addon, .voucher-wrapper .voucher-content .input-group-addon { border: 0; border-radius: 0 0 5px 0; padding: 9px 12px; background: #F2BD29; color: #4f4b43; height: 40px; line-height: 22px; text-decoration: none; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } @media (max-width: 767px) { .checkout-table-wrapper .checkout-table-content .input-group-addon, .voucher-wrapper .voucher-content .input-group-addon { border-radius: 0; } } .checkout-table-wrapper .checkout-table-content .input-group-addon:hover:not(.disabled), .checkout-table-wrapper .checkout-table-content .input-group-addon:focus:not(.disabled), .voucher-wrapper .voucher-content .input-group-addon:hover:not(.disabled), .voucher-wrapper .voucher-content .input-group-addon:focus:not(.disabled) { background: #A3A3A3; color: #fff; cursor: pointer; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } /* * === CART BOTTOM === */ .cart-content .wishlist-content { margin: 20px 0 40px 0; } .cart-bottom-wrapper { padding-top: 10px; } .cart-bottom-wrapper.border { border-top: 1px solid #ece9e2; border-bottom: 1px solid #ece9e2; } .cart-bottom-wrapper .cart-bottom-section.border { border-bottom: 1px solid #ece9e2; margin-bottom: 20px; } .cart-bottom-wrapper .product-slider-wrapper .product-slider-headline { margin-top: 0; } @media (min-width: 768px) { .cart-bottom-wrapper { border-top: 1px solid #ece9e2; padding-top: 0; } .cart-bottom-wrapper .cart-bottom-section.border { border-bottom: 1px solid #ece9e2; margin-bottom: 20px; } } /* * === REVIEW PAGE === */ .checkout-review-sidebar .checkout-review-sidebar-wrap .panel .panel-body span { word-wrap: break-word; } .checkout-review-sidebar .checkout-review-sidebar-wrap:last-child .panel { margin-bottom: 0; } @media (min-width: 768px) { .checkout-review-sidebar-wrap { display: flex; justify-content: space-between; } .checkout-review-sidebar-col { display: flex; margin-bottom: 10px; } .checkout-review-sidebar-col .panel { height: calc(100% + 0px); width: 100%; } .checkout-review-sidebar-col .panel-body { height: calc(100% - 54px); } } @media (min-width: 1024px) { .checkout-review-sidebar-wrap { display: block; } .checkout-review-sidebar-col { display: block; margin-bottom: 0; } .checkout-review-sidebar-col .panel { height: auto; width: auto; } .checkout-review-sidebar-col .panel-body { height: auto; } } .trustSeals { margin: 20px 0 0 0; text-align: center; } .trustSeals img { display: inline-block; } @media (min-width: 768px) { .trustSeals { margin: 30px 0; } } @media (min-width: 1024px) { .trustSeals div:first-child#trust_elem_comp_list { left: 25%; } } .reviewchangelayer.modal-layer .layer-wrapper { width: 50%; max-width: 767px; } @media (max-width: 1023px) { .reviewchangelayer.modal-layer .layer-wrapper { width: 75%; } } .reviewchangelayerbig.modal-layer .layer-wrapper { width: 80%; max-width: 1050px; } @media (max-width: 767px) { .reviewchangelayer.modal-layer .layer-wrapper, .reviewchangelayerbig.modal-layer .layer-wrapper { width: 100%; } } .productinfolayer.modal-layer .layer-wrapper, .directorderlayer.modal-layer .layer-wrapper { width: 750px; } @media (max-width: 767px) { .productinfolayer.modal-layer .layer-wrapper, .directorderlayer.modal-layer .layer-wrapper { width: 100%; } .productinfolayer.modal-layer .layer-wrapper .slick-slide img, .directorderlayer.modal-layer .layer-wrapper .slick-slide img { max-height: 300px; margin: 0 auto; } } .productinfolayer.modal-layer .layer-wrapper .alert-success, .productinfolayer.modal-layer .layer-wrapper .alert-error, .directorderlayer.modal-layer .layer-wrapper .alert-success, .directorderlayer.modal-layer .layer-wrapper .alert-error { border: none; padding-left: 0; } .productinfolayer.modal-layer .layer-wrapper .alert-success .icon, .productinfolayer.modal-layer .layer-wrapper .alert-error .icon, .directorderlayer.modal-layer .layer-wrapper .alert-success .icon, .directorderlayer.modal-layer .layer-wrapper .alert-error .icon { margin-right: 11px; } .productinfolayer.modal-layer .layer-wrapper .alert-success, .directorderlayer.modal-layer .layer-wrapper .alert-success { color: #746e63; background: none; } .productinfolayer.modal-layer .layer-wrapper .alert-error, .directorderlayer.modal-layer .layer-wrapper .alert-error { color: #BD0025; background: #ece9e2; } .productinfolayer.modal-layer .headline, .directorderlayer.modal-layer .headline { font-size: 18px; margin-bottom: 5px; display: block; } .productinfolayer.modal-layer .subline, .directorderlayer.modal-layer .subline { color: #A3A3A3; font-size: 12px; } .productinfolayer.modal-layer .border-bottom, .directorderlayer.modal-layer .border-bottom { border-bottom: 1px solid #d1d1d1; margin-bottom: 10px; padding-bottom: 5px; } .productinfolayer.modal-layer .light, .directorderlayer.modal-layer .light { color: #A3A3A3; } .productinfolayer.modal-layer .col-image, .productinfolayer.modal-layer .col-summary, .directorderlayer.modal-layer .col-image, .directorderlayer.modal-layer .col-summary { margin-bottom: 20px; } @media (min-width: 768px) { .productinfolayer.modal-layer .col-image, .productinfolayer.modal-layer .col-summary, .directorderlayer.modal-layer .col-image, .directorderlayer.modal-layer .col-summary { margin-bottom: 0; } } @media (max-width: 767px) { .productinfolayer.modal-layer .col-image img, .productinfolayer.modal-layer .col-summary img, .directorderlayer.modal-layer .col-image img, .directorderlayer.modal-layer .col-summary img { margin: auto; } } .productinfolayer.modal-layer .col-product-desc p, .productinfolayer.modal-layer .col-product-features p, .productinfolayer.modal-layer .col-delivery-info p, .directorderlayer.modal-layer .col-product-desc p, .directorderlayer.modal-layer .col-product-features p, .directorderlayer.modal-layer .col-delivery-info p { margin-bottom: 10px; padding-bottom: 0; } .productinfolayer.modal-layer .col-product-desc .headline, .productinfolayer.modal-layer .col-product-desc .subline, .productinfolayer.modal-layer .col-product-desc p, .productinfolayer.modal-layer .col-product-features .headline, .productinfolayer.modal-layer .col-product-features .subline, .productinfolayer.modal-layer .col-product-features p, .productinfolayer.modal-layer .col-delivery-info .headline, .productinfolayer.modal-layer .col-delivery-info .subline, .productinfolayer.modal-layer .col-delivery-info p, .directorderlayer.modal-layer .col-product-desc .headline, .directorderlayer.modal-layer .col-product-desc .subline, .directorderlayer.modal-layer .col-product-desc p, .directorderlayer.modal-layer .col-product-features .headline, .directorderlayer.modal-layer .col-product-features .subline, .directorderlayer.modal-layer .col-product-features p, .directorderlayer.modal-layer .col-delivery-info .headline, .directorderlayer.modal-layer .col-delivery-info .subline, .directorderlayer.modal-layer .col-delivery-info p { padding: 0 15px; } .productinfolayer.modal-layer .col-product-desc .subline, .productinfolayer.modal-layer .col-product-features .subline, .productinfolayer.modal-layer .col-delivery-info .subline, .directorderlayer.modal-layer .col-product-desc .subline, .directorderlayer.modal-layer .col-product-features .subline, .directorderlayer.modal-layer .col-delivery-info .subline { padding-bottom: 5px; } .productinfolayer.modal-layer .col-product-brand, .directorderlayer.modal-layer .col-product-brand { border-bottom: 1px solid #d1d1d1; margin-bottom: 20px; padding-bottom: 5px; } .productinfolayer.modal-layer .col-product-feature .bg-greyVlight, .productinfolayer.modal-layer .col-functions .bg-greyVlight, .directorderlayer.modal-layer .col-product-feature .bg-greyVlight, .directorderlayer.modal-layer .col-functions .bg-greyVlight { padding: 10px; } .productinfolayer.modal-layer .col-product-feature .bg-greyVlight.flex, .productinfolayer.modal-layer .col-functions .bg-greyVlight.flex, .directorderlayer.modal-layer .col-product-feature .bg-greyVlight.flex, .directorderlayer.modal-layer .col-functions .bg-greyVlight.flex { display: flex; } .productinfolayer.modal-layer .col-product-feature .price-wrapper .price-type, .productinfolayer.modal-layer .col-product-feature .price-wrapper .reduce, .productinfolayer.modal-layer .col-functions .price-wrapper .price-type, .productinfolayer.modal-layer .col-functions .price-wrapper .reduce, .directorderlayer.modal-layer .col-product-feature .price-wrapper .price-type, .directorderlayer.modal-layer .col-product-feature .price-wrapper .reduce, .directorderlayer.modal-layer .col-functions .price-wrapper .price-type, .directorderlayer.modal-layer .col-functions .price-wrapper .reduce { font-size: 14px; } .productinfolayer.modal-layer .col-product-feature .price-wrapper .price-sale, .productinfolayer.modal-layer .col-product-feature .price-wrapper .price, .productinfolayer.modal-layer .col-functions .price-wrapper .price-sale, .productinfolayer.modal-layer .col-functions .price-wrapper .price, .directorderlayer.modal-layer .col-product-feature .price-wrapper .price-sale, .directorderlayer.modal-layer .col-product-feature .price-wrapper .price, .directorderlayer.modal-layer .col-functions .price-wrapper .price-sale, .directorderlayer.modal-layer .col-functions .price-wrapper .price { font-size: 25px; } .productinfolayer.modal-layer .col-product-feature .product-availability, .productinfolayer.modal-layer .col-functions .product-availability, .directorderlayer.modal-layer .col-product-feature .product-availability, .directorderlayer.modal-layer .col-functions .product-availability { font-size: 12px; margin: 5px 0; } .productinfolayer.modal-layer .col-product-feature .col-actions, .productinfolayer.modal-layer .col-functions .col-actions, .directorderlayer.modal-layer .col-product-feature .col-actions, .directorderlayer.modal-layer .col-functions .col-actions { margin-top: 10px; } .productinfolayer.modal-layer .col-product-feature .flex-bottom, .productinfolayer.modal-layer .col-functions .flex-bottom, .directorderlayer.modal-layer .col-product-feature .flex-bottom, .directorderlayer.modal-layer .col-functions .flex-bottom { width: 100%; } @media (min-width: 768px) { .productinfolayer.modal-layer .col-product-feature .flex-bottom, .productinfolayer.modal-layer .col-functions .flex-bottom, .directorderlayer.modal-layer .col-product-feature .flex-bottom, .directorderlayer.modal-layer .col-functions .flex-bottom { width: auto; display: flex; align-self: flex-end; flex-wrap: wrap; } .productinfolayer.modal-layer .col-product-feature .flex-bottom .price-wrapper, .productinfolayer.modal-layer .col-product-feature .flex-bottom .product-availability, .productinfolayer.modal-layer .col-product-feature .flex-bottom .col-actions, .productinfolayer.modal-layer .col-functions .flex-bottom .price-wrapper, .productinfolayer.modal-layer .col-functions .flex-bottom .product-availability, .productinfolayer.modal-layer .col-functions .flex-bottom .col-actions, .directorderlayer.modal-layer .col-product-feature .flex-bottom .price-wrapper, .directorderlayer.modal-layer .col-product-feature .flex-bottom .product-availability, .directorderlayer.modal-layer .col-product-feature .flex-bottom .col-actions, .directorderlayer.modal-layer .col-functions .flex-bottom .price-wrapper, .directorderlayer.modal-layer .col-functions .flex-bottom .product-availability, .directorderlayer.modal-layer .col-functions .flex-bottom .col-actions { flex: 1 100%; -ms-flex: auto; } } .productinfolayer.modal-layer .row-product, .directorderlayer.modal-layer .row-product { border-bottom: 1px solid #d1d1d1; margin-bottom: 20px; padding-bottom: 5px; overflow: hidden; } .productinfolayer.modal-layer .row-product > div, .directorderlayer.modal-layer .row-product > div { padding: 0; } .productinfolayer.modal-layer .row-product:last-child, .directorderlayer.modal-layer .row-product:last-child { border-bottom-width: 0; } .productinfolayer.modal-layer .row-product .price-wrapper .price-type, .productinfolayer.modal-layer .row-product .price-wrapper .reduce, .productinfolayer.modal-layer .row-product .price-wrapper .prefix, .directorderlayer.modal-layer .row-product .price-wrapper .price-type, .directorderlayer.modal-layer .row-product .price-wrapper .reduce, .directorderlayer.modal-layer .row-product .price-wrapper .prefix { font-size: 12px; font-weight: normal; margin: 0; } .productinfolayer.modal-layer .row-product .price-wrapper .prefix, .directorderlayer.modal-layer .row-product .price-wrapper .prefix { display: block; } .productinfolayer.modal-layer .row-product .price-wrapper .price, .productinfolayer.modal-layer .row-product .price-wrapper .price-sale, .directorderlayer.modal-layer .row-product .price-wrapper .price, .directorderlayer.modal-layer .row-product .price-wrapper .price-sale { font-size: 18px; font-weight: bold; } .payment-info-img { max-height: 70px; } @media (min-width: 1280px) { .payment-info-img { max-width: 65%; } } @media (min-width: 1024px) and (max-width: 1279px) { .payment-info-img { max-width: 75%; } } @media (max-width: 1023px) { .payment-info-img { max-width: 90%; } } .checkout-additional-wrapper .checkout-summary-wrapper .list-value, .checkout-additional-wrapper .checkout-summary-wrapper .list-name { float: left; display: block; line-height: 25px; text-align: right; } .checkout-additional-wrapper .checkout-summary-wrapper li { color: #7d7d7d; } .checkout-additional-wrapper .checkout-summary-wrapper .list-name { width: 70%; } @media (min-width: 768px) { .checkout-additional-wrapper .checkout-summary-wrapper .list-name { width: 75%; } } .checkout-additional-wrapper .checkout-summary-wrapper .list-name.delivery .cartCostLabelHint { padding-left: 50px; font-size: 12px; } .checkout-additional-wrapper .checkout-summary-wrapper .list-value { width: 30%; font-size: 15px; } .checkout-additional-wrapper .checkout-summary-wrapper .list-value.js-totalPrice { color: #4f4b43; } @media (min-width: 768px) { .checkout-additional-wrapper .checkout-summary-wrapper .list-value { width: 25%; } } .checkout-additional-wrapper .checkout-summary-wrapper .list-sale { color: #BD0025; } .checkout-additional-wrapper .checkout-summary-wrapper .list-sum { border-top: 1px solid #ece9e2; margin-top: 10px; padding-top: 10px; } .checkout-additional-wrapper .checkout-summary-wrapper .list-sum .list-name { padding-left: 0; } .checkout-additional-wrapper .checkout-summary-wrapper .list-sum .list-value { font-size: 18px; font-weight: 700; } .checkout-additional-wrapper .checkout-summary-wrapper .list-sum strong { font-size: 18px; } .checkout-additional-wrapper .checkout-summary-wrapper .list-image { position: absolute; bottom: 36px; left: 0; } @media (max-width: 767px) { .checkout-additional-wrapper .checkout-summary-wrapper .list-image { bottom: 42px; } } .checkout-additional-wrapper .checkout-summary-wrapper .list-image img { max-width: 65px; } @media (min-width: 768px) { .checkout-additional-wrapper .checkout-summary-wrapper .list-image img { max-width: 100%; } } .checkout-additional-wrapper .trustSeals .trust-seals-content { margin: 0 auto; } .checkout-additional-wrapper .trustSeals .trust-seals-content img { margin: 20px auto 20px auto; } @media (min-width: 768px) { .checkout-additional-wrapper .trustSeals .trust-seals-content img { margin: 0 0 20px 0; } } /* Overwrite paddings in checkout summary for small VP to be able to show bigger prizes */ @media (max-width: 500px) { .checkout-content .checkout-additional-wrapper.panel { padding: 0; } .checkout-content .checkout-additional-wrapper.panel .panel-body { padding: 0; } } .checkout-confirmation p { font-size: 15px; } .ch-header-info-text h2, .ch-header-info-text p { color: #7d7d7d; font-size: 15px; } .ch-header-info-text h2 { margin: 0 0 20px 0; } .ch-header-info-text p { padding: 0; margin: 0 0 30px 0; } @media (min-width: 768px) { .ch-header-info-text p { padding: 0 60px; } } @media (min-width: 1024px) { .ch-header-info-text p { padding: 0 100px; } } .ch-header-info-text.border-top { border-top: 1px solid #ece9e2; padding-top: 20px; } .checkout-content-header { width: 100%; max-width: 1020px; margin: 0 auto; padding: 0; float: none; } .checkout-content { width: 100%; max-width: 1020px; margin: 0 auto; float: none; padding: 0 10px; } @media (min-width: 768px) { .checkout-content { width: 90%; width: calc(100% - 80px); } } @media (min-width: 1024px) { .checkout-content { width: 90%; width: calc(100% - 80px); } } @media (min-width: 1280px) { .checkout-content { width: 100%; } } .checkout-content .panel-heading, .checkout-content .dogEar { position: relative; } .checkout-content .panel-heading .btn-help, .checkout-content .dogEar .btn-help { border-radius: 50%; border: 1px solid #ECE9E2; background-color: #FCFBF5; height: 30px; width: 30px; line-height: 30px; font-size: 14px; bottom: 0; margin: auto 0; padding: 0; } .checkout-content .panel-heading .btn-help:hover, .checkout-content .panel-heading .btn-help:focus, .checkout-content .dogEar .btn-help:hover, .checkout-content .dogEar .btn-help:focus { color: #F2BD29 !important; } .checkout-content .panel-heading .btn-help { position: absolute; top: 0; right: 10px; } .checkout-content .dogEar > div { display: inline-block; width: 90%; width: calc(100% - 35px); } .pw-reset-inner .form-control { padding-right: 100px; } .pw-reset-inner .pw-reset-inner-content { position: absolute; top: 5px; right: 20px; } .pw-reset-inner .pw-reset-inner-content a { color: #4f4b43; } .pw-reset-inner .pw-reset-inner-content a:hover, .pw-reset-inner .pw-reset-inner-content a:focus { color: #F2BD29; } /* * === LOGIN === */ .panel-login .form-group label { text-align: left; padding-top: 0; } .login-section p { padding: 0; } .checkout-login-wrapper .checkout-login-content .form-horizontal h3 { margin: 20px 0 10px 0; } .checkout-login-wrapper .checkout-login-content .form-horizontal h3:first-child { margin-top: 0; } .checkout-login-wrapper .checkout-login-content .form-horizontal p { margin-bottom: 20px; padding: 0; } .checkout-login-wrapper .checkout-login-content .form-horizontal .control-label { display: block; margin-bottom: 5px; text-align: left; } .checkout-login-wrapper .checkout-login-content .form-horizontal .mandatoryInfo { margin: 20px 0 0 0; } .checkout-authentication-success { border: 1px solid #878682; background-color: #A9F5BC; padding: 15px; margin-bottom: 20px; border-radius: 5px 0; } @media (max-width: 500px) { .form-control.js-birthMonth, .form-control.js-birthDay { padding-left: 5px; padding-right: 5px; } } .checkOutReview-content .panel-body { padding-bottom: 0; } .checkOutReview-content .checkout-table-wrapper .checkout-table-entry .btn-radius { /* BAD-1227 fix problems with energy label */ position: absolute; left: 38%; left: calc(50% - 10px); bottom: -20px; } .checkOutReview-content .checkout-additional-wrapper { padding: 0 5px; margin-bottom: 0; } .checkOutReview-content .checkout-additional-wrapper .panel-body { padding-bottom: 20px; } .checkOutReview-content .agb-wrapper { font-size: 15px; } .checkOutReview-content .custom-checkbox.white-box { padding: 10px 20px; } @media (min-width: 768px) { .checkOutReview-content .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-data { width: 50%; } .checkOutReview-content .checkout-table-wrapper .checkout-table-entry .qty-field { padding: 0; height: auto; border: 0; } } #CheckoutReviewChangeLayer .checkout-payment-wrapper { width: 100%; padding: 10px 0; } #CheckoutReviewChangeLayer .checkout-payment-wrapper .checkout-payment-content.form-horizontal .panel-body { padding: 10px 0; } #CheckoutReviewChangeLayer .checkout-payment-wrapper .checkout-payment-content.form-horizontal .panel-body .checkout-panel-col-wrapper { padding: 20px; } #CheckoutReviewChangeLayer .checkout-payment-wrapper .checkout-payment-content.form-horizontal .control-label { text-align: left; } #CheckoutReviewChangeLayer .checkout-payment-wrapper .checkout-payment-content.form-horizontal .control-label:after { position: static; } #CheckoutReviewChangeLayer .checkout-payment-wrapper .checkout-payment-content.form-horizontal .checkout-cart-close-button, #CheckoutReviewChangeLayer .checkout-payment-wrapper .checkout-payment-content.form-horizontal .checkout-cart-submit-button { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: auto; margin: 0 10px; } @media (max-width: 500px) { #CheckoutReviewChangeLayer .checkout-payment-wrapper .checkout-payment-content.form-horizontal .checkout-cart-close-button, #CheckoutReviewChangeLayer .checkout-payment-wrapper .checkout-payment-content.form-horizontal .checkout-cart-submit-button { width: 45%; width: calc(50% - 20px); } } .checkout-table-wrapper { padding: 0 5px; } .checkout-table-wrapper .checkout-table-head { padding-top: 10px; color: #7d7d7d; font-weight: 700; } @media (min-width: 768px) { .checkout-table-wrapper .checkout-table-head { padding-top: 20px; } } .checkout-table-wrapper .checkout-table-entry { border-top: 1px solid #ece9e2; margin-top: 10px; padding-top: 10px; } .checkout-table-wrapper .checkout-table-entry:last-child { padding: 20px 0; } @media (min-width: 768px) { .checkout-table-wrapper .checkout-table-entry { margin-top: 20px; padding-top: 20px; } } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info-image { padding: 0 10px; float: left; max-width: 90px; position: relative; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info-image .product-image { max-width: 80px; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info-image .product-energyLabel { left: 8px; } .checkout-table-wrapper .checkout-table-entry .product-image { display: inline-block; border: 1px solid #ece9e2; position: relative; } .checkout-table-wrapper .checkout-table-entry .product-image:hover, .checkout-table-wrapper .checkout-table-entry .product-image:focus { border-color: #4f4b43; } .checkout-table-wrapper .checkout-table-entry .product-image.product-image--no-link:hover, .checkout-table-wrapper .checkout-table-entry .product-image.product-image--no-link:focus { border-color: #ece9e2; } .checkout-table-wrapper .checkout-table-entry .baseprice { font-size: 12px; } .checkout-table-wrapper .checkout-table-entry .price, .checkout-table-wrapper .checkout-table-entry .product-price { font-size: 15px; } .checkout-table-wrapper .checkout-table-entry .price-sale { font-size: 15px; } .checkout-table-wrapper .checkout-table-entry .price-sale .prefix { font-size: 15px; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-price { float: right; } @media (min-width: 768px) { .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-price { float: left; } } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap { width: 100%; width: calc(100% + 20px); } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-small + .input-qty, .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-large + .input-qty { text-align: right; } @media (max-width: 767px) { .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-small + .input-qty, .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-large + .input-qty { text-align: center; } } @media (min-width: 768px) { .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap input { padding-right: 30px; padding-left: 0; } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-qty { right: 25px; } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-small + .input-qty { padding-right: 32px; } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-large + .input-qty { padding-right: 45px; } } @media (min-width: 880px) { .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap input { padding-right: 35px; padding-left: 5px; } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-qty { right: 25px; } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-small + .input-qty { padding-right: 32px; } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-large + .input-qty { padding-right: 45px; } } @media (min-width: 900px) { .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap input { padding-right: 40px; padding-left: 5px; } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-qty { right: 32px; } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-small + .input-qty { padding-right: 40px; } .checkout-table-wrapper .checkout-table-entry .input-group-quantity.wrap .label-large + .input-qty { padding-right: 53px; } } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-table { width: 100%; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-table table { width: 100%; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-table table td { vertical-align: top; width: 100%; display: block; } @media (min-width: 768px) { .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-table table td { width: 50%; display: table-cell; } } @media (min-width: 1024px) { .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-table table td { width: 33.33333%; } } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-table table td.vertical-align-bottom { vertical-align: bottom; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info-product .product-name { font-size: 16px; line-height: 25px; text-decoration: none; display: block; color: #7d7d7d; font-weight: 700; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info-product .product-name:hover, .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info-product .product-name:focus { color: #F2BD29; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info-product .product-name.product-name--no-link:hover, .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info-product .product-name.product-name--no-link:focus { color: #7d7d7d; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-data { background-color: #FCFBF5; margin: 0 -6px; padding: 10px 10px 10px 20px; width: calc(100% + 12px); } @media (min-width: 768px) { .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-data { width: 41.66667%; margin: 0; padding: 0 10px; background-color: transparent; } } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-action { text-align: left; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-action.text-left { text-align: left; } @media (min-width: 768px) { .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-action { width: 100%; text-align: right; } } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-action a { display: inline-block; text-decoration: none; font-size: 16px; min-width: 85px; text-align: left; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-action a i { margin-right: 10px; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-action a + a { margin-top: 5px; } .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-action .edit { margin-right: 30px; } @media (min-width: 768px) { .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-action .edit { margin-right: 0; } } @media (min-width: 768px) { .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-data { padding-top: 25px; } } .checkout-table-wrapper .visible-table-xs { display: table; } @media (min-width: 768px) { .checkout-table-wrapper .visible-table-xs { display: none; } } .checkout-table-wrapper .js-submit-engraving { text-decoration: none; color: #4f4b43; } .checkout-table-wrapper .js-submit-engraving.disabled { opacity: 0.6; filter: alpha(opacity=60); } .checkout-table-wrapper .progressBar { width: 100%; margin: 0 auto; height: 2px; background-color: #fff; } .checkout-table-wrapper .progressBar div { height: 100%; text-align: right; line-height: 2px; /* same as #progressBar height if we want text middle aligned */ width: 0; background-color: #F2BD29; } .checkout-login .login p, .checkout-login .customerid p { padding: 0; } .checkout-login .login .panel, .checkout-login .customerid .panel { padding: 10px; height: 100%; } .sectionWrapper { margin: 10px 10px 30px; } .sectionWrapper:before, .sectionWrapper:after { content: " "; display: table; } .sectionWrapper:after { clear: both; } .cmsContent .iconSection { float: left; display: inline; padding: 15px 20px 0 60px; border-top: solid 1px #ECE9E2; width: 100%; } .cmsContent .iconSection img.icon { float: left; display: inline; margin: 0 0 0 -60px; } .cmsContent .iconSection h4, .cmsContent .iconSection .h4 { padding: 0 !important; margin: 0 !important; font-weight: 600 !important; } .cmsContent .iconSection p { width: auto; font-size: 15px; } .cmsContent .iconSection div.compensatePdg { margin-right: -12px; } /* * === GENERAL === */ table.sizes { border: 0; width: 100%; margin-bottom: 20px; } table.sizes.remove-last-border tr:last-child { border-bottom: 0; } table.sizes tr { border-bottom: 1px solid #ece9e2; } table.sizes thead tr { border-bottom: 0; } table.sizes caption { color: #4f4b43; } table.sizes th, table.sizes td { padding: 5px; } table.sizes caption.alternate, table.sizes .table-headline, table.sizes thead { color: #8a8a8a; background-color: #ECE9E2; border-bottom: 1px solid transparent; border-radius: 4px 0 4px 0; padding: 12px 15px; font-size: 14px; font-weight: 500; text-transform: uppercase; line-height: 1; height: 40px; } table.sizes .separator { width: 3px; padding: 0; } .cms-info-box { background-color: #fff; padding: 15px 40px; margin-bottom: 20px; text-align: center; } @media (max-width: 767px) { .cms-info-box { padding: 15px 0; } } .cms-info-box-headline, .cms-info-box h2, .cms-info-box .h2 { font-size: 24px; color: #4f4b43; margin: 0 0 10px 0; } .cms-info-box-description, .cms-info-box p { line-height: 20px; color: #4f4b43; padding: 0; margin: 0; } .cms-info-box-description p, .cms-info-box p p { padding: 0; margin-bottom: 10px; } .cms-info-box-description p:last-child, .cms-info-box p p:last-child { margin: 0; } .cmsTextEditorContent { font-size: 15px; } .nav-col-menu ul li a { display: block; color: #4f4b43; width: 100%; padding: 5px 0; text-decoration: none; } .nav-col-menu ul li a.active, .nav-col-menu ul li a:hover, .nav-col-menu ul li a:focus { color: #F2BD29; } .nav-col-menu ul li:first-child a { padding-top: 0; } .nav-col-menu ul li.separator { border-bottom: 1px solid #ddd; margin-bottom: 5px; padding-bottom: 5px; } /* * === SiteMap === */ #SiteMap { line-height: 2.1em; } #SiteMap div { width: 100%; float: left; } @media (min-width: 768px) { #SiteMap div { width: 33.33333%; } } #SiteMap ul { margin-bottom: 20px; } #SiteMap ul ul { float: left; width: 100%; } @media (min-width: 768px) { #SiteMap ul ul { width: auto; float: none; } } #SiteMap ul ul li { float: left; margin-right: 10px; } @media (min-width: 768px) { #SiteMap ul ul li { margin-right: 0; float: none; } } #SiteMap a.rootCategory { font-size: 14px; font-weight: bold; text-transform: uppercase; text-decoration: none; } .cms-middle-conent .section .catalogBox .catalog-image a { display: block; position: relative; overflow: hidden; } .cms-middle-conent .section .catalogBox .catalog-image a .invisible { display: block; visibility: hidden; } .cms-middle-conent .section .catalogBox .catalog-image a .visible { display: block; position: absolute; top: 0; left: 0; max-width: 100%; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; transition: all 0.6s ease; } .cms-middle-conent .section .catalogBox .catalog-image a .visible:hover { -webkit-transform: scale(1.08); -moz-transform: scale(1.08); transform: scale(1.08); } .cms-middle-conent .section .catalogBox .catalog-image, .cms-middle-conent .section .catalogBox .catalog-text, .cms-middle-conent .section .catalogBox .catalog-links { margin-bottom: 10px; padding: 0; } .catalogOverviewLayer.modal-layer .layer-wrapper { width: 90%; } @media (max-width: 767px) { .catalogOverviewLayer.modal-layer .layer-wrapper { width: 100%; } } .catalogOverviewLayer.modal-layer .layer-wrapper .catalogFrame { width: 97%; width: calc(100% - 20px); height: 100%; overflow-x: hidden; overflow-y: hidden; } #friendreferral-products-wrapper.slick-initialized > div { display: flex !important; } #friendreferral-products-wrapper.slick-initialized > div > div { display: flex !important; } #friendreferral-products-wrapper.slick-initialized .slick-dots { bottom: -35px; } .bader-friends-list-page .panel { margin-top: 40px; } .friendreferral-step { margin-top: 20px; margin: 20px 10px 0 10px; text-align: center; } .friendreferral-step > * { display: inline-block; width: 100%; } .friendreferral-step > i { font-size: 48px; line-height: 60px; color: #F2BD29; } .friendreferral-step .step-count { margin-top: 10px; font-size: 20px; color: #7d7d7d; } .friendreferral-step strong { margin-top: 20px; } .friendreferral-step p { color: #7d7d7d; } .friend-referral .footnote, .friend-referral .mandatoryInfo { font-size: 12px; color: #7d7d7d; } .friend-referral .form-description { margin: 10px 0; } @media (min-width: 1280px) { .friend-referral .form-description { margin-bottom: 50px; } } .friend-referral h2 { text-align: center; font-size: 24px; color: #7d7d7d; margin: 20px 0 30px 0; } @media (min-width: 1280px) { .friend-referral .panel-body .form-container { margin: 20px 80px; } } .friend-referral .product-container { margin-bottom: 20px; } .friend-referral .product-container .product-wrapper { border-color: #ece9e2; text-align: center; height: 100%; padding-bottom: 120px; position: relative; } .friend-referral .product-container .product-wrapper img { margin-left: auto; margin-right: auto; } .friend-referral .product-container .product-wrapper .product-name { font-weight: 700; } .friend-referral .product-container .product-wrapper button { position: absolute; width: calc(100% - 20px); left: 10px; } .friend-referral .product-container .product-wrapper button.btn-default { bottom: 70px; } .friend-referral .product-container .product-wrapper button.btn-primary { bottom: 20px; } .friend-referral .checkbox-area { padding: 10px 20px; border: 1px solid #ece9e2; margin-bottom: 20px; } .friend-referral textarea { resize: none; } .friend-referral-form.form-horizontal label.control-label.required:after { right: auto; margin-left: 5px; } .friendreferral-products-select-btn:focus { color: #4f4b43; background-color: #F2BD29; border-color: #F2BD29; } .friendreferral-products-select-btn:focus:hover { color: #fff; background-color: #7d7d7d; border-color: #A3A3A3; } .friendreferral-products-select-btn.active { color: #fff; background-color: #7d7d7d; border-color: #A3A3A3; } .friendreferral-products-select-btn.is-popup { width: 136px; } @media (max-width: 767px) { .friendreferral-products-select-btn { margin-left: auto; margin-right: auto; display: block; } } .friendreferral-product-name { margin-top: 0; font-size: 18px; font-weight: 700; } .friendreferral-product-description { margin-top: 10px; } /* bigger font sizes for landing pages */ .tpl-friendReferralSuccessPage .account-info-box-inner .main-content, .tpl-friendReferredLandingPage .account-info-box-inner .main-content, .tpl-friendReferredLandingErrorPage .account-info-box-inner .main-content { font-size: 16px; } @media print { html, body { padding-bottom: 0; -webkit-print-color-adjust: exact; } table { page-break-inside: auto; -fs-table-paginate: paginate; } tr { page-break-inside: avoid; page-break-after: auto; } td { page-break-inside: avoid; page-break-after: avoid; } thead { display: table-header-group; } tfoot { display: table-footer-group; } .checkout-table-head, .accordion-headline { page-break-inside: avoid; page-break-after: avoid; } .cms-additional-shop-wrapper, .panel-group-accordion, .product-line, .checkout-table-entry { page-break-inside: avoid; page-break-after: auto; } header .header-additional-area, footer, #breadcrumb, #NavColLeft, #link-back-to-category, #accordion_print, .account-nav, .checkout-progress-bar, .product-slider-wrapper, .error, .alert, .actions, .checkout-table-entry-action, .voucher-wrapper, .trustSeals, .not-printable, .sticky-elements, .btn-on-top, .modal-layer { display: none !important; } .cms-accordion-component .accordion-headline a:after { display: none; } .cms-accordion-component .collapse { display: block !important; height: auto !important; } .cms-accordion-component .accordion-content { padding-left: 0 !important; } .cms-accordion-component .accordion-content .accordion-content-inner, .cms-accordion-component .accordion-content .cmsContent, .cms-accordion-component .accordion-content .l-content { padding: 0 !important; } .cms-accordion-component .accordion-content .cmsTextEditorContent-c-textWrapper { padding-left: 0 !important; } .cms-accordion-component .accordion-content .cmsTextEditorContent { padding-top: 0 !important; } .panel-default, .panel-transparent { margin-bottom: 30px; } .panel-default .panel-heading, .panel-transparent .panel-heading { background-color: #ece9e2 !important; border: 0 solid #ece9e2; border-bottom-width: 1px; padding: 4px 10px; } .panel-default .panel-body, .panel-transparent .panel-body { padding: 0 10px; } .panel-default .panel-body .table-list td, .panel-transparent .panel-body .table-list td { line-height: normal; } .table-responsive-01 { margin-top: 10px; } .table-responsive-01 tbody tr td { padding: 0; min-height: auto; } .wishlist-content .product-line .product-line-content { padding: 10px 0; } .wishlist-content .product-line .product-line-content .product-number, .wishlist-content .product-line .product-line-content .product-price, .wishlist-content .product-line .product-line-content .product-classification, .wishlist-content .product-line .product-line-content .mbm { margin: 0; } .checkout-review-content .ch-header-info-text { display: none; } .checkout-review-content .panel-default { margin-bottom: 30px; border-width: 0; } .checkout-review-content .checkout-review-sidebar { margin-top: 30px; } .checkout-review-content .checkout-review-sidebar .checkout-review-sidebar-col { padding: 0 10px; width: 50%; } .checkout-review-content .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info { width: 65%; } .checkout-review-content .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info .mbs { margin: 0; } .checkout-review-content .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-info .checkout-table-entry-info-image .btn-radius { border: 1px solid #7d7d7d; background: #7d7d7d !important; } .checkout-review-content .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-data { background: transparent; width: 35%; margin: 0; } .checkout-review-content .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-data .checkout-table-entry-quantity { width: 50%; } .checkout-review-content .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-data .checkout-table-entry-quantity .qty-field.form-control { border: none; padding: 0; } .checkout-review-content .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-data .checkout-table-entry-price { width: 50%; } .checkout-review-content .checkout-table-wrapper .checkout-table-entry .checkout-table-entry-data .checkout-table-entry-price .product-price { display: block !important; } .bader-kaufbelege-inner .panel-transparent .panel-heading { padding: 12px 15px; background: #ece9e2 !important; } .bader-kaufbelege-inner .table-responsive-01 thead { display: table-header-group; border-bottom: 1px solid #ece9e2; } .bader-kaufbelege-inner .table-responsive-01 thead th { width: 8%; } .bader-kaufbelege-inner .table-responsive-01 thead th:first-child { width: 10%; } .bader-kaufbelege-inner .table-responsive-01 thead th.hidden-sm { display: table-cell !important; } .bader-kaufbelege-inner .table-responsive-01 tr { display: table-row; float: none; } .bader-kaufbelege-inner .table-responsive-01 tbody tr td { display: table-cell; float: none; width: 8%; padding: 8px; text-align: left; } .bader-kaufbelege-inner .table-responsive-01 tbody tr td:first-child { width: 10%; } .bader-kaufbelege-inner .table-responsive-01 tbody tr td:before { content: none; } } .prize-draw-form-container { max-width: 1024px; margin-left: auto; margin-right: auto; background: #fff; margin-bottom: 20px; margin-top: 20px; } .prize-draw-form-container .multiple-choices > .radio input[type="radio"] { margin-left: 0; } .prize-draw-form-container .multiple-choices > .radio > span { display: block; } .trendpages-template .flexible-teaser-row-component .flexible-teaser-tile-background { margin: 0 auto; } .trendpages-template .trendpage-paragraph { margin-top: 60px; margin-bottom: 50px; color: #7d7d7d; text-align: center; } .trendpages-template .trendpage-paragraph h2 { margin-bottom: 30px; font-size: 24px; } @media (min-width: 768px) { .trendpages-template .trendpage-paragraph { padding: 0 5%; } } @media (min-width: 1024px) { .trendpages-template .trendpage-paragraph { padding: 0 10%; } } .trendpages-template .cms-product-list-carousel-component { margin-bottom: 40px; } .js-simple-fade-slideshow.active .animate-fading { -webkit-animation: fading 10s infinite; animation: fading 10s infinite; } @keyframes fading { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } /* * === Breadcrumb === */ .breadcrumb { padding: 10px 0; margin: 10px 0; list-style: none; } .breadcrumb.col-6 { width: 50%; float: left; } .breadcrumb > li { display: inline-block; color: #a3a3a3; } .breadcrumb > li a { color: #7d7d7d; text-decoration: none; } .breadcrumb > li a:hover, .breadcrumb > li a:focus { color: #F2BD29; } .breadcrumb > li span.active { color: #4f4b43; } @media (max-width: 767px) { .breadcrumb { font-size: 12px; } } @media (min-width: 768px) { #js-main-nav { border: 1px solid #d4d1cb; border-width: 1px 0; position: relative; } #js-main-nav.has-break { background-color: #f6f4f1; } #js-main-nav.has-break .menu { margin: 0 auto; } #js-main-nav.middle-line:after { content: ""; position: absolute; background-color: #d4d1cb; height: 1px; width: 100%; top: 50%; bottom: 50%; left: 0; } #js-main-nav .close-dropdown { position: absolute; right: 15px; top: 10px; z-index: 1; font-size: 14px; } } .menu { font-size: 0px; } .menu li { list-style: none; } .menu li a { text-decoration: none; font-size: 15px; color: #4f4b43; } .menu li.cat-link a { font-style: italic; } .menu li.cat-link a:hover { color: #4f4b43; } .menu .sub-menu-list { display: none; position: absolute; } .menu .sub-menu-list .cat-col-title { border-bottom: 1px solid #ece9e2; padding: 10px; } .menu .sub-menu-list a { display: inline-block; padding: 5px 10px; position: relative; cursor: pointer; transition: color 0.5s ease; } .menu .sub-menu-list a:before { content: " "; width: 100%; height: 1px; background-color: #fff; position: absolute; bottom: 0; left: 0; transition: background-color 0.5s ease; } .menu .sub-menu-theme .cat-col-title, .menu .sub-menu-special .cat-col-title { width: 16%; } .menu .sub-menu-item-all-items { position: relative; } .menu .menu-highlight, .menu .highlight > a { color: #d4155c; } .menu .text-italic > a { font-style: italic; } .menu .strong > a { font-weight: 700; } @media (max-width: 767px) { .menu { display: block; position: fixed; top: 0; left: -767px; z-index: 1001; background-color: #FCFBF5; width: 100%; height: 100%; overflow-y: auto; } .menu .is-first-top-category { margin-top: 40px; } .menu .sub-menu-list a { position: static; padding: 0; font-size: 16px; } .menu .sub-menu-list a:before { width: auto; } .menu .sub-menu-list a:before:hover { background: transparent; } .menu > li { display: block; height: 40px; text-align: center; background-color: #FCFBF5; border-bottom: 1px solid #ece9e2; } .menu > li.main-menu-head { background-color: #ece9e2; position: fixed; width: 100%; left: -787px; } .menu > li.main-menu-head a { text-transform: uppercase; } .menu > li a { font-size: 16px; } .menu > li a:hover:before { background: transparent !important; } .menu > li .has-sub-categories { /* icon width */ padding-left: 36px; } .menu > li .has-sub-categories i[class^="icon-"] { float: right; margin-right: 20px; height: 40px; line-height: 40px; } .menu > li .has-sub-categories.active { border-bottom: 1px solid #ece9e2; } .menu > li .sub-menu-item a { padding: 0; transition: none; position: static; font-size: 16px; } .menu > li .sub-menu-item .sub-menu { position: relative; } .menu > li .sub-menu-item li { border-bottom: 1px solid #ece9e2; } .menu > li .sub-menu-item li a { color: #4f4b43; position: relative; padding-left: 0; display: block; } .menu > li .sub-menu-item li a.has-sub-categories:before { content: "\e907"; font-family: 'BADER-Iconfont' !important; position: absolute; right: 20px; top: 0; height: 40px; left: inherit; background: transparent; } .menu > li .sub-menu-item li a.has-sub-categories:before:hover { background: transparent; } .menu > li .sub-menu-item.active { background-color: #fff; } .menu > li .sub-menu-item-all-items { border-bottom: 1px solid #ece9e2; } .menu > li .sub-menu-item-all-items a { color: #4f4b43; } .menu > li .sub-menu-theme .sub-menu, .menu > li .sub-menu-special .sub-menu { display: none; position: absolute; width: 100%; top: 80px; } .menu > li .sub-menu-theme .open-sub-sub-menu, .menu > li .sub-menu-special .open-sub-sub-menu { top: 0; } .menu > li .sub-menu-theme li, .menu > li .sub-menu-special li { background-color: #fff; border-bottom: 1px solid #ece9e2; } .menu > li .sub-menu-theme li a, .menu > li .sub-menu-special li a { color: #4f4b43; padding-left: 0; position: relative; width: 100%; } .menu > li .sub-menu-theme li a.has-sub-categories:before, .menu > li .sub-menu-special li a.has-sub-categories:before { content: "\e907"; font-family: 'BADER-Iconfont' !important; position: absolute; right: 20px; top: 0; height: 40px; left: inherit; background: transparent; } .menu > li .sub-menu-theme.active .sub-menu, .menu > li .sub-menu-special.active .sub-menu { display: block; } .menu > li .nav-back, .menu > li .nav-close { position: absolute; height: 40px; line-height: 40px; top: 0; font-size: 16px; pointer-events: none; } .menu > li .nav-back { left: 20px; display: none; } .menu > li .nav-close { right: 20px; } .menu > li .open-sub-sub-menu, .menu > li .open-sub-sub-sub-menu { position: absolute; top: 80px; left: 0; width: 100%; background: #fff; height: 100%; /* overlayer hack */ } .menu > li .open-sub-sub-menu:before, .menu > li .open-sub-sub-sub-menu:before { content: ""; position: absolute; right: 0; width: 100%; height: 1000px; background-color: #fff; } .menu > li .open-sub-sub-menu a.active.has-sub-categories:before, .menu > li .open-sub-sub-sub-menu a.active.has-sub-categories:before { content: "\e906"; right: inherit; left: 20px; position: absolute; font-family: 'BADER-Iconfont' !important; } .menu > li .open-sub-sub-menu a.has-sub-categories.js-remove-after-back:before, .menu > li .open-sub-sub-sub-menu a.has-sub-categories.js-remove-after-back:before { content: ""; } .menu > li.opened .sub-menu-list { display: block; position: fixed; top: 40px; background-color: #fff; border-top: 1px solid #ece9e2; width: 100%; /* hide scroll bar */ width: calc(100% + 19px); height: 95%; overflow-y: scroll; overflow-x: hidden; } .menu > li.opened .sub-menu-list .first-sub-menu { margin-top: 80px; } .menu > li.opened .cat-col-title { position: absolute; top: 40px; left: 0; font-size: 16px; line-height: 40px; width: 50%; padding: 0; border-right: 1px solid #ece9e2; border-bottom: 1px solid #ece9e2; background-color: #FCFBF5; cursor: pointer; z-index: 1001; color: #4f4b43; } .menu > li.opened .cat-col-title.active { background-color: #fff; border-bottom-color: transparent; } .menu > li.opened .cat-col-title.fixed { top: 80px; } .menu > li.opened .cat-title { font-size: 16px; width: 100%; top: 40px; z-index: 1001; } .menu > li.opened .cat-title a:before { content: "\e906"; font-family: 'BADER-Iconfont' !important; right: inherit; left: 20px; height: 40px; position: absolute; background: none; transition: none; bottom: inherit; } .menu > li.opened .sub-menu-topics .cat-col-title, .menu > li.opened .sub-menu-special .cat-col-title { right: 0; left: inherit; } .menu > li.opened.has-one-category .cat-col-title { display: none; } .menu > li.opened.has-one-category .first-sub-menu { margin-top: 39px; } .menu > li.opened.has-three-categories .cat-col-title { width: 33.333%; } .menu > li.opened.has-three-categories .sub-menu-theme .cat-col-title { left: 33.333%; } .menu > li.opened.has-three-categories .sub-menu-special .cat-col-title { left: inherit; right: 0; } .menu a { display: block; color: #4f4b43; line-height: 40px; } } @media (min-width: 768px) { .menu { position: relative; background-color: #f6f4f1; text-align: center; } .menu > li { display: inline-block; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .menu > li:hover a:before, .menu > li:hover a:after, .menu > li.activeCategory a:before, .menu > li.activeCategory a:after { background-color: transparent; } .menu > li:hover + li a:before, .menu > li.activeCategory + li a:before { background-color: transparent; } .menu > li:last-child:hover a.level-1:before, .menu > li:last-child:hover a.level-1:after { background-color: #d4d1cb; } .menu > li > a { color: #4f4b43; font-size: 16px; display: block; text-decoration: none; position: relative; padding: 10px; line-height: 20px; } } @media (min-width: 768px) and (max-width: 840px) { .menu > li > a { padding: 10px 6px; } } @media (min-width: 768px) { .menu > li > a i[class^="icon-"] { display: none; } .menu > li > a:hover { color: #fff; } .menu > li > a:before, .menu > li > a:after { content: ""; position: absolute; height: 80%; width: 1px; top: 10%; background-color: #d4d1cb; } .menu > li > a:before { left: -1px; } .menu > li > a:after { right: 0px; } .menu > li.opened .sub-menu-list { padding: 60px 10px 20px 10px; border-style: solid; border-width: 2px 0; width: 100%; background-color: #fff; top: 40px; left: 0px; right: 0px; z-index: 1001; max-width: 1600px; margin: 0 auto; } } @media (min-width: 768px) and (min-width: 1600px) { .menu > li.opened .sub-menu-list { border-width: 2px; } } @media (min-width: 768px) { .menu > li.opened .sub-menu-list.push-down { top: 80px; } .menu > li.opened .sub-menu-list .sub-menu-item, .menu > li.opened .sub-menu-list .sub-menu-theme, .menu > li.opened .sub-menu-list .sub-menu-special { display: inline-block; width: 20%; padding: 10px; text-align: left; vertical-align: top; } .menu > li.opened .sub-menu-list .sub-menu-item.sub-menu-item-all-items, .menu > li.opened .sub-menu-list .sub-menu-theme.sub-menu-item-all-items, .menu > li.opened .sub-menu-list .sub-menu-special.sub-menu-item-all-items { display: none; } .menu > li.opened .sub-menu-list .sub-menu-item .cat-col-title, .menu > li.opened .sub-menu-list .sub-menu-theme .cat-col-title, .menu > li.opened .sub-menu-list .sub-menu-special .cat-col-title { font-size: 16px; font-weight: 500; position: absolute; top: 24px; } } .seo-wrapper { padding-top: 20px; padding-bottom: 20px; } .seo-wrapper .seo-content { line-height: 21px !important; color: #7d7d7d; font-size: 15px !important; } .seo-wrapper .seo-content *:first-child { margin-top: 0; } @media (min-width: 768px) { .seo-wrapper .seo-content .read-more-wrap--max-height { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 20px; -moz-column-gap: 20px; column-gap: 20px; } } .seo-wrapper .seo-content h3, .seo-wrapper .seo-content h2, .seo-wrapper .seo-content h1, .seo-wrapper .seo-content .h3, .seo-wrapper .seo-content .h2, .seo-wrapper .seo-content .h1 { font-weight: 700; font-size: 15px !important; line-height: 21px !important; color: #7d7d7d; } .seo-wrapper .seo-content p { font-size: 15px !important; line-height: 21px !important; color: #7d7d7d; } .boxBody { background-color: #fff; } .mobileCategoryTeaser { margin-bottom: 20px; } .mobileCategoryTeaser .boxBody { border: 0; } .sliderProducts { margin: 0 0 10px 0; } .sliderProducts:before, .sliderProducts:after { content: " "; display: table; } .sliderProducts:after { clear: both; } .sliderProducts .js-sliderProducts-c-boxBody { border: 1px solid #ece9e2; } .sliderProducts .js-sliderProducts-c-boxBody:before, .sliderProducts .js-sliderProducts-c-boxBody:after { content: " "; display: table; } .sliderProducts .js-sliderProducts-c-boxBody:after { clear: both; } .cms-product-variant-add-to-cart, .deals-component { margin-bottom: 10px; } .cms-product-variant-add-to-cart .boxBody, .deals-component .boxBody { margin-bottom: 0; } .cms-product-variant-add-to-cart .boxPadding, .deals-component .boxPadding { padding: 6px; border: 1px solid #ece9e2; transition: border-color 1s ease; /* @media (max-width: $screen-xsl-max) { */ /* display: inline-block; */ /* } */ } @media (max-width: 767px) { .cms-product-variant-add-to-cart, .deals-component { text-align: center; } } .cms-product-variant-add-to-cart:hover .boxPadding, .cms-product-variant-add-to-cart:focus .boxPadding, .deals-component:hover .boxPadding, .deals-component:focus .boxPadding { border-color: #F2BD29; transition: border-color 1s ease; } .cms-product-variant-add-to-cart:hover a, .cms-product-variant-add-to-cart:focus a, .deals-component:hover a, .deals-component:focus a { color: inherit; } .deals-component { width: 100%; float: left; padding: 0 10px; } .deals-component .dealsComponentImg { max-width: 100%; } @media (max-width: 1023px) { .baderBonusCarousel .boxInnerHeight193, .baderBonusCarousel .boxInnerHeight193 .doubleCol { height: auto; } .baderBonusCarousel .boxInnerHeight193 .separatorCol, .baderBonusCarousel .boxInnerHeight193 .doubleCol .separatorCol { height: 0; } .baderBonusCarousel .boxInnerHeight193 .doubleCol p.teaserText { position: static; width: 100%; } .baderBonusCarousel .boxInnerHeight193 .jCarouselLite li a { width: 100%; } .baderBonusCarousel .boxInnerHeight193 .jCarouselLite li a img { display: block; margin: auto; width: 100%; } } .baderBonusCarousel .doubleCol { width: 48%; } .baderBonusCarousel .doubleCol table td { vertical-align: top; width: 50%; } @media (max-width: 767px) { .baderBonusCarousel .doubleCol { width: 100%; } } .categorySeoTeaser { color: #4f4b43; margin-bottom: 20px; } @media (max-width: 500px) { .categorySeoTeaser { display: none; } } .categorySeoTeaser .categorySeoTeaserRight { position: relative; background: #f6f4f1; } .categorySeoTeaser .categorySeoTeaserRight .categorySeoTeaserText { z-index: 1; top: 4px; bottom: 4px; display: block; left: 15px; right: 15px; position: absolute; padding: 0 !important; overflow: hidden; } @media (max-width: 1023px) { .categorySeoTeaser .categorySeoTeaserRight .categorySeoTeaserText p { margin: 0; padding: 10px; } } @media (min-width: 501px) and (max-width: 1023px) { .categorySeoTeaser { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: start; -moz-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: start; -webkit-align-content: flex-start; -ms-flex-line-pack: start; justify-content: flex-start; -webkit-box-align: stretch; -moz-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .categorySeoTeaser .categorySeoTeaserLeft { -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } .categorySeoTeaser .categorySeoTeaserRight { -webkit-order: 1; -ms-flex-order: 1; order: 1; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } } @media (min-width: 1024px) { .categorySeoTeaser { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: start; -moz-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: start; -webkit-align-content: flex-start; -ms-flex-line-pack: start; justify-content: flex-start; -webkit-box-align: start; -moz-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .categorySeoTeaser.orientation-left .categorySeoTeaserLeft { -webkit-order: 1; -ms-flex-order: 1; order: 1; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } .categorySeoTeaser.orientation-left .categorySeoTeaserRight { -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } .categorySeoTeaser.orientation-center .categorySeoTeaserLeft, .categorySeoTeaser.orientation-right .categorySeoTeaserLeft { -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } .categorySeoTeaser.orientation-center .categorySeoTeaserRight, .categorySeoTeaser.orientation-right .categorySeoTeaserRight { -webkit-order: 1; -ms-flex-order: 1; order: 1; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } } @media (max-width: 767px) { .tpl-bader-vor-ort .boxPadding .toggleContent table { width: auto !important; } } .cms-product-variant-add-to-cart { width: 50%; float: left; padding: 0 10px; margin-bottom: 10px; } .cms-product-variant-add-to-cart.loading { position: relative; } .cms-product-variant-add-to-cart.loading:before { content: ""; background: url(/styles/common/images/spinner.gif) no-repeat center center rgba(255, 255, 255, 0.9); position: absolute; width: 100%; height: 100%; z-index: 2; } /* CMSActionBannerComponent */ .action-banner-component .element-container { position: relative; margin-bottom: 20px; } .action-banner-component .element-container span { display: block; position: absolute; top: 10px; right: 10px; left: 10px; bottom: 10px; padding: 10px; border: 1px dashed #f0b31a; text-transform: uppercase; font-weight: 700; font-size: 20px; color: #7d7d7d; text-align: right; background-color: rgba(255, 255, 255, 0); transition: 0.5s; } .action-banner-component a:hover { color: #7d7d7d; } .action-banner-component a:hover span { background-color: rgba(255, 255, 255, 0.75); } .action-banner-component .col-xs-12 { margin-bottom: 10px; } .spacing-component { margin: 0; width: 100%; float: left; } /* size_calculator */ @media (min-width: 1024px) { .modal-layer .layer-wrapper.size-content { width: 900px; } } .size-content .heading-wrapper { background-color: #ece9e2; border-radius: 4px 0 4px 0; padding: 5px 10px; margin-bottom: 10px; } .size-calculator-list li { display: inline-block; margin: 15px; } .size-calculator-list li .btn.btn-primary, .size-calculator-list li .boxInnerHeight193 .doubleCol .control a.btn-primary, .boxInnerHeight193 .doubleCol .control .size-calculator-list li a.btn-primary { width: 100%; margin: 20px 0 0 0; } /* * === Account Navigation Left === */ .account-nav ul li a { display: block; color: #7d7d7d; width: 100%; padding: 5px 0; text-decoration: none; } .account-nav ul li a:hover, .account-nav ul li a:focus, .account-nav ul li a.active { color: #F2BD29; } .account-nav ul li.disabled a { color: #A3A3A3; } .account-nav ul li.disabled a i { color: #4f4b43; } .account-nav ul li ul ul { padding-left: 10px; } .account-nav .logout-btn { width: 100%; margin-top: 10px; } @media (max-width: 500px) { .account-nav .logout-btn { width: 100%; } } /* * === google reCAPTCHA === */ .grecaptcha-badge { z-index: 1; } /* * === Account Sticky Nav === */ .sticky-nav-bottom { position: fixed; bottom: 0; left: 0; z-index: 1000; width: 100%; min-width: 320px; min-height: 50px; background-color: #fff; box-shadow: 0 -5px 18px -10px rgba(0, 0, 0, 0.2); } .sticky-nav-bottom-inner { padding: 7px 10px; width: 100%; float: left; } .sticky-nav-bottom-inner .btn.no-hover:hover, .sticky-nav-bottom-inner .boxInnerHeight193 .doubleCol .control a.no-hover:hover, .boxInnerHeight193 .doubleCol .control .sticky-nav-bottom-inner a.no-hover:hover, .sticky-nav-bottom-inner .btn.no-hover:focus, .sticky-nav-bottom-inner .boxInnerHeight193 .doubleCol .control a.no-hover:focus, .boxInnerHeight193 .doubleCol .control .sticky-nav-bottom-inner a.no-hover:focus { background: inherit; color: inherit; } .sticky-nav-bottom-action { width: 90%; width: calc(100% - 42px); } .sticky-nav-bottom-action .btn, .sticky-nav-bottom-action .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .sticky-nav-bottom-action a, .sticky-nav-bottom-action form { display: inline-block; } .sticky-nav-bottom-action .first-btn { width: 40%; } .sticky-nav-bottom-action .second-btn { width: 58%; } .sticky-nav-bottom-action form .btn, .sticky-nav-bottom-action form .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .sticky-nav-bottom-action form a { width: 100%; } .sticky-nav-bottom-action .js-logout { margin: 0; } .tpl-cart .sticky-nav-bottom-action .first-btn { width: 60%; } .tpl-cart .sticky-nav-bottom-action .second-btn { width: 38%; } /* * === Sticky Flyout Service === */ .sticky-flyout-service { position: fixed; top: 240px; right: 0; z-index: 110; height: auto; transition: right 0.5s; } .sticky-flyout-service.close { right: -301px; height: 40px; transition: right 0.5s; } .sticky-flyout-service.close .sticky-flyout-service-inner { height: 40px; } .sticky-flyout-service-inner { width: 100%; float: left; } .sticky-flyout-service .js-sticky-flyout-service-opener { width: 40px; height: 40px; line-height: 40px; cursor: pointer; font-size: 21px; text-align: center; border: 1px solid #7d7d7d; border-right-color: #fff; margin-right: -1px; border-radius: 5px 0 0 0; background-color: #fff; position: relative; z-index: 110; } .sticky-flyout-service-content { width: 300px; padding: 20px; background-color: #fff; border: 1px solid #7d7d7d; border-right: 0; } .sticky-flyout-service-content .h3, .sticky-flyout-service-content .h4, .sticky-flyout-service-content ul, .sticky-flyout-service-content .flyout-info-text-small { padding: 0 20px; } .sticky-flyout-service-content .h3, .sticky-flyout-service-content .h4 { display: block; margin: 0 0 20px 0; font-weight: 700; } .sticky-flyout-service-content .h3 { color: #7d7d7d; font-size: 16px; } .sticky-flyout-service-content .h4 { color: #7d7d7d; font-size: 14px; } .sticky-flyout-service-content .flyout-name, .sticky-flyout-service-content .flyout-subline { display: block; } .sticky-flyout-service-content .flyout-name { color: #7d7d7d; } .sticky-flyout-service-content .flyout-subline { color: #7d7d7d; font-size: 16px; } .sticky-flyout-service-content .flyout-info a { text-decoration: none; cursor: pointer; color: #7d7d7d; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .sticky-flyout-service-content .flyout-info a:hover, .sticky-flyout-service-content .flyout-info a:focus { color: #F2BD29; text-decoration: none; } .sticky-flyout-service-content .flyout-info .email { text-decoration: underline; } .sticky-flyout-service-content .flyout-info-text-small { font-size: 13px; color: #A3A3A3; } .sticky-flyout-service-content ul li { display: table; width: 100%; margin-bottom: 10px; } .sticky-flyout-service-content ul li .flyout-info, .sticky-flyout-service-content ul li .flyout-icon { display: table-cell; vertical-align: middle; } .sticky-flyout-service-content ul li .flyout-icon { margin-right: 10px; color: #F2BD29; font-size: 20px; text-align: left; width: 12%; } .sticky-flyout-service-content ul li .flyout-info { width: 80%; } @media (max-width: 767px) { .sticky-flyout-service { top: auto; right: auto; bottom: 49px; left: 10px; transition: top 1s, bottom 1s; } .sticky-flyout-service.scrollable { top: 0; overflow-y: scroll; } .sticky-flyout-service.close { top: auto; right: auto; height: auto; bottom: -600px; transition: top 1s, bottom 1s; } .sticky-flyout-service.close.scrollable { top: 600px; transition: top 1s; } .sticky-flyout-service.close .sticky-flyout-service-inner { height: auto; } .sticky-flyout-service-content { border-right: 1px solid #7d7d7d; } } .sticky-layer { position: fixed; top: 240px; left: 0; z-index: 110; } .sticky-layer.open { left: 0 !important; -webkit-transition: left .6s ease-out; -moz-transition: left .6s ease-out; -ms-transition: left .6s ease-out; -o-transition: left .6s ease-out; transition: left .6s ease-out; } .sticky-layer.close { -webkit-transition: left .6s ease-in; -moz-transition: left .6s ease-in; -ms-transition: left .6s ease-in; -o-transition: left .6s ease-in; transition: left .6s ease-in; } .sticky-layer .layer-wrapper { background: white; white-space: nowrap; border: 1px solid #7d7d7d; } .sticky-layer .layer-wrapper .sticky-layer-content { padding: 20px; display: inline-block; } @media (max-width: 767px) { .sticky-layer .layer-wrapper .sticky-layer-content { width: 100vw; } } @media (min-width: 768px) { .sticky-layer .layer-wrapper .sticky-layer-content { max-width: 95vw; max-width: calc(100vw - 65px); } } .sticky-layer .layer-wrapper .sticky-layer-content .img-responsive, .sticky-layer .layer-wrapper .sticky-layer-content img { margin: 0 auto; } .sticky-layer .layer-wrapper .sticky-layer-opener { display: inline-block; color: #4f4b43; background: #F2BD29; border: 1px solid #7d7d7d; border-left-width: 0; margin: -1px 0 0 0; padding: 10px 5px; cursor: pointer; position: absolute; width: 40px; line-height: 25px; border-radius: 0 4px 0 0; } .sticky-layer .layer-wrapper .sticky-layer-opener.opener-small { height: 40px; } .sticky-layer .layer-wrapper .sticky-layer-opener .inner { white-space: nowrap; display: inline-block; overflow: visible; } .sticky-layer .layer-wrapper .sticky-layer-opener i { position: absolute; top: 10px; right: 0; left: 0; text-align: center; } .sticky-layer .layer-wrapper .sticky-layer-opener span { padding-top: 30px; writing-mode: vertical-rl; -ms-writing-mode: tb-lr; } #NavColLeft { /* 2 level */ } #NavColLeft .mobileCMSpages li a:hover, #NavColLeft .mobileCMSpages li a:focus, #NavColLeft .mobileCMSpages li a.active { color: #F2BD29; } #NavColLeft .panel-body { padding-left: 30px; } #NavColLeft ul { background-color: #fff; } #NavColLeft li { margin: 0; padding: 15px 0; overflow: hidden; width: 100%; /* account */ /* global */ } #NavColLeft li.sub-cotegorie { padding: 0; margin-bottom: 5px; } #NavColLeft li.steady ul { display: block; border: 0; } #NavColLeft li.steady ul ul a { position: relative; } #NavColLeft li.open ul { display: block; } #NavColLeft li.open .topLevel:before { content: "\e90a"; } #NavColLeft a { text-decoration: none; display: block; padding: 6px 30px 6px 10px; outline: 0; color: #4f4b43; } #NavColLeft .topLevel { background-color: #ece9e2; border: 1px solid transparent; border-radius: 4px 0 4px 0; padding: 8px 30px 8px 10px; color: #707070; font-weight: normal; position: relative; } #NavColLeft .topLevel:before { content: "\e916"; font-family: 'BADER-Iconfont' !important; position: absolute; right: 10px; top: 0; bottom: 0; margin: auto 0; font-size: 15px; width: 16px; height: 37px; line-height: 37px; } #NavColLeft ul ul { display: none; } #NavColLeft ul ul ul { border: 0; } #NavColLeft ul ul li { padding: 0; /* 3 level */ } #NavColLeft ul ul li li { /* 4 level */ } #NavColLeft ul ul li li a { padding-left: 25px; } #NavColLeft ul ul li li li a { padding-left: 35px; } #NavColLeft ul ul li li li a:after { left: 20px !important; } #NavColLeft ul ul li.open ul li.active { /* 4 level */ } #NavColLeft ul ul li.open ul li.active a { font-weight: 700; } #NavColLeft ul ul li.open ul li.active li a { font-weight: 500; } #NavColLeft ul ul li.open ul li a { color: #4f4b43; font-weight: 500; } #NavColLeft ul ul li.active a { font-weight: 700; } #NavColLeft ul.menu-lvl1, #NavColLeft ul.menu-lvl2, #NavColLeft ul.menu-lvl3 { display: block; list-style-type: disc; list-style-position: outside; } #NavColLeft ul.menu-lvl1.marker-disc, #NavColLeft ul.menu-lvl2.marker-disc, #NavColLeft ul.menu-lvl3.marker-disc { list-style-type: disc; } #NavColLeft ul.menu-lvl1.marker-circle, #NavColLeft ul.menu-lvl2.marker-circle, #NavColLeft ul.menu-lvl3.marker-circle { list-style-type: circle; } #NavColLeft ul.menu-lvl1.marker-square, #NavColLeft ul.menu-lvl2.marker-square, #NavColLeft ul.menu-lvl3.marker-square { list-style-type: square; } #NavColLeft li.menu-lvl1-item, #NavColLeft li.menu-lvl2-item, #NavColLeft li.menu-lvl3-item { overflow: visible; padding: 6px 0; } #NavColLeft li.menu-lvl1-item a, #NavColLeft li.menu-lvl2-item a, #NavColLeft li.menu-lvl3-item a { display: inline; position: relative; padding: 0; } #GrayOut { position: fixed; top: 0; left: 0; z-index: 1100; width: 100%; height: 100%; background-color: #000000; opacity: 0.4; display: none; } body.modal-open { padding-right: 0; overflow: hidden; } @media (min-width: 768px) { body.modal-open { overflow: visible; } } /* fix modal for bader */ .modal-layer { padding: 0; position: fixed; left: -10000px; top: 0; margin: auto; min-height: 200px; display: block; z-index: -1; /* fix to prevent content from overlaping in IE11 */ overflow-x: hidden; overflow-y: auto; height: 100%; opacity: 0; -webkit-transition: opacity 0.3s linear; -moz-transition: opacity 0.3s linear; -ms-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .modal-layer.open { right: 0; left: 0; z-index: 1200; /* fix to prevent content from overlaping in IE11 */ } .modal-layer.loading .layerContent:before { content: ""; height: 100%; width: 100%; opacity: 0.7; position: absolute; top: 0; left: 0; background: url("/resources/BAD/images/ajax-loader.gif") no-repeat center center #fff; z-index: 10; } .modal-layer.in { opacity: 1; -webkit-transition: opacity 0.3s linear; -moz-transition: opacity 0.3s linear; -ms-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .modal-layer.in .layer-wrapper { -webkit-transform: translate(0, 0); -mot-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); -webkit-transition: -webkit-transform 0.3s ease-out; -moz-transition: -moz-transform 0.3s ease-out; -ms-transition: -ms-transform 0.3s ease-out; -o-transition: -o-transform 0.3s ease-out; transition: transform 0.3s ease-out; } .modal-layer.in .modal-wrapper-close { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .modal-layer .modal-wrapper-close { position: absolute; right: 0; left: 0; z-index: 4; -webkit-transform: translate(0, -150%); -ms-transform: translate(0, -150%); -o-transform: translate(0, -150%); transform: translate(0, -150%); -webkit-transition: -webkit-transform 0.3s ease-out; -moz-transition: -moz-transform 0.3s ease-out; -ms-transition: -ms-transform 0.3s ease-out; -o-transition: -o-transform 0.3s ease-out; transition: transform 0.3s ease-out; } .modal-layer .layer-wrapper { margin: 30px auto; position: absolute; left: 0; right: 0; background-color: #FFFFFF; width: 640px; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); -webkit-transition: -webkit-transform 0.3s ease-out; -moz-transition: -moz-transform 0.3s ease-out; -ms-transition: -ms-transform 0.3s ease-out; -o-transition: -o-transform 0.3s ease-out; transition: transform 0.3s ease-out; } .modal-layer .layer-wrapper .layerContent { padding: 30px 15px 15px; font-size: 15px; } .modal-layer .layer-wrapper .layerContent .textClose { margin-top: 10px; } .modal-layer .layer-wrapper .layerContent .compensatePdg { overflow-x: auto; } .modal-layer .layer-wrapper .layerContent.scroll .compensatePdg, .modal-layer .layer-wrapper .layerContent .scroll .compensatePdg { overflow-x: visible; } @media (max-width: 767px) { .modal-layer .layer-wrapper .layerContent .left .box391:nth-child(even), .modal-layer .layer-wrapper .layerContent .left .box391:nth-child(odd) { margin-right: -10px; margin-left: -10px; } } @media (min-width: 768px) { .modal-layer .layer-wrapper .layerContent .left .box391:nth-child(even) { margin-left: -10px; } .modal-layer .layer-wrapper .layerContent .left .box391:nth-child(odd) { margin-right: -10px; } } @media (min-width: 768px) { .modal-layer .layer-wrapper .layerContent.scroll { padding: 0 15px 15px; margin-top: 30px; overflow: auto; } } .modal-layer .close { width: 40px; height: 40px; border: 1px solid #7d7d7d; border-radius: 50%; position: absolute; top: -15px; right: -15px; background: #fff; text-decoration: none; -webkit-transition: 1s; -moz-transition: 1s; -ms-transition: 1s; -o-transition: 1s; transition: 1s; -webkit-transition-property: background; transition-property: background; } .modal-layer .close:hover, .modal-layer .close:focus { background-color: #7d7d7d; color: #fff; -webkit-transition: 1s; -moz-transition: 1s; -ms-transition: 1s; -o-transition: 1s; transition: 1s; } .modal-layer .close:before { content: "\e909"; font-family: 'BADER-Iconfont' !important; font-size: 18px; width: 38px; height: 38px; line-height: 38px; text-align: center; display: block; } @media (max-width: 767px) { .modal-layer .layer-wrapper { padding-top: 10px; margin: 0; width: 100%; height: auto !important; max-height: none !important; } .modal-layer .layer-wrapper .compensatePdg { overflow-x: scroll; } .modal-layer .layer-wrapper .scroll { height: 100% !important; max-height: 100% !important; } .modal-layer .layer-wrapper .scroll .compensatePdg { overflow-x: visible; } .modal-layer .modal-wrapper-close { width: 100%; height: 40px; margin: -10px 0 0 0; position: static; } .modal-layer .close { position: fixed; top: 0; left: 0; width: 100%; border-radius: 0; background-color: #d4d1cb; border-color: #d4d1cb; } .modal-layer .close:before { content: attr(title); width: 100%; font-family: "Cabin", "Helvetica Neue", Helvetica, Arial, sans-serif !important; font-size: 16px; } .modal-layer .close:after { content: "\e909"; width: 100%; font-family: 'BADER-Iconfont' !important; font-size: 16px; position: absolute; right: 0; top: 0; z-index: 2; width: 30px; height: 38px; line-height: 38px; } } /* * === MODAL WITH PRODUCT IMAGE === */ .modal-thumbnail-wrapper { width: 50px; float: left; margin-right: 15px; } .modal-thumbnail-wrapper .slick-prev { top: -40px; right: 0; left: 0; margin: 0 auto !important; } .modal-thumbnail-wrapper .slick-prev:before { content: "\e908"; } .modal-thumbnail-wrapper .slick-next { bottom: -40px; top: auto; right: 0; left: 0; margin: 0 auto !important; } .modal-thumbnail-wrapper .slick-next:before { content: "\e905"; } .modal-thumbnail-wrapper .js-thumbnail-modal.has-arrows { margin-top: 40px; } .modal-main-image-wrapper { float: left; width: 100%; } @media (min-width: 768px) { .modal-main-image-wrapper { width: 95%; width: calc(100% - 65px); } } .dropdown-backdrop { z-index: 99; } .filter-facett-container .bootstrap-select.open .btn-default.dropdown-toggle, .filter-facett-container .bootstrap-select.open .boxInnerHeight193 .doubleCol .control a.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .filter-facett-container .bootstrap-select.open a.dropdown-toggle, .bootstrap-select.open .btn-default.dropdown-toggle, .bootstrap-select.open .boxInnerHeight193 .doubleCol .control a.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .bootstrap-select.open a.dropdown-toggle { border: 1px solid #F2BD29; border-bottom-color: white; border-bottom-right-radius: 0; z-index: 101; } .filter-facett-container .bootstrap-select.open .btn-default.dropdown-toggle:hover, .filter-facett-container .bootstrap-select.open .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:hover, .boxInnerHeight193 .doubleCol .control .filter-facett-container .bootstrap-select.open a.dropdown-toggle:hover, .bootstrap-select.open .btn-default.dropdown-toggle:hover, .bootstrap-select.open .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select.open a.dropdown-toggle:hover { border-bottom-color: white; } .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner), .bootstrap-select.open .dropdown-menu:not(.inner) { margin-top: -1px; border: 1px solid #F2BD29; z-index: 100; } .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner).open, .bootstrap-select.open .dropdown-menu:not(.inner).open { border-top-left-radius: 0; } .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-thumb, .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-thumb { background-size: cover; background-position: 50% 50%; } .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner).open .text-with-offset, .bootstrap-select.open .dropdown-menu:not(.inner).open .text-with-offset { margin-left: 30px; } .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-color, .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-thumb, .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-color, .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-thumb { display: inline-block; position: absolute; width: 16px; height: 16px; border-radius: 50%; vertical-align: bottom; } .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-color:before, .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-thumb:before, .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-color:before, .bootstrap-select.open .dropdown-menu:not(.inner).open .icon-thumb:before { content: ''; position: absolute; display: inline-block; top: -4px; left: -4px; width: 24px; height: 24px; border: 1px solid #A3A3A3; border-radius: 50%; } .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner).open .selected .icon-color:before, .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner).open .selected .icon-thumb:before, .bootstrap-select.open .dropdown-menu:not(.inner).open .selected .icon-color:before, .bootstrap-select.open .dropdown-menu:not(.inner).open .selected .icon-thumb:before { border-width: 3px; } .filter-facett-container .bootstrap-select.open .dropdown-menu:not(.inner) li a, .bootstrap-select.open .dropdown-menu:not(.inner) li a { padding: 7px 20px 5px; text-decoration: none; } .filter-facett-container .bootstrap-select.open.dropup .btn-default.dropdown-toggle, .filter-facett-container .bootstrap-select.open.dropup .boxInnerHeight193 .doubleCol .control a.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .filter-facett-container .bootstrap-select.open.dropup a.dropdown-toggle, .bootstrap-select.open.dropup .btn-default.dropdown-toggle, .bootstrap-select.open.dropup .boxInnerHeight193 .doubleCol .control a.dropdown-toggle, .boxInnerHeight193 .doubleCol .control .bootstrap-select.open.dropup a.dropdown-toggle { border-top-left-radius: 0; border-top-color: white; border-bottom-right-radius: 4px; border-bottom-color: #F2BD29; } .filter-facett-container .bootstrap-select.open.dropup .btn-default.dropdown-toggle:hover, .filter-facett-container .bootstrap-select.open.dropup .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:hover, .boxInnerHeight193 .doubleCol .control .filter-facett-container .bootstrap-select.open.dropup a.dropdown-toggle:hover, .bootstrap-select.open.dropup .btn-default.dropdown-toggle:hover, .bootstrap-select.open.dropup .boxInnerHeight193 .doubleCol .control a.dropdown-toggle:hover, .boxInnerHeight193 .doubleCol .control .bootstrap-select.open.dropup a.dropdown-toggle:hover { border-top-color: white; border-bottom-color: #F2BD29; } .filter-facett-container .bootstrap-select.open.dropup .dropdown-menu:not(.inner), .bootstrap-select.open.dropup .dropdown-menu:not(.inner) { margin-bottom: -1px; } .filter-facett-container .bootstrap-select.open.dropup .dropdown-menu:not(.inner).open, .bootstrap-select.open.dropup .dropdown-menu:not(.inner).open { border-bottom-right-radius: 0; border-top-left-radius: 4px; } /* override for mobile filter */ #mobile-filter-window .bootstrap-select.open .btn-default.dropdown-toggle, #mobile-filter-window .bootstrap-select.open .boxInnerHeight193 .doubleCol .control a.dropdown-toggle, .boxInnerHeight193 .doubleCol .control #mobile-filter-window .bootstrap-select.open a.dropdown-toggle { border-bottom-color: #F2BD29 !important; } footer .cmsDynamicNewsletterComponent { position: relative; display: block; clear: both; margin: 20px 0 40px 0; } @media only screen and (min-width: 768px) { footer .cmsDynamicNewsletterComponent { margin: 40px 0 60px 0; } } footer .cmsDynamicNewsletterComponent.isRegistered { margin-bottom: 100px; } footer .cmsDynamicNewsletterComponent .wrapper { border: 1px dashed #F2BD29; margin: 10px; padding: 10px; height: 213px; } @media only screen and (min-width: 768px) { footer .cmsDynamicNewsletterComponent .wrapper { height: 250px; } } @media (max-width: 767px) { footer .cmsDynamicNewsletterComponent .wrapper { height: 243px; } } footer .cmsDynamicNewsletterComponent .wrapper.isRegistered { height: 290px; } @media (max-width: 767px) { footer .cmsDynamicNewsletterComponent .wrapper.isRegistered { height: 280px; } } footer .cmsDynamicNewsletterComponent .wrapper:before, footer .cmsDynamicNewsletterComponent .wrapper:after { content: " "; display: table; } footer .cmsDynamicNewsletterComponent .wrapper:after { clear: both; } footer .cmsDynamicNewsletterComponent .teaserContent { text-align: center; margin: 25px 0 0 10px; } @media (max-width: 1023px) { footer .cmsDynamicNewsletterComponent .teaserContent { margin: 0; } } @media (max-width: 767px) { footer .cmsDynamicNewsletterComponent .teaserContent { background-color: #fff; background: rgba(255, 255, 255, 0.7); padding: 10px; height: 80px; position: absolute; width: 80%; top: 90px; left: 10%; margin: auto; display: table; font-size: 16px; } footer .cmsDynamicNewsletterComponent .teaserContent .visible-xs { vertical-align: middle; display: table-cell !important; } } footer .cmsDynamicNewsletterComponent .teaserContent p { padding: 0 60px; font-size: 15px; } @media (max-width: 1023px) { footer .cmsDynamicNewsletterComponent .teaserContent p { padding: 0; } } @media (max-width: 500px) { footer .cmsDynamicNewsletterComponent .teaserContent p { padding: 0; } } footer .cmsDynamicNewsletterComponent .teaserContent .newsletter-headline { font-size: 24px; margin: 0 0 20px 0; padding: 0 !important; } @media (max-width: 767px) { footer .cmsDynamicNewsletterComponent .back .teaserContent { top: 30px; } } @media (max-width: 500px) { footer .cmsDynamicNewsletterComponent .back .teaserContent p { font-size: 12px; } } @media (max-width: 500px) { footer .cmsDynamicNewsletterComponent .back .teaserContent p { font-size: 12px; } } footer .cmsDynamicNewsletterComponent .newsletter-registrationshow-button .frontButton { text-transform: none; } footer .cmsDynamicNewsletterComponent #dnl_confirmation_section { width: 100%; height: 100%; background-repeat: no-repeat; background-position: 0 0; display: none; position: absolute; top: 0; } footer .cmsDynamicNewsletterComponent #dnl_confirmation_section .teaserContent { margin-top: 25px; } @media (max-width: 767px) { footer .cmsDynamicNewsletterComponent #dnl_confirmation_section .teaserContent { margin: auto; } } footer .cmsDynamicNewsletterComponent .form-control, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .btn.btn-default, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select a { border-color: #7e7e7c; } footer .cmsDynamicNewsletterComponent .form-control, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .btn.btn-default, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select a, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .dropdown-menu.open { background-color: #fefaee; background-color: rgba(255, 255, 255, 0.603922); } footer .cmsDynamicNewsletterComponent .form-control:hover, footer .cmsDynamicNewsletterComponent .form-control:focus, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .btn.btn-default:hover, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .boxInnerHeight193 .doubleCol .control a:hover, .boxInnerHeight193 .doubleCol .control footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select a:hover, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .btn.btn-default:focus, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .boxInnerHeight193 .doubleCol .control a:focus, .boxInnerHeight193 .doubleCol .control footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select a:focus, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .dropdown-menu.open:hover, footer .cmsDynamicNewsletterComponent .form-control.bootstrap-select .dropdown-menu.open:focus { background-color: #fff; border-color: #F2BD29; } footer .cmsDynamicNewsletterComponent .has-error .form-control { border-color: #BD0025; } footer .cmsDynamicNewsletterComponent #dnl_form_section .wrapper { padding: 20px 50px; } footer .cmsDynamicNewsletterComponent #dnl_form_section, footer .cmsDynamicNewsletterComponent #dnl_confirmation_section { background-size: cover !important; } footer .cmsDynamicNewsletterComponent .columnContent { text-align: center; } footer .cmsDynamicNewsletterComponent .columnContent .slogan { font-family: "PT Serif", serif; font-size: 24px; margin: 15px 0; display: block; } footer .cmsDynamicNewsletterComponent .columnContent p { font-size: 15px; } footer .cmsDynamicNewsletterComponent .slogan, footer .cmsDynamicNewsletterComponent .newsletter-headline { font-style: normal; } footer #components .cmsDynamicNewsletterComponent p { position: static; } /* entire container, keeps perspective */ .flip-container { -webkit-perspective: 1000; -moz-perspective: 1000; perspective: 1000; max-width: 1020px; height: 280px; margin: auto; position: relative; left: 5px; } @media (max-width: 1599px) { .flip-container { max-width: 830px; } } @media (max-width: 1023px) { .flip-container { width: 90%; } } /* flip speed goes here */ .flipper { -webkit-transition: 0.6s; -moz-transition: 0.6s; -ms-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; position: relative; } .flipper:before, .flipper:after { content: " "; display: table; } .flipper:after { clear: both; } /* hide back of pane during swap */ .front, .back { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; position: absolute; top: 0; left: 0; background-color: #fcf2d4; width: 100%; height: 270px; -webkit-box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.2); } .front:before, .front:after, .back:before, .back:after { content: " "; display: table; } .front:after, .back:after { clear: both; } .front.isRegistered, .back.isRegistered { height: 310px; } /* front pane, placed above back */ .front { z-index: 2; background-repeat: no-repeat !important; background-position: right !important; /* for firefox 31 */ -webkit-transform: rotateY(0deg); -ms-transform: rotateY(0deg); -o-transform: rotateY(0deg); transform: rotateY(0deg); } /* back, initially hidden pane */ .back { -webkit-transform: rotateX(180deg); -ms-transform: rotateX(180deg); -o-transform: rotateX(180deg); transform: rotateX(180deg); } .flip-container .flipper { -webkit-transform-origin: 100% 135px; -moz-transform-origin: 100% 135px; -ms-transform-origin: 100% 135px; transform-origin: 100% 135px; } @media (max-width: 767px) { .flip-container .flipper { -webkit-transform-origin: 100% 141px; -moz-transform-origin: 100% 141px; -ms-transform-origin: 100% 141px; transform-origin: 100% 141px; } } .flip-container.hover .flipper { -webkit-transform: rotateX(-180deg); -ms-transform: rotateX(-180deg); -o-transform: rotateX(-180deg); transform: rotateX(-180deg); } .isRegistered .flip-container .flipper { -webkit-transform-origin: 100% 155px; -moz-transform-origin: 100% 155px; -ms-transform-origin: 100% 155px; transform-origin: 100% 155px; } @media (max-width: 767px) { .isRegistered .flip-container .flipper { -webkit-transform-origin: 100% 150px; -moz-transform-origin: 100% 150px; -ms-transform-origin: 100% 150px; transform-origin: 100% 150px; } } .closeCircle { border-radius: 50%; background-color: #fcf2d4; width: 40px; height: 40px; line-height: 50px; position: absolute; top: -10px; right: -10px; border: 1px solid #7d7d7d; cursor: pointer; text-align: center; -webkit-transition: 1s; -moz-transition: 1s; -ms-transition: 1s; -o-transition: 1s; transition: 1s; } .closeCircle span { color: #aeaeae; font-size: 22px; font-weight: normal; text-transform: uppercase; } .closeCircle:hover, .closeCircle:focus { background-color: #7d7d7d; color: #fff; -webkit-transition: 1s; -moz-transition: 1s; -ms-transition: 1s; -o-transition: 1s; transition: 1s; } .closeCircle:hover span, .closeCircle:focus span { color: #fff; -webkit-transition: 1s; -moz-transition: 1s; -ms-transition: 1s; -o-transition: 1s; transition: 1s; } .frontButton { position: absolute; bottom: -20px; left: 180px; } .backButton .btn, .backButton .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .backButton a { position: absolute; bottom: -50px; right: 10px; width: calc(100% - 20px); text-transform: none; } @media (max-width: 767px) { .backButton .btn, .backButton .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .backButton a { bottom: -43px; } } .isRegistered .backButton .btn, .isRegistered .backButton .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .isRegistered .backButton a { bottom: -40px; } #loaderDiv { display: none; position: absolute; top: -16px; left: 0; width: 100%; height: 115%; background-color: rgba(255, 255, 255, 0.6); z-index: 5; } #loaderDiv img { margin: auto; position: absolute; top: 50%; left: 50%; margin: -30px 0 0 -30px; } /* Newsletter */ @media only screen and (max-width: 767px) { .components { width: 100%; } .flip-container { -webkit-perspective: 1000; -moz-perspective: 1000; perspective: 1000; left: auto; margin: 0 auto 30px; height: 235px; } .front, .back { height: 265px; } .front.isRegistered, .back.isRegistered { height: 300px; } .frontButton { right: 20px; left: 20px; } #additionalFormContent, #dynamicNewsletterRegistrationFormDiv { float: none; width: 100%; } #additionalFormContent { display: none; } .cmsDynamicNewsletterComponent .form-group label { display: none; } } .price { color: #4f4b43; font-size: 15px; font-weight: 700; } .price-sale { color: #BD0025; font-size: 15px; font-weight: 700; } .price-old { color: #7d7d7d; font-weight: 500; text-decoration: line-through; } .price-old-type { color: #7d7d7d; font-weight: 500; } .price-base { color: #7d7d7d; font-weight: 500; } .product-price .reduce { text-decoration: line-through; white-space: nowrap; } .product-availability .text { font-weight: 700; } .product-availability.availability_green .text { color: #74BD2B; } .product-availability.availability_red .text { color: #BD0025; } .product-availability.availability_yellow .text { color: #f0b31a; } .product-energyLabel { position: absolute; left: -5px; bottom: 10px; } .product-energyLabel img { height: 18px; } .productName { margin-top: 71px; text-align: center; } #ProductHeader .left { float: left; display: inline; text-align: center; padding-right: 9px; zoom: 1; position: relative; z-index: 3; width: 358px; } @media (max-width: 767px) { #ProductHeader .left { width: 100%; } } .zoomLens { border: 0 !important; opacity: 0 !important; } /* * === PRODUCT SLICK SLIDER === */ .product-slider-wrapper .product-slider-content { display: none; } @media (min-width: 768px) { .product-slider-wrapper .product-slider-content { padding: 0 40px; } } .product-slider-wrapper .slick-prev, .product-slider-wrapper .slick-next { display: none; padding-left: 0; } @media (min-width: 768px) { .product-slider-wrapper .slick-prev, .product-slider-wrapper .slick-next { display: block; } } .product-slider-wrapper .product-slider-headline { color: #7d7d7d; text-align: center; font-size: 18px; margin: 30px 0; padding: 0; } .product-slider-wrapper .product-slider-entry { text-align: center; /* only for slider calc */ border: 2px solid transparent; margin-bottom: 0px; /* .outer-image-box { */ /* min-height: $bader-slider-image-min-height; */ /* } */ } .product-slider-wrapper .product-slider-entry span, .product-slider-wrapper .product-slider-entry .product-slider-entry-link { display: block; } .product-slider-wrapper .product-slider-entry-link { text-decoration: none; border: 1px solid transparent; padding: 5px; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .product-slider-wrapper .product-slider-entry-link:hover, .product-slider-wrapper .product-slider-entry-link:focus { border-color: #ddd; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .product-slider-wrapper .product-slider-entry-image { margin-bottom: 10px; } .product-slider-wrapper .product-slider-entry-image img { margin: 0 auto; } .product-slider-wrapper .product-slider-entry-brand-name { color: #A3A3A3; } .product-slider-wrapper .product-slider-entry-itemOffer span, .product-slider-wrapper .product-slider-entry-itemOfferNew span { display: inline-block; } /****************************** * * Bonus Product Styling * */ .mobileFriendRecruit .productSpecifications { text-align: left; } .mobileFriendRecruit p { font-size: 15px; } .mobileFriendRecruit .friend-product-badge { position: absolute; right: 0; top: 0; } /*****************************************************************************/ /*** SUGGEST ***/ /*****************************************************************************/ /* needed otherwise the searchBoxLine will pop-up in IE */ #FreeSearch { position: relative; } @media (min-width: 768px) { #FreeSearch { height: auto !important; display: block !important; } } @media (max-width: 767px) { #FreeSearch { opacity: 0; height: 0; } #FreeSearch.collapse { display: none; opacity: 1; height: auto; } #FreeSearch.collapse.in { display: block; } #FreeSearch.collapsing { position: relative; height: 0; overflow: hidden; opacity: 1; -webkit-transition-property: height, visibility; transition-property: height, visibility; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: ease; transition-timing-function: ease; } } #FreeSearch .FreeSearchInput .form-control { border-color: #7d7d7d; } .suggestFormWrap { position: relative; z-index: 1001; } .suggestLayer, .suggestLayerErrorPage { display: none; padding: 0; margin: 0 0 64px 0; z-index: 1000; background-color: white; background: transparent; width: 700px; position: absolute; left: 0; top: 40px; -webkit-box-shadow: 0px 10px 25px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 10px 25px 0px rgba(0, 0, 0, 0.2); } @media (max-width: 1023px) { .suggestLayer, .suggestLayerErrorPage { width: 550px; } } @media (max-width: 767px) { .suggestLayer, .suggestLayerErrorPage { width: 95%; right: 0; top: 50px; margin: 0 auto; } } .suggestLayer .suggestLayerList, .suggestLayer .suggestLayerBlock, .suggestLayer .suggestLayerErrorPageList, .suggestLayer .suggestLayerErrorPageBlock, .suggestLayerErrorPage .suggestLayerList, .suggestLayerErrorPage .suggestLayerBlock, .suggestLayerErrorPage .suggestLayerErrorPageList, .suggestLayerErrorPage .suggestLayerErrorPageBlock { list-style: none; color: #58585a; font-size: 11px; background-color: white; border: 1px solid #ece9e2; padding: 10px 10px 80px 10px; position: relative; overflow: hidden; } .suggestLayer .suggestLayerList:before, .suggestLayer .suggestLayerBlock:before, .suggestLayer .suggestLayerErrorPageList:before, .suggestLayer .suggestLayerErrorPageBlock:before, .suggestLayerErrorPage .suggestLayerList:before, .suggestLayerErrorPage .suggestLayerBlock:before, .suggestLayerErrorPage .suggestLayerErrorPageList:before, .suggestLayerErrorPage .suggestLayerErrorPageBlock:before { content: ""; position: absolute; top: 0; left: 0; width: 32%; height: 3000px; background-color: #FCFBF5; } @media (max-width: 767px) { .suggestLayer .suggestLayerList:before, .suggestLayer .suggestLayerBlock:before, .suggestLayer .suggestLayerErrorPageList:before, .suggestLayer .suggestLayerErrorPageBlock:before, .suggestLayerErrorPage .suggestLayerList:before, .suggestLayerErrorPage .suggestLayerBlock:before, .suggestLayerErrorPage .suggestLayerErrorPageList:before, .suggestLayerErrorPage .suggestLayerErrorPageBlock:before { height: 0; } } .suggestLayer .suggestLayerList li, .suggestLayer .suggestLayerList .suggestLayerBlockText li, .suggestLayer .suggestLayerList .suggestLayerBlockImage li, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText li, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockImage li, .suggestLayer .suggestLayerBlock li, .suggestLayer .suggestLayerBlock .suggestLayerBlockText li, .suggestLayer .suggestLayerBlock .suggestLayerBlockImage li, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText li, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockImage li, .suggestLayer .suggestLayerErrorPageList li, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText li, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockImage li, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText li, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage li, .suggestLayer .suggestLayerErrorPageBlock li, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText li, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockImage li, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText li, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage li, .suggestLayerErrorPage .suggestLayerList li, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText li, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockImage li, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText li, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockImage li, .suggestLayerErrorPage .suggestLayerBlock li, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText li, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockImage li, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText li, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockImage li, .suggestLayerErrorPage .suggestLayerErrorPageList li, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText li, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockImage li, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText li, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage li, .suggestLayerErrorPage .suggestLayerErrorPageBlock li, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText li, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockImage li, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText li, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage li { list-style: none; display: block; } .suggestLayer .suggestLayerList .suggestLayerBlockImage, .suggestLayer .suggestLayerList .suggestLayerBlockText, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerBlock .suggestLayerBlockImage, .suggestLayer .suggestLayerBlock .suggestLayerBlockText, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText { width: 30%; padding: 10px 15px 20px; margin: 0; position: relative; z-index: 3; } @media (max-width: 1023px) { .suggestLayer .suggestLayerList .suggestLayerBlockImage, .suggestLayer .suggestLayerList .suggestLayerBlockText, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerBlock .suggestLayerBlockImage, .suggestLayer .suggestLayerBlock .suggestLayerBlockText, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText { padding: 0 0 20px; } } .suggestLayer .suggestLayerList .suggestLayerBlockImage, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerBlock .suggestLayerBlockImage, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage { float: right; margin-left: 20px; padding: 10px 10px; width: 66%; width: calc(72% - 40px); } @media (max-width: 767px) { .suggestLayer .suggestLayerList .suggestLayerBlockImage, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerBlock .suggestLayerBlockImage, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage { width: 100%; margin: 0; padding: 0; } } .suggestLayer .suggestLayerList .suggestLayerBlockImage .suggestTextQuery, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockImage .suggestTextQuery, .suggestLayer .suggestLayerBlock .suggestLayerBlockImage .suggestTextQuery, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockImage .suggestTextQuery, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockImage .suggestTextQuery, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage .suggestTextQuery, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockImage .suggestTextQuery, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage .suggestTextQuery, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockImage .suggestTextQuery, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockImage .suggestTextQuery, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockImage .suggestTextQuery, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockImage .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockImage .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockImage .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockImage .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockImage .suggestTextQuery { font-weight: 700; } .suggestLayer .suggestLayerList .suggestLayerBlockText, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerBlock .suggestLayerBlockText, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText { float: left; } @media (max-width: 767px) { .suggestLayer .suggestLayerList .suggestLayerBlockText, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerBlock .suggestLayerBlockText, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText { width: 100%; } } .suggestLayer .suggestLayerList .suggestLayerBlockText .suggestTextQuery, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText .suggestTextQuery, .suggestLayer .suggestLayerBlock .suggestLayerBlockText .suggestTextQuery, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestTextQuery, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText .suggestTextQuery, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestTextQuery, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestTextQuery, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestTextQuery, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText .suggestTextQuery, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText .suggestTextQuery, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText .suggestTextQuery, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestTextQuery { padding-left: 10px; position: relative; text-decoration: none; width: auto; margin: 0; } .suggestLayer .suggestLayerList .suggestLayerBlockText .suggestRow.suggestRowWithoutImage, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText .suggestRow.suggestRowWithoutImage, .suggestLayer .suggestLayerBlock .suggestLayerBlockText .suggestRow.suggestRowWithoutImage, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestRow.suggestRowWithoutImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText .suggestRow.suggestRowWithoutImage, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestRow.suggestRowWithoutImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestRow.suggestRowWithoutImage, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestRow.suggestRowWithoutImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText .suggestRow.suggestRowWithoutImage, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText .suggestRow.suggestRowWithoutImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText .suggestRow.suggestRowWithoutImage, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestRow.suggestRowWithoutImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText .suggestRow.suggestRowWithoutImage, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestRow.suggestRowWithoutImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestRow.suggestRowWithoutImage, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestRow.suggestRowWithoutImage { padding: 0px 5px; margin-bottom: 5px; } .suggestLayer .suggestLayerList .suggestLayerBlockText .suggestHighlight, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText .suggestHighlight, .suggestLayer .suggestLayerBlock .suggestLayerBlockText .suggestHighlight, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestHighlight, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText .suggestHighlight, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestHighlight, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestHighlight, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestHighlight, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText .suggestHighlight, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText .suggestHighlight, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText .suggestHighlight, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestHighlight, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText .suggestHighlight, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestHighlight, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestHighlight, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestHighlight { background-color: transparent; cursor: default; } .suggestLayer .suggestLayerList .suggestLayerBlockText .suggestHighlight .suggestTextQuery, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText .suggestHighlight .suggestTextQuery, .suggestLayer .suggestLayerBlock .suggestLayerBlockText .suggestHighlight .suggestTextQuery, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestHighlight .suggestTextQuery, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText .suggestHighlight .suggestTextQuery, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestHighlight .suggestTextQuery, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestHighlight .suggestTextQuery, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestHighlight .suggestTextQuery, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText .suggestHighlight .suggestTextQuery, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText .suggestHighlight .suggestTextQuery, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText .suggestHighlight .suggestTextQuery, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestHighlight .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText .suggestHighlight .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestHighlight .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestHighlight .suggestTextQuery, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestHighlight .suggestTextQuery { background-color: #fff; cursor: pointer; } .suggestLayer .suggestLayerList .suggestLayerBlockText .suggestHeader, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText .suggestHeader, .suggestLayer .suggestLayerBlock .suggestLayerBlockText .suggestHeader, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestHeader, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText .suggestHeader, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestHeader, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestHeader, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestHeader, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText .suggestHeader, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText .suggestHeader, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText .suggestHeader, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestHeader, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText .suggestHeader, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestHeader, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestHeader, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestHeader { border-top: 1px solid #ccc; padding: 10px 0 0px 0; margin: 10px 0 10px 0; } .suggestLayer .suggestLayerList .suggestLayerBlockText .suggestHeader:first-child, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlockText .suggestHeader:first-child, .suggestLayer .suggestLayerBlock .suggestLayerBlockText .suggestHeader:first-child, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestHeader:first-child, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlockText .suggestHeader:first-child, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestHeader:first-child, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestHeader:first-child, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestHeader:first-child, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlockText .suggestHeader:first-child, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlockText .suggestHeader:first-child, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlockText .suggestHeader:first-child, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlockText .suggestHeader:first-child, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlockText .suggestHeader:first-child, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlockText .suggestHeader:first-child, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlockText .suggestHeader:first-child, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlockText .suggestHeader:first-child { border-top: 0; padding-top: 0; } .suggestLayer .suggestLayerList li.suggestHeader, .suggestLayer .suggestLayerBlock li.suggestHeader, .suggestLayer .suggestLayerErrorPageList li.suggestHeader, .suggestLayer .suggestLayerErrorPageBlock li.suggestHeader, .suggestLayerErrorPage .suggestLayerList li.suggestHeader, .suggestLayerErrorPage .suggestLayerBlock li.suggestHeader, .suggestLayerErrorPage .suggestLayerErrorPageList li.suggestHeader, .suggestLayerErrorPage .suggestLayerErrorPageBlock li.suggestHeader { color: #474747; font-weight: bold; font-size: 14px; padding: 0; margin-left: 0; margin-bottom: 20px; text-transform: uppercase; } .suggestLayer .suggestLayerList .suggestLayerBlock ul.noborder, .suggestLayer .suggestLayerList .suggestLayerErrorPageBlock ul.noborder, .suggestLayer .suggestLayerBlock .suggestLayerBlock ul.noborder, .suggestLayer .suggestLayerBlock .suggestLayerErrorPageBlock ul.noborder, .suggestLayer .suggestLayerErrorPageList .suggestLayerBlock ul.noborder, .suggestLayer .suggestLayerErrorPageList .suggestLayerErrorPageBlock ul.noborder, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerBlock ul.noborder, .suggestLayer .suggestLayerErrorPageBlock .suggestLayerErrorPageBlock ul.noborder, .suggestLayerErrorPage .suggestLayerList .suggestLayerBlock ul.noborder, .suggestLayerErrorPage .suggestLayerList .suggestLayerErrorPageBlock ul.noborder, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerBlock ul.noborder, .suggestLayerErrorPage .suggestLayerBlock .suggestLayerErrorPageBlock ul.noborder, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerBlock ul.noborder, .suggestLayerErrorPage .suggestLayerErrorPageList .suggestLayerErrorPageBlock ul.noborder, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerBlock ul.noborder, .suggestLayerErrorPage .suggestLayerErrorPageBlock .suggestLayerErrorPageBlock ul.noborder { border: none; padding-left: 0; border-left: 0; } .suggestLayer li.suggestRow, .suggestLayerErrorPage li.suggestRow { padding: 0; margin: 0; } .suggestLayer li.suggestRow.border-bottom, .suggestLayerErrorPage li.suggestRow.border-bottom { border-bottom: 1px solid #ddd; padding: 10px 0; } .suggestLayer li.suggestRow .product-desc, .suggestLayerErrorPage li.suggestRow .product-desc { display: block; float: left; font-size: 12px; color: #bab9b3; overflow: hidden; text-overflow: ellipsis; } .suggestLayer li.suggestRow .product-energyLabel img, .suggestLayerErrorPage li.suggestRow .product-energyLabel img { width: 30px; height: auto; } .suggestLayer li.suggestRow .product-price-normal, .suggestLayerErrorPage li.suggestRow .product-price-normal { margin-top: 5px; } .suggestLayer li.suggestRow .product-price, .suggestLayerErrorPage li.suggestRow .product-price { display: block; width: 120px; float: right; font-size: 16px; font-weight: 700; color: #474747; position: static; right: 0; bottom: 5px; text-align: right; } .suggestLayer li.suggestRow .product-price .product-base-price, .suggestLayerErrorPage li.suggestRow .product-price .product-base-price { font-size: 11px; font-weight: 500; color: #474747; margin-top: 5px; } .suggestLayer li.suggestRow .product-price .product-price-old, .suggestLayerErrorPage li.suggestRow .product-price .product-price-old { font-size: 13px; font-weight: 400; } .suggestLayer li.suggestRow .product-price .product-price-old .strike, .suggestLayerErrorPage li.suggestRow .product-price .product-price-old .strike { text-decoration: line-through; } .suggestLayer li.suggestRow .product-price.product-price-noOldPrice, .suggestLayerErrorPage li.suggestRow .product-price.product-price-noOldPrice { position: absolute; right: 0; bottom: 5px; } @media (max-width: 1023px) { .suggestLayer li.suggestRow .product-price.product-price-noOldPrice, .suggestLayerErrorPage li.suggestRow .product-price.product-price-noOldPrice { position: static; } } .suggestLayer .suggestRowWithImage, .suggestLayerErrorPage .suggestRowWithImage { display: block; float: left; width: 100%; position: relative; padding: 5px 0; } .suggestLayer .suggest-article-info, .suggestLayerErrorPage .suggest-article-info { width: 220px; overflow: hidden; text-overflow: ellipsis; } @media (min-width: 768px) { .suggestLayer .suggest-article-info, .suggestLayerErrorPage .suggest-article-info { width: 250px; } } .suggestLayer .suggestTextQuery, .suggestLayerErrorPage .suggestTextQuery { display: block; font-size: 13px; margin-bottom: 10px; text-decoration: underline; } .suggestLayer .suggestTextQueryTyped, .suggestLayerErrorPage .suggestTextQueryTyped { font-weight: bold; } .suggestLayer .suggestTextType, .suggestLayerErrorPage .suggestTextType { float: right; padding-left: 20px; font-size: 10px; } .suggestLayer .suggestTextAmount, .suggestLayerErrorPage .suggestTextAmount { padding-left: 10px; text-align: right; display: inline-block; } .suggestLayer .suggestParentCategory, .suggestLayerErrorPage .suggestParentCategory { display: block; font-size: 12px; color: #474747; font-weight: bold; margin: 15px 0 5px 0; text-transform: uppercase; } .suggestLayer .suggestHighlight, .suggestLayerErrorPage .suggestHighlight { background-color: #FCFBF5; cursor: pointer; } .suggestLayer .suggestImage, .suggestLayerErrorPage .suggestImage { padding-right: 10px; width: 55px; min-height: 1px; text-align: center; float: left; } .suggestLayer.no-suggest-block-text .suggestLayerBlockImage, .suggestLayer.no-suggest-block-text .suggestLayerErrorPageBlockImage, .suggestLayerErrorPage.no-suggest-block-text .suggestLayerBlockImage, .suggestLayerErrorPage.no-suggest-block-text .suggestLayerErrorPageBlockImage { margin-left: 33%; } .suggestLayer .product-price-translation, .suggestLayerErrorPage .product-price-translation { display: block; } .show-all-results { position: absolute; bottom: 20px; right: 100px; width: 256px; } @media (max-width: 1023px) { .show-all-results { right: 12%; } } @media (max-width: 767px) { .show-all-results { left: 0; right: 0; margin: 0 auto; } } .suggestLayerErrorPage { top: 80px; left: 10px; } .css-arrow-right { width: 0; height: 0; border-top: 18px solid transparent; border-bottom: 18px solid transparent; border-left: 18px solid #fff; } .checkout-progress-bar { margin: 0 auto 30px auto; padding: 15px 10px 0 10px; max-width: 1230px; } .checkout-progress-bar ul { margin: 0; padding: 0; list-style-type: none; color: #a3a3a3; } .checkout-progress-bar ul li { margin: 0; padding: 0; float: left; display: inline-block; height: 36px; line-height: 36px; width: 25%; text-align: center; position: relative; white-space: nowrap; } .checkout-progress-bar ul li.cb-pb-personal-data:before, .checkout-progress-bar ul li.cb-pb-cart:before { display: none; } .checkout-progress-bar ul li:before { content: ""; position: absolute; left: -18px; top: 0; border-top: 18px solid transparent; border-bottom: 18px solid transparent; border-left: 18px solid transparent; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .checkout-progress-bar ul li.finished .ch-pb-name i { color: #74BD2B; vertical-align: top; line-height: 33px; margin: 0 0 0 5px; } .checkout-progress-bar ul li.finished .ch-pb-icon i:before { content: "\e904"; color: #74BD2B; } .checkout-progress-bar ul li div { background-color: #ece9e2; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: background-color; transition-property: background-color; } .checkout-progress-bar ul li a { display: inline-block; text-decoration: none; color: #8a8a8a; width: 100%; } .checkout-progress-bar ul li i { vertical-align: middle; } .checkout-progress-bar ul li.active:before { content: ""; width: 15px; background: #7d7d7d; position: absolute; left: -18px; border-top: 18px solid transparent; border-bottom: 18px solid transparent; border-left: 18px solid #fff; } .checkout-progress-bar ul li.active div { background-color: #7d7d7d; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: background-color; transition-property: background-color; } .checkout-progress-bar ul li.active div .arrow-overlayer, .checkout-progress-bar ul li.active div .arrow-background { border-left-color: #7d7d7d; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-progress-bar ul li.active div.cb-pb-cart div { border-color: #7d7d7d; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-progress-bar ul li.active div .ch-pb-icon, .checkout-progress-bar ul li.active div .ch-pb-name { color: #fff; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: color; transition-property: color; } .checkout-progress-bar ul li .ch-pb-icon { font-size: 16px; display: inline-block; width: 100%; } .checkout-progress-bar ul li .ch-pb-name { display: none; } .checkout-progress-bar ul li .arrow-background, .checkout-progress-bar ul li .arrow-overlayer { position: absolute; top: 0; right: 0; border-top-color: #ece9e2; border-bottom-color: #ece9e2; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-progress-bar ul li .arrow-background { z-index: 4; border-left-color: #ece9e2; right: 3px; border-width: 15px 0 15px 15px; top: 3px; border-top-color: transparent; border-bottom-color: transparent; } .checkout-progress-bar ul li.cb-pb-cart div { border: 0px solid #ece9e2; border-radius: 4px 0 4px 0; width: 99%; float: left; } .checkout-progress-bar ul li.cb-pb-cart .ch-pb-separator { width: 1%; height: 100%; background-color: #fff; float: right; } .checkout-progress-bar ul li.cb-pb-hover:hover:before, .checkout-progress-bar ul li.cb-pb-hover:focus:before { content: ""; width: 15px; background: #7d7d7d; position: absolute; left: -18px; top: 0; border-top: 18px solid transparent; border-bottom: 18px solid transparent; border-left: 18px solid #fff; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .checkout-progress-bar ul li.cb-pb-hover:hover a, .checkout-progress-bar ul li.cb-pb-hover:focus a { color: #fff; } .checkout-progress-bar ul li.cb-pb-hover:hover div, .checkout-progress-bar ul li.cb-pb-hover:focus div { background-color: #7d7d7d; cursor: pointer; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: background-color; transition-property: background-color; } .checkout-progress-bar ul li.cb-pb-hover:hover div .arrow-overlayer, .checkout-progress-bar ul li.cb-pb-hover:hover div .arrow-background, .checkout-progress-bar ul li.cb-pb-hover:focus div .arrow-overlayer, .checkout-progress-bar ul li.cb-pb-hover:focus div .arrow-background { border-left-color: #7d7d7d; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: border-color; transition-property: border-color; } .checkout-progress-bar ul li.cb-pb-hover:hover div .ch-pb-icon, .checkout-progress-bar ul li.cb-pb-hover:hover div .ch-pb-name, .checkout-progress-bar ul li.cb-pb-hover:focus div .ch-pb-icon, .checkout-progress-bar ul li.cb-pb-hover:focus div .ch-pb-name { color: #fff; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transition-property: color; transition-property: color; } .checkout-progress-bar ul li.cb-pb-arrows i { margin-right: 15px; } .checkout-progress-bar ul li.last div { border-radius: 0 0 4px 0; } @media (min-width: 768px) { .checkout-progress-bar { padding-top: 25px; margin-bottom: 40px; } .checkout-progress-bar ul li .ch-pb-icon { display: none; } .checkout-progress-bar ul li .ch-pb-name { display: block; } } #mobile-filter-sort { float: left; width: 50%; } @media (max-width: 500px) { #mobile-filter-sort { padding-left: 8px; padding-right: 8px; } } .mobile-filter-sort-header { position: fixed; color: white; background-color: #7d7d7d; line-height: 40px; height: 40px; width: 100%; vertical-align: middle; text-align: center; margin-bottom: 10px; cursor: pointer; z-index: 1005; } .mobile-filter-sort-header #mobile-filter-close { color: white; position: absolute; right: 10px; width: 40px; text-decoration: none; } #mobile-filter-window { display: none; width: 100%; height: 0; position: fixed; bottom: 0; left: 0; background-color: white; overflow-y: auto; overflow-x: hidden; z-index: 2; } #mobile-filter-window .animate-section { position: relative; width: 100%; height: 100%; margin-top: 45px; padding-left: 10px; padding-right: 10px; } #mobile-filter-window .animate-section .sort-section .bs-caret .icon-chef_down:before { content: ""; } #mobile-filter-window .animate-section .mobile-selected-facette-container .btn, #mobile-filter-window .animate-section .mobile-selected-facette-container .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control #mobile-filter-window .animate-section .mobile-selected-facette-container a { padding: 2px 12px; height: 24px; font-size: 12px; margin-bottom: 10px; } #mobile-filter-window .animate-section .mobile-selected-facette-container .btn i, #mobile-filter-window .animate-section .mobile-selected-facette-container .boxInnerHeight193 .doubleCol .control a i, .boxInnerHeight193 .doubleCol .control #mobile-filter-window .animate-section .mobile-selected-facette-container a i { font-size: 10px; margin-right: 0; margin-left: 6px; } #mobile-filter-window .animate-section .mobile-selected-facette-container .remove-all-filters { margin-left: auto; margin-right: auto; display: block; max-width: 320px; } #mobile-filter-window .animate-section .bootstrap-select { margin-bottom: 10px; } #mobile-filter-window .animate-section .filter-section .bs-caret .icon-chef_down:before { content: ""; } #mobile-filter-window .animate-section .animate-section-inner { /* background-color: red; temp */ position: absolute; width: 100%; height: 100%; left: 100%; top: 0px; z-index: 1030; } #mobile-filter-window .animate-section .animate-section-inner .bootstrap-select .dropdown-menu.open { border: none; border-radius: 0; } #mobile-filter-window .animate-section .animate-section-inner .bootstrap-select .dropdown-menu.open .bs-filter-sort-action { position: fixed; bottom: 0; background-color: white; } #mobile-filter-window .animate-section .animate-section-inner .bootstrap-select ul.dropdown-menu.inner { padding-left: 5px; padding-right: 5px; } #mobile-filter-window .animate-section .animate-section-inner .bootstrap-select ul.dropdown-menu.inner li a { padding-top: 8px; padding-bottom: 8px; border-bottom: 1px solid #ece9e2; white-space: normal; } #mobile-filter-window .animate-section .animate-section-inner .bootstrap-select ul.dropdown-menu.inner li:last-child a { border-bottom: 0; } /* * === CMS ADDITIONAL SHOP === */ .cms-additional-shop-wrapper { padding: 20px; } .cms-additional-shop-wrapper.isCart { padding: 0 0px 10px 0px; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-flex { margin: 0 -10px; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col { display: block; line-height: 35px; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-icon, .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-text { display: block; vertical-align: middle; float: left; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-icon { font-size: 32px; padding-right: 10px; text-align: center; width: auto; color: #F2BD29; font-weight: 700; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-text { font-size: 16px; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-text .additional-shop-text-subline { font-weight: 700; } .cms-additional-shop-wrapper { padding: 20px; } .cms-additional-shop-wrapper.is-pds, .cms-additional-shop-wrapper.is-checkout { border-top: 1px solid #ece9e2; } .cms-additional-shop-wrapper.is-pds .hidden, .cms-additional-shop-wrapper.is-checkout .hidden { display: block !important; } .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content { width: 280px; } @media (min-width: 1600px) { .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content { width: 100%; } } .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content .additional-shop-flex, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content .additional-shop-flex { display: block; } .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content .additional-shop-col, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content .additional-shop-col { width: 100%; margin-bottom: 10px; } @media (min-width: 1600px) { .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content .additional-shop-col, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content .additional-shop-col { width: 50%; float: left; } } .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content .additional-shop-col .additional-shop-icon, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content .additional-shop-col .additional-shop-icon { font-size: 21px; } @media (min-width: 1600px) { .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content .additional-shop-col .additional-shop-icon, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content .additional-shop-col .additional-shop-icon { vertical-align: top; } } .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content .additional-shop-col .additional-shop-text .additional-shop-text-headline, .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content .additional-shop-col .additional-shop-text .additional-shop-text-subline, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content .additional-shop-col .additional-shop-text .additional-shop-text-headline, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content .additional-shop-col .additional-shop-text .additional-shop-text-subline { display: block; float: left; } .cms-additional-shop-wrapper.is-pds .cms-additional-shop-content .additional-shop-col .additional-shop-text .additional-shop-text-headline, .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content .additional-shop-col .additional-shop-text .additional-shop-text-headline { margin-right: 5px; } .cms-additional-shop-wrapper.is-checkout { border-top: 0; padding: 0; } .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content { width: 100%; text-align: left; } .cms-additional-shop-wrapper.is-checkout .cms-additional-shop-content .additional-shop-col { width: 50%; float: left; } @media (max-width: 767px) { .cms-additional-shop-wrapper.is-checkout { display: none; } } @media (max-width: 767px) { .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col { width: 100%; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-icon { font-size: 21px; } } @media (min-width: 768px) { .cms-additional-shop-wrapper { padding: 30px; border-top: 1px solid #ece9e2; } .cms-additional-shop-wrapper.isCart { padding: 30px 0; border: 0; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-flex { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col { display: block; width: auto; padding: 0; line-height: 1.42857; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-icon, .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-text { display: table-cell; float: none; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-icon { font-weight: 500; width: 50px; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-text { font-size: 16px; } .cms-additional-shop-wrapper .cms-additional-shop-content .additional-shop-col .additional-shop-text .additional-shop-text-headline { display: block; } } /* styling for Homepage */ .additional-container-homepage { border-top: 2px solid #d4d1cb; border-bottom: 2px solid #d4d1cb; padding: 5px 0; margin: 20px 0; } .additional-container-homepage .additional-shop-icon, .additional-container-homepage .additional-shop-text { display: table-cell; vertical-align: middle; } .additional-container-homepage .additional-shop-icon { color: #F2BD29; font-size: 24px; text-align: center; padding-right: 10px; } .additional-container-homepage .additional-shop-text-subline { font-weight: 700; } .additional-container-homepage .free-delivery-container { float: right; } @media (min-width: 768px) { .additional-container-homepage .col-sm-flex-center { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: space-around; -moz-box-pack: space-around; -webkit-justify-content: space-around; -ms-flex-pack: space-around; justify-content: space-around; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .additional-container-homepage .col-sm-flex-center .additional-wrapper { display: inline-block; } .additional-container-homepage .free-delivery-container { position: relative; width: 79px; margin-right: 20px; } .additional-container-homepage .free-delivery-container .img-logo { position: absolute; min-width: 80%; max-width: 100%; right: 0; top: -20px; } } #directOrderForm .order-header { margin-bottom: 10px; font-weight: 700; } #directOrderForm .order-header div { text-align: left; } #directOrderForm .order-list .order-entry { margin: 0; } #directOrderForm .order-list .order-entry .order-entry-number { line-height: 40px; padding: 10px; font-weight: 700; } #directOrderForm .order-list .order-entry .order-entry-error { color: #BD0025; } #directOrderForm .order-list .order-entry .order-entry-border { padding: 15px 0; border-top: 1px solid #ddd; } #directOrderForm .order-list .order-entry:last-child .order-entry-border { border-bottom: 1px solid #ddd; } #directOrderForm .order-list .order-entry .order-article-view { margin-top: 20px; } @media (min-width: 768px) { #directOrderForm .order-list .order-entry .order-article-view { margin-top: 0; } } #directOrderForm .order-list .order-entry .order-article-view .btn, #directOrderForm .order-list .order-entry .order-article-view .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control #directOrderForm .order-list .order-entry .order-article-view a { height: 40px; line-height: 24px; } #directOrderForm .order-list .order-entry .order-article-view .product-image { /* be sure, the enegy label fits inside this box. */ min-height: 28px; } #directOrderForm .order-list .order-entry .order-article-orderNumber { margin: 0 0px 10px 0px; } @media (min-width: 768px) { #directOrderForm .order-list .order-entry .order-article-orderNumber { margin-bottom: 0; } } #directOrderForm .order-list .order-entry .order-article-quantity .form-control { text-align: center; } @media (min-width: 768px) { #directOrderForm .order-list .order-entry .order-article-quantity .label-small + .input-qty { text-align: right; padding-right: 40px; } #directOrderForm .order-list .order-entry .order-article-quantity .label-large + .input-qty { text-align: right; padding-right: 53px; } } #directOrderForm .order-list .order-entry .order-article-quantity .input-group { width: 100%; } #directOrderForm .order-list .bootstrap-select { width: 100%; margin-bottom: 10px; } #directOrderForm .order-list .product-details .close { position: absolute; top: 0; right: 0; cursor: pointer; } #directOrderForm .order-list .product-details .product-name { font-size: 15px; color: #878682; padding-right: 20px; position: relative; } #directOrderForm .order-list .product-details div { margin-bottom: 5px; } #directOrderForm .order-list .product-details .product-delivery-info { color: #74BD2B; } #directOrderForm .order-list .product-details .light { color: #999; } @media (max-width: 767px) { #directOrderForm .action .order-entry-border { padding: 5px 0 15px; border-bottom: 1px solid #ddd; overflow: hidden; } } @media (min-width: 768px) { #directOrderForm .action .order-entry-border { margin-bottom: 15px; } } #directOrderForm .product-energyLabel { left: 10px; } #directOrderForm p { font-size: 15px; } #collapseOrderForm .product-energyLabel { left: 10px; } .cookieInformation { width: 100%; position: fixed; left: 0; right: 0; background-color: #ece9e2; padding: 10px; box-shadow: 0 -10px 8px -6px rgba(0, 0, 0, 0.1); z-index: 10; } @media (max-width: 767px) { .cookieInformation { bottom: 54px; } } @media (min-width: 768px) { .cookieInformation { bottom: 0; } } /* product Badges general on Product Grid */ .product-badge { position: absolute; z-index: 2; display: block; } .product-badge-sale { text-align: center; right: -12px; top: -12px; background-color: #BD0025; border: 1px solid #BD0025; border-radius: 50%; width: 40px; height: 40px; line-height: 40px; font-size: 20px; color: #fff; transform: rotate(6deg); } .product-badge-pricetip { border: 56px solid #F2BD29; border-left-color: transparent; border-right-color: transparent; border-bottom-color: transparent; width: 0; height: 0; -moz-backface-visibility: hidden; /* BAD-1233 prevent rendering issues in FF*/ -moz-transform: rotate(225deg); /* BAD-1233 prevent rendering issues in FF*/ transform: translateZ(0) rotate(225deg); pointer-events: none; top: -56px; right: -56px; } .product-badge-pricetip-content { transform: rotate(180deg); top: -50px; right: -30px; position: absolute; color: #BD0025; white-space: nowrap; font-weight: 700; font-size: 14px; } /* product Badges on PDP */ .pds-main-image-wrapper .product-badge-wrapper { position: absolute; top: 0; right: 0; overflow: hidden; width: 100px; height: 100px; } @media (min-width: 768px) { .pds-main-image-wrapper .product-badge-wrapper .product-badge-pricetip { border-width: 70px; top: -70px; right: -70px; } .pds-main-image-wrapper .product-badge-wrapper .product-badge-pricetip-content { top: -60px; right: -33px; font-size: 16px; } } @media (min-width: 768px) { .pds-main-image-wrapper .product-badge-sale { right: -12px; top: -12px; width: 60px; height: 60px; line-height: 60px; font-size: 34px; } } @media (max-width: 767px) { .pds-main-image-wrapper .product-badge-sale { right: -4px; top: -4px; } } /* * === CMS ACCORDION COMPONENT === */ .cms-accordion-component { border-top: 1px solid #cccccc; padding-top: 3px; background: #fff; line-height: 1.3; text-decoration: none; clear: both; } .cms-accordion-component .panel-cms.mtl { margin-top: 0; } .cms-accordion-component .accordion-content { position: relative; padding: 0 !important; } .cms-accordion-component .accordion-content .cmsContent { padding-bottom: 25px; } .cms-accordion-component .accordion-content .accordion-content-inner { padding-top: 0; padding-bottom: 25px; } .cms-accordion-component .accordion-content .accordion-content-inner, .cms-accordion-component .accordion-content .accordion-content-inner p { font-size: 15px; } .cms-accordion-component .accordion-content:after { background: url("#$common-folder/images/accordion_sprite.png") no-repeat 0 -14px transparent; content: ""; display: block; height: 14px; width: 26px; position: absolute; bottom: -1px; left: 40px; } .cms-accordion-component .accordion-content:before { content: ""; display: block; height: 14px; width: 100%; position: absolute; bottom: 0; left: 0; border-bottom: 1px solid #ccc; } .cms-accordion-component .accordion-content .accordion-content-close { width: 100%; height: 20px; display: block; position: absolute; left: 0; bottom: 0; z-index: 1; } .cms-accordion-component .accordion-headline { background-color: transparent; position: relative; padding: 0; border-radius: 0; } .cms-accordion-component .accordion-headline a { text-decoration: none; display: block; padding: 12px 15px; font-weight: 700; color: #4f4b43; } .cms-accordion-component .accordion-headline a.collapsed { border-bottom: 1px solid #cccccc; font-weight: 500; } .cms-accordion-component .accordion-headline a.collapsed:after { background: url("#$common-folder/images/accordion_sprite.png") no-repeat 0 0 transparent; content: ""; display: block; height: 14px; width: 26px; position: absolute; bottom: -13px; left: 40px; } .catalogOverviewlayer .catalogueFrame { height: 600px; overflow: hidden; width: 1000px; border: 0 none; } .cms-middle-conent .toggleContainer { background-color: #fff; } .cms-middle-conent .panel.panel-cms { padding: 0; } .cms-middle-conent .panel.panel-cms .panel-heading { padding: 0; } .cms-middle-conent .panel.panel-cms .panel-heading h3, .cms-middle-conent .panel.panel-cms .panel-heading .h3 { margin: 0; } .cms-middle-conent .panel.panel-cms .panel-cms-section { padding: 15px; box-shadow: 0 5px 8px -6px rgba(0, 0, 0, 0.1); } @media (min-width: 768px) { .cms-middle-conent .panel.panel-cms .panel-cms-section { padding: 20px; } } .cms-middle-conent .panel.panel-cms .panel-cms-section-hr { border-color: #ece9e2; } .cms-middle-conent .panel.panel-cms .panel-cms-section-content { padding: 0; font-size: 15px; } .cms-middle-conent .panel.panel-cms .panel-cms-section-icon { font-size: 48px; color: #F2BD29; text-align: center; float: left; min-height: 1px; padding: 0; } @media (min-width: 768px) { .cms-middle-conent .panel.panel-cms .panel-cms-section-icon { width: 10%; width: calc(63px); } } .cms-middle-conent .panel.panel-cms .panel-cms-section-description { color: #8a8a8a; line-height: 25px; width: 100%; float: left; } @media (min-width: 768px) { .cms-middle-conent .panel.panel-cms .panel-cms-section-description { padding: 0 10px 0 0; width: 90%; width: calc(100% - 63px); } } .cms-middle-conent .panel.panel-cms .panel-cms-section-description.full { width: 100%; } .cms-middle-conent .panel.panel-cms .panel-cms-section-desc-headline { margin-top: 0; font-size: 16px; font-weight: 700; } .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list { padding: 0 20px; } .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list .btn, .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list a { width: 100%; margin: 20px 0; } @media (min-width: 768px) { .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list .btn, .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list a { margin: 20px 0 0 0; } } @media (max-width: 767px) { .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list tr, .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list td, .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list table, .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list tbody, .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list a { display: block; width: 100%; text-align: center; } } @media (max-width: 767px) { .cms-middle-conent .panel.panel-cms .panel-cms-section-image-list img { margin: 0 auto; } } .cms-middle-conent .panel.panel-cms .panel-cms-section-table-wrap { overflow-x: scroll; } @media (min-width: 768px) { .cms-middle-conent .panel.panel-cms .panel-cms-section-table-wrap { overflow-x: visible; } } .cms-middle-conent .panel.panel-cms .panel-cms-section .dl-horizontal { float: left; width: 100%; } .cms-middle-conent .panel.panel-cms .panel-cms-section .dl-horizontal dt { text-align: left; width: 130px; margin-bottom: 5px; } .cms-middle-conent .panel.panel-cms .panel-cms-section .dl-horizontal dd { margin-left: 130px; } @media (max-width: 767px) { .cms-middle-conent .panel.panel-cms .panel-cms-section .dl-horizontal dt, .cms-middle-conent .panel.panel-cms .panel-cms-section .dl-horizontal dd { float: left; margin: 0 0 10px 0; } .cms-middle-conent .panel.panel-cms .panel-cms-section .dl-horizontal dt { clear: both; width: 30%; } .cms-middle-conent .panel.panel-cms .panel-cms-section .dl-horizontal dd { width: 70%; } } @media (max-width: 500px) { .cms-middle-conent .panel.panel-cms .panel-cms-section .dl-horizontal dt, .cms-middle-conent .panel.panel-cms .panel-cms-section .dl-horizontal dd { width: 50%; } } .cms-middle-conent .panel.panel-cms .panel-cms-section .compensatePdg { padding: 0; } .cms-middle-conent .panel.panel-cms .panel-cms-section .compensatePdg table { margin: 0 0 20px 0; } .cms-middle-conent .section { box-shadow: 0 5px 8px -6px rgba(0, 0, 0, 0.1); background: #fff; margin-bottom: 20px; } .cms-middle-conent .section h3, .cms-middle-conent .section .h3 { color: #4f4b43; font-size: 14px; text-transform: uppercase; padding: 12px 15px; border-radius: 4px 0 4px 0; margin: 0 0 15px 0; background-color: #ECE9E2; border-color: transparent; } .cms-middle-conent .section p, .cms-middle-conent .section b, .cms-middle-conent .section div:not(.cms-accordion-component) { padding: 12px 15px; } .cms-middle-conent .section .iconSection p, .cms-middle-conent .section .iconSection b, .cms-middle-conent .section div p, .cms-middle-conent .section div b { padding: 0; } .cms-middle-conent .section .iconSection .iconSection, .cms-middle-conent .section div .iconSection { padding: 15px 20px 0 60px; } .cms-middle-conent .section div.toTopLink { float: none; padding: 2px 0 6px 14px; } @media (max-width: 767px) { .cms-middle-conent .section-grid.flex-row.xsl-remove-flex .section-tile { text-align: center; } .cms-middle-conent .section-grid.flex-row.xsl-remove-flex .section-tile > div { margin: 0 auto; display: inline-block; text-align: left; } } /* CMSBaderBonusArticleCarousel2Component */ .bader-bonus-carousel-component { float: left; width: 100%; width: calc(100% + 20px); margin-bottom: 10px; /* This is a fix for older IE with no flexbox and height calculation support. */ } .bader-bonus-carousel-component > div { padding-top: 10px; padding-bottom: 10px; } .bader-bonus-carousel-component .bader-bonus-carousel-background { visibility: hidden; margin-top: 10px; } @media (max-width: 767px) { .bader-bonus-carousel-component .bader-bonus-carousel-background { display: none; } } .bader-bonus-carousel-component .box-padding { overflow: hidden; padding: 10px; height: 100%; background: #f8de94; position: relative; margin-left: 0; /* In Safarie 10, a flex-item child can not strecht up to 100% height, so we have to use a absolut position hack. Source: https://bugs.webkit.org/show_bug.cgi?id=137730 The disadvanage of this hack is, that the content could not stretch anymore the flex-container. */ } @media (min-width: 768px) { .bader-bonus-carousel-component .box-padding.not-stretchable-from-sm { position: absolute; top: 10px; right: 10px; bottom: 10px; left: 0; height: auto; margin-left: 10px; } } .bader-bonus-carousel-component .box-padding .box-border { height: 100%; width: 100%; border: 1px dashed #F2BD29; min-height: 220px; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: center; -moz-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; background: -webkit-radial-gradient(center, ellipse cover, white 10%, rgba(255, 255, 255, 0) 70%); background: -moz-radial-gradient(center, ellipse cover, white 10%, rgba(255, 255, 255, 0) 70%); background: radial-gradient(ellipse at center, white 10%, rgba(255, 255, 255, 0) 70%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ background-size: 55% 100%; background-position: -10% 0; background-repeat: no-repeat; } .bader-bonus-carousel-component .bader-bonus-carousel { height: 100%; width: 100%; } .bader-bonus-carousel-component .bader-bonus-carousel .slick-prev, .bader-bonus-carousel-component .bader-bonus-carousel .slick-next { position: absolute; z-index: 2; top: 0; width: 28px; height: 28px; } .bader-bonus-carousel-component .bader-bonus-carousel .slick-prev:before, .bader-bonus-carousel-component .bader-bonus-carousel .slick-next:before { font-size: 16px; line-height: 24px; } .bader-bonus-carousel-component .bader-bonus-carousel .slick-prev { left: -8px; } .bader-bonus-carousel-component .bader-bonus-carousel .slick-next { right: -8px; } .bader-bonus-carousel-component .bader-bonus-carousel .slick-list, .bader-bonus-carousel-component .bader-bonus-carousel .slick-track, .bader-bonus-carousel-component .bader-bonus-carousel .slick-slide { height: 100%; } .bader-bonus-carousel-component .bader-bonus-carousel .slick-list { width: 38%; width: calc(50% - 55px); margin-left: 20px; } .bader-bonus-carousel-component .bader-bonus-carousel .bader-bonus-slide { height: 100%; vertical-align: middle; text-align: center; } .bader-bonus-carousel-component .bader-bonus-carousel .bader-bonus-slide:before { content: ""; display: inline-block; height: 100%; vertical-align: middle; } .bader-bonus-carousel-component .bader-bonus-carousel .bader-bonus-slide img { display: inline-block; width: 97%; } @media (max-width: 1023px) { .bader-bonus-carousel-component .bader-bonus-carousel .bader-bonus-slide img { width: 95%; } } .bader-bonus-carousel-component .bader-bonus-catalog-background { width: 100%; } .bader-bonus-carousel-component .bader-bonus-teaser-content, .bader-bonus-carousel-component .bader-bonus-catalog-content { position: absolute; bottom: 30px; right: 40px; z-index: 1; width: 50%; text-align: right; } @media (max-width: 767px) { .bader-bonus-carousel-component .bader-bonus-teaser-content, .bader-bonus-carousel-component .bader-bonus-catalog-content { width: 60%; } } .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-teaser-headline, .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-catalog-headline, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-teaser-headline, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-catalog-headline { font-size: 19px; font-family: PT Serif, serif; } .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-teaser-text, .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-catalog-text, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-teaser-text, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-catalog-text { padding: 10px 0; } .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-teaser-button, .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-catalog-button, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-teaser-button, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-catalog-button { height: auto; white-space: normal; } .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-teaser-button .btn, .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-teaser-button .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-teaser-button a, .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-catalog-button .btn, .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-catalog-button .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-catalog-button a, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-teaser-button .btn, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-teaser-button .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-teaser-button a, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-catalog-button .btn, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-catalog-button .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-catalog-button a { max-width: 100%; text-overflow: ellipsis; overflow: hidden; } .bader-bonus-carousel-component .bader-bonus-teaser-content { padding-right: 10px; } @media (max-width: 767px) { .bader-bonus-carousel-component .box-border, .bader-bonus-carousel-component .bader-bonus-slide, .bader-bonus-carousel-component .bader-bonus-slide:before { min-height: 150px; } .bader-bonus-carousel-component .bader-bonus-carousel .bader-bonus-slide img { width: 95%; } .bader-bonus-carousel-component .bader-bonus-teaser-content, .bader-bonus-carousel-component .bader-bonus-catalog-content { right: 30px; } .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-teaser-text, .bader-bonus-carousel-component .bader-bonus-teaser-content .bader-bonus-catalog-text, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-teaser-text, .bader-bonus-carousel-component .bader-bonus-catalog-content .bader-bonus-catalog-text { font-size: 13px; } } @media (max-width: 500px) { .bader-bonus-carousel-component .bader-bonus-teaser-content { right: 10px; bottom: 20px; } .bader-bonus-carousel-component .bader-bonus-catalog-content { right: 20px; bottom: 20px; } .bader-bonus-carousel-component .bader-bonus-teaser-headline, .bader-bonus-carousel-component .bader-bonus-catalog-headline { font-size: 15px; } .bader-bonus-carousel-component .bader-bonus-teaser-headline, .bader-bonus-carousel-component .bader-bonus-teaser-text { padding-right: 20px !important; } } /* CMSThemeWorldButtonComponent */ .theme-world-button-component { display: block; float: left; text-align: center; } .theme-world-button-component.width-whole { width: 100%; } .theme-world-button-component.width-a-half { width: 50%; } @media (max-width: 1279px) { .theme-world-button-component.width-a-half { width: 100%; } } .theme-world-button-component.width-a-third { width: 33.333%; } @media (max-width: 1023px) { .theme-world-button-component.width-a-third { width: 100%; } } .theme-world-button-component.width-a-fourth { width: 25%; } @media (max-width: 1279px) { .theme-world-button-component.width-a-fourth { width: 50%; } } @media (max-width: 767px) { .theme-world-button-component.width-a-fourth { width: 100%; } } .theme-world-button-component .theme-world-button { text-overflow: ellipsis; overflow: hidden; width: 95%; width: calc(100% - 20px); margin: 0 10px; color: #7d7d7d; background-color: transparent; border-color: #F2BD29; } .theme-world-button-component .theme-world-button:hover, .theme-world-button-component .theme-world-button:focus, .theme-world-button-component .theme-world-button.focus { color: #fff; background-color: #7d7d7d; border-color: #7d7d7d; } /* CMSThemeWorldContainerComponent */ .theme-world-container-component { margin-bottom: 20px; } .theme-world-container-component .theme-world-container-headline { padding: 0; width: 100%; text-align: center; margin-bottom: 20px; } .theme-world-container-component .theme-world-container-headline .h2 { margin: 0; padding: 0; word-wrap: break-word; } .theme-world-container-component .theme-world-container-headline.moulding { background: transparent; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); } .theme-world-container-component .theme-world-container-headline.moulding > .h2 { display: inline-block; background: white; padding: 0 10px; max-width: 80%; } /* CMSFlexibleTeaserTileComponent */ /* Some IE fixes on bottom of page */ .flexible-teaser-tile-component, .extended-flexible-teaser-tile-component, .cta-only-flexible-teaser-tile-component { min-height: 50px; position: relative; overflow: hidden; } .flexible-teaser-tile-component.border, .extended-flexible-teaser-tile-component.border, .cta-only-flexible-teaser-tile-component.border { border: 1px solid #A3A3A3; } .flexible-teaser-tile-component.cta, .extended-flexible-teaser-tile-component.cta, .cta-only-flexible-teaser-tile-component.cta { cursor: pointer; } .flexible-teaser-tile-component .flexible-teaser-tile-transparency-layer, .flexible-teaser-tile-component .extended-flexible-teaser-tile-transparency-layer, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-transparency-layer, .extended-flexible-teaser-tile-component .flexible-teaser-tile-transparency-layer, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-transparency-layer, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-transparency-layer, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-transparency-layer, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-transparency-layer, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-transparency-layer { background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 33%, white 100%); background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 33%, white 100%); background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 33%, white 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 1; } .flexible-teaser-tile-component .flexible-teaser-tile-background, .flexible-teaser-tile-component .extended-flexible-teaser-tile-background, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-background, .extended-flexible-teaser-tile-component .flexible-teaser-tile-background, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-background, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-background, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-background, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-background, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-background { max-width: 100%; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; transition: all 0.6s ease; } .flexible-teaser-tile-component:hover .flexible-teaser-tile-background.zoom, .flexible-teaser-tile-component:hover .extended-flexible-teaser-tile-background.zoom, .flexible-teaser-tile-component:hover .cta-only-flexible-teaser-tile-background.zoom, .extended-flexible-teaser-tile-component:hover .flexible-teaser-tile-background.zoom, .extended-flexible-teaser-tile-component:hover .extended-flexible-teaser-tile-background.zoom, .extended-flexible-teaser-tile-component:hover .cta-only-flexible-teaser-tile-background.zoom, .cta-only-flexible-teaser-tile-component:hover .flexible-teaser-tile-background.zoom, .cta-only-flexible-teaser-tile-component:hover .extended-flexible-teaser-tile-background.zoom, .cta-only-flexible-teaser-tile-component:hover .cta-only-flexible-teaser-tile-background.zoom { -webkit-transform: scale(1.08); -moz-transform: scale(1.08); transform: scale(1.08); } .flexible-teaser-tile-component .flexible-teaser-tile-box-container, .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container { color: #4f4b43; position: absolute; z-index: 3; } .flexible-teaser-tile-component .flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container { bottom: 0; padding: 10px 10px 20px; } .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left { left: 10px; } .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-center, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-center, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-center { left: 28%; left: calc(25% + 10px); width: 50%; } .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right { right: 10px; } .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right { width: 44%; width: calc(50% - 20px); } @media (max-width: 1023px) { .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right { width: 70%; width: calc(80% - 20px); } } @media (max-width: 767px) { .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-left, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-right { width: 94%; width: calc(100% - 20px); } } .flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-center, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-center, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container.text-center { width: 80%; left: 10%; } .flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-caption, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-caption, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-caption { color: #4f4b43; font-size: 32px; font-family: PT Serif, serif; } @media (max-width: 767px) { .flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-caption, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-caption, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-caption { font-size: 26px; } } @media (max-width: 500px) { .flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-caption, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-caption, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-caption { font-size: 19px; } } .flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-description, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-description, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-description { color: #4f4b43; padding: 10px 0; } @media (max-width: 767px) { .flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-description, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-description, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-description { font-size: 13px; } } .flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-button button, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-button button, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-button button { height: auto; white-space: normal; } .flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-button button.btn, .extended-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-button button.btn, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-box-container .flexible-teaser-tile-button button.btn { max-width: 100%; text-overflow: ellipsis; overflow: hidden; } .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container { width: 95%; width: calc(100% - 20px); left: 10px; } .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-caption, .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-description, .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-link span, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-caption, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-description, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-link span, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-caption, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-description, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-link span { width: 100%; } .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-caption, .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-description, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-caption, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-description, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-caption, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-description { text-decoration: none; } .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .font-mathilde, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .font-mathilde, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .font-mathilde { font-weight: 500; } .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .font-mathilde.font-big, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .font-mathilde.font-big, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .font-mathilde.font-big { font-size: 70px; } .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .font-mathilde.font-very-big, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .font-mathilde.font-very-big, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .font-mathilde.font-very-big { font-size: 90px; } .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-link span, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-link span, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-link span { height: auto; white-space: normal; } .flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-link span:hover, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-link span:hover, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-box-container .extended-flexible-teaser-tile-link span:hover { text-decoration: none; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:after, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:before, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:after, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:before, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:after { display: block; position: absolute; top: 0; height: 0; z-index: 3; border: 0 solid transparent; content: ""; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left { left: 0; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .bg-black:after, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .bg-black:after, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .bg-black:after { border-left-color: #000; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .bg-white:after, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .bg-white:after, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .bg-white:after { border-left-color: #fff; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .bg-gray:after, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .bg-gray:after, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-left .bg-gray:after { border-left-color: #7d7d7d; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right { right: 0; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .bg-black:before, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .bg-black:before, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .bg-black:before { border-right-color: #000; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .bg-white:before, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .bg-white:before, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .bg-white:before { border-right-color: #fff; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .bg-gray:before, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .bg-gray:before, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-right .bg-gray:before { border-right-color: #7d7d7d; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-top, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-top, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-top { top: 10%; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-bottom, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-bottom, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container.text-bottom { bottom: 10%; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { position: relative; } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { position: absolute; left: 15px; z-index: 3; width: 90%; width: calc(100% - 30px); } .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text > *, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text > *, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text > * { text-align: center; text-decoration: none; } .flexible-teaser-tile-component .flexible-teaser-tile-hover-layer, .flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer, .extended-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer { background: transparent; position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 2; -webkit-transition: background .3s ease; -moz-transition: background .3s ease; transition: background .3s ease; } .flexible-teaser-tile-component .flexible-teaser-tile-hover-layer .flexible-teaser-tile-box-container, .flexible-teaser-tile-component .flexible-teaser-tile-hover-layer .extended-flexible-teaser-tile-box-container, .flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer .flexible-teaser-tile-box-container, .flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer .extended-flexible-teaser-tile-box-container, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer .flexible-teaser-tile-box-container, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer .extended-flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer .flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer .extended-flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer .flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer .extended-flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer .flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer .extended-flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer .flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer .extended-flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer .flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer .extended-flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer .flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer .extended-flexible-teaser-tile-box-container { opacity: 0; -webkit-transition: opacity .3s ease; -moz-transition: opacity .3s ease; transition: opacity .3s ease; } .flexible-teaser-tile-component .flexible-teaser-tile-hover-layer:hover, .flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer:hover, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer:hover, .extended-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer:hover, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer:hover, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer:hover, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer:hover, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer:hover, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer:hover { background: rgba(255, 255, 255, 0.75); } .flexible-teaser-tile-component .flexible-teaser-tile-hover-layer:hover .flexible-teaser-tile-box-container, .flexible-teaser-tile-component .flexible-teaser-tile-hover-layer:hover .extended-flexible-teaser-tile-box-container, .flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer:hover .flexible-teaser-tile-box-container, .flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer:hover .extended-flexible-teaser-tile-box-container, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer:hover .flexible-teaser-tile-box-container, .flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer:hover .extended-flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer:hover .flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer:hover .extended-flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer:hover .flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer:hover .extended-flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer:hover .flexible-teaser-tile-box-container, .extended-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer:hover .extended-flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer:hover .flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-hover-layer:hover .extended-flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer:hover .flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .extended-flexible-teaser-tile-hover-layer:hover .extended-flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer:hover .flexible-teaser-tile-box-container, .cta-only-flexible-teaser-tile-component .cta-only-flexible-teaser-tile-hover-layer:hover .extended-flexible-teaser-tile-box-container { opacity: 1; } .flexible-teaser-tile-component .flexible-teaser-tile-background-button, .extended-flexible-teaser-tile-component .flexible-teaser-tile-background-button, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-background-button { position: absolute; bottom: 20px; width: 40%; width: calc(50% - 40px); } .flexible-teaser-tile-component .flexible-teaser-tile-background-button.text-left, .extended-flexible-teaser-tile-component .flexible-teaser-tile-background-button.text-left, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-background-button.text-left { left: 20px; } .flexible-teaser-tile-component .flexible-teaser-tile-background-button.text-center, .extended-flexible-teaser-tile-component .flexible-teaser-tile-background-button.text-center, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-background-button.text-center { left: 12%; left: calc(10% + 10px); width: 76%; width: calc(80% - 20px); } .flexible-teaser-tile-component .flexible-teaser-tile-background-button.text-right, .extended-flexible-teaser-tile-component .flexible-teaser-tile-background-button.text-right, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-background-button.text-right { right: 20px; } .flexible-teaser-tile-component .flexible-teaser-tile-background-button .btn, .flexible-teaser-tile-component .flexible-teaser-tile-background-button .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .flexible-teaser-tile-component .flexible-teaser-tile-background-button a, .extended-flexible-teaser-tile-component .flexible-teaser-tile-background-button .btn, .extended-flexible-teaser-tile-component .flexible-teaser-tile-background-button .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .extended-flexible-teaser-tile-component .flexible-teaser-tile-background-button a, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-background-button .btn, .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-background-button .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .cta-only-flexible-teaser-tile-component .flexible-teaser-tile-background-button a { height: auto; white-space: normal; overflow: hidden; max-width: 100%; } /* CMSFlexibleTeaserRowComponent */ .flexible-teaser-row-component { margin-bottom: 20px; /* we want to set different font sizes, depending on the size in the according viewport */ } .flexible-teaser-row-component .flexible-teaser-row-headline { width: 100%; text-align: center; margin-bottom: 20px; } .flexible-teaser-row-component .flexible-teaser-row-headline .h2 { margin: 0; padding: 0; word-wrap: break-word; } .flexible-teaser-row-component .flexible-teaser-row-headline.moulding { background: transparent; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); } .flexible-teaser-row-component .flexible-teaser-row-headline.moulding > .h2 { display: inline-block; background: white; padding: 0 10px; max-width: 80%; } .flexible-teaser-row-component .flexible-teaser-tile-wrapper { overflow: hidden; } @media (max-width: 500px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper { /* in XSP, we only have 100% tiles */ /* only relevant in XL, LG, MD and SM */ /* only relevant in XSP and XSL */ /* Depending on the font size, we have to calculate and set padding and box sizes and finally the arrow size and position */ } .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container { /* box is left and arrow right and directs to right */ /* box is right and arrow left and directs to left */ } .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -49px; border-width: 24.5px 0 24.5px 24.5px; width: 49px; } } @media (max-width: 500px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -39px; border-width: 19.5px 0 19.5px 19.5px; width: 39px; } } @media (max-width: 500px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -49px; border-width: 24.5px 24.5px 24.5px 0; width: 49px; } } @media (max-width: 500px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -39px; border-width: 19.5px 19.5px 19.5px 0; width: 39px; } } @media (max-width: 500px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-family: PT Serif, serif; font-size: 32px; line-height: 32px; } } @media (max-width: 500px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-size: 22px; line-height: 22px; } } @media (max-width: 500px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (max-width: 500px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (max-width: 500px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { top: 8px; padding-top: 1px; } } @media (max-width: 500px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsp-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-xsp-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { padding-top: 1px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper { /* In XSL we could have 100% tiles ...*/ /* only relevant in XL, LG, MD and SM */ /* only relevant in XSP and XSL */ /* Depending on the font size, we have to calculate and set padding and box sizes and finally the arrow size and position */ } .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container { /* box is left and arrow right and directs to right */ /* box is right and arrow left and directs to left */ } .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -49px; border-width: 24.5px 0 24.5px 24.5px; width: 49px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -39px; border-width: 19.5px 0 19.5px 19.5px; width: 39px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -49px; border-width: 24.5px 24.5px 24.5px 0; width: 49px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -39px; border-width: 19.5px 19.5px 19.5px 0; width: 39px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-family: PT Serif, serif; font-size: 32px; line-height: 32px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-size: 22px; line-height: 22px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { top: 8px; padding-top: 1px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-xsl-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { padding-top: 1px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper { /* ... or 50% tiles. */ /* only relevant in XL, LG, MD and SM */ /* only relevant in XSP and XSL */ /* Depending on the font size, we have to calculate and set padding and box sizes and finally the arrow size and position */ } .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container { /* box is left and arrow right and directs to right */ /* box is right and arrow left and directs to left */ } .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -41px; border-width: 20.5px 0 20.5px 20.5px; width: 41px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -35px; border-width: 17.5px 0 17.5px 17.5px; width: 35px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -41px; border-width: 20.5px 20.5px 20.5px 0; width: 41px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -35px; border-width: 17.5px 17.5px 17.5px 0; width: 35px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-family: PT Serif, serif; font-size: 24px; line-height: 24px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-size: 18px; line-height: 18px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 501px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { top: 8px; padding-top: 1px; } } @media (min-width: 501px) and (max-width: 767px) and (max-width: 767px) { .flexible-teaser-row-component .col-xsl-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-xsl-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { padding-top: 1px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper { /* In all other viewports, we could have 100% tiles ... */ /* only relevant in XL, LG, MD and SM */ /* only relevant in XSP and XSL */ /* Depending on the font size, we have to calculate and set padding and box sizes and finally the arrow size and position */ } .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container { /* box is left and arrow right and directs to right */ /* box is right and arrow left and directs to left */ } .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -49px; border-width: 24.5px 0 24.5px 24.5px; width: 49px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -39px; border-width: 19.5px 0 19.5px 19.5px; width: 39px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -49px; border-width: 24.5px 24.5px 24.5px 0; width: 49px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -39px; border-width: 19.5px 19.5px 19.5px 0; width: 39px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-family: PT Serif, serif; font-size: 32px; line-height: 32px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-size: 22px; line-height: 22px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { top: 8px; padding-top: 1px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-12.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-sm-12.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { padding-top: 1px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper { /* or 50% tiles ... */ /* only relevant in XL, LG, MD and SM */ /* only relevant in XSP and XSL */ /* Depending on the font size, we have to calculate and set padding and box sizes and finally the arrow size and position */ } .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container { /* box is left and arrow right and directs to right */ /* box is right and arrow left and directs to left */ } .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -41px; border-width: 20.5px 0 20.5px 20.5px; width: 41px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -35px; border-width: 17.5px 0 17.5px 17.5px; width: 35px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -41px; border-width: 20.5px 20.5px 20.5px 0; width: 41px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -35px; border-width: 17.5px 17.5px 17.5px 0; width: 35px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-family: PT Serif, serif; font-size: 24px; line-height: 24px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-size: 18px; line-height: 18px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { top: 8px; padding-top: 1px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-6.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-sm-6.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { padding-top: 1px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper { /* or 33% tiles ... */ /* only relevant in XL, LG, MD and SM */ /* only relevant in XSP and XSL */ /* Depending on the font size, we have to calculate and set padding and box sizes and finally the arrow size and position */ } .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container { /* box is left and arrow right and directs to right */ /* box is right and arrow left and directs to left */ } .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -39px; border-width: 19.5px 0 19.5px 19.5px; width: 39px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -33px; border-width: 16.5px 0 16.5px 16.5px; width: 33px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -39px; border-width: 19.5px 19.5px 19.5px 0; width: 39px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -33px; border-width: 16.5px 16.5px 16.5px 0; width: 33px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-family: PT Serif, serif; font-size: 22px; line-height: 22px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-size: 16px; line-height: 16px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { top: 8px; padding-top: 1px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { padding-top: 1px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper.p-absolute-b, .flexible-teaser-row-component .col-sm-4.flexible-teaser-tile-wrapper.p-absolute-t, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper.p-absolute-b, .flexible-teaser-row-component .col-sm-4.full-height .flexible-teaser-tile-wrapper.p-absolute-t { width: 98%; width: calc(100% - 10px); } .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper { /* or 25% tiles. */ /* only relevant in XL, LG, MD and SM */ /* only relevant in XSP and XSL */ /* Depending on the font size, we have to calculate and set padding and box sizes and finally the arrow size and position */ } .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container { /* box is left and arrow right and directs to right */ /* box is right and arrow left and directs to left */ } .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -35px; border-width: 17.5px 0 17.5px 17.5px; width: 35px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-left .cta-only-flexible-teaser-tile-link-background:after { right: -31px; border-width: 15.5px 0 15.5px 15.5px; width: 31px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -35px; border-width: 17.5px 17.5px 17.5px 0; width: 35px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container.text-right .cta-only-flexible-teaser-tile-link-background:before { left: -31px; border-width: 15.5px 15.5px 15.5px 0; width: 31px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-family: PT Serif, serif; font-size: 18px; line-height: 18px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper { font-size: 14px; line-height: 14px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-background { padding: 9px 20px 8px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { top: 8px; padding-top: 1px; } } @media (min-width: 768px) and (max-width: 767px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper .cta-only-flexible-teaser-tile-box-container .cta-only-flexible-teaser-tile-box-container-wrapper .cta-only-flexible-teaser-tile-link-text { padding-top: 1px; } } @media (min-width: 768px) { .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper.p-absolute-b, .flexible-teaser-row-component .col-sm-3.flexible-teaser-tile-wrapper.p-absolute-t, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper.p-absolute-b, .flexible-teaser-row-component .col-sm-3.full-height .flexible-teaser-tile-wrapper.p-absolute-t { width: 98%; width: calc(100% - 10px); } } .flexible-teaser-row-component .full-height { /* This is used for the 1x50%, 2x50% two row style to handle the invisible image that give the column the needed height */ } .flexible-teaser-row-component .full-height > .flexible-teaser-tile-component, .flexible-teaser-row-component .full-height > .extended-flexible-teaser-tile-component, .flexible-teaser-row-component .full-height > .cta-only-flexible-teaser-tile-component { visibility: hidden; } @media (max-width: 767px) { .flexible-teaser-row-component .full-height > .flexible-teaser-tile-component, .flexible-teaser-row-component .full-height > .extended-flexible-teaser-tile-component, .flexible-teaser-row-component .full-height > .cta-only-flexible-teaser-tile-component { display: none; } } @media (min-width: 768px) { .flexible-teaser-row-component .full-height .flexible-teaser-tile-absolute-fix { /* because we have a absolut element, we have to reduce the size manualy, cause the margin is not working */ width: 98%; width: calc(100% - 10px); } } /* fix for IE11 */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .flexible-teaser-tile-wrapper.p-absolute-t, .flexible-teaser-tile-wrapper.p-absolute-b { left: 10px; right: 0px; } .cta-only-flexible-teaser-tile-link-background:before, .cta-only-flexible-teaser-tile-link-background:after { opacity: 0.5; } } /* fix for IE(EDGE) */ @supports (-ms-ime-align: auto) { .cta-only-flexible-teaser-tile-link-background:before, .cta-only-flexible-teaser-tile-link-background:after { opacity: 0.5; } } .cms-search-component-wrap { position: relative; } /* CMS FULL WIDTH SLIDER */ .cms-product-list-carousel-component, .cms-dynamic-product-carousel-component > .product-slider-content { margin-bottom: 20px; } .cms-full-width-slider-wrap .slick-slide { outline: 0; } .cms-full-width-slider-wrap .slick-dotted.slick-slider { margin-bottom: 10px; } @media (min-width: 768px) { .cms-full-width-slider-wrap .slick-dotted.slick-slider { margin-bottom: 40px; } } .cms-full-width-slider-wrap .slick-prev, .cms-full-width-slider-wrap .slick-next { width: 40px; height: 45px; } .cms-full-width-slider-wrap .slick-prev { left: 10px; } .cms-full-width-slider-wrap .slick-next { right: 10px; } .cms-full-width-slider-wrap .slick-slide img { max-width: 767px; } @media (min-width: 768px) { .cms-full-width-slider-wrap .slick-slide img { max-width: 100%; } } .cms-full-width-slider-wrap .slick-dots { bottom: 2px; width: 100%; } @media (max-width: 767px) { .cms-full-width-slider-wrap .slick-dots { width: 95%; width: calc(100% - 20px); } } .cms-full-width-slider-wrap .slick-dots li button:before { color: #fff; opacity: 1; } .cms-full-width-slider-wrap .slick-dots li.slick-active button:before { color: #757571; } @media (min-width: 768px) { .cms-full-width-slider-wrap .slick-dots { position: static; bottom: 10px; } .cms-full-width-slider-wrap .slick-dots li { height: 35px; line-height: 35px; width: auto; float: left; margin: 0; background-color: #ece9e2; text-align: center; border-right: 2px solid #fff; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-property: background-color; transition-property: background-color; } .cms-full-width-slider-wrap .slick-dots li:last-child { border-right: 0; } .cms-full-width-slider-wrap .slick-dots li.slick-active, .cms-full-width-slider-wrap .slick-dots li:hover, .cms-full-width-slider-wrap .slick-dots li:focus { background-color: #F2BD29; color: #4f4b43; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-property: background-color; transition-property: background-color; } } .cms-full-width-slider-wrap .cms-full-width-slider-main-paging { width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .cms-full-width-slider-wrap .full-width-slider-box-container, .cms-full-width-slider-wrap .extended-full-width-slider-box-container { color: #4f4b43; position: absolute; z-index: 1; } .cms-full-width-slider-wrap .full-width-slider-box-container { bottom: 20px; top: 10px; } @media (max-width: 767px) { .cms-full-width-slider-wrap .full-width-slider-box-container { bottom: 10px; top: 5px; } } .cms-full-width-slider-wrap .full-width-slider-box-container.box-left { left: 70px; } @media (max-width: 767px) { .cms-full-width-slider-wrap .full-width-slider-box-container.box-left { left: 10px; } } .cms-full-width-slider-wrap .full-width-slider-box-container.box-center { left: 70px; right: 70px; } @media (max-width: 767px) { .cms-full-width-slider-wrap .full-width-slider-box-container.box-center { left: 10px; right: 10px; } } .cms-full-width-slider-wrap .full-width-slider-box-container.box-right { right: 70px; } @media (max-width: 767px) { .cms-full-width-slider-wrap .full-width-slider-box-container.box-right { right: 10px; } } .cms-full-width-slider-wrap .full-width-slider-box-container.content-top { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .cms-full-width-slider-wrap .full-width-slider-box-container.content-middle { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: center; -moz-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .cms-full-width-slider-wrap .full-width-slider-box-container.content-middle .full-width-slider-content-container { -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: center; -moz-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .cms-full-width-slider-wrap .full-width-slider-box-container.content-middle .full-width-slider-button { -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto; } .cms-full-width-slider-wrap .full-width-slider-box-container.content-bottom { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: end; -moz-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: end; -webkit-align-content: flex-end; -ms-flex-line-pack: end; justify-content: flex-end; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-caption, .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-description, .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-button { text-align: center; } .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-caption { font-size: 20px; font-family: PT Serif, serif; color: #666; margin-bottom: 10px; } @media (max-width: 500px) { .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-caption { margin: 20px 20px 0 0; } } @media (min-width: 768px) { .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-caption { font-size: 32px; } } @media (min-width: 1024px) { .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-caption { font-size: 32px; } } .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-description { color: #fff; margin-bottom: 10px; display: none; } @media (min-width: 768px) { .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-description { display: block; } } @media (max-width: 767px) { .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-caption, .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-description, .cms-full-width-slider-wrap .full-width-slider-box-container .full-width-slider-button { margin-bottom: 15px; } } .cms-full-width-slider-wrap .extended-full-width-slider-box-container { width: 95%; width: calc(100% - 20px); left: 10px; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container.text-left { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: start; -moz-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: start; -webkit-align-content: flex-start; -ms-flex-line-pack: start; justify-content: flex-start; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container.text-center { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: center; -moz-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container.text-right { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: end; -moz-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: end; -webkit-align-content: flex-end; -ms-flex-line-pack: end; justify-content: flex-end; -webkit-box-align: center; -moz-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container.text-top .extended-full-width-slider-content-wrapper { -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: flex- start; -ms-flex-item-align: start; align-self: flex- start; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container.text-middle { top: 0; bottom: 0; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container.text-middle .extended-full-width-slider-content-wrapper { -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container.text-bottom .extended-full-width-slider-content-wrapper { -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: flex- end; -ms-flex-item-align: end; align-self: flex- end; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container .extended-full-width-slider-content-wrapper, .cms-full-width-slider-wrap .extended-full-width-slider-box-container .extended-full-width-slider-caption, .cms-full-width-slider-wrap .extended-full-width-slider-box-container .extended-full-width-slider-description, .cms-full-width-slider-wrap .extended-full-width-slider-box-container .extended-full-width-slider-link span { width: 100%; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container .extended-full-width-slider-caption, .cms-full-width-slider-wrap .extended-full-width-slider-box-container .extended-full-width-slider-description { text-decoration: none; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container .extended-full-width-slider-link span { height: auto; white-space: normal; } .cms-full-width-slider-wrap .extended-full-width-slider-box-container .extended-full-width-slider-link span:hover { text-decoration: none; } .cms-full-width-slider-main-image .item, .js-bader-bonus-carousel .bader-bonus-slide { position: absolute; visibility: hidden; } .cms-full-width-slider-main-image .item:first-child { position: relative; visibility: visible; } .slick-initialized.cms-full-width-slider-main-image .item, .slick-initialized.cms-full-width-slider-main-image .item:first-child, .slick-initialized.js-bader-bonus-carousel .bader-bonus-slide { position: relative; visibility: visible; } /* CMSTrustElementsComponent */ .trust-elements-component { margin: 10px -10px 20px; border: 0 solid #d4d1cb; border-width: 2px 0; /* Just to fix initial styling before slick slider is initialized */ } .trust-elements-component .slick-slide { outline: 0; } .trust-elements-component > div:not(.slick-initialized) > .trust-element-item { display: inline-block; margin: 4px 0 2px; } @media (min-width: 1280px) { .trust-elements-component > div:not(.slick-initialized) > .trust-element-item { width: 25%; } .trust-elements-component > div:not(.slick-initialized) > .trust-element-item:nth-child(4) ~ * { display: none; } } @media (max-width: 1279px) { .trust-elements-component > div:not(.slick-initialized) > .trust-element-item { width: 33%; } .trust-elements-component > div:not(.slick-initialized) > .trust-element-item:nth-child(3) ~ * { display: none; } } @media (max-width: 1023px) { .trust-elements-component > div:not(.slick-initialized) > .trust-element-item { width: 50%; } .trust-elements-component > div:not(.slick-initialized) > .trust-element-item:nth-child(2) ~ * { display: none; } } @media (max-width: 500px) { .trust-elements-component > div:not(.slick-initialized) > .trust-element-item { width: 100%; } .trust-elements-component > div:not(.slick-initialized) > .trust-element-item:first-child ~ * { display: none; } } .trust-elements-component .trust-element-item { margin: 4px 0; height: 40px; position: relative; text-align: center; line-height: 40px; } @media (max-width: 500px) { .trust-elements-component .trust-element-item { line-height: 30px; height: 30px; } } .trust-elements-component .trust-element-item .icon { margin-left: 40px; font-size: 20px; } .trust-elements-component .trust-element-item .item-text { margin-left: 6px; margin-right: 40px; } .trust-elements-component .trust-element-item .icon { vertical-align: middle; color: #F2BD29; } .trust-elements-component .trust-element-item .item-text { vertical-align: middle; } .trust-elements-component .icon-container { text-align: right; } .trust-elements-component .icon-container .ekomi-wrapper { display: inline-block; margin: -12px 0; } .trust-elements-component .icon-container .delivery-wrapper { display: inline-block; margin: -16px 0; } @media (max-width: 500px) { .trust-elements-component .icon-container .delivery-wrapper { position: absolute; width: 60px; height: 60px; top: 40px; right: 0; bottom: 0; margin: auto 0; } } .trust-elements-component .ekomi-wrapper { margin: -10px 0; } @media (max-width: 500px) { .trust-elements-component .ekomi-wrapper { margin: 0; } .trust-elements-component .ekomi-wrapper #eKomiSeal_default { position: absolute; top: -7px; right: 0; } .trust-elements-component .ekomi-wrapper.ekomi-bad #eKomiSeal_default { width: 55px; height: 60px; } } .cms-trend-elements-component { padding: 0; } @media (min-width: 1024px) { .cms-trend-elements-component { padding: 20px 15%; } } .cms-trend-elements-component .trend-element-item { padding: 0 10px; } @media (min-width: 768px) { .cms-trend-elements-component .trend-element-item { padding: 0 15%; } } .cms-trend-elements-component .trend-element-item.item-left img { float: left; margin: 0 15px 15px 0; } .cms-trend-elements-component .trend-element-item.item-right img { float: right; margin: 0 0 15px 15px; } .cms-trend-elements-component .trend-element-item .sub-headline { text-align: center; margin: 20px 0; font-size: 24px; } .cms-trend-elements-component .trend-element-item .item-text .headline { font-size: 16px; margin-bottom: 20px; display: block; } .product-trend-slider .inner-image-box, .product-trend-slider .centered-image { *max-height: 315px; } @media (min-width: 1024px) { .product-trend-slider .slick-slide { margin: 0 20px; } } .cms-product-trend-tile-component { margin-bottom: 10px; } @media (min-width: 768px) { .cms-product-trend-tile-component { padding: 0 10%; margin-bottom: 30px; } } .cms-product-trend-tile-component .container-inner { background-color: #FCFBF5; } .cms-product-trend-tile-component .flex-center { width: auto; display: flex; align-self: center; flex-wrap: wrap; } .cms-product-trend-tile-component .flex-center .col-product-name, .cms-product-trend-tile-component .flex-center .col-product-desc, .cms-product-trend-tile-component .flex-center .price-wrapper, .cms-product-trend-tile-component .flex-center .col-actions { flex: 1 100%; -ms-flex: auto; } .cms-product-trend-tile-component .equalize-height { display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: no-wrap; -ms-flex-wrap: no-wrap; flex-wrap: no-wrap; -webkit-box-pack: left; -moz-box-pack: left; -webkit-justify-content: left; -ms-flex-pack: left; justify-content: left; -webkit-box-align: stretch; -moz-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; padding: 5px; } .cms-product-trend-tile-component .equalize-height .full-height { display: flex; } @media (max-width: 767px) { .cms-product-trend-tile-component .equalize-height.xs-remove-flex, .cms-product-trend-tile-component .equalize-height.xsl-remove-flex, .cms-product-trend-tile-component .equalize-height.xs-remove-flex .equalHW, .cms-product-trend-tile-component .equalize-height.xs-remove-flex .flex-item, .cms-product-trend-tile-component .equalize-height.xsl-remove-flex .equalHW, .cms-product-trend-tile-component .equalize-height.xsl-remove-flex .flex-item { display: block; } } .cms-product-trend-tile-component .col-image { background-color: #fff; padding: 10px; display: flex; align-items: center; justify-content: center; } @media (min-width: 768px) { .cms-product-trend-tile-component .col-image.item-right { order: 2; } } @media (max-width: 767px) { .cms-product-trend-tile-component .col-image { margin-bottom: 10px; } .cms-product-trend-tile-component .col-image img { margin: 0 auto; max-height: 350px; } } .cms-product-trend-tile-component .col-product-name .headline { font-size: 18px; margin-bottom: 10px; } .cms-product-trend-tile-component .col-product-name .subline { font-size: 12px; margin-bottom: 10px; } .cms-product-trend-tile-component .col-product-name .link { text-decoration: none; } .cms-product-trend-tile-component .col-product-price { margin-top: 0; } @media (min-width: 768px) { .cms-product-trend-tile-component .col-product-price { margin-top: 20px; } } .cms-product-trend-tile-component .col-product-price .price { font-size: 25px; } .cms-product-trend-tile-component .col-product-price .vat { font-size: 12px; color: #A3A3A3; } .cms-product-trend-tile-component .price-wrapper { text-align: center; } .cms-product-trend-tile-component .col-actions { margin: 10px 0; } .cms-product-trend-tile-component .col-actions .btn, .cms-product-trend-tile-component .col-actions .boxInnerHeight193 .doubleCol .control a, .boxInnerHeight193 .doubleCol .control .cms-product-trend-tile-component .col-actions a { min-width: 230px; } @media (min-width: 768px) { .cms-product-trend-tile-component .col-actions { margin-top: 20px; margin-bottom: 0; } } /*# sourceMappingURL=main.css.map */