@media all { html{ scroll-padding-top: 100px; } .ua-edg .imagemap-container img { pointer-events: auto !important; } .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto, .col-xxl-1, .col-xxl-2, .col-xxl-3, .col-xxl-4, .col-xxl-5, .col-xxl-6, .col-xxl-7, .col-xxl-8, .col-xxl-9, .col-xxl-10, .col-xxl-11, .col-xxl-12, .col-xxl, .col-xxl-auto { min-height: 0; } /* general overwritings */ /* :target:before { content: ""; display: block; height: 200px; margin: -200px 0 0; }*/ /*dropup*/ .dropup .dropdown-toggle::after { border: none; } /*end dropup*/ /*input*/ input[type="time"], input[type="date"] { height: 4rem; } /*end input*/ .opacity-0 { opacity: 0 !important; } .opacity-1 { opacity: 0.2 !important; } .opacity-2 { opacity: 0.4 !important; } .opacity-3 { opacity: 0.6 !important; } .opacity-4 { opacity: .8 !important; } .opacity-5 { opacity: 1 !important; } a.modalLink { cursor: pointer; color: #cc0000 !important; } .right .btn { float: right; } .webkit h2.h1-style { font-size: 3rem; font-family: wuerthextra_bold_cond, futura, -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; text-transform: uppercase; line-height: 1.1; margin-bottom: 1.8rem; display: block; color: #000000; } .webkit .frontpage2col.new a .col:hover span.btn_cta { background-color: #007ab7; } .hoverscale { overflow: hidden; } .hoverscale .img-fluid { -webkit-transition: -webkit-transform 2s; transition: transform 2s; } .hoverscale:hover .img-fluid { -webkit-transform: scale(1.05); transform: scale(1.05); } .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .mobile-mega-menu.search-mobile { overflow: visible; } .searchResult .breadcrumb-label { font-size: 1.5rem; } body .webkit { font-size: 1.7rem; } .side-nav li a { padding-left: 2rem; } [class^="icon-"], [class*=" icon-"] { font-style: normal !important; } .salesRep_background { background: url(../../../layout_wl2/images/salesRep_background.png); } .salesRep_picture.mobile { max-width: 100% !important; height: auto; } .header-nav.sticky.is-sticky, .sticky-outer-container.sticky.is-sticky { box-shadow: 0 2px 5px 0 rgb(0 0 0 / 26%); } .sticky.is-sticky.header-search { min-height: 8.8rem; } .sticky-outer-container.sticky.is-sticky .header-search-group { margin-left: -12px; } .sticky-outer-container.sticky.is-sticky .input-group.input-header-search { border: none; } /* MARGIN-COLUMN */ figure figcaption { background-color: #ececec; border-top: 2px solid #cc0000; padding: 0.5rem 1rem; font-size: 1.3rem; } figure figcaption p { margin-bottom: 0; } /* MARGIN-COLUMN */ .sidebar { padding: 1.2rem 0; font-size: 1.3rem; } .sidebar img { display: block; width: 100%; height: auto; } .sidebar a { color: #000; } .sidebar ul { list-style-type: none; margin-bottom: 0; padding-left: 0; } .sidebar ul li { position: relative; background-color: #dedede; margin-bottom: 2px; padding: 0.5rem 0.8rem 0.4rem 2.8rem; } .sidebar ul li a { text-decoration: none !important; } .sidebar ul li .icon { top: 0.9rem; left: 0.8rem; } .sidebar a:not(.boxlink), .sidebar a:not(.boxlink):hover { text-decoration: underline; } .sidebar.redbox a { color: #fff } .sidebar a:hover { text-decoration: none; cursor: pointer; } .sidebar .icon { position: absolute; top: 1.4rem; left: 0.8rem; } .sidebar a.boxlink { padding-left: 2rem; display: inline-block; } .sidebar.redbox { background-color: #cc0000; color: #fff; } .sidebar.greybox { background-color: #ececec; } .sidebar.transparentbox { background-color: transparent; color: #000; border: 1px solid #dedede; } /* END MARGIN-COLUMN */ /* CONTENT COLUMN */ .bg-size-cover { background-size: cover; } .bg-position-center { background-position: center top; } .btn-container .btn { min-width: 240px; } .card .btn-container .btn { min-width: inherit; } .twoBtn { width: 48%; float: left; margin-right: 2%; } .twoBtn .btn { min-width: 100%; max-width: 100%; } .main .container-fluid ul { overflow: hidden; } .main .container-fluid ul li.bulletList { list-style-type: none } .main .container-fluid ul li.bulletList:before { font-family: 'Wuerthicons'; content: '\eb14'; margin: 0 5px 0 -21px; color: #cc0000; } .main .container-fluid ul li.bulletList.text-white:before { color: #fff; } .webkit .cols_full .inner_sub img { padding: 0; } #col3 { outline: none; } .webkit .card .card-body { padding: 1.2rem; } .webkit #col3_content.frontpage.searchResult { margin-top: 30px; } .slide-link { color: #000; position: relative; padding-right: 2rem; display: block; } .slide-link:hover, .slide-link:visited, .slide-link:focus { color: #000; text-decoration: none; cursor: pointer; } .slide-link .icon { position: absolute; right: 0.5rem; top: 0.4rem; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .slide-link.collapsed .icon { transform: rotate(180deg); } /* GALLERY */ .gallery a { display: block; } .gallery .card:hover { text-decoration: none; cursor: pointer; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); } .gallery .img-container { overflow: hidden; } .gallery .card .card-img-overlay { bottom: 0; padding: 0; top: auto; margin: 0; height: 2px; -webkit-transition: max-height 0.5s ease-in; transition: max-height 0.5s ease-in; overflow: hidden; max-height: 2px; } .gallery .card:hover .card-img-overlay { max-height: 50%; height: auto; -webkit-transition: max-height 0.5s ease-out; transition: max-height 0.5s ease-out; } /*.gallery .img-container img { width: 100%; max-width: 100%; height: auto; }*/ .gallery .img-container.vertical img { width: auto; height: 100%; max-height: 100%; } .gallery .card-deck .card .card-footer { background-color: #ECECEC; border-top: 0.2rem solid #c00; padding: 1.2rem; overflow: hidden; font-size: 1.3rem; } .gallery .img-container.original img { width: auto; height: auto; margin: auto auto; } /* 2-spaltiger Teaser / Story Section left */ .teaser2col .card { overflow: hidden; } .teaser2col .card-img { width: 100%; height: auto; display: block; } .teaser2col .card .card-img { -webkit-transition: all 1.5s ease; transition: all 1.5s ease; } .teaser2col .card:hover .card-img { -webkit-transform: scale(1.05); transform: scale(1.05); } .teaser2col .card-header { background-color: rgba(0, 0, 0, .3); padding: 15px 30px; font-family: wuerthextra_bold_cond; font-size: 30px; line-height: 1.2; font-weight: normal; text-transform: uppercase; color: #fff; border: none; } .teaser2col .card-footer { background-color: transparent; padding: 30px; display: block; position: absolute; width: calc(100% - 20px); bottom: 0; border: none; } .teaser2col .routeplannerForm .form-control { width: 49%; float: left; margin-right: 2% } .teaser2col .routeplannerForm .btn-info { width: 49%; -webkit-appearance: button; } .teaser4col .teaser-img { width: 100%; height: auto; } .teaser { background-color: #ececec; display: block; height: 100%; } .teaser:hover { background-color: #dedede; } .teaser-footer { border-top: 2px solid #cc0000; background-color: transparent; color: #000; padding: 1.7rem 2rem 2.4rem 2rem; font-size: 1.3rem; } /*.teaser4col a:hover { display: block; height: 100%; text-decoration: none; cursor: pointer; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }*/ /* Productslider / Story Section right */ .story .teaser2col .story-teaser { position: absolute; bottom: 0; left: 0; margin: 0 1.2rem; background-color: transparent; border: none; } .productteaser a:hover { text-decoration: none; cursor: pointer; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); } .story .slick-slider .card-link, .productteaser .card-link { color: #000; display: block; height: 100%; background-color: #ececec; margin: 0; } .slick-slider .card-block, .productteaser .card-block { height: auto; background-color: #ECECEC; border-top: 0.2rem solid #c00; padding: 1.2rem; overflow: hidden; font-size: 1.3rem; } .productteaser a:hover, .productteaser a:hover .card-block { background-color: #dedede; } .productteaser .card-image { background-color: #fff; width: 100%; } .productteaser .card-img { width: 100%; height: auto; } .productteaser .card-footer { border-top: 2px solid #cc0000; background-color: transparent; color: #000; padding: 1.7rem 2rem 2.4rem 2rem; } .slick-slider .card-footer { background-color: #dedede; } .productteaser .price { color: #cc0000; font-family: wuerthextra_bold_cond, Arial, Helvetica, sans-serif; font-size: 32px; font-weight: normal; } .teaserslider .card-link { color: #000; margin-left: 0; } .teaserslider .slick-prev:before, .teaserslider .slick-next:before, .contentslider .slick-prev:before, .contentslider .slick-next:before, .homeslider .slick-prev:before, .homeslider .slick-next:before { height: 52px; width: 53px; top: 0%; position: relative; margin-top: 0; background: none; background-color: rgba(0, 0, 0, .3); z-index: 8; font-size: 3.5rem; padding: 10px; color: #fff; } .teaserslider .slick-prev:before { left: 5px; } .teaserslider .slick-next:before { right: 5px; } .teaserslider .slick-prev:hover:before, .teaserslider .slick-next:hover:before, .contentslider .slick-prev:hover:before, .contentslider .slick-next:hover:before, .homeslider .slick-prev:hover:before, .homeslider .slick-next:hover:before { color: #cc0000; } .contentslider.slick-dotted { margin-bottom: 0; } .slick-slider .slick-dots { position: absolute; bottom: 10px; } .slick-slider .slick-dots li { margin: 0; } .slick-slider .slick-dots li button:before { font-size: 35px; color: #000; opacity: 0.2; } .slick-slider .slick-dots li.slick-active button:before { color: #cc0000; opacity: 1; } /* datepicker / timepicker */ .ui-datepicker { background-color: #fff; margin-top: 2px; margin-left: 10px; } span.icon-date-picker.icon-interface-calendar { top: 42px; z-index: 100; } .columnar span.icon-date-picker.icon-interface-calendar { top: 14px; z-index: 100; } .ui-timepicker-div .ui-slider { background-color: #ececec; } .ui_tpicker_hour, .ui_tpicker_minute { padding-top: 7px; } /*column-section Start*/ .mouse-over-caption .card { height: 300px; } .mouse-over-caption .overlay { position: absolute; bottom: 0; left: 0; right: 0; overflow: hidden; width: 100%; height: 7.2rem; transition: .5s ease; } .mouse-over-caption .overlay.effect-red { background-color: rgba(204, 0, 0, 0.9); } .mouse-over-caption .overlay.effect-blue { background-color: rgba(0, 122, 183, 0.9); } .mouse-over-caption .overlay.effect-black { background-color: rgba(0, 0, 0, 0.9); } .mouse-over-caption .overlay.effect-success { background-color: rgba(186, 196, 5, 0.9); } .mouse-over-caption .overlay.effect-warning { background-color: rgba(247, 167, 7, 0.9); } .mouse-over-caption .card:hover .overlay { height: 100%; } .mouse-over-caption .card .overlay .h2-style { transition: margin-top .5s; } .mouse-over-caption .card:hover .overlay .h2-style { margin-bottom: 1.6rem !important; margin-top: 3rem; } .mouse-over-caption .overlay-text { color: white; position: relative; width: 100%; text-align: center; } /*column-section Start end*/ /* Add to favorites */ .ui-dialog { padding: 14px !important; text-align: left !important; background-color: #ececec !important; } .ui-dialog .ui-dialog-titlebar { padding: 0 !important; border-color: #ececec !important; background-color: #ececec !important; margin: -6px 0 0 0 !important; } .ui-dialog .ui-dialog-titlebar-close { display: none; } .ui-dialog .ui-dialog-title { padding: 0 0 7px 0 !important; background-color: #ececec !important; display: block !important; width: 100%; float: left !important; font-family: wuerthextra_bold_cond, Arial, Helvetica, sans-serif !important; font-weight: normal !important; text-transform: uppercase !important; color: #959595 !important; font-size: 19px !important; white-space: normal !important; } .ui-dialog .ui-dialog-content { margin-top: -1px !important; padding: 11px 14px !important; height: auto !important; border: 1px solid #dedede !important; background-color: #fff !important; float: left; } .ui-dialog .ui-dialog-buttonpane { margin: 14px 0 0 0 !important; padding: 0 !important; border: 0 !important; background-color: #ececec !important; text-align: right; } .ui-dialog .ui-dialog-buttonpane button { background-color: #cc0000; border: none; margin-top: 10px; min-width: 100px; color: #fff; } /* footer new */ .footer-new div.link-absolute .text-icon { padding-left: 0.4rem; } p.i-absolute img { position: absolute; margin-top: 0.3rem; } /* Produkliste / Productlist */ .productlist .card-body { color: #000 !important; position: relative; } .productlist .card-title { line-height: 1.4; } .productlist .price { color: #cc0000; display: inline-block; font-family: wuerthextra_bold_cond, Arial, Helvetica, sans-serif; font-size: 32px; font-weight: normal; line-height: 1; } .productlist .prefix { float: right; font-size: 15px; color: rgb(0, 0, 0); font-family: Arial, Helvetica, sans-serif; text-transform: none; margin-top: 12px; margin-left: 5px; } .productlist .outer-price { position: absolute; bottom: 10px; } .productlist .outer-cta { position: absolute; right: 2rem; bottom: 2rem; } .productlist .img-container { position: relative; height: 20rem; } /* .productlist .card-image-badge { position: absolute; bottom: 1rem; right: 1rem; }*/ .productlist .card.bg-light .multiline-ellipsis:before { background: none; } /* ENDE PRODUKTLISTE / END Productlist */ /* video player */ .video_columns { float: left; width: 48.333333%; margin-right: 3.333333%; } .video_columns.last { margin-right: 0; } .video-container { position: relative; clear: right; } .video-container.ratio4x3 { padding-bottom: 75%; } .video-container.ratio4x3 .youtube-embed { padding-bottom: 75%; } .youtube-embed { position: relative; padding-bottom: 56%; height: 0; overflow: hidden; max-width: 100%; width: 100%; } .youtube-embed iframe, .video-container iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; } .youtube-embed.with-chat iframe { height: 75% !important; } .video-startimage { position: absolute; top: 0; left: 0; width: 100%; height: 100%; font-size: 1.7rem; } /* personalized content */ input[type="time"], input[type="date"] { height: 4rem; } .dropup .dropdown-toggle::after { border: none; } /* personalized content */ /* couponcode */ .coupon-item:hover, .coupon-item.active { background-color: #cc0000 !important; color: #fff !important; border-radius: .4rem; } .coupon-item:hover { cursor: pointer; } .bg-primary .coupon-item:hover, .bg-primary .coupon-item.active { background-color: #0093dd !important; color: #fff !important; } /* couponcode */ /* Headline XXL*/ .h1-style.text-xxl, .h1-style.text-xxxl { line-height: 1.2; } /* Headline xxl*/ /*Promotionbanner Case Image Overlap*/ .promotionbanner-img-overlay-container .banner-overlap-img-clipped-wrapper { height: 30rem; max-height: fit-content; overflow: hidden; display: flex; align-items: center; justify-content: center; top: -120%; } .shadow-image-overlap { box-shadow: 0 14px 28px rgb(0 0 0 / 25%), 0 10px 10px rgb(0 0 0 / 22%); } /* facelift 2023 */ body .webkit h3, body .webkit a h3, body .webkit h4, body .webkit a h4, body .webkit h5, body .webkit a h5 { font-family: wuerthbold, futura, -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-weight: normal !important; } body .webkit h3, body .webkit a h3 { font-size: 1.7rem; } body .webkit h4, body .webkit a h4, body .webkit h5, body .webkit a h5 { font-size: 1.5rem; } .webkit #subnav a.active { font-family: wuerthbold, futura, -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-weight: normal !important; } body .webkit #subnav li a { padding: 10px 16px 8px 26px; } body .webkit strong, body .webkit b, body .webkit .strong, body .webkit .bold { font-family: wuerthbold, futura, -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-weight: normal !important; } /*Socialbar Section*/ .socialIconbar a { height: 2.5rem; width: 2.5rem; text-decoration: none; position: relative; display: inline-block; } .socialIconbar.text-right a { margin-left: 0.5rem; } .socialIconbar.text-left a { margin-right: 0.5rem; } .socialIconbar.text-center a { margin: 0 0.5rem; } .socialIconbar a img { width: 2.5rem; position: absolute; left: 0; } .socialIconbar a .icon { font-size: 2.5rem; position: absolute; left: 0; } .socialIconbar.text-white a .icon { color: #fff; } .socialIconbar.text-black a .icon { color: #000; } .socialIconbar a:hover .icon { color: #959595; } .socialIconbar.big a { height: 4rem; width: 4rem; } .socialIconbar.big a img { width: 4rem; } .socialIconbar.big a .icon { font-size: 4rem; } /*End Socialbar Section*/ } @media (min-width: 1230px) { .modal-dialog.large { max-width: 120rem !important; } .promotionbanner-img-overlay-container .banner-overlap-img-clipped-wrapper { top: -150%; height: 32rem; } } @media screen and (max-width: 991px) { .story .teaser2col .story-teaser { position: relative; margin: 0; } .promotionbanner-img-overlay-container .banner-overlap-img-clipped-wrapper { height: 25rem; top: -140%; } } @media screen and (max-width: 768px) { .mobile-mega-menu.search-mobile { overflow: visible; } .mobile-mega-menu.search-mobile input { font-size: 1.6rem; } .btn-container .btn { min-width: inherit; } .mouse-over-caption .card .overlay { height: 100%; background-color: transparent; } .mouse-over-caption .overlay.effect-red, .mouse-over-caption .overlay.effect-blue, .mouse-over-caption .overlay.effect-black, .mouse-over-caption .overlay.effect-success, .mouse-over-caption .overlay.effect-warning { background-color: rgba(0, 0, 0, 0.3); } .mouse-over-caption .overlay-text { text-align: left; position: absolute; bottom: 0; } .promotionbanner-img-overlay-container .banner-overlap-img-clipped-wrapper { height: 40rem; top: 0; } } @media screen and (max-width: 576px) { .teaser2col .card-header { font-size: 20px; } .teaser2col .routeplannerForm .form-control { width: 100%; } .teaser2col .routeplannerForm .btn-info { width: 100%; } .product-slider .container { max-width: 100%; } .promotionbanner-img-overlay-container .banner-overlap-img-clipped-wrapper { height: 35rem; top: 0; } .text-xxxl { font-size: 4rem !important; } .text-xxl { font-size: 3rem !important; } }