.mr-0,.mx-0{margin-right:0!important}.ml-0,.mx-0{margin-left:0!important}.mt-0,.my-0{margin-top:0!important}.mb-0,.my-0{margin-bottom:0!important}.pr-0,.px-0{padding-right:0!important}.pl-0,.px-0{padding-left:0!important}.pt-0,.py-0{padding-top:0!important}.pb-0,.py-0{padding-bottom:0!important}.float-left{float:left!important}.float-right{float:right!important}.float-none{float:none!important}.text-left{text-align:left!important}.text-right{text-align:right!important}.text-center{text-align:center!important}.m-0{margin:0!important}.mr-1,.mx-1{margin-right:.25rem!important}.ml-1,.mx-1{margin-left:.25rem!important}.mt-1,.my-1{margin-top:.25rem!important}.mb-1,.my-1{margin-bottom:.25rem!important}.m-1{margin:.25rem!important}.mr-2,.mx-2{margin-right:.5rem!important}.ml-2,.mx-2{margin-left:.5rem!important}.mt-2,.my-2{margin-top:.5rem!important}.mb-2,.my-2{margin-bottom:.5rem!important}.m-2{margin:.5rem!important}.mr-3,.mx-3{margin-right:1rem!important}.ml-3,.mx-3{margin-left:1rem!important}.mt-3,.my-3{margin-top:1rem!important}.mb-3,.my-3{margin-bottom:1rem!important}.m-3{margin:1rem!important}.mr-4,.mx-4{margin-right:1.5rem!important}.ml-4,.mx-4{margin-left:1.5rem!important}.mt-4,.my-4{margin-top:1.5rem!important}.mb-4,.my-4{margin-bottom:1.5rem!important}.m-4{margin:1.5rem!important}.mr-5,.mx-5{margin-right:3rem!important}.ml-5,.mx-5{margin-left:3rem!important}.mt-5,.my-5{margin-top:3rem!important}.mb-5,.my-5{margin-bottom:3rem!important}.m-5{margin:3rem!important}.p-0{padding:0!important}.pr-1,.px-1{padding-right:.25rem!important}.pl-1,.px-1{padding-left:.25rem!important}.pt-1,.py-1{padding-top:.25rem!important}.pb-1,.py-1{padding-bottom:.25rem!important}.p-1{padding:.25rem!important}.pr-2,.px-2{padding-right:.5rem!important}.pl-2,.px-2{padding-left:.5rem!important}.pt-2,.py-2{padding-top:.5rem!important}.pb-2,.py-2{padding-bottom:.5rem!important}.p-2{padding:.5rem!important}.pr-3,.px-3{padding-right:1rem!important}.pl-3,.px-3{padding-left:1rem!important}.pt-3,.py-3{padding-top:1rem!important}.pb-3,.py-3{padding-bottom:1rem!important}.p-3{padding:1rem!important}.pr-4,.px-4{padding-right:1.5rem!important}.pl-4,.px-4{padding-left:1.5rem!important}.pt-4,.py-4{padding-top:1.5rem!important}.pb-4,.py-4{padding-bottom:1.5rem!important}.p-4{padding:1.5rem!important}.pr-5,.px-5{padding-right:3rem!important}.pl-5,.px-5{padding-left:3rem!important}.pt-5,.py-5{padding-top:3rem!important}.pb-5,.py-5{padding-bottom:3rem!important}.p-5{padding:3rem!important}@media (min-width:768px){.float-sm-left{float:left!important}.float-sm-right{float:right!important}.float-sm-none{float:none!important}.text-sm-left{text-align:left!important}.text-sm-right{text-align:right!important}.text-sm-center{text-align:center!important}.mr-sm-0,.mx-sm-0{margin-right:0!important}.ml-sm-0,.mx-sm-0{margin-left:0!important}.mt-sm-0,.my-sm-0{margin-top:0!important}.mb-sm-0,.my-sm-0{margin-bottom:0!important}.pr-sm-0,.px-sm-0{padding-right:0!important}.pl-sm-0,.px-sm-0{padding-left:0!important}.pt-sm-0,.py-sm-0{padding-top:0!important}.pb-sm-0,.py-sm-0{padding-bottom:0!important}.m-sm-0{margin:0!important}.mr-sm-1,.mx-sm-1{margin-right:.25rem!important}.ml-sm-1,.mx-sm-1{margin-left:.25rem!important}.mt-sm-1,.my-sm-1{margin-top:.25rem!important}.mb-sm-1,.my-sm-1{margin-bottom:.25rem!important}.m-sm-1{margin:.25rem!important}.mr-sm-2,.mx-sm-2{margin-right:.5rem!important}.ml-sm-2,.mx-sm-2{margin-left:.5rem!important}.mt-sm-2,.my-sm-2{margin-top:.5rem!important}.mb-sm-2,.my-sm-2{margin-bottom:.5rem!important}.m-sm-2{margin:.5rem!important}.mr-sm-3,.mx-sm-3{margin-right:1rem!important}.ml-sm-3,.mx-sm-3{margin-left:1rem!important}.mt-sm-3,.my-sm-3{margin-top:1rem!important}.mb-sm-3,.my-sm-3{margin-bottom:1rem!important}.m-sm-3{margin:1rem!important}.mr-sm-4,.mx-sm-4{margin-right:1.5rem!important}.ml-sm-4,.mx-sm-4{margin-left:1.5rem!important}.mt-sm-4,.my-sm-4{margin-top:1.5rem!important}.mb-sm-4,.my-sm-4{margin-bottom:1.5rem!important}.m-sm-4{margin:1.5rem!important}.mr-sm-5,.mx-sm-5{margin-right:3rem!important}.ml-sm-5,.mx-sm-5{margin-left:3rem!important}.mt-sm-5,.my-sm-5{margin-top:3rem!important}.mb-sm-5,.my-sm-5{margin-bottom:3rem!important}.m-sm-5{margin:3rem!important}.p-sm-0{padding:0!important}.pr-sm-1,.px-sm-1{padding-right:.25rem!important}.pl-sm-1,.px-sm-1{padding-left:.25rem!important}.pt-sm-1,.py-sm-1{padding-top:.25rem!important}.pb-sm-1,.py-sm-1{padding-bottom:.25rem!important}.p-sm-1{padding:.25rem!important}.pr-sm-2,.px-sm-2{padding-right:.5rem!important}.pl-sm-2,.px-sm-2{padding-left:.5rem!important}.pt-sm-2,.py-sm-2{padding-top:.5rem!important}.pb-sm-2,.py-sm-2{padding-bottom:.5rem!important}.p-sm-2{padding:.5rem!important}.pr-sm-3,.px-sm-3{padding-right:1rem!important}.pl-sm-3,.px-sm-3{padding-left:1rem!important}.pt-sm-3,.py-sm-3{padding-top:1rem!important}.pb-sm-3,.py-sm-3{padding-bottom:1rem!important}.p-sm-3{padding:1rem!important}.pr-sm-4,.px-sm-4{padding-right:1.5rem!important}.pl-sm-4,.px-sm-4{padding-left:1.5rem!important}.pt-sm-4,.py-sm-4{padding-top:1.5rem!important}.pb-sm-4,.py-sm-4{padding-bottom:1.5rem!important}.p-sm-4{padding:1.5rem!important}.pr-sm-5,.px-sm-5{padding-right:3rem!important}.pl-sm-5,.px-sm-5{padding-left:3rem!important}.pt-sm-5,.py-sm-5{padding-top:3rem!important}.pb-sm-5,.py-sm-5{padding-bottom:3rem!important}.p-sm-5{padding:3rem!important}}@media (min-width:992px){.float-md-left{float:left!important}.float-md-right{float:right!important}.float-md-none{float:none!important}.text-md-left{text-align:left!important}.text-md-right{text-align:right!important}.text-md-center{text-align:center!important}.mr-md-0,.mx-md-0{margin-right:0!important}.ml-md-0,.mx-md-0{margin-left:0!important}.mt-md-0,.my-md-0{margin-top:0!important}.mb-md-0,.my-md-0{margin-bottom:0!important}.pr-md-0,.px-md-0{padding-right:0!important}.pl-md-0,.px-md-0{padding-left:0!important}.pt-md-0,.py-md-0{padding-top:0!important}.pb-md-0,.py-md-0{padding-bottom:0!important}.m-md-0{margin:0!important}.mr-md-1,.mx-md-1{margin-right:.25rem!important}.ml-md-1,.mx-md-1{margin-left:.25rem!important}.mt-md-1,.my-md-1{margin-top:.25rem!important}.mb-md-1,.my-md-1{margin-bottom:.25rem!important}.m-md-1{margin:.25rem!important}.mr-md-2,.mx-md-2{margin-right:.5rem!important}.ml-md-2,.mx-md-2{margin-left:.5rem!important}.mt-md-2,.my-md-2{margin-top:.5rem!important}.mb-md-2,.my-md-2{margin-bottom:.5rem!important}.m-md-2{margin:.5rem!important}.mr-md-3,.mx-md-3{margin-right:1rem!important}.ml-md-3,.mx-md-3{margin-left:1rem!important}.mt-md-3,.my-md-3{margin-top:1rem!important}.mb-md-3,.my-md-3{margin-bottom:1rem!important}.m-md-3{margin:1rem!important}.mr-md-4,.mx-md-4{margin-right:1.5rem!important}.ml-md-4,.mx-md-4{margin-left:1.5rem!important}.mt-md-4,.my-md-4{margin-top:1.5rem!important}.mb-md-4,.my-md-4{margin-bottom:1.5rem!important}.m-md-4{margin:1.5rem!important}.mr-md-5,.mx-md-5{margin-right:3rem!important}.ml-md-5,.mx-md-5{margin-left:3rem!important}.mt-md-5,.my-md-5{margin-top:3rem!important}.mb-md-5,.my-md-5{margin-bottom:3rem!important}.m-md-5{margin:3rem!important}.p-md-0{padding:0!important}.pr-md-1,.px-md-1{padding-right:.25rem!important}.pl-md-1,.px-md-1{padding-left:.25rem!important}.pt-md-1,.py-md-1{padding-top:.25rem!important}.pb-md-1,.py-md-1{padding-bottom:.25rem!important}.p-md-1{padding:.25rem!important}.pr-md-2,.px-md-2{padding-right:.5rem!important}.pl-md-2,.px-md-2{padding-left:.5rem!important}.pt-md-2,.py-md-2{padding-top:.5rem!important}.pb-md-2,.py-md-2{padding-bottom:.5rem!important}.p-md-2{padding:.5rem!important}.pr-md-3,.px-md-3{padding-right:1rem!important}.pl-md-3,.px-md-3{padding-left:1rem!important}.pt-md-3,.py-md-3{padding-top:1rem!important}.pb-md-3,.py-md-3{padding-bottom:1rem!important}.p-md-3{padding:1rem!important}.pr-md-4,.px-md-4{padding-right:1.5rem!important}.pl-md-4,.px-md-4{padding-left:1.5rem!important}.pt-md-4,.py-md-4{padding-top:1.5rem!important}.pb-md-4,.py-md-4{padding-bottom:1.5rem!important}.p-md-4{padding:1.5rem!important}.pr-md-5,.px-md-5{padding-right:3rem!important}.pl-md-5,.px-md-5{padding-left:3rem!important}.pt-md-5,.py-md-5{padding-top:3rem!important}.pb-md-5,.py-md-5{padding-bottom:3rem!important}.p-md-5{padding:3rem!important}}@media (min-width:1200px){.float-lg-left{float:left!important}.float-lg-right{float:right!important}.float-lg-none{float:none!important}.text-lg-left{text-align:left!important}.text-lg-right{text-align:right!important}.text-lg-center{text-align:center!important}.mr-lg-0,.mx-lg-0{margin-right:0!important}.ml-lg-0,.mx-lg-0{margin-left:0!important}.mt-lg-0,.my-lg-0{margin-top:0!important}.mb-lg-0,.my-lg-0{margin-bottom:0!important}.pr-lg-0,.px-lg-0{padding-right:0!important}.pl-lg-0,.px-lg-0{padding-left:0!important}.pt-lg-0,.py-lg-0{padding-top:0!important}.pb-lg-0,.py-lg-0{padding-bottom:0!important}.m-lg-0{margin:0!important}.mr-lg-1,.mx-lg-1{margin-right:.25rem!important}.ml-lg-1,.mx-lg-1{margin-left:.25rem!important}.mt-lg-1,.my-lg-1{margin-top:.25rem!important}.mb-lg-1,.my-lg-1{margin-bottom:.25rem!important}.m-lg-1{margin:.25rem!important}.mr-lg-2,.mx-lg-2{margin-right:.5rem!important}.ml-lg-2,.mx-lg-2{margin-left:.5rem!important}.mt-lg-2,.my-lg-2{margin-top:.5rem!important}.mb-lg-2,.my-lg-2{margin-bottom:.5rem!important}.m-lg-2{margin:.5rem!important}.mr-lg-3,.mx-lg-3{margin-right:1rem!important}.ml-lg-3,.mx-lg-3{margin-left:1rem!important}.mt-lg-3,.my-lg-3{margin-top:1rem!important}.mb-lg-3,.my-lg-3{margin-bottom:1rem!important}.m-lg-3{margin:1rem!important}.mr-lg-4,.mx-lg-4{margin-right:1.5rem!important}.ml-lg-4,.mx-lg-4{margin-left:1.5rem!important}.mt-lg-4,.my-lg-4{margin-top:1.5rem!important}.mb-lg-4,.my-lg-4{margin-bottom:1.5rem!important}.m-lg-4{margin:1.5rem!important}.mr-lg-5,.mx-lg-5{margin-right:3rem!important}.ml-lg-5,.mx-lg-5{margin-left:3rem!important}.mt-lg-5,.my-lg-5{margin-top:3rem!important}.mb-lg-5,.my-lg-5{margin-bottom:3rem!important}.m-lg-5{margin:3rem!important}.p-lg-0{padding:0!important}.pr-lg-1,.px-lg-1{padding-right:.25rem!important}.pl-lg-1,.px-lg-1{padding-left:.25rem!important}.pt-lg-1,.py-lg-1{padding-top:.25rem!important}.pb-lg-1,.py-lg-1{padding-bottom:.25rem!important}.p-lg-1{padding:.25rem!important}.pr-lg-2,.px-lg-2{padding-right:.5rem!important}.pl-lg-2,.px-lg-2{padding-left:.5rem!important}.pt-lg-2,.py-lg-2{padding-top:.5rem!important}.pb-lg-2,.py-lg-2{padding-bottom:.5rem!important}.p-lg-2{padding:.5rem!important}.pr-lg-3,.px-lg-3{padding-right:1rem!important}.pl-lg-3,.px-lg-3{padding-left:1rem!important}.pt-lg-3,.py-lg-3{padding-top:1rem!important}.pb-lg-3,.py-lg-3{padding-bottom:1rem!important}.p-lg-3{padding:1rem!important}.pr-lg-4,.px-lg-4{padding-right:1.5rem!important}.pl-lg-4,.px-lg-4{padding-left:1.5rem!important}.pt-lg-4,.py-lg-4{padding-top:1.5rem!important}.pb-lg-4,.py-lg-4{padding-bottom:1.5rem!important}.p-lg-4{padding:1.5rem!important}.pr-lg-5,.px-lg-5{padding-right:3rem!important}.pl-lg-5,.px-lg-5{padding-left:3rem!important}.pt-lg-5,.py-lg-5{padding-top:3rem!important}.pb-lg-5,.py-lg-5{padding-bottom:3rem!important}.p-lg-5{padding:3rem!important}} ::selection{ background-color: #2F2F2F; color: #fff; } ::moz-selection{ background-color: #2F2F2F; color: #fff; } ::webkit-selection{ background-color: #2F2F2F; color: #fff; } html,body { margin:0; padding:0; font-family: 'Source Sans Pro', sans-serif; font-size:15px; background-color:#fff; color:#333; font-weight:400; } /* Hide arows from number input for firefox as not working. */ input[type=number] { -moz-appearance: textfield !important; } /* show footer at the bottom of the (even with little text) */ #flexWrapper { display: flex; flex-flow: column; min-height: 75vh; } #fullBody { flex: auto; } /***********************************/ p { -webkit-font-smoothing: antialiased; } * { transition: all .3s linear; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -o-transition: all .3s linear; } .no-trans-all, .no-trans-all *, .fancybox-container, .fancybox-container * { transition: none; -webkit-transition: none; -moz-transition: none; -o-transition: none } a { font-family: 'Source Sans Pro', sans-serif; color: #49b5e5; } a,a:hover,a:active { text-decoration:none!important; } a:active, a:focus { outline: none; } .wrap { width:90%; max-width:1200px; margin:auto; } .signIn { background-image:url('../img/signInBG.jpg'); background-size:cover; background-position:center center; min-height:100vh; width:100%; } .signIn.keystone { background-image:url('../img/signInBGk.jpg'); } .signIn .wrap { position:relative; } .signIn .overlay { position:fixed; width:100%; top:0; left:0; height:100%; background:rgba(1,1,1,0.2); z-index:1; } .signIn .motto { font-size: 40px; color: #fff; position: absolute; bottom: 0px; font-weight: 100; width: 364px; } .signIn .content { z-index:99; background:#fff; position: relative; top: 0; bottom: 0; right: 0; left: 0; margin: auto; width: 90%; max-width: 1200px; } .signIn .content .main { padding:0px 65px; } header { position: fixed; top: 0; width: 100%; z-index: 9000; background:#fff; } .signIn .content .main form { } .signIn .content .info { background:#eee; padding: 133px 40px; padding-bottom:40px; } .signIn .content .header { font-size:30px; margin-bottom:40px; font-weight:200; } .signIn .content img { margin-right:20px; } .signIn .content h3 { font-size: 40px; font-weight: 200; margin-bottom: 11px; margin-top: -12px; } .signIn .main h3 { font-size:26px; margin-top:0; } .signIn .content label { font-weight:400; } .signIn .content .form-control { padding: 13px 16px; height: auto; } .signIn .content a { font-size:16px; color:#00A0DE; } .signIn .content a.buttonInPopupWindow, .signIn .content a.buttonInPopupWindow:hover { color: white; display: inline-block; margin-bottom: 0; } .signIn .content a i { margin-right:5px; } .signIn .content a:hover { color: #006792; } .signIn .content h3 a { font-weight:400; position:relative; top: 16px; } .signIn .content button { background: #D4112F; color: #fff; font-weight: 300; width: 100%; text-align: center; border-radius: 26px; padding: 13px 10px; border: 0; font-size: 19px; margin-top:-10px; } .signIn .content button:hover { background: #9a0f26; } .signIn .content button.ok { width: 142px; margin: 1em 0; } .signIn .content button i, .wrapButtonLink i { margin-left:10px; } .signIn .content .info p { font-size: 16px; color: #646363; letter-spacing: 0; line-height: 24px; margin-left:0px !important; } .signIn .content .info p i { margin-right:10px; } .signIn.register .content { background:none; } .signIn.register .content .main { background:#fff; } .signIn.register .content .desc { /* margin-top: -18px;*/ font-size: 16px; color: #000000; line-height: 27px; margin-bottom: 40px; } .checkbox input { margin-right:7px; } .signIn .help { background:#EEEEEE; padding: 35px 65px; } .signIn .help h3 { margin-bottom:3px; } .passtrengthMeter{ position: relative; width: 100%; } .passtrengthMeter > input{ width: 100%; display: inline-block; padding: 5px; box-sizing: border-box; -moz-box-shadow: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .passtrengthMeter > input:focus { outline-width: 0; } .passtrengthMeter::after{ content: ''; height: 3px; overflow: hidden; width: 0%; transition: width .5s; position: absolute; left: 0px; bottom: 0px; } .passtrengthMeter.weak::after{ background-color: #EC644B; width: 25%; } .passtrengthMeter.medium::after{ content: ''; background-color: #E87E04; width: 50%; } .passtrengthMeter.strong::after{ content: ''; background-color: #EFBF17; width: 75%; } .passtrengthMeter.very-strong::after{ content: ''; background-color: #42A72A; width: 100%; } .passtrengthMeter .showPassword{ position: absolute; width: 20px; top: calc(50% - 10px); right: 10px; } .passtrengthMeter .showPassword.active{ opacity: .5; } .passtrengthMeter .showPassword img{ display: block; width: 100%; height: auto; } .passtrengthMeter .showPassword:hover{ cursor: pointer; } .passtrengthMeter .tooltip { background: #000000; top: 100%; color: #fff; font-family:Arial; font-size: 12px; display: block; left: 50%; margin-bottom: 15px; opacity: 0; padding: 5px 10px; pointer-events: none; position: absolute; min-width: 70px; box-sizing: border-box; text-align: center; z-index: 10; -webkit-transform: translateY(5px); -moz-transform: translateY(5px); -ms-transform: translateY(5px); -o-transform: translateY(5px); transform: translateY(5px); -webkit-transition: all .25s ease-out; -moz-transition: all .25s ease-out; -ms-transition: all .25s ease-out; -o-transition: all .25s ease-out; transition: all .25s ease-out; -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); } .passtrengthMeter.weak .tooltip{ background-color: #EC644B; } .passtrengthMeter.weak .tooltip:after{ border-left: solid transparent 7px; border-right: solid transparent 7px; border-bottom: solid #EC644B 7px; top: -7px; content: " "; height: 0; left: 50%; margin-left: -7px; position: absolute; width: 0; } .passtrengthMeter.medium .tooltip{ background-color: #E87E04; } .passtrengthMeter.medium .tooltip:after{ border-left: solid transparent 7px; border-right: solid transparent 7px; border-bottom: solid #E87E04 7px; top: -7px; content: " "; height: 0; left: 50%; margin-left: -7px; position: absolute; width: 0; } .passtrengthMeter.strong .tooltip{ background-color: #EFBF17; } .passtrengthMeter.strong .tooltip:after{ border-left: solid transparent 7px; border-right: solid transparent 7px; border-bottom: solid #EFBF17 7px; top: -7px; content: " "; height: 0; left: 50%; margin-left: -7px; position: absolute; width: 0; } .passtrengthMeter.very-strong .tooltip{ background-color: #42A72A; } .passtrengthMeter.very-strong .tooltip:after{ border-left: solid transparent 7px; border-right: solid transparent 7px; border-bottom: solid #42A72A 7px; top: -7px; content: " "; height: 0; left: 50%; margin-left: -7px; position: absolute; width: 0; } .passtrengthMeter.weak .tooltip:before { top: -20px; content: " "; display: block; height: 20px; left: 0; position: absolute; width: 100%; } .passtrengthMeter .tooltip:after { border-left: solid transparent 7px; border-right: solid transparent 7px; border-bottom: solid #000000 7px; top: -7px; content: " "; height: 0; left: 50%; margin-left: -7px; position: absolute; width: 0; -webkit-transition: all .25s ease-out; -moz-transition: all .25s ease-out; -ms-transition: all .25s ease-out; -o-transition: all .25s ease-out; transition: all .25s ease-out; } .passtrengthMeter:hover .tooltip { opacity: 1; pointer-events: auto; -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); transform: translateY(10px); } .lte8 .passtrengthMeter .tooltip { display: none; } .lte8 .passtrengthMeter:hover .tooltip { display: block; } /** old print definitions */ .formularHeadlineWhite { font-weight: bold; margin: 0px; margin-left:40px; padding: 0px; padding-left: 0px; padding-top: 12px; padding-bottom: 12px; } .redline { width: 95%; height: 2px; margin-top: 8px; } #tablePrint .shoppingAreaCategoryText, #tablePrint .shoppingAreaTableHeadlinePrint { font-weight: normal; padding: 2px 5px; border: 1px solid #d8d8d8; box-sizing: border-box; } #tablePrint .shoppingAreaTableHeadlinePrint { font-weight: bold; } #tablePrint .printTrackingTableHeadline, #tablePrint .printServiceTableHeadline { font-size: 12px; font-style: normal; font-weight: bold; font-variant: normal; text-transform: none; padding-top: 2px; padding-left: 5px; padding-bottom: 2px; padding-right: 5px; border: 1px solid #d8d8d8; } #tablePrint .textNormalPrintTracking, #tablePrint .textRedPrintTracking, #tablePrint .textNormalPrintService, #tablePrint .textRedPrintService { font-size: 10px; font-weight: normal; padding-left: 2px; } #tablePrint .OrderItemTextPrint, #tablePrint .OrderItemLineLeftPrint, #tablePrint .OrderItemLineRightPrint, #tablePrint .ServiceItemTextPrint, #tablePrint .ServiceItemLineLeftPrint, #tablePrint .ServiceItemLineRightPrint, #tablePrint .ServiceItemLineCenterPrint { font-size: 10px; font-weight: normal; padding-top: 2px; padding-bottom: 2px; padding-left: 2px; padding-right: 2px; border-style: solid; border-width: 1px; border-color: #d8d8d8; } #tablePrint .ServiceItemText, #tablePrint .ServiceItemTextPrint { padding-bottom: 0px; padding-left: 2px; padding-right: 0px; margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-bottom: 0px; border: none; } #tablePrint .oddTableRow { background-color: #eeeeee; } #tablePrint .evenTableRow { background-color: #ffffff; } #tablePrint .colouredTableRow { background-color: #eeeeee; } /*******************************************************/ footer { position:relative; width:100%; bottom:0; padding:30px; z-index:99; color:#fff; } footer a { float:right; color:#fff; margin-left:20px; } footer a:hover { color: #999999; } footer .header { display:none; font-size:20px; margin-bottom:40px; font-weight:200; margin-top:-30px; } footer .header img { width: 64px; margin-right: 13px; } @media(max-width:1280px) { .signIn .col-8 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media(max-width:1130px) { .signIn .content .main { padding: 0px 45px; } } @media(max-width:1050px) { .signIn .content .col-5, .signIn .content .col-6 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .signIn .content { position:relative; width:100%; } .signIn .forgot { position: relative; top: -23px; } footer { position:relative; background:#646363; } footer.mobileKeystone { background:#000; } footer a { float:none; display:block; margin-bottom:20px; margin-left:0px; } footer .header { display:block; } } header { border-bottom: 1px solid #eee; } header .header { font-size: 23px; font-weight:200; } header .header img { margin-right:20px; height:70px; } header ul { list-style:none; padding:0; margin:0; margin-top:21px; position: absolute; /* right: 0; 24.3.2020 by C. Berens */ } header ul#menu-level1 { right: 0; } header ul li { float:left; position:relative; } header ul li a { font-size: 18px; color: #3B3A3A; padding: 8px 16px; position:relative; padding-bottom: 25px; } header ul li a:hover { color: #5e5d5d; } header ul li a .count { position: absolute; background: #D4112F; color: #fff; width: 15px; height: 15px; border-radius: 50%; text-align: center; font-size: 10px; left: 0; right: -21px; margin: auto; top: 3px; } h1 { font-size: 40px; font-weight: 200; border-bottom: 1px solid #eeeeee; padding-bottom: 15px; margin-top: 50px; margin-bottom:40px; } h1.no-border { border-bottom: 0; margin-bottom:0; } h1 i { opacity:0.6; margin-right:10px; } h1 span { font-size: 15px; float: right; position: relative; top: 20px; } .module { } .module .title { font-weight:200; font-size:30px; margin-bottom:22px; } .module .title a { font-size: 15px; font-weight: 400; color: #00A0DE; margin-left: 10px; position: Relative; top: -3px; } .primary [data-toggle="collapse"] .far:before { content: "\f176"; } .primary [data-toggle="collapse"].collapsed .far:before { content: "\f175"; } .card-header { padding: .75rem 1.25rem; margin-bottom: 0; background-color: #fff; /* border-bottom: 1px solid rgba(0,0,0,.125); */ border-bottom: 0; } .card { border-radius:0; } .card h2 { position:relative; } .primary .card .far { position: absolute; right: 0px; color: #00a0de; font-size: 26px; top: 8px; } .card .btn-link { font-weight: 200; font-size: 18px; color:#333; text-decoration:none !important; } .fileList { margin-bottom:15px; } .fileList:last-of-type {margin-bottom:0;} .fileList .title { font-size: 15px; font-weight: bold; margin-bottom:9px; opacity:0.8; } .fileList ul { list-style:none; padding:0; margin:0px; } .fileList ul li a { color: #00A0DE; letter-spacing: 0.2px; } .fileList ul li a:hover { color: #006792; } .fileList ul li a i { margin-right:5px; } .moduleRow { margin-bottom:50px; } iframe { max-width: 100%; } .trackingInfo { color: #00A0DE; } .trackingInfo:hover { color: #006792; } .trackingInfo i { margin-right:5px; } .table { color:#333; border: 1px solid #dee2e6; font-weight:200; } .table thead th { vertical-align: bottom; border-bottom: 1px solid #dee2e6; background: #eaeaea; } .table thead { border-left: 1px solid #dee2e6; } .table .blip, .tableKey .blip { width:12px; height:12px; border-radius:50%; background:#646363; margin:auto; margin-top:5px; } .table .blip.blue, .tableKey .blip.blue { background:#00a0de; } .tableKey .blip { margin: 0px; margin-right: 7px; display: inline-block; position: relative; top: 1px; } .tableKey .item { display:inline-block; margin-right:30px; } .tableKey { margin-top:14px; } .table .dots { text-align: right; color: #909090; margin-top: -18px; position: relative; font-size: 28px; top: 10px; } .footer { background:#646363 !important; color:#fff !important; padding-bottom:50px; height: auto !important; font-family: 'Source Sans Pro', sans-serif; clear: both; margin-top: 3em; z-index:9000; } .footer .header { font-size:30px; margin-bottom:40px; font-weight:200; } .footer img { margin-right:20px; } .footer .signOut { float: right; color: #c8c8c8; font-size: 18px; margin-top: 30px; } .footer .signOut:hover { color: #939393; } .footer .signOut i { margin-right:10px; } .footer .copyright { color: #c8c8c8; } .footer .copyright a { color: #c8c8c8; margin-right:20px; } .footer .copyright a:hover { color: #939393; } .footer .copyright .language { float:right; margin-top:-13px; } .footer .copyright .language .form-control { padding: 12px 16px; height: auto; border-radius: 0; display: inline-block; width: 126px; margin-left: 18px; } .favourites [data-toggle="collapse"] { display:block; font-size:14px; margin-top:3px; color: #00A0DE; } .favourites [data-toggle="collapse"]:hover { color: #006792; } .favourites .btn { text-align:left; } .favourites [data-toggle="collapse"] i { margin-right:4px; } .favourites .no { padding-top:2px; text-align:right; } .favourites .no span { color: #00A0DE; margin-right:5px; } .favourites .fa-star, .favourites .fa-tools, .favourites .fa-envelope { font-size: 23px; cursor: pointer; margin-top:3px; } .favourites .fa-star { color: #efd232; } .favourites .fa-star:hover, .favourites .fa-tools:hover, .favourites .fa-envelope:hover { opacity:0.6; } .favourites .qty, #wrapQtyPrice .qty { height: auto; text-align: center; border-radius: 13px; padding: 4px 2px !important; } .favourites .minus { color: #9a9a9a; font-size: 27px; position: relative; left: 12px; top: -5px; cursor:pointer; } .favourites .minus:hover { opacity:0.7; } .favourites .plus { color: #d4112f; font-size: 27px; position: relative; right: 17px; top: -5px; cursor:pointer; } .favourites .plus:hover { opacity:0.7; } .favourites .tools { padding-top:15px; } /* begin modification v3.31 by C. Berens */ .favourites .show-coniguration-button, .favourites .show-enquiry-button { text-align: right; } /* end modification v3.31 by C. Berens */ @media(max-width:1305px) { header ul li a { padding: 8px 20px; } } @media(max-width:1130px) { header ul li a { font-size:16px; } h1 { font-size:31px; } header ul { margin-top:22px; } .module .title { font-size:26px; } .module .title a { top:-1px; } .fileList .title { font-size:15px !important; } .favourites .plus { right:25px; } } @media(max-width:960px) { .contentLeft, .contentRight { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contentRight { margin-top:30px; } .contentRight .module { padding-left:0 !important; } .userDataPage hr { display:none; } } @media(max-width:1055px) { header ul li a { font-size: 15px; } header ul li a { padding: 8px 16px; } header ul { margin-top: 24px; } .favourites .col-8, .favourites .tools { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .favourites .tools { padding-top: 15px; max-width: 350px !important; padding-right: 0; padding-left: 15px; } .favourites .toggleFav { position: relative; left: 10px; } .form .basketItems .col-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .form .basketItems .tools .col-4 { -ms-flex: 0 0 35%; flex: 0 0 35%; max-width: 35%; } .form .basketItems .tools .col-8 { -ms-flex: 0 0 65%; flex: 0 0 65%; max-width: 65%; } .form .basketItems .qty { max-width:999px !important; } .form .basketItems .discount { /* right:0; */ } .form .basketItems .total { right:0; } } .hamburger { display:none; } @media(max-width:940px) { header ul li { display:none; } header ul li.cart { display: block; padding-top: 7px; } .hamburger { display:block; position:absolute; right:40px; top:9px; } header ul li a { font-size: 26px; } header ul { right: 57px; top: -7px; } .hamburger-box { position: relative; display: inline-block; width: 28px; height: 24px; overflow: hidden; } .hamburger-inner, .hamburger-inner:after, .hamburger-inner:before { background-color: #3b3a3a; } .keystone .hamburger-inner, .keystone .hamburger-inner:after, .keystone .hamburger-inner:before { background-color: #fff; } header .col-3, header .col-9 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } } .tabs { border-bottom: 1px solid #eeeeee; margin-bottom:40px; } .tabs .tab { display: inline-block; margin-right: 25px; padding: 16px 0px; border-bottom: 3px solid transparent; } .tabs .tab a { color:#000; } .tabs .tab.active, .tabs .tab:hover { border-bottom: 3px solid #d5112f; } .tabs .tab.info { float:right; } .tabs .tab.info a { color: #00A0DE; } .tabs .tab.info a i { margin-left:5px; } .tabs .tab.info:hover { border-bottom:0 !important; opacity:0.7; } #catalog-help { padding: 16px 0px; display: inline-block; float: right; font-size: 15px; font-weight: 400; } #catalog-help:hover { color: #006792; } #catalog-help i { margin-right: 7px; font-weight: 300; } .products { /* margin-bottom:40px; */ } .productsLeft form { } .productsLeft form .form-control { padding: 11px 17px; height: auto; } .productsLeft form .fa-search { position: absolute; right: 26px; top: 13px; font-size: 20px; cursor:pointer; } .productsLeft form .fa-search:hover { color:#d5112f; } .productsLeft ul { list-style:none; padding:0; margin:0; /* margin-top:20px; */ } .productsLeft ul li, .productsLeft ul li a { color:#000; font-size:19px; font-weight:100; padding: 10px 0px; display:block; } .productsLeft ul li { border-bottom: 1px solid #c8c8c8; padding: 0px; cursor:pointer; } .productsLeft ul li:hover { border-bottom: 1px solid #d5112f; } .products .single { background:#e6e6e6; margin-bottom:30px; } .products .single:hover { background: #cbcbcb; } .products .single .image { background: #fff; border-radius: 50%; position: relative; width: 170px; height: 170px; -moz-box-shadow: 0 0 10px #e0e0e0; -webkit-box-shadow: 0 0 10px #e0e0e0; box-shadow: 0 0 10px #e0e0e0; margin: auto; top: -31px; } .products .single .image img { position: absolute; max-height: 80%; max-width: 80%; left: 0px; right: 0px; margin: auto; top: 0px; bottom: 0px; z-index: 0; width: auto; } .products .single .title { text-align: center; font-size: 25px; font-weight: 200; padding-bottom: 20px; color:#000; margin-top: -15px; } h1 .filter { float: right; border: 1px solid #c8c8c8; background: #fff; border-radius: 24px; padding: 11px 23px; font-size: 19px; } h1 .filter:hover { background:#fafafa; } h1 .filter i { margin-left:15px; } h1 .smallDesc { display: block; float: none; font-size: 16px; top: 0; max-width: 400px; margin-top: 11px; line-height: 25px; } h1.notFound { border-bottom: 0; margin-top: 100px; margin-bottom: 100px; font-size: 80px; } h1.notFound .smallDesc { display: block; float: none; font-size: 27px; top: 0; max-width: 999px; margin-top: 24px; line-height: 25px; } h1.notFound a, .orderInfo a { color: #00A0DE; } h1.notFound a:hover, .orderInfo a:hover { color: #006792; } h1.notFound a i { margin-left: 15px; position: relative; top: 2px; } .orderInfo { } .orderInfo .row { } .orderInfo label { font-weight:bold; } .orderInfo .notice { font-size:12px; margin-top:10px; } .tableActions { margin-top:20px; } .tableActions a { display:inline-block; margin-right:20px; color: #00A0DE; } .tableActions a:hover { color: #006792; } .tableActions i { margin-right:5px; } .block { display:block; } .title a.block { top:0; margin-left:0; margin-top:8px; } .title a.block i { margin-right:5px; } .singleBody h2 { font-weight: 100; margin-bottom: 30px; } .disclaimer { float: right; width:50%; color: #D4112F; text-align: right; position: absolute; right: 15px; top: 8px; } .singleBody .looking { background: #fbfbfb; padding: 28px 38px; margin-top:30px; padding-left:33px; border:1px solid #eee; } .singleBody .looking h2 { font-size: 28px; margin-bottom: 8px; } .singleBody .looking .items { background:#fff; border:1px solid #ddd; width:92%; } .singleBody .looking .items .item { border-bottom:1px solid #ddd; margin-bottom:-1px; position:relative; } .singleBody .looking .items .item .num { width: 50px; border-right: 1px solid #ddd; text-align: center; padding: 10px 0px; display:inline-block; vertical-align:top; } .singleBody .looking .items .item .input { display:inline-block; vertical-align:top; width: calc(100% - 60px); } .singleBody .looking .items .item .input input { border: 0px; margin-top: 3px; } .singleBody .looking .items .item .fa-times { position: absolute; right: -27px; font-size: 21px; top: 11px; } .singleBody .looking a { font-size: 14px; color: #00A0DE; margin-top: 14px; display: block; } .singleBody .looking button { background: #D4112F; color: #fff; font-weight: 300; width: 186px; text-align: center; border-radius: 26px; padding: 13px 10px; border: 0; font-size: 16px; margin-top: 5px; } .singleBody .looking button:hover { background: #9a0f26; } .singleBody .looking button i { margin-left:10px; } .favourites .configure { background: #D4112F; color: #fff; font-weight: 300; text-align: center; border-radius: 26px; padding: 11px 10px; border: 0; font-size: 16px; margin-top: -5px; min-width: 170px; display: inline-block; } .favourites .configure:hover { background: #9a0f26; } .favourites .configure i { margin-left:10px; } .titleArea { position:relative; } .basketItems h2 span span { font-size:13px; display:block; } .basketItems .remove { color: #646363; font-size: 23px; cursor: pointer; margin-top: -1px; } .basketItems .discount { text-align: right; position: relative; margin-top: 8px; right:35px; } .basketItems .wrapDiscountInput { right:35px; } #wrapOfferData { text-align: right; } #wrapOfferData div.wrap-offer-field { text-align: left; } #wrapOfferData label { margin-top: .4em; } #diplayedCustomername { font-size: 90%; display: inline-block; padding: 0 .5em; } .basketItems .total { font-weight:bold; margin-top:10px; text-align:right; position: relative; right: 35px; } .cartInfo { } .cartInfo .summary { width: 300px; /* 27.4.2020 */ float:right; } .cartInfo .summary { text-align:right; } .clear { clear:both; } .cartInfo .order { float:right; /* width:140px !important; 27.4.2020 */ margin-top:15px !important; } .favGo { background: #D4112F; color: #fff; font-weight: 300; width: 96px; text-align: center; border-radius: 26px; padding: 7px 10px; border: 0; font-size: 14px; margin-top: -2px; margin-left: -26px; } .favGo:hover { background: #9a0f26; } .favGo i { margin-left:10px; } h1 span.large { display: block; font-size: 20px; float: none; top: 4px; } .userList .card { margin-top:-2px; } .userList .card span { font-size: 14px; margin-left: 15px; } .userList .card .far { position: absolute; right: 0px; color: #00a0de; font-size: 26px; top: 8px; } .margin-50 { margin-top:50px; } .module.form .title span { display:block; opacity:1; font-size:20px; } .module.form .title span.no-block { display: inline; font-size: inherit; } .module.form button, .modal-body button, .buttonInPopupWindow, .modal-body .buttonWhiteBackground { background: #D4112F; color: #fff; font-weight: 300; width: 100%; text-align: center; border-radius: 26px; padding: 13px 31px; border: 0; font-size: 17px; font-family: 'Source Sans Pro', sans-serif; margin-top: 18px; width: auto; margin-bottom: 20px; height:auto !important; } .module.form button:hover, .modal-body button:hover, .buttonInPopupWindow:hover, .modal-body .buttonWhiteBackground:hover { background: #9a0f26; color:#fff; } .module.form button i, .module.form a i { margin-left:10px; } .module.form .form-control { box-shadow: none; padding: 10px 19px; height: auto; max-width: 400px; } .module.form .note { background:#eee; padding: 25px 30px; margin-bottom:30px; margin-top:30px; } .module.form .note h5 { font-weight:100; font-size:27px; } .module.form .note a { color: #00A0DE; } .module.form .note a i { margin-left:5px; } .module.form .subHead { font-weight:100; margin-bottom:20px; font-size:24px; } .module.form .optionTable { width:400px; border-left:1px solid #d2d2d2; border-right:1px solid #d2d2d2; border-top:1px solid #d2d2d2; } .module.form .optionTable .item { background:#fff; border-bottom:1px solid #d2d2d2; } .module.form .optionTable .item .main { display:inline-block; width:80%; } .module.form .optionTable .item .amount { display:inline-block; width:19%; margin-left:0.2%; border-left:1px solid #d2d2d2; vertical-align:top; } .module.form .optionTable .item input { width:100%; border:0; } .module.form .optionTable .item.top .main, .module.form .optionTable .item.top .amount { padding: 5px 12px; } .module.form .addOption, .module.form .addOption a { color: #00A0DE; cursor:pointer !important; } .module.form .addOption i { margin-right:5px; margin-top:20px; } .subModule { padding:30px; border:1px solid #eee; } .module.form .addOption a { margin-right:20px; } button.white { background:#fff !important; color:#333 !important; border:1px solid #ddd !important; } .orderThankYou .title { text-align:center; } .orderThankYou .title img { display:block; margin:auto; margin-bottom:20px; } .orderThankYou .desc { text-align:Center; font-size:20px; opacity:0.9; max-width:600px; font-weight:100; margin:0px auto; } .alert-danger { border-radius:0; border:0; } .textRed label {color:#721c24;/*background: #f8d7da;*/padding-right: 1em;} .userdata_big_red, .formInputMediumRed {border-color: #721c24;} .wrap-button-next { display:inline-block; margin-right:.5em; } .orderThankYou .alert, .orderThankYou .buttonRow { max-width: 514px; /* padding: 10px; */ margin: auto; margin-top: 30px; margin-bottom: 30px; } .orderThankYou .buttonRow { margin-top:40px; } .orderThankYou .button, .orderThankYou button { font-weight: 300; display:block; width: 100% !important; text-align: center; border-radius: 26px; padding: 13px 13px; border: 0; font-size: 14px; display: block; margin-top: -10px; background: #fff; color: #333; border: 1px solid #ddd !important; } .orderThankYou button.red { background: #D4112F !important; color: #fff !important; font-weight: 300; width: 100%; text-align: center; border-radius: 26px; padding: 13px 31px; border: 0; font-size: 17px; font-family: 'Source Sans Pro', sans-serif; margin-top: 18px; width: auto; margin-bottom: 20px; height: auto !important; } .orderThankYou .button:hover { background: #9a0f26; } .orderThankYou .button i { margin-left:10px; } .table input { border:0; padding:0 !important; } .form table td { border:1px solid #eee; } header ul li { padding-bottom:25px; } header ul li ul { background:#007ab8; position:absolute; left:0; /* width: 246px; 24.3.2020 by C. Berens */ white-space:nowrap; top:28px; z-index: 999; display:none; } header ul li:hover ul { display:block; } header ul li ul li.keycard { background:#006a9e; } header ul li ul li a { color:#fff; font-weight:300; } header ul li ul li a:hover { color: #aaaaaa; } header ul li ul li { float: none; padding: 10px 0; } .module.form.contact .form-control { width:100%; max-width:999px; } .form-cb { height: 0.5px; overflow: hidden; } .nobr {white-space: nowrap;} .contactPoints a, .editLink a { color:#00A0DE; } .contactPoints a:hover, .editLink a:hover { opacity:0.7; } .contactPoints .item .icon { display: inline-block; text-align: center; width: 36px; font-size: 18px; position: Relative; top: 2px; } .contactPoints .item { margin-top:7px; } .light { font-weight:100; } .card-body h4 { font-weight:100; } .modal .module.form .row { margin-bottom:30px; } .modal .module.form input,.modal .module.form textarea { max-width:999px; } .modal-body { padding: 40px 60px; } .modal-dialog { max-width:700px; } .isICONConfiguration .modal-dialog { max-width: 900px; } .modal-content { border: 0; border-radius: 0; } .modal-content.is-loading { min-height: 300px; } .closeModal { background: #000; color: #fff; position: absolute; width: 50px; height: 50px; top: 0; font-size: 20px; right: 0; text-align: center; padding-top: 11px; cursor:pointer; z-index:9999; } .closeModal:hover { background:#D4112F; } .colorRed { color:#D4112F; } ul.children { padding-left: 15px; margin-top: 0; } ul.children li a { font-size:16px; } .productsLeft ul.children li { } .refresh { position: absolute; color: #4CAF50; top: -1px; font-size: 21px; cursor: pointer; left: 2px; } .refresh:hover { color:#333; } .standardButtonWhite { border: 1px solid #c8c8c8; background: #fff; border-radius: 24px; padding: 13px 23px; font-size: 19px; color: #616161; } .standardButtonWhite:hover { color: #323232; } .standardButtonWhite i { margin-left:15px; } #orderFilter { background:#fafafa; padding:20px; margin-bottom:30px; display:none; } #orderFilter .form-control { max-width:999px; } .miniCartBtn { background: #D4112F; color: #fff; font-weight: 300; width: 96px; text-align: center; border-radius: 26px; padding: 7px 10px; border: 0; font-size: 14px; } .productImageSmall { display: inline-block; vertical-align: top; /* width: 175px; height: 91px; */ position: relative; width: 65px; height: 65px; } .productImageSmall img { position: absolute; max-height: 100%; max-width: 100%; left: 0px; right: 0px; margin: auto; top: 0px; bottom: 0px; z-index: 0; width: auto; height: 100% !important; } .configurator__product-image { padding: 0 16px 0 0; } .configurator__product-image-inner { /* border-radius: 50%; border: 1px solid #cfcfcf; */ width: 80px; height: 80px; overflow: hidden; position: relative; } .configurator__product-image-inner img { transition: transform 250ms; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-height: 100%; max-width: 100%; } .configurator__product-image.is-placeholder img { max-height: 100%; max-width: 100%; -webkit-filter: grayscale(100%); filter: grayscale(100%); border: none; } .configurator__product.is-placeholder{ pointer-events: none; } .hasProdImage { display:inline-block; max-width:500px; margin-top: -10px; } .modal-body.remote { padding: 57px 30px; } .keystone header, .keystone .footer { background:#000 !important; color:#fff; } .keystone header ul li a { color:#fff; } .kShowroom { background-image:url('/images/general/showroomBG.jpg'); background-size:cover; background-position:center center; height:320px; margin-bottom:40px; position:Relative; } .kShowroom .cta { background: #fff; width: 458px; padding: 19px 24px; position: absolute; bottom: -29px; left: 20px; -moz-box-shadow: 0 0 16px #868686; -webkit-box-shadow: 0 0 16px #868686; box-shadow: 0 0 16px #868686; } .kShowroom .cta p { color: #D4112F; font-size: 14px; margin-bottom: 3px; } .kShowroom .cta h4 { font-weight:100; font-size:30px; color:#333; } .kShowroom .cta i { position: absolute; right: 20px; bottom: 33px; } .kShowroom.banner .cta { width: 96%; left: 2%; } .keystone.dashboard header { background:#000; border-bottom:0px; } .keystoneHeader { min-height: 300px; background-image: url(../img/keystoneHeader.jpg); background-size: cover; background-position: center center; margin-top: -70px; margin-bottom:180px; } .keystoneHeader h1 { color: #fff; border-bottom: 0px; margin-top: 0; padding-top: 68px; font-weight: 100; margin-bottom: -5px; font-size: 30px; position: relative; top: 52px; } .keystoneHeader h1 span { display: block; font-size: 22px; float: none; margin-top: -18px; } .keystoneHeader h1 span.credits { float:right; } .keystoneHeader h1 span.credits i { font-size:15px; margin-left: 10px; color: #fff; opacity: 1; } .keystoneNav { background:#646363; color:#fff; font-size:0; -moz-box-shadow: 0 0 16px #000000; -webkit-box-shadow: 0 0 16px #000000; box-shadow: 0 0 16px #000000; position: relative; top: 100px; } .keystoneNav .single { text-align:center; display:inline-block; vertical-align:top; width:25%; font-size:20px; border-right: 1px solid #585858; } .keystoneNav .single:hover { background:#585858; } .keystoneNav .single i { display: block; margin-top: 16px; margin-bottom: 44px; } .keystoneNav .single .icon { display: block; width:77px; position:relative; height:100px; margin:auto; margin-top: 34px; margin-bottom: 20px; } .keystoneNav .single .icon img { position: absolute; max-height: 100%; left: 0px; right: 0px; margin: auto; top: 0px; bottom: 0px; z-index: 0; width: auto; } .keystoneNav .single a { color:#fff; } .keystone header ul li ul { background: #fff; -webkit-box-shadow: 0 0 10px #d0d0d0; box-shadow: 0 0 10px #d0d0d0; } .keystone header ul li ul a { color: #3b3a3a; padding: 9px 22px; font-size: 16px; } header ul li a { padding: 9px 22px; font-size: 16px; } .tableKeyInfo td { padding: 6px 11px; border: 1px solid #d2d2d2 !important; width: auto !important; } .tableKeyInfo td input, .tableKeyInfo td select, .tableKeyInfo td textarea { background: none; -moz-appearance: none; appearance: none; border: 0; font-size: 15px !important; color: #5d5d5d; } .tableKeyInfo td input[type="radio"] { -webkit-appearance: radio; -moz-appearance: radio; appearance: radio; } .tableKeyInfo .shoppingAreaTableHeadline { font-weight:bold; } button:focus, a:focus, input[type=submit]:focus, .standardButtonWhite { outline:none; } .leftChild { display:none; } .modal { z-index: 20000; } input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button { opacity: 1; } .products .accordion>.card .card-header { padding:5px 9px; } .products .favourites [data-toggle="collapse"] { display: block; font-size: 14px; margin-top: 5px; color: #49b5e5; vertical-align: middle; margin-left:0px; } .products .favourites .tools { padding-top:8px; } @media(max-width:800px) { .motto { display:none; } .signIn .col-5, .signIn .col-7, .signIn .col-6 { -ms-flex: 0 0 100; flex: 0 0 100%; max-width: 100%; } .signIn .content { min-height:0px !important; height:auto !important; } .signIn .content .info { padding: 50px 43px; } .timeoutCol { display:none; } .signIn .content h3 { font-size:33px; } } .accordion>.card:not(:first-of-type):not(:last-of-type) { border-bottom: 1px solid rgba(0,0,0,.125); border-radius: 0; margin-top: -1px; } .accordion .card:first-of-type { border: 1px solid rgba(0,0,0,.125); } @media(min-width:1000px) { .signIn .content .info { min-height:601px; } } .favourites .refresh { top:2px; } .favourites .basketItems .remove { margin-top:2px; } .favourites .tools { padding-top:7px; } .navIcon { margin-right:10px; opacity:0.5; } .keystoneNav { position:relative; height:264px; } .keystoneNav .single .largeContent { display:none; } .keystoneNav .single { -webkit-transition: width 0.4s, height 4s; /* For Safari 3.1 to 6.0 */ transition: width 0.4s, height 4s; } .keystoneNav .single.small { font-size:14px; width: 10%; height: 100%; } .keystoneNav .single.small .icon img { max-height: 46%; margin-top: 53px; } .keystoneNav .single.small .icon { margin-top:49px; } .keystoneNav .single.large { width:70%; height:100%; background: #585858; } .keystoneNav .single.large .largeContent { display:block; text-align:left; position:relative; padding:40px; } .keystoneNav .single.large .original { display:none; } .keystoneNav .single h4 { font-weight: 200; font-size: 28px; margin-bottom:13px; } .keystoneNav .single .largeContent a { font-weight: 200; color: #fff; font-size: 18px; display: block; margin-top: 12px; margin-bottom: 9px; } .keystoneNav .single .largeContent a:hover { opacity:0.6; } .keystoneNav .fa-times { position: absolute; right: 18px; font-size: 29px; z-index:999; top: 2px; cursor:pointer; } #confirmDeleteAddress { display:none; } #fullBody { /* min-height:400px; */ } @media(max-width:1180px) { header ul li a { padding: 9px 13px; } .productsLeft, .productRight { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .productRight { margin-top:40px; } } @media(max-width:930px) { .keystoneNav { height:auto; } .keystoneNav .single { width:100%; text-align:left; font-size: 19px !important; font-weight: 200; } .keystoneNav .single .icon { display:inline-block; margin:0; width:77px; vertical-align:middle; height:48px; margin-top: 14px; margin-bottom: 14px; } .keystoneNav .single i { display: inline-block; margin-top: 14px; margin-bottom: 44px; float: right; position: relative; top: 13px; right: 13px; } .keystoneNav .single .icon img { max-height:92%; } .keystoneNav .single.large i { position: absolute; right: 18px; font-size: 29px; z-index: 999; top: 2px; } .keystoneNav .single.small { width:0%; opacity:0; height:0px; } .keystoneNav .single.large { width:100%; } } @media(max-width:1055px) { .favourites .tools { max-width:250px !important; } .favourites .no { text-align:left; } } @media(max-width:520px) { .tabs .tab { display: block; margin-right: 0px; padding: 16px 0px; text-align: center; } header .col-3 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } header .col-9 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } header .header { font-size:18px; } .keystoneHeader h1 span.credits { float: right; position: relative; top: 41px; } .keystoneHeader h1 { text-align:Center; font-size:27px; top:42px; } .keystoneHeader h1 span { font-size:17px; } .keystoneHeader h1 span.credits { float: none; position: relative; top: 51px; } } @media(max-width:770px) { .module .title { font-size: 22px; } .keystoneRow .col-6 { -ms-flex: 0 0 100%; flex: 0 0 100%; margin-bottom:30px; max-width: 100%; } } @media(max-width:690px) { .form .col-5, .form .col-7, .form .col-4 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .module.form .form-control { max-width:100%; } .module.form button, .modal-body button, .buttonInPopupWindow, .modal-body .buttonWhiteBackground { border-radius: 20px; padding: 9px 25px; border: 0; font-size: 15px; } .tableKeyInfo { width:350px; } .modular .standardButtonWhite { border: 1px solid #c8c8c8; background: #fff; border-radius: 24px; padding: 13px 13px; font-size: 14px; color: #616161; display: inline-block; margin-bottom: 10px; width: 30%; text-align: center; } .productRight .module.form button { float:none !important; display:block; clear:both; } .productRight .looking { margin-top:-80px; } .singleBody .looking h2 { font-size:23px; } .hasProdImage { width: calc(100% - 47px); margin-left: 7px; } .hasProdImage p { font-size:15px !important; } } @media(max-width:960px) { .contact .col-4, .contact .col-8 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contact .col-8 { margin-top:30px; } .userData .col-6 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media(max-width:600px) { .modal .col-6 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .modal-dialog { margin:0; } .modal-body { /* min-height: 100vh; */ } .modal-backdrop { display:none; } header .wrap { width: 100%; padding-right: 20px; } } header ul li.cart .item { padding: 0; /* padding: 9px 22px;*/ border-bottom: 1px solid #ececec; color: #3B3A3A; } header ul li.cart .item span { float:right; } header ul li.cart ul { background: #fff; -webkit-box-shadow: 0 0 10px #d0d0d0; box-shadow: 0 0 10px #d0d0d0; left: auto; right: 0; width:320px; } header ul li.cart ul a { color: #fff; background: #d5112f; padding: 7px 20px; border-radius: 15px; margin-left: 19px; } header ul li.cart ul a i { margin-left:5px; } header ul li.cart ul a:hover { color:#fff; background: #b80f2a; } .slideout-menu { position: fixed; top: 0; bottom: 0; width: 286px; min-height: 100vh; overflow-y: scroll; -webkit-overflow-scrolling: touch; z-index: 0; display: none; } .slideout-menu-left { left: 0; } .slideout-menu-right { right: 0; } .slideout-panel { position: relative; z-index: 1; /*will-change: transform;*/ background-color: #FFF; /* A background-color is required */ /* min-height: 100vh;*/ } .slideout-open, .slideout-open body, .slideout-open .slideout-panel { overflow: hidden; } .slideout-open .slideout-menu { display: block; } #menu { background: #fbfbfb; border-right: 2px solid #e1e4e8; } #menu ul { list-style:none; padding:0; margin:0; } #menu ul li a { display: block; color: #333; border-bottom: 1px solid #e1e4e8; padding: 13px 19px; font-size: 20px; font-weight: 200; } #menu ul li a i { opacity:0.6; } #menu ul li ul li a { font-size:17px; padding: 8px 19px; } #menu ul li ul { padding-left:20px; } #menu .count { font-weight:bold; margin-left:5px; } #menu ul .down { float:right; margin-top: 5px; } @media(max-width:1150px) { .basketItems .col-7, .basketItems .col-5 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .basketItems .col-5.tools { max-width: 300px !important; min-width: 300px; } .basketItems .no { right:0 !important; } .basketItems .card .btn-link { padding-left:0; } .basketItems .col-6 .col-6 { } .basketItems .col-11 { -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .basketItems .col-1 { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; text-align:right; } .responsiveTable { overflow-x:auto; } .modal .responsiveTable { overflow-x: auto; width: 85vw; } .modal .responsiveTable table { min-width: 700px; } .actualFav .col-7, .actualFav .col-5 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .actualFav .col-5.tools { max-width:999px !important; min-width: 0px; } } @media(max-width:840px) { .disclaimer { float: none; width: 100%; text-align: left; position: static; right: 15px; top: 0; } .form .col-6 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .keystoneNav .single { font-size:16px; border-top: 1px solid #585858; } .keystoneNav .single.small { width:0%; opacity:0; height:0px; } .keystoneNav .single.large { width:100%; } .largeContent .col-4 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media(max-width:500px) { .basketItems .col-11 { -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .basketItems .col-1 { -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; text-align:right; } } span .fa-info-circle { color: #49b5e5; position: relative; top: -1px; left: 6px; font-size: 13px; } span .fa-info-circle:hover { opacity:1; } .card .col-8, .card .btn-link { padding-right:0; } .card .btn-link { font-size:17px; white-space:normal; text-align:left; margin-rigth:20px; } .productsLeft ul li strong { font-weight:bold; } .favourites.basketItems .tools { padding-top: 5px; margin-bottom: -10px; } .basketItems .total { font-weight: bold; margin-top: 8px; } .favourites .no { position: relative; right: -38px; padding-top:4px; } .favourites .qty { -webkit-appearance: none; appearance: none; -moz-appearance: none; } .optionTable .pos { display: inline-block; padding: 5px 12px; width: 18%; } .optionTable .top { font-weight:bold; } .module.form .optionTable .item .main { display: inline-block; border-left: 1px solid #d2d2d2; width: 60%; } .productStart b, .productStart strong { font-weight:normal; } .productStart p:first-of-type { font-size:25px; } .productRight .favourites .no { right: -11px; } .products .favourites .articleInfoBottom { display: block !important; margin-top: -18px !important; margin-left: 0 !important; } .actualFav .zusatz { color: #49b5e5; font-size:14px; } .actualFav .twoLines .tools { padding-top: 14px !important; } .actualFav .remove { margin-top: 4px; position: absolute; right: -33px; color: #49b5e5; font-size: 17px; } .actualFav .refresh { top: 0px; } .actualFav span .fa-info-circle { top:-1px; } .actualFav .card-header { border-bottom:0; } .favourites.basketItems.actualFav .tools { padding-top:3px; } .productRight .card h2.oneLine { top:21px; } .productRight .favourites .tools { padding-top: 14px !important; } .actualFav .refresh { color: #d51030; } .forceButtonWhite { background: #fff !important; color: #333 !important; border: 1px solid #e4e2e2 !important; } .forceButtonWhite:hover { background:#e4e2e2 !important; } .modal-open .slideout-panel { position:static; } .signIn .content .info ul li { margin-bottom:15px; } header ul li ul li i { opacity: 0.7; margin-left: 9px; } header ul li ul li a:hover { color: #cacaca; } .module.contentDoc h3 { font-weight: 200; font-size: 25px; margin-top: 29px; margin-bottom: 14px; } /* v3.8 */ .module.contentDoc h5 { font-weight: 400; font-size: 17px; margin-top: 20px; margin-bottom: 10px; } .enet-order, a.enet-order:hover { color: #d42a42; } .no-enet-order, a.no-enet-order:hover { color: #333; } .document-icon-right { margin-left:5px; } .document-icon-left { margin-right:5px; } .document-icon-hidden { visibility: hidden; } /* END: v3.8 */ /* v3.9 */ .notificationCheckbox { margin-bottom: .3em; } .notificationCheckbox label, .servicesCheckbox label, .productsCheckbox label { margin-left: .8em; } #wrapCheckAllNotificationTypes, #wrapCheckAllServices, #wrapCheckAllProducts { border-top: 1px solid rgba(0,0,0,.3); margin-bottom: 0; } /* END: v3.9 */ .no-margin-bottom { margin-bottom:0; } .page-item.active .page-link { background-color: #49b5e5; border-color: #49b5e5; } .page-link { color: #49b5e5; } div.dataTables_wrapper div.dataTables_paginate ul.pagination { margin-top:15px; } .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #ba0f2c !important; background: #d51030 !important; color: #fff !important; } .userData .col-6 { /* padding-right:60px; */ } .userData .col-6 p { padding-right:60px; } @media(max-width:1055px) { .artMechLength { right:24px !important; } .actualFav .no { text-align:right !important; right:0; } .actualFav .col-8 { -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%; } } @media(max-width:960px) { .signIn .contentRight { margin-top: 0px !important; } .signIn .content { padding-bottom:0px; } } @media(max-width:880px) { .register .form-group { width:100% !important; } .register .col-9, .register .col-3, .expand-to-100 .col-4 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin-bottom: 1em; } .signIn .register.content button { margin-top:20px; } #accordionFAQs.accordion>.card .card-header, #accordionNews.accordion>.card .card-header { padding: 5px !important; } #accordionFAQs.accordion>.card .card-header h2, #accordionNews.accordion>.card .card-header h2 { padding-right: 21px !important; } #accordionFAQs .card .btn-link, #accordionNews .card .btn-link { font-size: 15px; text-align: left; } .primary .card .far { position: absolute; right: 3px; color: #00a0de; font-size: 20px; top: 8px; } .productImageSmall { width:35px !important; height:35px !important; } .productRight .card h2.oneLine { top: 8px; width: calc(100% - 53px); padding-right: 10px; } .productRight .favourites .tools { padding-bottom:10px; } } #menu ul li ul li a i { margin-left:10px; } @media(max-width:600px) { .modal-body { padding: 40px 20px; } } .articleMechBasketRule { margin-top: 28px; } @media(max-width:933px) { .actualFav .remove { right:-14px; } } @media(max-width:700px) { .actualFav .col-7, .actualFav .col-5, .actualFav .col-6 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .actualFav .col-5.tools { max-width:266px !important; min-width: 266px; } .actualFav .no { text-align:left !important; } .actualFav .col-5.tools .col-3 { display:none; } .actualFav .card .btn-link { padding-left:0; } .favourites.basketItems.actualFav .tools { padding-bottom:13px; } .actualFav .refresh { top: 3px; } .actualFav .card .btn-link { font-size: 15px; } .cartInfo.looking button { display:block; width:100% !important; min-width:0 !important; } } .userOr { font-size: 28px; margin-top: 18px; display: block; } .products .single .content { text-align:center; margin-top: -33px; padding-bottom:30px; color:#333; } .products .single .content .price { color: #D4112F; font-size:18px; } .title.keystoneProducts { margin-bottom: 47px; } .creditsData .fa-long-arrow-up { color:#86bc25; margin-left:5px; } .creditsData .fa-long-arrow-down { color: #D4112F; margin-left:5px; } .creditAmountBlock { background: #00A0DE; color: #fff; font-weight: 200; padding: 17px 15px; font-size: 20px; width: 244px; margin-left:100px; float: right; } .creditAmountBlock strong { font-weight:bold; } .creditAmountBlock span { display:block; font-size:15px; } .creditInfo h3 { font-weight:200; } .creditInfo .content { background: #fff; border: 1px solid #eee; margin-top: 15px; padding: 15px; } .creditInfoRule { margin-top: 50px; margin-bottom: 40px; } @media(max-width:780px) { .creditAmountBlock { float:none; width:100%; margin-left:0; margin-bottom:30px; } .creditInfoRow .col-6 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin-bottom:30px; } } .keystoneNav .single.small a * { display:none; } .keystoneNav .single.small .icon, .keystoneNav .single.small .icon * { display:block; } .contentDoc.documents ul { list-style:none; padding:0; } .contentDoc.documents ul i { margin-right:5px; } .dropdown { display:none; background:#fff; position:absolute; width:100%; left:0; color:#333; -webkit-box-shadow: 0 0 10px #d0d0d0; box-shadow: 0 0 10px #d0d0d0; top: 71px; padding: 30px 73px; transition: none; -webkit-transition: none; -moz-transition: none; -o-transition: none } .dropdown h4 { font-weight: 200; font-size: 28px; } header .wrap { position:relative; } .dropdown ul { position:relative; } .dropdown ul li { display:block; float:none; padding-bottom: 19px; } .dropdown a { color: #333 !important; font-weight: 200; padding:0; } .dropdown a:hover { opacity:0.7; } .dropdown ul li i { opacity:0.5; margin-left:5px; } .dropdown ul li.rule { height: 1px; background: #c7c7c7; width: 100%; padding: 0; margin-bottom: 16px; max-width: 193px; } .keystoneNav .fa-credit-card { display: inline !important; margin-left: 10px; } .subArrow { font-size: 14px; margin-right: 7px; } @media(max-width:700px) { .contentDoc.fullWidth .col-3, .contentDoc.fullWidth .col-9 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contentDoc.fullWidth .col-3 { margin-bottom:30px; } h1 { font-size: 26px; } } #partners { /* background-image:url('../img/partners.png'); */ background-size:cover; background-position:center center; padding:50px; color:#fff; overflow:hidden; } #partners h4 { font-weight: 200; font-size: 34px; } #partners ul { list-style:none; padding:0; margin:0; } #partners ul li { font-weight:200; font-size: 16px; color: #fff; margin-bottom: 12px; cursor:pointer; } #partners ul li:hover { opacity:0.7; } #partners ul li.active { font-weight:bold; } #partners .row { margin-top:150px; } #partners .item { font-weight:200; display:none; } #partners .item.active { display:block; } #partners .item h5 { font-weight: 200; font-size: 23px; margin-bottom: 12px; } #partners .rule { height: 300%; width: 1px; background: #fff; position: absolute; left: 0; right: 0; margin: auto; } table.dataTable thead .sorting::before, table.dataTable thead .sorting::after, table.dataTable thead .sorting_asc::before, table.dataTable thead .sorting_asc::after, table.dataTable thead .sorting_desc::before, table.dataTable thead .sorting_desc::after, table.dataTable thead .sorting_asc_disabled::before, table.dataTable thead .sorting_asc_disabled::after, table.dataTable thead .sorting_desc_disabled::before, table.dataTable thead .sorting_desc_disabled::after { display:none; } table.dataTable thead span.sort-icon { display: inline-block; padding-left: 5px; width: 16px; height: 16px; } table.dataTable thead .sorting span::before, table.dataTable thead .sorting span::after, table.dataTable thead .sorting_asc span::before, table.dataTable thead .sorting_asc span::after, table.dataTable thead .sorting_desc span::before, table.dataTable thead .sorting_desc span::after, table.dataTable thead .sorting_asc_disabled span::before, table.dataTable thead .sorting_asc_disabled span::after, table.dataTable thead .sorting_desc_disabled span::before, table.dataTable thead .sorting_desc_disabled span::after { opacity: 0.3; } table.dataTable thead .sorting_asc span::before, table.dataTable thead .sorting_desc span::after { opacity: 1; } table.dataTable thead .sorting span::before, table.dataTable thead .sorting_asc span::before, table.dataTable thead .sorting_desc span::before, table.dataTable thead .sorting_asc_disabled span::before, table.dataTable thead .sorting_desc_disabled span::before { content: "\2191"; } table.dataTable thead .sorting span::after, table.dataTable thead .sorting_asc span::after, table.dataTable thead .sorting_desc span::after, table.dataTable thead .sorting_asc_disabled span::after, table.dataTable thead .sorting_desc_disabled span::after { content: "\2193"; } @media(max-width:1100px) { #partners .col-3 { -ms-flex: 0 0 33%; flex: 0 0 33%; max-width: 33%; } #partners .col-4 { -ms-flex: 0 0 44.333333%; flex: 0 0 44.333333%; max-width: 44.333333%; } } @media(max-width:870px) { #partners .rule { display:none; } #partners .col-3 { margin-bottom:50px; } #partners .col-3, #partners .col-4 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } h1.accent:before, h2.accent:before, h3.accent:before, h4.accent:before, h5.accent:before { content: ''; height: 1.6rem; display: inline-block; width: .2rem; background-color: #d51130; margin-left: -.95rem; margin-right: .8rem; } .util-h1 { font-size: 40px; font-weight: 200; padding-bottom: 15px; margin-top: 50px; margin-bottom:40px; } .util-h2 { font-size: 32px; font-weight: 200; padding-bottom: 10px; margin-top: 30px; margin-bottom:20px; } .util-text-l { font-size: 18px; font-weight: 200; } .util-title-number { position: relative; width: 50px; display: inline-block; text-align: center; margin-right: 15px; font-weight: 800; } .util-title-number:before { content: ""; display: block; position: absolute; border: 2px solid #d51130; padding: 5px; border-radius: 50%; width: 50px; height: 50px; top: -10px; } @media(max-width:870px) { .util-title-number { width: 40px; margin-right: 5px; font-size: 18px; } .util-title-number:before { width: 35px; height: 35px; top: -7px; left: 2px; } } #registration_submit{ width:fit-content; min-width: 142px; } #formProductOrder { } .products #formProductOrder .favourites [data-toggle="collapse"] { display:inline; margin-left:10px; margin-top:2px; } #formProductOrder .favourites .fa-star { position: relative; right: 11px; } #formProductOrder .productImageSmall { display: inline-block; vertical-align: top; width: 65px; height: 61px; position: relative; border-radius: 50%; border: 1px solid #dfdfdf; padding: 8px; } #formProductOrder .productImageSmall img { position: absolute; max-height: 81%; max-width: 86%; left: 0px; right: 0px; margin: auto; top: 0px; bottom: 0px; z-index: 0; width: auto; border-radius:20px; } #formProductOrder .card h2 { top: 9px; } #formProductOrder .card h2.oneLine { top: 21px; } .products #formProductOrder .favourites .tools { padding-top:16px; } #formProductOrder .favourites .fa-star { color: #efd232; font-size: 23px; cursor: pointer; margin-top: 2px; position: relative; right: 9px; } #formProductOrder .accordion>.card:first-of-type { border: 1px solid rgba(0,0,0,.125); } #formProductOrder .faded { padding: 0; -webkit-filter: grayscale(100%); filter: grayscale(100%); } #formProductOrder .faded img { max-height: 100%; max-width: 100%; border-radius:50%; } .products #formProductOrder .favourites [data-toggle="collapse"] { margin-top:-1px; display:inline-block; margin-left:8px; } #formProductOrder .favourites .no { padding-top:4px; } #formProductOrder h1 #catalog-help {display: inline-block; margin-top:8px;} /** Configurator *****************************************************/ .favourites .fa-tools,.refresh .fa-tools, .favourites .fa-envelope,.refresh .fa-envelope { color: #646363; } #containerAttributeSelection, #containerAttributeFixed { margin-bottom: 0; } #wrapQtyPrice { margin-bottom: 10px; } #wrapQtyPrice .row { margin-bottom: 0; } #wrapFixedValues { margin: 0 0; padding-bottom: 0; } #accordionFixedAttributes .card { margin-bottom: 0; padding-bottom:0; } #wrapFixedValues .fa-chevron-down { color: #00a0de; margin-top: 3px; } #collapseFixedAttributes .col-6:nth-child(even) { padding-left: 22px; } #wrapFixedValues .accordion .card, #wrapFixedValues .accordion .card:first-of-type{ margin: 0; border: 0; } #wrapFixedValues .card-body { padding-left: 0; } #wrapFixedValues .subHead { margin-bottom: 0; font-size: 20px; cursor: pointer; display: block; } #wrapFixedValues .subHead span { display: inline-block; margin-top: 5px; } /* 16.6.2022 */ #wrapFixedValues .subHead i { display: inline-block; top: 2px; margin-left: 10px; position:relative; font-size: 100%; } #wrapFixedValues div { margin-bottom: 0; padding-bottom: 0; } #wrapFixedValues label { font-weight: bold; display:block; margin-bottom: 0; /* width:200px; */ } /* 16.6.2022 */ #accordionArticleInformation .card, #accordionArticleSupplier .card { border: 0; } #accordionArticleInformation #headingArticleInformation a, #accordionArticleSupplier #headingArticleSupplier a { padding-left: 0; border:0; } #accordionArticleInformation #headingArticleInformation i, #accordionArticleSupplier #headingArticleSupplier i { display: inline-block; top: 2px; position:relative; font-size: 100%; padding: 0 10px; } #accordionArticleInformation .card-body, #accordionArticleSupplier .card-body { padding: 0; } .-hasSpecs #accordionArticleInformation .card-body{ display: flex; grid-gap: 12px; font-size: 14px; border-radius: 14px; background: rgba(238, 238, 238, 0.5); padding: 20px; } .-hasSpecs #accordionArticleSupplier .card-body { font-size: 14px; border-radius: 14px; background: rgba(238, 238, 238, 0.5); padding: 20px; } .wrapPDFInfoExternSupplier p { margin-bottom: .4rem; margin-top: 0; } .wrapPDFInfoExternSupplier p:first-of-type { display:inline-block; } .-hasSpecs #accordionArticleInformation .card-body p { flex: 2; } .-hasSpecs #accordionArticleInformation .card-body dl { flex: 2; } .-hasSpecs #accordionArticleInformation .card-body dt { display: inline; } .-hasSpecs #accordionArticleInformation .card-body dd { display: inline; padding-left: 6px; } .-hasSpecs #accordionArticleInformation .card-body dd:after{ display: block; content: ''; } #wrapReopenConfiguration { text-align: right; margin-bottom: .5em; } #wrapReopenConfiguration #linkReopenConfiguration i { margin-right: 10px; font-size: 90%; } #formConfigurationPrice .row { margin-bottom: 1em; } /* 16.6.2022 */ #content-configuration .cb-hidden,#wrapEnquiry .cb-hidden, #wrapRequest .cb-hidden, #contentRequestTask .cb-hidden, #contentConfigurationPrice .cb-hidden, #contentLeadDetailEdit .cb-hidden { display: none; } #content-configuration .tag-error, #contentLeadDetailEdit .tag-error { color:#721c24; font-weight: bold; margin-left: 10px; } #content-configuration .tag-check, #contentLeadDetailEdit .tag-check { max-height: 20px; margin-left: 10px; } #content-configuration .wrapAttributeSelection, #contentLeadDetailEdit .wrapAttributeSelection { margin-bottom: 1.5em; } #contentLeadDetailEdit .wrapAttributeSelection { margin-right: 0; } #content-configuration .fixed-attribute-value { border:1px solid transparent; padding-right:1em; display:inline-block; } #content-configuration div.attributeError, #contentLeadDetailEdit div.attributeError { border: 1px solid #D4112F; } #content-configuration .attributeError, #contentLeadDetailEdit .attributeError, #formOpenings .attributeError { border-color: #D4112F; } #content-configuration .wrapAttributeSelection label, #contentLeadDetailEdit .wrapAttributeSelection label { display:block; padding: 0 .1em; font-weight:bold; margin-bottom: .3rem; } #content-configuration .wrapAttributeSelection label.input-label,#contentLeadDetailEdit .wrapAttributeSelection label.input-label { display:inline-block; font-weight:normal; } #content-configuration .wrapAttributeSelection .form-control { max-width: 400px; } #content-configuration .wrapAttributeSelection select { } #content-configuration .wrapAttributeSelection textarea, #contentLeadDetailEdit .wrapAttributeSelection textarea { height: 150px; } .primary .card .far.fa-shopping-cart, .primary .card .far.fa-long-arrow-right { position: relative; right: 0px; color: white; font-size: 17px; top: 2px; } .modal .module.form .row.iCON-row { margin-bottom: 0; } .card .btn-link.iCON-collapse { width: 100%; } #wrapQtyPrice { margin-bottom:0; } #wrapQtyPrice label { display:block; } #wrapQtyPrice p { padding-top: .5em; } #wrapOfferNoInBasket { margin: 1em 0 0; } /** END: Configurator *****************************************************/ /** Request *****************************************************/ #formRequest .label-checkbox { display: inline-block; margin-right: 2em; } #formRequest input[type=checkbox] { margin-right: .5em; } /** END: Request *****************************************************/ .module.form .input-manual-discount,.input-manual-discount { width:3.5em; text-align:right; display:inline-block; line-height:1; height:auto; margin-left: .2em; padding:.2rem .5rem; } .attributeTitle { white-space: nowrap !important; display: inline-block !important; margin-right: .5em !important; } .form-control--quantity { position: relative; display: block; } .form-control--quantity input[type=number] { padding: .375rem 30px; border-radius: 20px; text-align: center; } .form-control--quantity input[type=number]::-webkit-inner-spin-button, .form-control--quantity input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .form-control--quantity > i { color: #49b5e5; font-size: 32px; font-style: normal; width: 38px; height: calc(100% - 2px); background: white; position: absolute; left: 1px; top: 1px; cursor: pointer; line-height: 27px; user-select: none; /* standard syntax */ -webkit-user-select: none; /* webkit (safari, chrome) browsers */ -moz-user-select: none; /* mozilla browsers */ -khtml-user-select: none; /* webkit (konqueror) browsers */ -ms-user-select: none; /* IE10+ */ font-weight: 400; border-radius: 20px 0 0 20px; z-index:2; } .form-control--quantity > i:hover { font-weight: 600; } .form-control--quantity > i:last-child { left: auto; right: 1px; line-height: 30px; font-size: 22px; border-radius: 0 20px 20px 0; } .form-control--quantity > i::-moz-selection, .form-control--quantity > i::selection { background-color: transparent !important; } .products__list { margin: 40px 0; } .products__list-item { background-color: #E6E6E6; margin-top: 40px; padding: 120px 0 0 0; position: relative; } .products__list-item a { color: black; } .products__list-item a:hover .products__list-item-title{ color: rgba(0,0,0,0.4); } .products__list-item a:hover .products__list-item-image img{ transform: translate(-50%, -50%) scale(1.1); } .products__list-item-image { border-radius: 50%; background: white; box-shadow: 0 0 5px 5px rgba(0,0,0,.08); width: 150px; height: 150px; position: absolute; top: -30px; left: calc(50% - 75px); overflow: hidden; } .products__list-item-image img{ transition: transform 250ms; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-height: 140px; max-width: 140px; } .products__list-item-image.is-placeholder img{ min-height: 150px; min-width: 150px; } .products__list-item-title { text-align: center; padding: 12px 6px; font-weight: 300; font-size: 24px; line-height: 28px; color: black; } .products__list-item-submenu { background-color: #EEEEEE; list-style: none; padding: 0 20px; font-weight: 300; } .products__list-item-submenu li { margin: 6px 0; display: inline-block; width: 100%; } .products__list-item-submenu li:first-child { margin-top: 20px; } .products__list-item-submenu li:last-child { margin-bottom: 20px; } .products__list-item-submenu li a { transition: color 300ms; color: black; } .products__list-item-submenu li a i { margin-right: 8px; } .products__list-item-submenu li a:hover { color: rgba(0,0,0,0.6); } .search-form { position: relative; } .search-form .form-control { padding: 12px 60px 10px 16px; height: auto; margin: 10px 0 20px 0; } .search-form .form-control::placeholder { color: rgba(0,0,0,0.3); } .search-form > i { position: absolute; top: calc(50% - 9px); right: 20px; font-size: 18px; cursor: pointer; color: rgba(0,0,0,0.3); transition: color 0.3s; } .search-form > i:hover { color: rgba(0,0,0,1); } body.is-scroll-hidden { overflow-y: hidden; } body.is-dimmed::after { content: ""; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 12000; background: rgba(0,0,0,0.7); } .article-filter { } .article-filter__bottom { display: none; } .article-filter__btn { /* transition: all 0.25s; font-size: 16px; color: black; width: 100%; display: block; display: flex; justify-content: space-between; align-items: center; border: 1px solid rgba(0,0,0,.125); border-radius: 30px; padding: 10px 24px 10px 30px; margin: 10px 0 30px 0; */ } .article-filter__btn:hover { /* border-color: rgba(0,0,0,.6); color: black; */ } .article-filter__btn > i { /* font-size: 1.5rem; font-weight: 300; */ } .article-filter__btn--clear { display: none; } .article-filter__btn--clear.is-visible { display: flex; } .article-filter__btn--close { display: none; position: absolute; top: 0; right: 0; background: black; color: white; padding: 12px; border: none; margin: 0; border-radius: 0; width: 60px; height: 60px; align-items: center; justify-content: center; font-size: 3.5rem; } .article-filter__btn--close:hover { background: rgba(0,0,0,0.6); color: white; } .article-filter__btn--close > i{ font-size: 26px; margin: 0 !important; } .article-filter__bottom { position: fixed; bottom: 0; left: 0; width: 100%; background: white; padding: 0 30px 20px 30px; } .article-filter__bottom > button{ width: 100% !important; margin: 0 !important; cursor: pointer; } .article-filter__btn--open { font-size: 20px; font-weight: 800; color: rgba(0,0,0,1); display: flex; align-items: center; } .article-filter__btn-count { width: 22px; height: 22px; margin-left: 6px; border-radius: 50%; background: black; color: white; font-size: 12px; display: flex; align-items: center; justify-content: center; pointer-events: none; } .article-filter__btn-count.is-hidden { display: none; } @media(max-width:767px) { .article-filter.is-shown { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: white; z-index: 9000; margin: 0; border-radius: 0; border: none; padding: 90px 30px 70px 30px; } .article-filter.is-shown .article-filter__bottom { display: block; } .article-filter.is-shown .article-filter__btn--close { display: flex; } .article-filter.is-shown .article-filter__btn--open { font-size: 32px; font-weight: 300; line-height: 60px; position: absolute; left: 30px; top: 0; width: calc(100% - 90px); } .article-filter.is-shown .article-filter__btn-count { display: none; } } @media(min-width:768px) { .article-filter { border: none; padding: 0; } .article-filter__btn--open { font-size: 16px; font-weight: 400; color: rgba(0,0,0,0.5); pointer-events: none; display: none; } .article-filter__btn-count { display: none; } } .article-filter__items { max-height: 0; overflow: hidden; } .article-filter.is-shown .article-filter__items { max-height: 1000px; } @media(max-width:767px) { .article-filter.is-shown .article-filter__items { overflow-y: auto; height: calc(100% - 80px); scrollbar-width: thin; scrollbar-color: rgb(220, 220, 220) rgb(240, 240, 240) ; } .article-filter.is-shown .article-filter__items::-webkit-scrollbar { width: 8px; border-radius: 20px; } .article-filter.is-shown .article-filter__items::-webkit-scrollbar-thumb { transition: all 350ms; background-color: rgb(220, 220, 220) ; border-radius: 20px; border: 3px solid rgb(220, 220, 220) ; } .article-filter.is-shown .article-filter__items:hover::-webkit-scrollbar-thumb { background-color: rgb(180, 180, 180); border-color: rgb(180, 180, 180); } } @media(min-width:768px) { .article-filter__items { max-height: none; overflow: visible; display: flex; flex-wrap: wrap; } .article-filter.is-shown .article-filter__items { max-height: none; } } .article-filter__item { margin: 20px 10px 30px 0; position: relative; } @media(min-width:768px) { .article-filter__item { margin: 0px 0 0 0; position: relative; } } .article-filter__item.is-hidden { display: none; } .article-filter__item-btn { transition: all 200ms; padding: 6px 40px 6px 0px; cursor: pointer; position: relative; display: flex; border-bottom: 1px solid rgba(0,0,0,0.2); } @media(min-width:768px) { .article-filter__item-btn { margin: 0px 25px 0 0; padding: 10px 38px 10px 0; /* min-width: 120px; */ border-radius: 0; /* border: 1px solid rgba(0,0,0,0.4); */ border: none; color: rgba(0,0,0,1); } .article-filter__item-btn:hover { transition: all 0.3s; color: rgba(0,0,0,0.5); } .article-filter__item-btn:hover, .article-filter__item.is-open .article-filter__item-btn, .article-filter__item.is-active .article-filter__item-btn { border-color: rgba(0,0,0,1); /* box-shadow: 0 0 0px 1px rgba(0,0,0,1); -webkit-box-shadow: 0 0 0px 1px rgba(0,0,0,1); -moz-box-shadow: 0 0 0px 1px rgba(0,0,0,1); */ } .article-filter__item.is-open .article-filter__item-btn, .article-filter__item.is-active .article-filter__item-btn { /* background: black; color: white; */ } } .article-filter__item-btn:after { transition: all 200ms; content: ""; position: absolute; right: 4px; top: 0; background-size: 100%; width: 30px; height: 30px; top: calc(50% - 15px); background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGlkPSJMYXllcl8xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2NCA2NDsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY0IDY0IiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiMwMDA7fQo8L3N0eWxlPjxnPjxnIGlkPSJJY29uLUNoZXZyb24tTGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjM3LjAwMDAwMCwgMzM1LjAwMDAwMCkiPjxwb2x5bGluZSBjbGFzcz0ic3QwIiBpZD0iRmlsbC0zNSIgcG9pbnRzPSItMjE4LjcsLTMwOC42IC0yMTYuNywtMzEwLjYgLTIwNSwtMjk4LjggLTE5My4zLC0zMTAuNiAtMTkxLjMsLTMwOC42IC0yMDUsLTI5NC45ICAgICAgLTIxOC43LC0zMDguNiAgICAiLz48L2c+PC9nPjwvc3ZnPg=="); transform: rotate(0); /* background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGlkPSJMYXllcl8xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2NCA2NDsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY0IDY0IiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNmZmY7fQo8L3N0eWxlPjxnPjxnIGlkPSJJY29uLUNoZXZyb24tTGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjM3LjAwMDAwMCwgMzM1LjAwMDAwMCkiPjxwb2x5bGluZSBjbGFzcz0ic3QwIiBpZD0iRmlsbC0zNSIgcG9pbnRzPSItMjE4LjcsLTMwOC42IC0yMTYuNywtMzEwLjYgLTIwNSwtMjk4LjggLTE5My4zLC0zMTAuNiAtMTkxLjMsLTMwOC42IC0yMDUsLTI5NC45ICAgICAgLTIxOC43LC0zMDguNiAgICAiLz48L2c+PC9nPjwvc3ZnPg=="); */ } .is-open .article-filter__item-btn:after { transition: all 200ms; transform: rotate(180deg); } @media(min-width:768px) { .is-open .article-filter__item-btn { color: #db344d; } .is-open .article-filter__item-btn:after { /* background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGlkPSJMYXllcl8xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2NCA2NDsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY0IDY0IiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNmZmY7fQo8L3N0eWxlPjxnPjxnIGlkPSJJY29uLUNoZXZyb24tTGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjM3LjAwMDAwMCwgMzM1LjAwMDAwMCkiPjxwb2x5bGluZSBjbGFzcz0ic3QwIiBpZD0iRmlsbC0zNSIgcG9pbnRzPSItMjE4LjcsLTMwOC42IC0yMTYuNywtMzEwLjYgLTIwNSwtMjk4LjggLTE5My4zLC0zMTAuNiAtMTkxLjMsLTMwOC42IC0yMDUsLTI5NC45ICAgICAgLTIxOC43LC0zMDguNiAgICAiLz48L2c+PC9nPjwvc3ZnPg=="); */ background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGlkPSJMYXllcl8xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2NCA2NDsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY0IDY0IiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNkYjM0NGQ7fQo8L3N0eWxlPjxnPjxnIGlkPSJJY29uLUNoZXZyb24tTGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjM3LjAwMDAwMCwgMzM1LjAwMDAwMCkiPjxwb2x5bGluZSBjbGFzcz0ic3QwIiBpZD0iRmlsbC0zNSIgcG9pbnRzPSItMjE4LjcsLTMwOC42IC0yMTYuNywtMzEwLjYgLTIwNSwtMjk4LjggLTE5My4zLC0zMTAuNiAtMTkxLjMsLTMwOC42IC0yMDUsLTI5NC45ICAgICAgLTIxOC43LC0zMDguNiAgICAiLz48L2c+PC9nPjwvc3ZnPg==") } } .article-filter__item-btn--all:after { width: 30px; height: 20px; top: calc(50% - 11px); right: 8px; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDEyOCAxMjgiIGhlaWdodD0iMTI4cHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMjggMTI4IiB3aWR0aD0iMTI4cHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwYXRoIGQ9Ik02MS44OTQsNjYuMDU2SDE2LjE4NWMtMS4xMDQsMC0yLTAuODk2LTItMnMwLjg5Ni0yLDItMmg0NS43MDljMS4xMDQsMCwyLDAuODk2LDIsMlM2Mi45OTgsNjYuMDU2LDYxLjg5NCw2Ni4wNTZ6Ii8+PHBhdGggZD0iTTExMS45MDcsNjYuMDU2SDg3LjY1NWMtMS4xMDQsMC0yLTAuODk2LTItMnMwLjg5Ni0yLDItMmgyNC4yNTJjMS4xMDQsMCwyLDAuODk2LDIsMlMxMTMuMDEyLDY2LjA1NiwxMTEuOTA3LDY2LjA1NnoiLz48cGF0aCBkPSJNNDguNTAzLDk2LjYwOUgxNi4xODVjLTEuMTA0LDAtMi0wLjg5Ni0yLTJzMC44OTYtMiwyLTJoMzIuMzE4YzEuMTA0LDAsMiwwLjg5NiwyLDJTNDkuNjA3LDk2LjYwOSw0OC41MDMsOTYuNjA5eiIvPjxwYXRoIGQ9Ik0xMTEuOTA3LDk2LjYwOUg3NC43NzRjLTEuMTA0LDAtMi0wLjg5Ni0yLTJzMC44OTYtMiwyLTJoMzcuMTMzYzEuMTA0LDAsMiwwLjg5NiwyLDJTMTEzLjAxMiw5Ni42MDksMTExLjkwNyw5Ni42MDl6Ii8+PHBhdGggZD0iTTM1LjAxMywzNS41MDJIMTYuMTg1Yy0xLjEwNCwwLTItMC44OTYtMi0yczAuODk2LTIsMi0yaDE4LjgyOGMxLjEwNCwwLDIsMC44OTYsMiwyUzM2LjExNywzNS41MDIsMzUuMDEzLDM1LjUwMnoiLz48cGF0aCBkPSJNMTExLjkwNywzNS41MDJINjAuNzc2Yy0xLjEwNCwwLTItMC44OTYtMi0yczAuODk2LTIsMi0yaDUxLjEzMWMxLjEwNCwwLDIsMC44OTYsMiwyUzExMy4wMTIsMzUuNTAyLDExMS45MDcsMzUuNTAyeiIvPjxwYXRoIGQ9Ik00Mi42MTYsNDMuMTA0Yy01LjI5NSwwLTkuNjA0LTQuMzA5LTkuNjA0LTkuNjA0YzAtNS4yOTUsNC4zMDktOS42MDMsOS42MDQtOS42MDNzOS42MDQsNC4zMDgsOS42MDQsOS42MDMgIEM1Mi4yMiwzOC43OTYsNDcuOTExLDQzLjEwNCw0Mi42MTYsNDMuMTA0eiBNNDIuNjE2LDI3Ljg5N2MtMy4wOSwwLTUuNjA0LDIuNTE0LTUuNjA0LDUuNjAzYzAsMy4wOSwyLjUxNCw1LjYwNCw1LjYwNCw1LjYwNCAgUzQ4LjIyLDM2LjU5LDQ4LjIyLDMzLjVDNDguMjIsMzAuNDExLDQ1LjcwNiwyNy44OTcsNDIuNjE2LDI3Ljg5N3oiLz48cGF0aCBkPSJNNTYuMTA2LDEwNC4yMTVjLTUuMjk1LDAtOS42MDQtNC4zMDktOS42MDQtOS42MDVjMC01LjI5NSw0LjMwOS05LjYwNCw5LjYwNC05LjYwNGM1LjI5NywwLDkuNjA1LDQuMzA5LDkuNjA1LDkuNjA0ICBDNjUuNzEyLDk5LjkwNiw2MS40MDMsMTA0LjIxNSw1Ni4xMDYsMTA0LjIxNXogTTU2LjEwNiw4OS4wMDZjLTMuMDksMC01LjYwNCwyLjUxNC01LjYwNCw1LjYwNGMwLDMuMDkyLDIuNTE0LDUuNjA1LDUuNjA0LDUuNjA1ICBjMy4wOTEsMCw1LjYwNS0yLjUxNCw1LjYwNS01LjYwNUM2MS43MTIsOTEuNTIsNTkuMTk3LDg5LjAwNiw1Ni4xMDYsODkuMDA2eiIvPjxwYXRoIGQ9Ik02OS41MDEsNzMuNjYxYy01LjI5OCwwLTkuNjA3LTQuMzEtOS42MDctOS42MDVjMC01LjI5NSw0LjMxLTkuNjA0LDkuNjA3LTkuNjA0YzUuMjk0LDAsOS42MDIsNC4zMDgsOS42MDIsOS42MDQgIEM3OS4xMDMsNjkuMzUyLDc0Ljc5NSw3My42NjEsNjkuNTAxLDczLjY2MXogTTY5LjUwMSw1OC40NTJjLTMuMDkyLDAtNS42MDcsMi41MTQtNS42MDcsNS42MDRjMCwzLjA5MSwyLjUxNiw1LjYwNSw1LjYwNyw1LjYwNSAgYzMuMDg5LDAsNS42MDItMi41MTUsNS42MDItNS42MDVDNzUuMTAzLDYwLjk2Niw3Mi41OSw1OC40NTIsNjkuNTAxLDU4LjQ1MnoiLz48L3N2Zz4="); } .article-filter__item-btn--clear { background: rgba(0,0,0,1); color: white; background: #636363; color: #fff; display: none; padding: 4px 10px; position: fixed; top: 65px; left: 30px; border-radius: 26px; } .is-shown .article-filter__item-btn--clear.is-visible { display: block; } @media(min-width:768px) { .article-filter__item-btn--clear { /* padding: 10px 40px 10px 16px; */ position: relative; top: 0; left: 0; border-color: rgba(0,0,0,1); /* box-shadow: 0 0 0px 1px rgb(0 0 0); -webkit-box-shadow: 0 0 0px 1px rgb(0 0 0); -moz-box-shadow: 0 0 0px 1px rgba(0,0,0,1); */ padding: 5px 40px 5px 16px; margin: 5px 0; } .article-filter__item-btn--clear.is-visible { display: block; } .article-filter__item-btn--clear:hover { color: white; background: #000; } .article-filter__item-btn--clear:after { width: 15px; height: 15px; top: calc(50% - 7px); right: 10px; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMyIDMyIiBoZWlnaHQ9IjMycHgiIGlkPSLQodC70L7QuV8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMycHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwYXRoIGQ9Ik0xNy40NTksMTYuMDE0bDguMjM5LTguMTk0YzAuMzk1LTAuMzkxLDAuMzk1LTEuMDI0LDAtMS40MTRjLTAuMzk0LTAuMzkxLTEuMDM0LTAuMzkxLTEuNDI4LDAgIGwtOC4yMzIsOC4xODdMNy43Myw2LjI4NGMtMC4zOTQtMC4zOTUtMS4wMzQtMC4zOTUtMS40MjgsMGMtMC4zOTQsMC4zOTYtMC4zOTQsMS4wMzcsMCwxLjQzMmw4LjMwMiw4LjMwM2wtOC4zMzIsOC4yODYgIGMtMC4zOTQsMC4zOTEtMC4zOTQsMS4wMjQsMCwxLjQxNGMwLjM5NCwwLjM5MSwxLjAzNCwwLjM5MSwxLjQyOCwwbDguMzI1LTguMjc5bDguMjc1LDguMjc2YzAuMzk0LDAuMzk1LDEuMDM0LDAuMzk1LDEuNDI4LDAgIGMwLjM5NC0wLjM5NiwwLjM5NC0xLjAzNywwLTEuNDMyTDE3LjQ1OSwxNi4wMTR6IiBmaWxsPSIjZmZmZmZmIiBpZD0iQ2xvc2UiLz48Zy8+PGcvPjxnLz48Zy8+PGcvPjxnLz48L3N2Zz4="); } } .article-loadmore { display: flex; width: 100%; justify-content: center; padding: 20px 0; border-top: 1px solid rgba(0,0,0,.125); } .article-loadmore-btn { transition: all 200ms; cursor: pointer; background: rgba(0,0,0,1); color: white; background: #636363; color: #fff; padding: 6px 20px; border-radius: 26px; } .article-loadmore-btn:hover { color: white; background: #000; } .article-filter__item-btn-title { font-size: 16px; font-weight: 300; margin: 0; pointer-events: none; } @media(min-width:768px) { .article-filter__item-btn-title { font-weight: 400; } } .article-filter__item-btn-count { transition: all 0.3s; margin-left: 8px; background: transparent; color: black; font-size: 16px; display: flex; align-items: center; justify-content: center; pointer-events: none; font-weight: 300; } .article-filter__item-btn-count > span{ display: none; } @media(min-width:768px) { .article-filter__item-btn-count { font-weight: 400; } .article-filter__item-btn-count > span{ display: inline; } .is-open .article-filter__item-btn-count { color: #db344d; } } .article-filter__item-btn-count.is-hidden { display: none; } .article-filter__item-values { transition: all 0.4s cubic-bezier(0, 1, 0, 1); overflow: hidden; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgb(220, 220, 220) rgb(240, 240, 240) ; max-height: 0; overflow: hidden; } @media(min-width:768px) { .article-filter__item-values { position: absolute; top: 45px; left: -1px; min-width: 200px; background: white; box-shadow: 5px 5px 10px 0px rgb(0 0 0 / 20%); z-index: 10; overflow-y: auto; } } .is-open .article-filter__item-values { transition: all 0.4s ease-in-out; max-height: 1000px; } .article-filter__item-values:hover { scrollbar-color: rgb(180, 180, 180) rgb(240, 240, 240) ; } .article-filter__item-values::-webkit-scrollbar { width: 8px; border-radius: 20px; } .article-filter__item-values::-webkit-scrollbar-track { background: rgb(240, 240, 240); } .article-filter__item-values::-webkit-scrollbar-thumb { transition: all 350ms; background-color: rgb(220, 220, 220) ; border-radius: 20px; border: 3px solid rgb(220, 220, 220) ; } .article-filter__item-values:hover::-webkit-scrollbar-thumb { background-color: rgb(180, 180, 180); border-color: rgb(180, 180, 180); } .article-filter__item-value { display: block; position: relative; margin: 15px 10px; cursor: pointer; /* display: flex; align-items: center; */ padding: 0 0 0 28px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: 16px; line-height: 18px; } .article-filter__item-value input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .article-filter__item-value > span { position: absolute; top: 0; left: 0; height: 18px; width: 18px; border: 1px solid #C8C8C8; border-radius: 4px; } .article-filter__item-value:hover input ~ span { border-color: rgba(0,0,0,1); } .article-filter__item-value input:checked ~ span { border-color: rgba(0,0,0,1); background-color: rgba(0,0,0,1); } .article-filter__item-value > span:after { content: ""; position: absolute; display: none; } .article-filter__item-value input:checked ~ span:after { display: block; } .article-filter__item-value span:after { left: 5px; top: 1px; width: 6px; height: 11px; border: solid rgba(255,255,255,1); border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .article-filter__item-value.is-inactive { pointer-events: none; color: #ccc; } .article-filter__item-value.is-inactive > span { border: 1px solid rgb(228, 228, 228); } .article-filter__overlay { transition: 300ms ease all; width: 400px; background: white; position: fixed; height: 100%; top: 0; right: 0; z-index: 25000; -webkit-transform: translateX(400px); transform: translateX(400px); -webkit-transform: translateX(400px) tranlateZ(0); transform: translateX(400px) tranlateZ(0); -webkit-transform: translate3d(400px, 0, 0); transform: translate3d(400px, 0, 0); padding: 90px 0 0 0; } .article-filter__overlay.is-shown { -webkit-transform: translateX(0); transform: translateX(0); -webkit-transform: translateX(0) translateZ(0); transform: translateX(0) translateZ(0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .article-filter__overlay.is-shown::after { content: ""; position: fixed; width: 100vw; height: 100%; top: 0; right: 400px; z-index: 12000; background: rgba(0,0,0,0.7); } .article-filter__overlay-close { display: flex; position: absolute; top: 0; right: 0; background: black; color: white; padding: 12px; border: none; margin: 0; border-radius: 0; width: 60px; height: 60px; align-items: center; justify-content: center; font-size: 3.5rem; cursor: pointer; } .article-filter__overlay-close:hover { background: rgba(0,0,0,0.6); color: white; } .article-filter__overlay-close > i{ font-size: 26px; margin: 0 !important; } .article-filter__overlay-title { position: absolute; top: 20px; left: 30px; font-size: 22px; font-weight: 600; } .article-filter__overlay .article-filter__bottom { display: block; z-index: 20; } .article-filter__overlay-items { padding: 0 30px 100px 30px; overflow: auto; height: 100%; } .article-filter__overlay-items::-webkit-scrollbar { width: 8px; border-radius: 20px; } .article-filter__overlay-items::-webkit-scrollbar-track { background: rgb(240, 240, 240); } .article-filter__overlay-items::-webkit-scrollbar-thumb { transition: all 350ms; background-color: rgb(220, 220, 220) ; border-radius: 20px; border: 3px solid rgb(220, 220, 220) ; } .article-filter__overlay-items:hover::-webkit-scrollbar-thumb { background-color: rgb(180, 180, 180); border-color: rgb(180, 180, 180); } .article-filter__overlay-items .article-filter__overlay-items-inner { } .article-filter__overlay-items .article-filter__item { display: block; } .article-filter__overlay-items .article-filter__item-btn { margin: 0; } .article-filter__overlay-items .article-filter__item-btn-title { } .article-filter__overlay-items .article-filter__item-btn-count { } .article-filter__overlay-items .article-filter__item-values { position: relative; top: auto; left: auto; min-width: none; background: white; box-shadow: none; z-index: 10; overflow-y: auto; } .article-filter__overlay-items .article-filter__item-value { } .article-filter__overlay-items .article-filter__item-btn--all { display: none; } .article-filter__overlay-items .article-filter__item-btn--clear.is-visible { margin-top: 40px; display: inline-block; } .eggTimer.is-loading{ position:fixed; z-index: 8999; height:100vh; padding:0px; top:0px; width:100%; } .is-loading { } .is-loading::after { background: rgba(0,0,0,.30); position: absolute; top: 0; left: 0; width: 100%; height:100%; content: ""; z-index: 100; } .is-loading::before { border-radius: 50%; width: 100px; height: 100px; content: ""; z-index: 11000; position: absolute; top: calc(40% - 50px); left: calc(50% - 50px); font-size: 10px; text-indent: -9999em; border-top: 1.1em solid rgba(255, 255, 255, 0.7); border-right: 1.1em solid rgba(255, 255, 255, 0.7); border-bottom: 1.1em solid rgba(255, 255, 255, 0.7); border-left: 1.1em solid rgb(104, 104, 104); -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-animation: load8 1.1s infinite linear; animation: load8 1.1s infinite linear; } @-webkit-keyframes load8 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes load8 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .article-list { margin: 6px -5px 0 -5px; display: flex; flex-wrap: wrap; } @media(min-width:480px) { .article-list { margin: 6px -15px 0 -15px; } } @media(min-width:768px) { .article-list { display: block; margin: 6px 0 0 0; } } .article-list__count { margin: 0; font-weight: 300; font-size: 16px; } @media(min-width:768px) { .article-list__count { font-size: 18px; } } .article-list__title { font-weight: 300; font-size: 42px; margin: 0; } .article-list__item { margin: 0 0 10px 0; border: 1px solid rgba(0,0,0,.125); /* border-bottom: none; */ margin: 0 5px 10px 5px; display: flex; flex-direction: column; align-items: center; width: 100%; } .article-list__item:last-child { border-bottom: 1px solid rgba(0,0,0,.125); } .basket-article-list__item { margin: 0 0 10px 0; border: 1px solid rgba(0,0,0,.125); /* border-bottom: none; */ margin: 0 5px 10px 5px; display: flex; flex-direction: column; align-items: center; width: 100%; border: 1px solid rgba(0,0,0,.125); /* border-bottom: none; */ margin: 0; padding: 10px 20px 10px 10px; } .article-list__item-image { padding: 0 24px 0 0; cursor: pointer; display: flex; align-items: center; } #articleTypeFL .article-list__item-image, #articleTypeFL .article-list__item-actions { align-items: flex-start; } #articleTypeFL .article-list__item-actions { margin-top: .5em; } .article-list__item-image-inner { /* border-radius: 50%; */ /* border: 1px solid #cfcfcf; */ width: 120px; height: 120px; overflow: hidden; position: relative; } .article-list__item-image-inner img { transition: transform 250ms; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-height: 120px; max-width: 120px; } .article-list__item-image.is-placeholder img { max-height: 70px; max-width: 70px; border-radius: 50%; -webkit-filter: grayscale(100%); filter: grayscale(100%); } .article-list__item-image.is-placeholder{ pointer-events: none; } .article-list__item-title { font-size: 20px; font-weight: 300; margin: 0; /* max-width: 94%; */ } .article-list__item-article_information { font-size: 16px; font-weight: 300; margin: 4px 0; } .article-list__item-article_information.-hasSpecs { } .article-list__item-article_information.-hasSpecs .article-list__item-article_information-accordion { display: block !important; } .article-list__item-article_information.-hasSpecs .article-list__item-article_information-content { display: none !important; } .article-list__item-article_supplier { margin: 10px 0 4px 0; font-size: 14px; font-weight: 300; } .article-list__item-article_supplier .article-list__item-article_supplier-content { display: block !important; } .article-list__item-article_supplier .card .btn-link { font-size: 14px; } .article-list__item-article_nr { font-size: 14px; margin: 0 10px 0 0; color: #49b5e5; display: inline-block; cursor: pointer; } .article-list__item-article_nr > input { position:absolute; opacity:0; left:-999999px; } .article-list__item-more { transition: color .3s linear; font-size: 14px; margin: 0; display: inline-block; color: #646363; cursor: pointer; position: relative; } .article-list__item-more:after { content: ""; position: absolute; width: 100%; height: 16px; bottom: -16px; left: 0; } .article-list__item-more:hover { color: black; } .article-list__item-pdf { font-size: 14px; margin: 0 10px 0 0; display: inline-block; color: #d61e37; } .article-list__item-content { display: flex; flex-direction: column; width: 100%; padding: 10px 10px; height: 100%; } .article-list__item-content-inner { display: flex; flex-direction: column; justify-content: space-between; margin:0; height: 100%; } .is-show-more .article-list__item-content-inner { height: auto; } @media(min-width:480px) { .article-list__item { width: 50%; width: calc(50% - 10px); margin: 0 5px 10px 5px; } .basket .article-list__item { width: 100%; margin: 0; } } @media(min-width:768px) { .article-list__item { flex-direction: row; align-items: initial; width: 100%; border-bottom: none; margin: 0; padding: 10px 20px 10px 10px; } .article-list__item-content { padding: 15px 0; justify-content: center; height: auto; } .article-list__item-content-inner { flex-direction: row; height: auto; } } @media(min-width:768px) { .article-list__item-content-inner-left { max-width: 80%; } } .article-list__item-actions { display: flex; align-items: center; justify-content: space-between; margin: 20px 0 0 0; flex-wrap: wrap; } @media(min-width:480px) { .article-list__item-actions { margin: 20px 0 0 0; } } @media(min-width:768px) { .article-list__item-actions { justify-content: flex-end; margin: 0; padding: 0 0 0 40px; flex-wrap: nowrap; } } .article-list__item-actions-length { width: 100%; } @media(min-width:768px) { .article-list__item-actions-length { padding-right: 40px; width: auto; } } .article-list__item-actions-inner { display: flex; align-items: center; justify-content: flex-end; gap: 6px 18px; } @media(min-width:768px) { .article-list__item-actions-inner { justify-content: inherit; gap: inherit; } } .article-list__item-description { transition: all 0.4s cubic-bezier(0, 1, 0, 1); max-height: 0; overflow: hidden; } .article-list__item-description-inner { font-size: 14px; margin: 20px 0 0 0; border-radius: 14px; background: rgba(238, 238, 238, 0.5); padding: 20px; display: flex; grid-gap: 12px; } .article-list__item-description-inner p { flex: 2; } .article-list__item-description.-hasSpecs dl { flex: 3; columns: 2; } .article-list__item-description.-hasSpecs.-oneRowSpecs dl { flex: 2; columns: 1; } .article-list__item-description.-hasSpecs dt { display: inline; } .article-list__item-description.-hasSpecs dd { display: inline; padding-left: 6px; } .article-list__item-description.-hasSpecs dd:after{ display: block; content: ''; } .article-list__item-description p { margin: 0; } .article-list__item.is-show-more .article-list__item-description{ transition: all 0.4s ease-in-out; max-height: 1000px; } .article-list__item.is-show-more .article-list__item-more i { transform: rotate(180deg); } .article-list__item-quantity { width: 100px; margin: 0 12px; text-align: center; } .article-list__item-price { font-weight: 600; white-space: nowrap; min-width:75px; } @media(min-width:768px) { .article-list__item-price { min-width: 80px; text-align: right; } } .article-list__item-netprice { font-weight: 600; min-width:75px; white-space: nowrap; padding-left:5px; text-align: right; font-size: 18px; } @media(min-width:768px) { .article-list__item-netprice { font-size: 15px; } } .article-list__item-icon { cursor: pointer; } .article-list__item-icon-wrapper { display: flex; width: 100%; justify-content: flex-end; gap: 16px 20px; margin: 16px 0; padding: 0 32px 0 0; align-items: center; } @media(min-width:768px) { .article-list__item-icon-wrapper { justify-content: flex-start; gap: inherit; padding: 0; margin: 0; } } .article-list__item-icon i { transition: all 0.25s; color: #49b5e5; font-size: 20px; font-weight: 400; margin-left:10px; } #formHomeFavorites .article-list__item-icon i { color: #a5a5a5; font-size: 21px; } #formHomeFavorites .article-list__item-icon i.fa-shopping-cart { color: #d4112f; } .article-list__item-icon:hover i, .article-list__item-article_nr:hover, .article-list__item-configure > a > i { color: #1d95c9; } .article-list__item-icon.is-active i { color: #FDC300; font-weight: 900; } .article-list__item-icon.request-is-disabled i, .article-list__item-icon.request-is-disabled:hover i { opacity: 50%; } .article-list__item-icon.request-is-disabled, .article-list__item-icon.request-is-disabled a { cursor: default; display: inline-block; /* For IE11/ MS Edge bug */ text-decoration: none; } .article-list__item-configure > a { white-space: nowrap; margin-right: 16px; display: flex; align-items: center; } .article-list__item-configure > a > span { color: black; font-weight: 400; padding: 0 4px; } .article-list__item-configure > a > i { color: #49b5e5; font-size: 20px; font-weight: 400; } .article-list__item-enquire > a { transition: all 250ms; white-space: nowrap; margin-right: 16px; display: flex; align-items: center; } .article-list__item-enquire > a > span { color: #a5a5a5; font-weight: 400; padding: 0 4px; } .article-list__item-enquire > a > i { color: #a5a5a5; font-size: 26px; font-weight: 400; } .article-list__item-enquire > a:hover > i { color: #49b5e5; } .article-list__item-fav { cursor: pointer; } .article-list__item-fav i { transition: all 0.25s; color: #a5a5a5; font-size: 20px; font-weight: 400; } .article-list__item-fav:hover i { color: #FDC300; } .article-list__item-fav.is-active i { color: #FDC300; font-weight: 900; } .article-list__item-discount { padding-left:10px; } .article-navigation > p > a.is-active { color: #d61e37; } .article-navigation__inner { margin: 70px 0 0 0; } .article-navigation__inner > p > a { color: black; } .article-navigation__inner > p > a.is-active { color: #d61e37; } .article-submit { -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; } .article-submit.is-fixed { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 100; } .article-submit .article-submit__inner { -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; } .article-submit.is-fixed .article-submit__inner { background-color: white; padding: 20px 20px 0 20px; width: 90%; max-width: 1200px; margin: 0 auto; display: block; box-shadow: 1px 1px 9px 0px rgb(0 0 0 / 15%); -webkit-box-shadow: 1px 1px 9px 0px rgb(0 0 0 / 15%); -moz-box-shadow: 1px 1px 9px 0px rgba(0,0,0,0.15); } /* .products--layout-list */ .burgermenu { width: 24px; height: 16px; position: relative; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; } .burgermenu span { display: block; position: absolute; height: 2px; width: 100%; background: #a5a5a5; border-radius: 2px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; } .burgermenu span:nth-child(1) { top: 0px; } .burgermenu span:nth-child(2),.burgermenu span:nth-child(3) { top: 8px; } .burgermenu span:nth-child(4) { top: 16px; } .burgermenu.is-open span:nth-child(1) { top: 6px; width: 0%; left: 50%; } .burgermenu.is-open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .burgermenu.is-open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .burgermenu.is-open span:nth-child(4) { top: 6px; width: 0%; left: 50%; } .breadcrumb--products { background: none; padding: .75rem 1rem .75rem 0; border-radius: none; margin: 0; } .breadcrumb--products .breadcrumb-item { position: relative; } .breadcrumb--products .breadcrumb-item:not(.breadcrumb-item--home):not(.breadcrumb-item--articletype) { display: none; } .breadcrumb--products .breadcrumb-item > a { transition: all .25s ease-out; color: rgba(0,0,0,.5); font-family: 'Source Sans Pro', sans-serif; font-size: 15px; } .breadcrumb--products .breadcrumb-item > a:hover { color: rgba(0,0,0,1); } .breadcrumb--products .breadcrumb-item+.breadcrumb-item { padding-left: 30px; } .breadcrumb--products .breadcrumb-item+.breadcrumb-item::before { content: ""; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pjxzdmcgdmlld0JveD0iMCAwIDk2IDk2IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjx0aXRsZS8+PHBhdGggZD0iTTY5Ljg0MzcsNDMuMzg3NiwzMy44NDIyLDEzLjM4NjNhNi4wMDM1LDYuMDAzNSwwLDAsMC03LjY4NzgsOS4yMjNsMzAuNDcsMjUuMzktMzAuNDcsMjUuMzlhNi4wMDM1LDYuMDAzNSwwLDAsMCw3LjY4NzgsOS4yMjMxTDY5Ljg0MzcsNTIuNjEwNmE2LjAwOTEsNi4wMDkxLDAsMCwwLDAtOS4yMjNaIi8+PC9zdmc+"); opacity: 0.3; width: 16px; height: 16px; background-repeat: no-repeat; background-size: 100%; position: absolute; left: 7px; top: 3px; } .breadcrumb--products .breadcrumb-item > a.is-active { color: black; } .breadcrumb--products .breadcrumb-item:last-child > a{ color: black; font-weight: 600; } .breadcrumb--products .breadcrumb-item:last-child:before{ opacity: 0.8; } @media(min-width:768px) { .breadcrumb--products .breadcrumb-item:not(.breadcrumb-item--home):not(.breadcrumb-item--articletype) { display: block; } } .search { position: relative; } .search__suggests { transition: all 0.35s; background: white; position: absolute; top: 46px; left: 0; width: 100%; z-index: 10; max-height: 0; overflow: hidden; } .search__suggests.is-open { max-height: 600px; box-shadow: 0 3px 4px 2px rgb(0 0 0 / 10%); } .search__suggests-items { padding: 0; list-style: none; margin: 0; } .search__suggests-item { width: 100%; transition: all .35s; display: flex; width: 100%; padding: 10px; font-size: 16px; align-items: center; cursor: pointer; } @media(min-width:768px) { .search__suggests-item { padding: 10px 30px; } } .search__suggests-item:hover { background: rgba(0,0,0,0.035); } .search__suggests-item > span{ display: flex; flex-direction: column; justify-content: center; } .search__suggests-item-image { display: none; border-radius: 50%; border: 1px solid #cfcfcf; width: 40px; height: 40px; overflow: hidden; position: relative; margin: 0 15px 0 0; } @media(min-width:768px) { .search__suggests-item-image { display: block; } } .search__suggests-item-image img { transition: transform 250ms; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-height: 40px; max-width: 40px; } .search__suggests-item-image.is-placeholder img { max-height: 100%; max-width: 100%; -webkit-filter: grayscale(100%); filter: grayscale(100%); } .search__suggests-item-image.is-placeholder{ pointer-events: none; } .search__suggests-item-title { font-weight: 600; font-size: 16px; margin: 0; color: black; } .search__suggests-item-articlenr { font-size: 14px; margin: 0 0 0 0; color: black; } .search__suggests-item-subtitle { font-size: 14px; margin: 0 0 0 0; color: black; } .search__suggests-results-btn { transition: background 0.3s; background: #D4112F; color: white !important; cursor: pointer; font-weight: 300; text-align: center; border-radius: 26px; padding: 6px 20px; border: 0; margin: 15px 20px 10px 20px; width: auto; display: inline-block; } .search__suggests-results-btn:hover { background: #db344d; } .search__suggests-notfound { padding: 20px 20px; margin: 0; font-weight: 600; } .categorybar { position: relative; } .categorybar-button { transition: all 250ms; display: inline-block; font-size: 23px; padding: 10px 35px 10px 0; position: relative; font-weight: 300; color: rgba(0,0,0,1); font-weight: 600; color: #db344d; border-bottom: 2px solid #db344d; width: 100%; cursor: pointer; } .categorybar-button:before { transition: all 200ms; content: ""; position: absolute; right: 4px; top: 0; background-size: 100%; width: 30px; height: 30px; top: calc(50% - 15px); background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGlkPSJMYXllcl8xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2NCA2NDsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY0IDY0IiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNkYjM0NGQ7fQo8L3N0eWxlPjxnPjxnIGlkPSJJY29uLUNoZXZyb24tTGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjM3LjAwMDAwMCwgMzM1LjAwMDAwMCkiPjxwb2x5bGluZSBjbGFzcz0ic3QwIiBpZD0iRmlsbC0zNSIgcG9pbnRzPSItMjE4LjcsLTMwOC42IC0yMTYuNywtMzEwLjYgLTIwNSwtMjk4LjggLTE5My4zLC0zMTAuNiAtMTkxLjMsLTMwOC42IC0yMDUsLTI5NC45ICAgICAgLTIxOC43LC0zMDguNiAgICAiLz48L2c+PC9nPjwvc3ZnPg=="); transform: rotate(0); } .is-mobile-open .categorybar-button:before { transition: all 200ms; transform: rotate(180deg); background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGlkPSJMYXllcl8xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2NCA2NDsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY0IDY0IiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNkYjM0NGQ7fQo8L3N0eWxlPjxnPjxnIGlkPSJJY29uLUNoZXZyb24tTGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjM3LjAwMDAwMCwgMzM1LjAwMDAwMCkiPjxwb2x5bGluZSBjbGFzcz0ic3QwIiBpZD0iRmlsbC0zNSIgcG9pbnRzPSItMjE4LjcsLTMwOC42IC0yMTYuNywtMzEwLjYgLTIwNSwtMjk4LjggLTE5My4zLC0zMTAuNiAtMTkxLjMsLTMwOC42IC0yMDUsLTI5NC45ICAgICAgLTIxOC43LC0zMDguNiAgICAiLz48L2c+PC9nPjwvc3ZnPg=="); } @media(min-width:768px) { .categorybar-button { display: none; } } .categorybar__items { /* width: 100%; */ position: relative; display: flex; flex-direction: column; max-height: 0; transition: all 0.4s cubic-bezier(0, 1, 0, 1); overflow: hidden; position: absolute; left: 0; background: white; box-shadow: 5px 5px 10px 0px rgb(0 0 0 / 20%); z-index: 10; /* width: calc(100% - 30px); */ padding: 0 20px; width: 100%; top: auto; } .is-mobile-open .categorybar__items { transition: all 0.4s ease-in-out; max-height: 1000px; } @media(min-width:768px) { .categorybar__items { width: 100%; position: relative; display: block; display: flex; flex-direction: row; max-height: none; overflow: visible; box-shadow: none; top:auto; right: auto; left: auto; padding: 0; z-index: 1; } } @media(min-width:768px) { .categorybar__items:after { position: absolute; width: 100%; content: ""; height: 1px; background: rgba(0,0,0,0.125); bottom: 0; left: 0; } } .categorybar__item { transition: all 250ms; display: inline-block; font-size: 23px; padding: 10px 0; position: relative; font-weight: 300; color: rgba(0,0,0,1); } .-isSmall .categorybar__item { font-size: 18px; margin-right: 20px; padding: 6px 0; } .categorybar__item:hover { color: rgba(0,0,0,1); } .categorybar__item.is-active { font-weight: 600; color: #db344d; display: none; } .-isSmall .categorybar__item.is-active { font-weight: 400; } .categorybar__item.is-hidden { display: none; } .categorybar__item.is-active:after { background: #db344d; opacity: 1; } .categorybar__item--more.is-hidden { display: none; } @media(min-width:768px) { .categorybar__item { order: 2; white-space: nowrap; margin-right: 35px; } .categorybar__item.is-active { order: 1; display: inline-block; } .categorybar__item:after { transition: all 250ms; position: absolute; width: 100%; content: ""; height: 2px; background: #db344d; bottom: 0; left: 0; opacity: 0; } .categorybar__item:hover:after { opacity: 1; } .categorybar__item +.categorybar__item { /* margin-left: 35px; */ } } .categorybar__more-container { transition: all 0.4s cubic-bezier(0, 1, 0, 1); overflow: hidden; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgb(220, 220, 220) rgb(240, 240, 240) ; max-height: 0; overflow: hidden; } @media(min-width:768px) { .categorybar__more-container { position: absolute; top: 54px; right: 0px; min-width: 200px; background: white; box-shadow: 5px 5px 10px 0px rgb(0 0 0 / 20%); z-index: 10; overflow-y: auto; display: flex; flex-direction: column; } } .categorybar__more-container .categorybar__item { margin-right: 0; padding: 10px 20px; } .is-open .categorybar__more-container { transition: all 0.4s ease-in-out; max-height: 1000px; } .categorybar__more-container:hover { scrollbar-color: rgb(180, 180, 180) rgb(240, 240, 240) ; } .categorybar__more-container::-webkit-scrollbar { width: 8px; border-radius: 20px; } .categorybar__more-container::-webkit-scrollbar-track { background: rgb(240, 240, 240); } .categorybar__more-container::-webkit-scrollbar-thumb { transition: all 350ms; background-color: rgb(220, 220, 220) ; border-radius: 20px; border: 3px solid rgb(220, 220, 220) ; } .categorybar__more-container:hover::-webkit-scrollbar-thumb { background-color: rgb(180, 180, 180); border-color: rgb(180, 180, 180); } @media(min-width:768px) { .categorybar__item--more { display: block; cursor: pointer; padding-right: 40px; position: relative; } .categorybar__item--more:before { transition: all 200ms; content: ""; position: absolute; right: 4px; top: 0; background-size: 100%; width: 30px; height: 30px; top: calc(50% - 15px); background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGlkPSJMYXllcl8xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2NCA2NDsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY0IDY0IiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiMwMDA7fQo8L3N0eWxlPjxnPjxnIGlkPSJJY29uLUNoZXZyb24tTGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjM3LjAwMDAwMCwgMzM1LjAwMDAwMCkiPjxwb2x5bGluZSBjbGFzcz0ic3QwIiBpZD0iRmlsbC0zNSIgcG9pbnRzPSItMjE4LjcsLTMwOC42IC0yMTYuNywtMzEwLjYgLTIwNSwtMjk4LjggLTE5My4zLC0zMTAuNiAtMTkxLjMsLTMwOC42IC0yMDUsLTI5NC45ICAgICAgLTIxOC43LC0zMDguNiAgICAiLz48L2c+PC9nPjwvc3ZnPg=="); transform: rotate(0); } .categorybar__item--more.is-open { color: #db344d; } .categorybar__item--more.is-open:before { transition: all 200ms; transform: rotate(180deg); background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGlkPSJMYXllcl8xIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2NCA2NDsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY0IDY0IiB4bWw6c3BhY2U9InByZXNlcnZlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNkYjM0NGQ7fQo8L3N0eWxlPjxnPjxnIGlkPSJJY29uLUNoZXZyb24tTGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjM3LjAwMDAwMCwgMzM1LjAwMDAwMCkiPjxwb2x5bGluZSBjbGFzcz0ic3QwIiBpZD0iRmlsbC0zNSIgcG9pbnRzPSItMjE4LjcsLTMwOC42IC0yMTYuNywtMzEwLjYgLTIwNSwtMjk4LjggLTE5My4zLC0zMTAuNiAtMTkxLjMsLTMwOC42IC0yMDUsLTI5NC45ICAgICAgLTIxOC43LC0zMDguNiAgICAiLz48L2c+PC9nPjwvc3ZnPg=="); } } .form-control { border-color: rgba(0,0,0,.125); } .readonly { pointer-events: none; visibility: hidden; } .articleTypeHeader { text-align: left; font: normal normal normal 24px/35px Source Sans Pro; letter-spacing: 0px; color: #FFFFFF; font-size: 1.25rem; background-color: #909090; padding: 5px 5px 5px 20px; border-top-left-radius: 10px; border-top-right-radius: 10px; display: flex; justify-content: space-between; align-items: center; min-height: 50px; } .articleTypeHeaderTitle { display: flex; flex-direction: column; line-height: 1.25; } .articleTypeHeaderActions { display: flex; gap: 12px; align-items: center; } .articleTypeHeaderActionsButton { transition: all 300ms; font-size: 14px; line-height: 14px; display: flex; gap: 4px; cursor: pointer; border: 1px solid white; border-radius: 30px; padding: 6px 11px; align-items: center; background: white; color: rgba(0,0,0,0.6); } .articleTypeHeaderActionsButton:hover { color: rgba(0,0,0,1); background: #eaeaea; border-color: #eaeaea; } .articleTypeHeader .js-start-mks { } .articleTypeHeader .js-delete-mks { } .js-articletypeheadermenu { position: relative; } .articleTypeHeaderMenu { display: none; flex-direction: column; gap: 12px; align-items: center; background: white; box-shadow: 0px 3px 6px #00000029; border-radius: 5px; position: absolute; z-index: 10; top: 32px; left: -12px; padding: 6px; min-width: 130px; } .-open > .articleTypeHeaderMenu { display: flex; } .articleTypeBlock { margin-bottom: 10px; } .addressed_accordion { margin-top:10px; } @media(max-width:700px) { .small_flex { width:100%; display: flex; flex-wrap: wrap; } } @media(min-width:700px){ .large_fit_content{ width:max-content; } } #deliveryAddressExtras, #deliveryNewAddress{ padding-left:10px; } .pdf_table { border-collapse: collapse; margin-left:40px; margin-right:10px; width:90%; border:1px; border-style:solid; } .pdf_table tr, .pdf_table td { border:1px; border-style:solid; padding:1px; } .pdf_lable_column { width:200px; display: inline-block; margin-left:40px; vertical-align:top; } .pdf_data_column { display: inline-block; margin-right:10px; word-wrap: normal; width:370px; vertical-align:top; } .pdf_cost { text-align:right; } .project header { background:#636363 !important; color: #fff; } .project header ul li a { color:#fff; } #project_edit_icon { color:#fff; padding: 9px 22px; font-size: 16px; } .project header button { text-align: center; border-radius: 26px; border:0px; } .project .hamburger-inner, .project .hamburger-inner:after, .project .hamburger-inner:before { background-color: #fff; } .select2-selection--single { height:48px !important; } .select2-selection__rendered { padding: 10px 19px !important; } .select2-selection__arrow { top:11px !important; } .select2-selection, .select2-dropdown, .select2-selection__rendered, .select2-container--default, .select2-container--single { border-color: rgba(0,0,0,.125) !important; } .select2-selection:focus, .select2-dropdown:focus, .select2-selection__rendered:focus, .select2-container--default:focus, .select2-container--single:focus { border-color: #49b5e5 !important; } /*Generic CSS*/ .datatableSort tr:hover { background-color: #eee; } .datatableSort thead th { vertical-align: top; white-space: nowrap; } .standard_button { font-weight: 300; text-align: center; border-radius: 26px; padding: 13px 10px; border: 0; font-size: 16px; } .thin_button { font-weight: 300; text-align: center; border-radius: 26px; padding: 5px 10px; border: 0; font-size: 16px; margin: 3px 0px; } .red_button { background: #D4112F !important; color: #fff !important; } .red_button:hover{ background: #9a0f26 !important; } .orderPrintHeadline { border-bottom: 2px solid #D4112F; margin-bottom: 1em; } .white_button { background: #fff !important; color: #333 !important; border: 1px solid #e4e2e2 !important; } .white_button:hover{ background: #ccc !important; } .black_button { background: #636363 !important; color: #fff !important; } .black_button:hover{ background: #000 !important; } .right_button { float:right; margin-left:5px } @media(max-width:700px) { .right_button { float:none; margin-right:5px; margin-left:0px; } } .radio { margin:5px; } .showCapitals { text-transform:uppercase; } .quantity { position: relative; } .quantity input[type=number]::-webkit-inner-spin-button, .quantity input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .quantity input[type=number] { -moz-appearance: textfield; } .quantity input { width: 80px; height: 34.75px; line-height: 1.65; float: left; display: block; padding: 0; margin: 0; padding-right: 2px; border: 1px solid #eee; border-radius: 20px; text-align: center; } .quantity input:focus { outline: 0; } .quantity-nav { float: left; position: relative; height: 42px; } .quantity-button { position: relative; cursor: pointer; width: 20px; text-align: center; color: #49b5e5; font-size: 24px; font-family: "Trebuchet MS", Helvetica, sans-serif !important; line-height: 1.7; -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } .-readonly .quantity-button { display: none; } .quantity-button.quantity-up { position: absolute; height: 50%; transform: translate(-25px, -20%); } .quantity-button.quantity-down { position: absolute; height: 50%; transform: translate(5px, -20%); } .modal-backdrop { z-index: 10000; } .modal-dialog label { font-weight: 700; } .boxRequestAction { border: 1px solid #ccc; padding: 1em; height:100%; min-height:350px; position:relative; } .boxRequestAction form { height:100%; } .boxRequestAction h3 { font-size: 100%; font-weight: bold; } .boxRequestAction img { margin-top: 1em; } .boxRequestAction label.request-price-info-label { display: inline-block; width: 70%; font-weight: bold; } .boxRequestAction span.request-price-info-value { display: inline-block; width: 30%; text-align: right; } .boxRequestAction .request-msg-bottom { position:absolute; bottom:5px; right:20px; } .boxRequestAction button { padding: .2em 1em; position:absolute; left:15px; bottom:30px; } .boxRequestAction.not_requested { background:lightgrey; } .boxRequestAction.not_requested button { background:grey; } .boxRequestAction.finished { background:white; } .boxRequestAction.finished button { background:green; } #contentRequestTask .alert { } #contentRequestTask .wrapMessage, #contentLeadDetail .wrapMessage { margin: 1em 0; border: 1px solid #ccc; padding: .5em; } #contentRequestTask .no-margin-bottom { margin-bottom: 0; } .hovertip { position: relative; display: inline-block; } .hovertip .hovertiptext { visibility: hidden; width: 120px; background-color: #fff; color: #000; text-align: center; border-radius: 6px; padding: 5px 0; position: absolute; z-index: 1; top: -5px; left: 110%; } .hovertip:hover .hovertiptext { visibility: visible; } .hovertip .hovertiptext::after { content: " "; position: absolute; top: 50%; right: 100%; /* To the left of the tooltip */ margin-top: -5px; border-width: 5px; border-style: solid; border-color: transparent white transparent transparent; } #formRequestTask { height:100%; } select { background: url("data:image/svg+xml,") no-repeat; background-position: calc(100% - 0.75rem) center !important; -moz-appearance:none !important; -webkit-appearance: none !important; appearance: none !important; padding-right: 2rem !important; } #new_project,.button_lead_edit { float: right; margin-right: 3%; padding: 13px 23px; } #new_project i,.button_lead_edit i{ margin-left: 10px; margin-right: 0; } #buttonEditLead { margin: 0; } @media (max-width: 767.98px) { .project_filter { display: none !important; } } @media (max-width: 600px) { #buttonEditLead { display: block; width: 100%; margin: 1em 0; } } @media (max-width: 1130px) { .hideOnSmallDecives { display: none; } } .basket { display: flex; gap: 2rem; flex-direction: column; } @media(min-width:1180px) { .basket { flex-direction: row; } } .basket__list { width: 100%; } @media(min-width:1180px) { .basket__list { width: 70%; } } .basket__overview { width: 100%; } @media(min-width:1180px) { .basket__overview { position: sticky; width: 30%; top: 106px; height: 900px; overflow: hidden; } } .basket__overview input, .basket__box input, .basket__box textarea { transition: all 300ms; } .basket__overview input:focus, .basket__box input:focus, .basket__box textarea:focus { outline: none; border-color: rgba(0,0,0,0.5); box-shadow: none; } .basket__overview-headline { background: #909090; color: white; font-size: 1.25rem; padding: 8px 16px; display: flex; justify-content: space-between; } .basket__overview-box { border-radius: 10px; border: 1px solid #cbcbcb; overflow: hidden; } .basket__overview-inner { padding: 1rem; } .basket__overview-line { display: flex; margin: 0.5rem 0; padding: 0 2rem 0 0; } .basket__overview-line span { color: rgba(0,0,0,1); font-size: 1.125rem; border-top: 1px solid rgba(0,0,0,0.1); padding-top: 12px; } .basket__overview-line span:first-child { flex: 2; } .basket__overview-line span:last-child { flex: 2; text-align: right; } .basket__overview-line.-small span { color: rgba(0,0,0,0.5); font-size: 1rem; border: none; padding: 0; } .basket__overview-hint { font-size: 13px; color: rgba(0,0,0,0.5); font-weight: 400; } .basket__overview-offer { /* display: block !important; */ } .basket__overview-offer > p { font-size: 0.85rem; color: rgba(0,0,0,0.5); font-weight: 400; } .basket__overview-offer-hint { font-size: 0.85rem; color: rgba(0,0,0,0.5); font-weight: light; margin: 1rem 0 0 0; } .basket__overview-offer.-disabled .button.-text { color: #ccc; cursor: not-allowed; pointer-events: none; } .basket__overview-form > label { display: flex; flex-direction: column; margin: 0 0 2px 0; } .basket__overview-form > label >span { font-size: 10px; } .basket__overview-form-inputs { display: flex; gap: 6px; align-items: center; } .basket__box-commission { } .basket__box-commission label { font-weight: 600; font-size: 14px; margin: 0 0 2px 0; cursor: pointer; } .basket__box-commission label > span { font-size: 10px; } .basket__overview-credits { } .basket__overview-credits-form { display: flex; gap: 1rem; align-items: center; margin: 0.5rem 0; justify-content: space-between; } .basket__overview-credits-form label { font-weight: 600; font-size: 14px; line-height: 16px; cursor: pointer; margin: 0; } .basket__overview-credits-form input { width: 40%; max-width: 100px; } .basket__box-additional { } .basket__box-additional > div:last-child { margin: 0 0 12px 0; } .basket__box-additional label { font-weight: 600; font-size: 14px; margin: 0 0 2px 0; cursor: pointer; } .basket__box-additional-comment { } .basket__box-additional.-disabled .button.-secondary { background: #ccc; color: #fff; cursor: not-allowed; pointer-events: none; } .basket__box-additional-file { } .basket__box-additional-file input[type=file]::file-selector-button { margin-right: 4px; border: none; background: #D4112F; color: #fff; padding: 12px 20px; border-radius: 20px; font-size: 1rem; cursor: pointer; transition: background .2s ease-in-out; font-family: 'Source Sans Pro', sans-serif; font-weight: 300; line-height: 1.125rem; } .basket__box-additional-file input[type=file]::file-selector-button:hover { background: #9a0f26; } .basket__box-additional-file input:disabled::file-selector-button { background: #ccc; color: #fff; cursor: not-allowed; } .basket__box-additional-file input:disabled::file-selector-button:hover { background: #ccc; } .basket__overview-btns { display: flex; gap: 1rem; margin: 1rem 0; } .basket__overview-btns > button { flex: 1; } .basket__box-disclaimer { margin: 0; } .basket__box { border: 1px solid rgba(0,0,0,0.1); border-radius: .5rem; padding: 1rem 2rem; margin: 1rem 0; } .basket__box-title { font-family: 'Source Sans Pro', sans-serif; font-size: 32px; font-weight: 300; } .basket__box .title { margin-bottom: 0; padding-left: 1rem; } .basket__box.-quickorder { padding: 1rem 1rem; } .basket__box.-quickorder .card { border: none; } .basket__box.-quickorder .moduleRow{ margin-bottom: 0; } .button { transition: all 300ms; padding: 6px 20px; border-radius: 20px; font-size: 1rem; text-align: center; height: 40px; cursor: pointer; font-family: 'Source Sans Pro', sans-serif; font-weight: 300; line-height: 1.125rem; display: inline-flex; align-items: center; gap: 6px; width: auto; } .button.-primary { background: #D4112F; color: #fff; border: none; } .button.-primary:hover { background: #9a0f26; } .button.-outline { color: rgba(0,0,0,0.8); background: white; border: 1px solid rgba(0,0,0,0.3); } .button.-outline:hover { border-color: #707070; color: black; } .button.-secondary { background: #00a0de; color: #fff; border: none; } .button.-secondary:hover { background: #008bc3; } .button.-text { color: #00a0de; border: none; padding-left: 0; padding-right: 0; font-weight: 400; } .button.-text:hover { color: #008bc3; } .button.-inline { display: inline-block; } .hidden { display: none !important; } .radio [type="radio"]:checked, .radio [type="radio"]:not(:checked) { position: absolute; left: -9999px; } .radio [type="radio"]:checked + label, .radio [type="radio"]:not(:checked) + label { position: relative; padding-left: 28px; cursor: pointer; line-height: 20px; display: inline-block; color: #000; } .radio [type="radio"]:checked + label:before, .radio [type="radio"]:not(:checked) + label:before { content: ''; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border: 1px solid rgba(0,0,0,.3); border-radius: 100%; background: #fff; } .radio [type="radio"]:checked + label:before { border-color: #000; } .radio [type="radio"]:checked + label:after, .radio [type="radio"]:not(:checked) + label:after { content: ''; width: 12px; height: 12px; background: #d4112f; position: absolute; top: 4px; left: 4px; border-radius: 100%; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .radio [type="radio"]:not(:checked) + label:after { opacity: 0; -webkit-transform: scale(0); transform: scale(0); } .radio [type="radio"]:checked + label:after { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } .radio [type="radio"]:disabled { opacity: .5; cursor: default; } .radio [type="radio"]:disabled + label { color: #b8b8b8; cursor: default; } .quantity input[type=number][readonly] { pointer-events: none; } /* lead application */ .leadsPerformance .itemleadsPerformance { border: 1px solid #eaeaea; padding-left: 1em; padding-right: 1em; } .leadsPerformance .itemleadsPerformance span { display: block; } .leadsPerformance .itemleadsPerformance i { font-size: 40px; opacity: 0.6; margin: .5em 0 .75em; } tr.bgLead td.colLeadStatus span, span.bgLead { padding: 3px 10px; /* border-radius: 24px; */ min-width: 110px; display: inline-block; text-align: center; } tr.bgLeadPending td.colLeadStatus span, span.bgLeadPending { background-color: #de3434; color: white; } tr.leadEmployeeView.leadEmployeeView.bgLeadPending td.colLeadStatus span, span.bgLeadPending { background-color: orange; } tr.bgLeadAccepted td.colLeadStatus span, span.bgLeadAccepted,span.bgLead_accepted,label.bgLeadAccepted { background-color: #9cffb2; color: darkgreen; } label.bgLeadAccepted .arrow { border-color: darkgreen; } tr.bgLeadQuotation td.colLeadStatus span, span.bgLeadQuotation, span.bgLead_quotation,label.bgLeadQuotation { background-color: #fcd08f; color: #a05f04; } label.bgLeadQuotation .arrow { border-color: #a05f04; } tr.bgLeadCreated td.colLeadStatus span, span.bgLeadCreated,span.bgLead_created, span.bgLead_pending, span.bgLead_created_pending { background-color: #666; color: #fff; } tr.bgLeadRejected td.colLeadStatus span, span.bgLeadRejected, span.bgLead_rejected { background-color: #e2892a; color: #fff; } tr.bgLeadExpired td.colLeadStatus span, span.bgLeadExpired, span.bgLead_expired { background-color: #000; color: #fff; } tr.bgLeadFinished td.colLeadStatus span, span.bgLeadFinished, span.bgLead_finished { background-color: #6b86a3; color: #fff; } tr.bgLeadWon td.colLeadStatus span, span.bgLeadWon, span.bgLead_won,label.bgLeadWon { background-color: lightblue; color: #2F2F2F; } label.bgLeadWon .arrow { border-color: #2F2F2F; } tr.bgLeadLost td.colLeadStatus span, span.bgLeadLost, span.bgLead_lost,label.bgLeadLost { background-color: lightblue; color: #2F2F2F; } label.bgLeadLost .arrow { border-color: #2F2F2F; } tr.bgLeadUnassigned td.colLeadStatus span, span.bgLeadUnassigned { background-color: #de3434; color: white; } .cb-dropdown { width: 160px; position: relative; } .cb-dropdown input[type=checkbox], .cb-dropdown input[type=radio] { display: none; } .cb-dropdown label.cb-dropdown-current-option { position: relative; display: block; margin: 0; box-sizing: border-box; } .cb-dropdown .arrow { border: solid #9b091b; border-width: 0 1px 1px 0; display: inline-block; padding: 4px; transform: rotate(45deg); -webkit-transform: rotate(45deg); position: absolute; top: 35%; right: .5em; } .cb-dropdown-options li label, .cb-dropdown label.cb-dropdown-current-option { padding: .2em .8em; } .cb-dropdown-options { border: 1px solid #ccc; display:none; position: absolute; z-index: 1000; background: #fff; width: 100%; } .cb-dropdown .cb-dropdown-checkbox:checked ~ label ~ div { display: block; } .cb-dropdown-options ul { border: 0; list-style-type: none; list-style: none; margin: 0; padding: 0; outline: 0; } .cb-dropdown-options li { width: 100%; } .cb-dropdown-options li label { display: block; margin: 0; width: 100%; } .cb-dropdown-options li label:hover { background-color: #cfcfcf; } .wrapLeadUserSelection { overflow:auto; max-height:215px; width:100%; border-top: 1px solid #ccc; /* border-bottom: 1px solid #ccc;*/ } .lead-user-option { border: 1px solid #ccc; padding: 1em .5em 0 1em; margin: .5em 0; clear:both; } .lead-user-option:first-of-type { border-top: 0; margin-top: 0; } .lead-user-option .input-select { float: left; width: 2em; padding: .1em 0 4em; } .lead-user-option .info { display: block; position: relative; } .lead-user-info .membership { display: inline-block; margin-left: 1.5em; padding-left: 1em; padding-right: 1em; border-radius: 5px; float: right; min-width: 8em; text-align: center; } .lead-user-info .bgMembership_elite { background-color: #9cffb2; color: darkgreen; } .lead-user-info .bgMembership_premium { background-color: lightblue; color: darkblue; } .lead-user-info .bgMembership_standard { background-color: #e2892a; color: white; } .lead-user-info .performance>span { display: inline-block; margin-right: 1.2em; } .lead-user-info .performance span.distance { width: 80px; } .lead-user-info .performance span.response-time { width: 90px; } .lead-user-info .performance span.acceptance-rate { width: 60px; } .lead-user-info .performance span.finished { } .lead-user-info .performance span i { display: inline-block; margin-right: .5em; } .lead-user-option .performance { font-size: 85%; } .lead-user-option .performance span.distance { width: 75px; } .lead-user-option .performance span.response-time { width: 80px; } .lead-user-option .performance span.acceptance-rate { width: 50px; } .lead-user-option .performance span.open { width: 40px; } #wrapTabAssignement { margin-top: 1.5em; margin-bottom: 1em; border-bottom: 1px solid #ccc; } .tab-assign-item { display: inline-block; margin: 0; padding: 0 .5em .5em 0; margin-right: 1.5em; cursor: pointer; border-bottom: 3px solid white; } .tab-assign-item.active { border-color: #3f3f3f; } .modal-dialog #contentLeadDetail label { font-weight: inherit; } .isLeadView .modal-dialog { max-width: 1100px; } .isLeadEditView .modal-dialog { max-width: 800px; } #contentLeadDetail .module { padding: 1em 0; /* border-bottom: 1px solid #eee; */ } #contentLeadDetail .module:first-of-type { padding-top: 0; } #contentLeadDetail .moduleRow { margin-bottom: .5em; } #contentLeadDetail .wrapLeadDetails { border: 1px solid #ccc; padding: 0; /* box-shadow: 4px 4px 4px rgba(0,0,0,.2); */ margin-bottom: 1.5em; } #contentLeadDetail .wrapLeadDetails>* { padding: 0 .5em; } #contentLeadDetail .wrapLeadDetails p.headline-lead-details { border-bottom: 1px solid #ccc; padding-top: .5em; padding-bottom: .5em; } #contentLeadDetail .text-light { color: inherit !important; opacity: .6; } #contentLeadDetail .wrapMessage { /* border-bottom: 1px solid #eee; */ /* padding: .5em 0 1em 0; */ } #contentLeadDetail .wrapMessage:last-of-type { /* border-bottom: 0; */ } #contentLeadDetail .wrapMessage span { margin-right: 1.5em; display: inline-block; } .wrapDummy { display: none; } #contentLeadDetail .wrapMessage span.msg-creator { font-weight: bold; } .hiddenLeadData { box-shadow: 0 0 6px rgba(0,0,0,0.25); width: 50px; display:inline-block; background:rgba(0,0,0,0.15); line-height: 10px; } .hiddenLeadDataLarge { width: 150px; } /* lead application */ /* opening hours */ #wrapUserOpenings label { display: inline-block; width: 5em; } #formOpenings input[type=time] { padding: .5em .5em .5em .1em; text-align: center; } #formOpenings .time-divider { text-align: center; font-size: larger; line-height: 2em; } #formOpenings .time-label { line-height: 2.8em; } #formOpenings .opened-label { display: inline-block; margin-left: 55px; font-weight: normal; line-height: 1.5em; } .wrap-switch { position: relative; display: inline-block; } .wrap-switch input { height: 0px; opacity: 0; width: 0px; } .wrap-switch .switch-el { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; border-radius: 34px; width: 60px; height: 26px; } .wrap-switch .switch-el:before { position: absolute; content: ""; height: 26px; width: 26px; left: 4px; right: 4px; bottom: 0; background-color: white; -webkit-transition: .4s; transition: .4s; border-radius: 34px; } .wrap-switch input:checked + .switch-el { background-color: #2196F3; } .wrap-switch input:focus + .switch-el { box-shadow: 0 0 1px #2196F3; } .wrap-switch input:checked + .switch-el:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); } #fieldsOpening .row { margin-bottom: .5em; } #formOpenings .wrap-switch .switch-el { height: 18px; width: 50px; border-radius: 24px; } #formOpenings .wrap-switch .switch-el:before { height: 18px; width: 18px; border-radius: 24px; } #formOpenings .time-field { display: inline; width: auto; min-width: 78.75px; } #formOpenings .wrap-openings { position:relative; /* text-align: right;*/ } #formOpenings .opening-icon { position:absolute; /* right:0; */ top:.5em; } @media(min-width:690px) { #formOpenings .opening-icon { right:0; } } /* opening hours */ .module.form button.keycardAdjustDescription, .module.form button.keycardCharsOk { font-size: inherit; padding: 5px 10px; margin-right: 20px; }