@charset "utf-8";
/* CSS Document */

* {
  padding:0;
  margin:0
}
html, body {
    width:100%;
    height:100%;
}
body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #f5f5f5 url("../img/stripe1.png") repeat;
}
a {
    text-decoration: none;
    outline: none;
    border: none;
    color:#333;
}
a img {
    border:none;
    outline:none;
}
.ul {
    list-style-position: inside;
}
.clearing {clear:both;}
.empty{height:20px;}

.custcontainer {
    margin:0 auto;
    padding-bottom: 8px;
}
.custbox{
  padding: 60px;
  margin-bottom: 30px;
  font-size: 18px;
  font-weight: 200;
  line-height: 30px;
  color: inherit;
  background-color: #eeeeee;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}

/**
 * Fonts
 */
@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url(../fonts/Lato-Light.woff2) format('woff2'), url(../fonts/Lato-Light.ttf) format('truetype');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/**
 * Header
 */
.js-alert--error {
    color: rgb(204, 21, 63);
    background-color: #FFEE9CFF;
    border: 1px solid #D6CA8EFF;
}
.js-alert {
    display: flex;
    padding: 12px;
    justify-content: center;
}
.header {
    height: auto;
    min-height: 67px;
    color: inherit;
    font-weight: 200;
    line-height: 30px;
    background: url("../img/header.png");
    background: image-set(
            url("../img/header.avif") type("image/avif"),
            url("../img/header.webp") type("image/webp")
    );
    background-position-x: 50%;
    background-position-y: 50%;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-origin: padding-box;
    background-clip: border-box;
    background-size: cover;
    background-color:#f6f6f6;
        -webkit-border-radius: 0;
            -moz-border-radius: 0;
                border-radius: 0;
}
.header .contacts {
    float: right;
    display: none;
    margin: 2px 8px 0px 0px;
    line-height: normal;
    clear: right;
}
.header .slogan {
    text-align: end;
    font-size: x-small;
    line-height: normal;
    font-style: italic;
    font-weight: 400;
    color: rgb(27, 106, 172);
}
.header a#brand {
    font-family: 'Lato', sans-serif;
    font-size: 70%;
    float: right;
    display: block;
    margin: 4px 8px 0 0;
    line-height: .95;
    width: auto;
    font-weight: 300;
    text-align: right;
    text-decoration: none;
    /*color: midnightblue;*/
    /*color: darkslategray;*/
    color: white;
    text-shadow: 1px 1px 1px #595656, 1px 1px 2px #848282, 2px 2px 2px #aeadad;
    letter-spacing: 1px;
}
.header__lang_title {
    /*font-size: x-small;*/
}
.logo__img {
    margin-left: 18px;
    height: 48px;
    margin-top: 8px;
}

.header__left {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0 10px;
}
.header__left .slogan {
    width: 100%;
    padding-left: 18px;
}
.header__right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.header__right .lang,
.header__right .contacts,
.header__right .header__partner {
    float: none;
}
.header__certificate-link {
    display: inline-flex;
    align-items: flex-start;
    margin-top: 8px;
}
.header__certificate-img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: 40px;
    margin: 0;
}

.header a#logo:hover {
    color: rgb(243, 154, 45);
}
.header a#logo:hover {
    text-decoration: none;
}
.header a#logo {
    font-family:ARCHITXT;
    float: right;
    display: block;
    margin: 62px 20px 0px 0px;
    line-height: normal;
    width: auto;
    font-size: 20px;
    font-weight: bold;
}



.header a#logo2 {
    font-family:ARCHITXT;
    float: right;
    display: block;
    margin: 21px 20px 0px 0px;
    line-height: normal;
    width: auto;
    font-size: 20px;
    font-weight: bold;
}



.header .contacts .phone {
    font-size: 18px;
    display: block;
    line-height: normal;
    clear: right;
}
.header .contacts .contactability {
    font-size: 12px;
    padding-left: 8px;
    display: block;
    line-height: normal;
    clear: right;
}

.header .lang {
    float: right;
    display: block;
    margin: 8px 6px 0px 0px;
    line-height: normal;
}
.header .lang ul li {
  list-style: none;
  float: left;
  font-size: 16px;
}
.lang-switcher {
    filter: opacity(50%) grayscale(90%);
    transition: filter 0.3s;
}
.lang-switcher:hover {
    filter: none;
}
.header__partner{
    clear: both;
}



/**
 * Navbar
 */
.navbar {
    justify-content: flex-end;
}
.navbar__btn{
    padding: 7px;
    cursor: pointer;
}
.navbar__burger{
    display: block;
    position: relative;
    width: 32px;
    height: 20px;
}
.navbar__burger span{
    display: block;
    position: relative;
    background-color: #7c7c7d;
    width: 100%;
    height: 2px;
    top: 9px;
    transition: all 0.3s ease 0s;
}
.navbar__burger:before,
.navbar__burger:after{
    content: '';
    background-color: #7c7c7d;
    position: absolute;
    width: 100%;
    height: 2px;
    transition: all 0.3s ease 0s;
}
.navbar__burger:before{
    top: 0;
}
.navbar__burger:after{
    bottom: 0;
}
.navbar__burger.active span{
    transform: scale(0);
}
.navbar__burger.active:before{
    transform: rotate(45deg);
    top: 9px;
}
.navbar__burger.active:after{
    transform: rotate(-45deg);
    bottom: 9px;
}
.navbar-collapse{
    transition: all 0.3s ease 0s;
}

.left-box {
    margin-right: 8px;
}

.navbar {
    background-color: #f5f5f5;
}
.dropdown-menu {
    border-radius: 2px;
    padding: .25rem 0;
}
.dropdown-nav-link {
    padding: 10px 20px !important;
}
.dropdown-item {
    line-height: 2;
}
.dropdown-item:active, .dropdown-item:active {
    color: #16181b;
    text-decoration: none;
    background-color: #598ab2;
}
.navbar-top {
    padding: 0;
}
.navbar-top .navbar-nav .nav-link {
    /*color: rgba(255,255,255,.5);*/
    padding: .625rem 1.5rem;
}
.navbar-top .nav-item .active .nav-link,
.navbar-top .nav-item:hover .nav-link {
    color: #ffffff;
    background-color: #5f8fb5;
}
/*.navbar-top .dropdown:hover > .dropdown-menu {
    background-color: rgba(var(--bs-light-rgb),var(--bs-bg-opacity)) !important;
    display: block;
}*/
/*.navbar-top .dropdown>.dropdown-toggle:active {*/
    /*Without this, clicking will make it sticky*/
    /*pointer-events: none;
}*/
.navbar-top .dropdown-item:hover, .navbar-top .dropdown:has(.nav-link[aria-expanded="true"]) {
    color: #ffffff;
    background-color: #5f8fb5;
}
.navbar-top .dropdown .nav-link::after {
    transition: transform .1s linear;
    transform-origin: center;
    /*position: absolute;*/
    margin-left: 6px;
    top: calc(50% - 1px);
    transform: translateY(-50%) rotate(45deg);
    content: " " !important;
    border-style: solid;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 2px;
}
/*.navbar-top .dropdown:hover .nav-link::after {
    border-width: 2px 2px 0 0;
    transform: translateY(calc(-50% + 2px)) rotate(-45deg);
    color: #ffffff;
}*/
.navbar-top .nav-link[aria-expanded="true"] {
    color: #ffffff;
}
.navbar-top .nav-link[aria-expanded="true"]::after {
    border-width: 2px 2px 0 0;
    transform: translateY(calc(-50% + 2px)) rotate(-45deg);
    color: #ffffff;
}
/*.dropdown-toggle[aria-expanded="true"]:after {
    transform: rotate(180deg);
}*/
.live-search {
    min-height: calc(1.5em + .5rem);
    padding: 0px !important;
    margin: 0px !important;
    position: relative;
    background-color: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: 1px;
    /*width: 70%;*/
}
.live-search::before {
    content: '\f002';
    font-size: 14px;
    color: gray;
    font-family: 'FontAwesome';
    padding-left: 8px;
}
.live-search input {
    padding: .25rem 0;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: none;
    border-radius: 1px;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    min-height: calc(1.5em + .5rem + calc(var(--bs-border-width) * 1));
    width: 85%;
}
.live-search input:focus {
    box-shadow: none;
    outline: none;
}

/**
 * Nav tabs
 */
.nav-tabs {
    border-bottom: .25rem solid #6b97bb;
}
.nav-tabs .nav-link {
    /*background-color: var(--bs-light-bg-subtle);*/
    /*border: 1px dashed var(--bs-gray-400);*/
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    margin-bottom: 0;
    border-bottom: none;
    color: darkolivegreen;
}
.nav-tabs .nav-link.active {
    border: 1px solid var(--bs-border-color-translucent);
    border-bottom: none;
    padding: calc(var(--bs-nav-link-padding-y) + 1px) var(--bs-nav-link-padding-x);
    /*color: dodgerblue;*/
}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    isolation: isolate;
    border: 1px solid var(--bs-border-color-translucent);
    background-color: var(--bs-white);
    border-bottom: none;
}

#productPageTab .nav-link {
    font-family: inherit;
    font-size: 1rem;
    font-weight: 400;
    color: inherit;
    background-color: #f8fafc;
    border: 1px solid #b6c3d0;
    border-bottom: none;
}

#productPageTab .nav-link.active {
    color: inherit;
    background-color: #ffffff;
    border-color: #b6c3d0 #b6c3d0 #ffffff;
    font-weight: 400;
}

#productPageTab .nav-link:hover,
#productPageTab .nav-link:focus {
    color: inherit;
    background-color: #ffffff;
    border-color: #b6c3d0;
    border-bottom: none;
}


/**
 * Sidebar
 */
aside .nav-link {
    color: #333333;
    padding: .375rem 0.5rem;
}

/**
 * Cookie Consent Banner
 */
.cookie-consent-banner {
    max-height: calc(100vh - 20px);
    position: fixed;
    height: auto;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    grid-template-rows: minmax(0, 1fr);
    z-index: 99999;
    background: #f1f1f1;
    padding: 15px 20px;
    display: grid;
    grid-gap: 10px;
    row-gap: 10px;
}
.cookie-consent-banner {
    top: initial;
    left: initial;
    right: 20px;
    bottom: 20px;
    transform: initial;
    box-shadow: rgba(0, 0, 0, .10) 0 8px 20px, rgba(0, 0, 0, .15) 0 4px 6px;
}
.cookie-consent-banner .cookie-banner-header {
    grid-template-columns: 100px 1fr 100px;
    align-items: center;
    display: grid;
    grid-column: span 3;
}
.cookie-consent-banner .cookie-banner-title {
    justify-self: center;
    grid-column-start: 2;
    /*font-size: 14px;*/
    color: #222;
    font-weight: 500;
}
.cookie-consent-banner .cookie-banner-close {
    line-height: 20px;
    justify-self: end;
    grid-column-start: 3;
    font-size: 20px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    color: #222;
}
.cookie-consent-banner .cookie-banner-back {
    line-height: 1.25rem;
    justify-self: start;
    grid-column-start: 1;
    font-size: x-large;
    width: 1.25rem;
    height: 1.25rem;
    color: #222;
}
.cookie-consent-banner .cookie-banner-back .fa,
.cookie-consent-banner .cookie-banner-open .fa {
    font-size: x-large;
    font-weight: bold;
}
.cookie-consent-banner .cookie-banner-divider {
    height: 1px;
    box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.05);
}
.cookie-consent-banner .cookie-banner-message,
.cookie-consent-banner .cmplz-categories,
.cookie-consent-banner .cookie-banner-links,
.cookie-consent-banner .cookie-banner-buttons,
.cookie-consent-banner .cookie-banner-divider {
    grid-column: span 3;
}
.cookie-consent-banner .cookie-banner-body {
    width: 100%;
    grid-column: span 3;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 55vh;
}
.cookie-consent-banner .cookie-banner-buttons {
    display: flex;
    justify-content: center;
    gap: 10px;
}
.cookie-consent-banner .cookie-banner-message {
    word-wrap: break-word;
    font-size: small;
    /*line-height: 1.5;*/
    color: #222;
    margin-bottom: 5px;
}
/*.cookie-consent-banner .cookie-banner-categories,*/
.cookie-consent-banner .cmplz-save-preferences,
.cookie-consent-banner .cmplz-link.cmplz-manage-options,
.cookie-consent-banner .cmplz-manage-vendors,
.cookie-consent-banner .cmplz-read-more,
.cookie-consent-banner .cmplz-btn.cmplz-manage-options {
    display: none;
}
.cookie-consent-banner .cookie-banner-links.cookie-banner-information {
    display: none;
}
.cookie-consent-banner .cookie-banner-information {
    justify-content: space-between;
}
.cookie-consent-banner .cookie-banner-links {
    display: flex;
    gap: 10px;
}
.cookie-consent-banner .cookie-banner-links.cookie-banner-documents {
    justify-content: center;
}
.cookie-consent-banner .cookie-banner-links .cookie-banner-link {
    color: #5f5f5f;
    font-size: small;
    text-decoration: underline;
    margin: 0;
}
.cookie-consent-banner .cookie-banner-links .cookie-banner-link:hover {
    color: #222;
    transition-duration: .1s;
    transition-timing-function: linear;
}
.cookie-consent-banner .cookie-banner-buttons {
    display: flex;
    gap: 10px;
}
.cookie-consent-banner .cookie-banner-categories .cookie-banner-category:not(:last-child) {
    margin-bottom: 10px;
}
.cookie-consent-banner .cookie-banner-categories .cookie-banner-category {
    background-color: rgba(239, 239, 239, 0.5);
}
.cookie-consent-banner .cookie-banner-categories .cookie-banner-category .cookie-banner-category-header {
    display: grid;
    grid-template-columns: 1fr auto 15px;
    grid-template-rows: minmax(0, 1fr);
    align-items: center;
    grid-gap: 10px;
    padding: 10px;
}
.cookie-consent-banner .cookie-banner-categories .cookie-banner-category .cookie-banner-category-header .cookie-banner-category-title {
    font-weight: 500;
    grid-column-start: 1;
    justify-self: start;
    font-size: smaller;
    color: #222;
    margin: 0;
}
.cookie-consent-banner .cookie-banner-categories .cookie-banner-category .cookie-banner-category-header .cookie-banner-icon.cookie-banner-open {
    grid-column-start: 3;
    cursor: pointer;
    content: '';
    transform: rotate(0deg);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    background-size: cover;
    height: 18px;
    width: 18px;
}
.cookie-consent-banner .cookie-banner-categories .cookie-banner-category .cookie-banner-category-header .cookie-banner-icon.cookie-banner-open svg {
     vertical-align: inherit;
 }
.cookie-consent-banner .cookie-banner-categories .cookie-banner-category .cookie-banner-description {
    font-size: small;
    color: #222;
    margin: 0;
    max-width: 100%;
    padding: 10px;
}

/**
 * Main Content
 */
.alert {
    border-radius: 0;
}
.alert-danger {
    border-left: 3px solid #dc3545;
}
.alert-primary {
    border-left: 3px solid #6593b7;
}
.content__main {
    flex: 1 0 auto;
    width: 100%;
    background-color: white;
}

.form-control {
    border-radius: 2px;
}

.similar {
    font-size: 18px;
    /*margin-bottom: 8px;*/
    color: var(--bs-heading-color);;
}

.leftcustom {
    width:220px;
    float:left;
    margin-right:4px;
    padding:0px;
}

.left-box{
    margin: 0 5px 20px 8px;
    font-size: 14px;
}
.left-box:first-of-type{
    margin-top: 10px;
}

.prod-cat-p {
    margin: 0;
    line-height: 1.2 !important;
}

.left-box .title {
  border-left:#8fabbb 1px solid;
  border-right:#8fabbb 1px solid;
  border-top:#8fabbb 1px solid;
  color: white;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  padding-left: 8px;
  background-image: -moz-linear-gradient(top, #afc3ce, #5e8fb7);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#afc3ce), to(#5e8fb7));
  background-image: -webkit-linear-gradient(top, #afc3ce, #5e8fb7);
  background-image: -o-linear-gradient(top, #afc3ce, #5e8fb7);
  background-image: linear-gradient(to bottom, #afc3ce, #5e8fb7);
  background-repeat: repeat-x;
    line-height: 28px;
  -webkit-border-top-left-radius: 1px;
     -moz-border-top-left-radius: 1px;
          border-top-left-radius: 1px;
  -webkit-border-top-right-radius: 1px;
     -moz-border-top-right-radius: 1px;
          border-top-right-radius: 1px;
}

.left-box .boxcontent {
  box-shadow: 0 8px 8px -10px rgba(0,0,0,.25);
  background-color: #F5F5F5;
  border-left:#e2e2e2 1px solid;
  border-right:#e2e2e2 1px solid;
  border-bottom:#e2e2e2 1px solid;
  padding: 10px;

}
.left-box .manubox {
  /*height: 571px;*/
  background-color: #F5F5F5;
  margin:0;
  padding: 12px 10px 14px;
  border-left:#e2e2e2 1px solid;
  border-right:#e2e2e2 1px solid;
  border-bottom:#e2e2e2 1px solid;
  -webkit-border-bottom-left-radius: 0;
     -moz-border-bottom-left-radius: 0;
          border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
     -moz-border-bottom-right-radius: 0;
          border-bottom-right-radius: 0;

}
.left-box .manubox p {
  padding-bottom: 14px;
  text-align: center;
}
.tab-content-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
}
.tab-content-list-item:nth-child(2n+1) {
    background: #f5f5f5;
}
.tab-content-list-item {
    align-items: center;
    padding: .35rem .75rem;
    display: flex;
    justify-content: space-between;
}
.tab-content-list-item .list-item-wrapper {
    align-items: center;
    display: inline-flex;
}
.tab-content-list-item .list-item-link {
    color: rgb(19, 107, 179);
}
.tab-content-list-item a:hover {
    text-decoration: underline;
}

[class^="brands-"], [class*=" brands-"] {
    display: block;
    margin: 11px auto;
    background-image: url("../img/csg-52a473633ce38.png");
    background-repeat: no-repeat;
}
.brands-siemens:hover{ background-position: -153px -680px; width: 103px; height: 30px; text-decoration: none; }
/*.brands-siemens{ background-position: -153px -748px; width: 103px; height: 30px; }*/
.brands-siemens{ background-position: -153px -680px; width: 103px; height: 30px; }
.brands-ifm:hover{ background-position: 0 -616px; width: 30px; height: 30px; text-decoration: none; }
.brands-ifm{ background-position: 0 -696px; width: 30px; height: 30px; }
.brands-turck:hover{ background-position: -153px -976px; width: 80px; height: 30px; text-decoration: none; }
.brands-turck{ background-position: -153px -1056px; width: 80px; height: 30px; }
.brands-pepperl-fuchs:hover{ background-position: -153px -254px; width: 103px; height: 30px; text-decoration: none; }
.brands-pepperl-fuchs{ background-position: -153px -317px; width: 103px; height: 30px; }
.brands-vipa:hover{ background-position: -153px -1136px; width: 82px; height: 30px; text-decoration: none; }
.brands-vipa{ background-position: -153px -1216px; width: 82px; height: 30px; }
.brands-abb:hover{ background-position: 0 0; width: 77px; height: 30px; text-decoration: none; }
.brands-abb{ background-position: 0 -80px; width: 77px; height: 30px; }
.brands-jumo:hover{ background-position: 0 -776px; width: 86px; height: 30px; text-decoration: none; }
.brands-jumo{ background-position: 0 -856px; width: 86px; height: 30px; }
.brands-baumueller:hover{ background-position: 0 -160px; width: 98px; height: 30px; text-decoration: none; }
.brands-baumueller{ background-position: 0 -240px; width: 98px; height: 30px; }
.brands-keyence:hover{ background-position: 0 -1096px; width: 103px; height: 30px; text-decoration: none; }
.brands-keyence{ background-position: 0 -1168px; width: 103px; height: 30px; }
.brands-lenze:hover{ background-position: 0 -1850px; width: 103px; height: 30px; text-decoration: none; }
.brands-lenze{ background-position: 0 -1926px; width: 103px; height: 30px; }
.brands-leuze_electronic:hover{ background-position: -153px 0; width: 103px; height: 30px; text-decoration: none; }
.brands-leuze_electronic{ background-position: -153px -66px; width: 103px; height: 30px; }
.brands-sick:hover{ background-position: -153px -520px; width: 95px; height: 30px; text-decoration: none; }
.brands-sick{ background-position: -153px -600px; width: 95px; height: 30px; }
.brands-landies-gyr:hover{ background-position: 0 -1538px; width: 79px; height: 30px; text-decoration: none; }
.brands-landies-gyr{ background-position: 0 -1618px; width: 79px; height: 30px; }
.brands-orientalmotor:hover{ background-position: -153px -132px; width: 103px; height: 30px; text-decoration: none; }
.brands-orientalmotor{ background-position: -153px -196px; width: 103px; height: 30px; }
.brands-crouzet:hover{ background-position: 0 -320px; width: 102px; height: 29px; text-decoration: none; }
.brands-crouzet{ background-position: 0 -399px; width: 102px; height: 29px; }
.brands-schrack_energietechnik:hover{ background-position: -153px -386px; width: 103px; height: 30px; text-decoration: none; }
.brands-schrack_energietechnik{ background-position: -153px -453px; width: 103px; height: 30px; }
.brands-krohne:hover{ background-position: 0 -1384px; width: 103px; height: 27px; text-decoration: none; }
.brands-krohne{ background-position: 0 -1461px; width: 103px; height: 27px; }
.brands-honeywell:hover{ background-position: 0 -478px; width: 103px; height: 30px; text-decoration: none; }
.brands-honeywell{ background-position: 0 -547px; width: 103px; height: 30px; }
.brands-keb:hover{ background-position: 0 -936px; width: 66px; height: 30px; text-decoration: none; }
.brands-keb{ background-position: 0 -1016px; width: 66px; height: 30px; }
.brands-klauke:hover{ background-position: 0 -1240px; width: 103px; height: 30px; text-decoration: none; }
.brands-klauke{ background-position: 0 -1312px; width: 103px; height: 30px; }
.brands-legrand:hover{ background-position: 0 -1698px; width: 103px; height: 30px; text-decoration: none; }
.brands-legrand{ background-position: 0 -1774px; width: 103px; height: 30px; }
.brands-smc_networks:hover{ background-position: -153px -816px; width: 64px; height: 30px; text-decoration: none; }
.brands-smc_networks{ background-position: -153px -896px; width: 64px; height: 30px; }
.brands-wago:hover{ background-position: -153px -1296px; width: 89px; height: 30px; text-decoration: none; }
.brands-wago{ background-position: -153px -1376px; width: 89px; height: 30px; }
.brands-wika:hover{ background-position: -153px -1456px; width: 97px; height: 30px; text-decoration: none; }
.brands-wika{ background-position: -153px -1536px; width: 97px; height: 30px; }

.hyphenate {
    word-wrap: break-word;
    overflow-wrap: break-word;

    -webkit-hyphens: auto;
        -moz-hyphens: auto;
            hyphens: auto;
}

div.auto {
   -webkit-hyphens: auto;
   hyphens: auto;
}

.right-box-catalog {
  border:#e2e2e2 1px solid;
  min-height: 1051px;
  padding: 10px;
  margin-bottom:0;
  color: inherit;
  background-color:#F5F5F5;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

.box1{width:218px; padding:0; border:#999 1px solid; float:left;}

.box5{width:220px; padding-top:5px; float:left; clear:left;}
.box5 .header{background:#0080C0; padding-left:5px; border:#999 1px solid; text-align:left;}

.left ul {margin:0; padding:0;}
.left ul li {list-style:none;}
.left .list1{float:left; width:108px; margin:0; padding-right:1px; text-align:right;}
.left .list2{float:left; width:108px; margin:0; padding-left:1px; text-align:left;}
.content { border:#999 1px solid; margin-bottom:5px; padding:5px;}


/**
 * Footer
 */
footer .nav-link {
    color: #333333;
    padding: .25rem 0;
}
footer a:hover {
    color: #0056b3;
    text-decoration: underline;
}
.footer {
    margin-top: auto;
    background-color: #e6e6e6;
}
.footertop{
    color: #333333;
    padding: 10px 35px 10px 40px;
}
.footerbottom{
    background-color:#333;
    border:#444 1px solid;
    color: #fff;
    text-align: center;
    line-height: 2;
}
/*.footer {
    color: #98a1a7;

    padding: 1.25rem 2.375rem 1.25rem 2.375rem;
    background-color: #f7f7f7;
}*/
.footer h4 {
    color: #636c72;
    font-family: Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;
    font-size: large;
    font-weight: 500;
}
.footer p {
    font-size: 0.875rem;
    line-height: 1.2
}
.footer ul {
    padding-left: 0;
    margin: 0;
}
.footer ul li {
    font-size: 0.875rem;
    list-style: none;
}
.footer hr {
    margin: 10px 0;
}

ul.custmenu {
    margin:0;
    padding: 0;
    display: inline-block;
    background-color: #2b2b2b;
    background-repeat: no-repeat;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4f4f4f), to(#2b2b2b));
    background-image: -webkit-linear-gradient(#4f4f4f, #2b2b2b);
    background-image: -moz-linear-gradient(top, #4f4f4f, #2b2b2b);
    background-image: -ms-linear-gradient(#4f4f4f, #2b2b2b);
    background-image: -o-linear-gradient(#4f4f4f, #2b2b2b);
    background-image: linear-gradient(#4f4f4f, #2b2b2b);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4f4f4f', endColorstr='#2b2b2b', GradientType=0);
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    width: 100%;
}

ul.custmenu li {
    float: left;
    list-style: none;
    border-right: 1px solid #4f4f4f;
    position: relative;
}

ul.custmenu li a {
    color: white;
    display: block;
    font-family: Arial;
    font-size: 13px;
    padding: 8px 20px 10px;
    text-decoration: none;
    border-right: 1px solid #2b2b2b;
}

ul.custmenu li a:hover {
    background-color: #2b2b2b;
}

ul.menu li:first-child a:hover {
    border-radius: 4px 0 0 4px;
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
}
ul.custmenu li ul {
    display: none;
}

ul.custmenu li:hover ul {
    display: block;
    position: absolute;
    top: 34px;
    border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    background-color: #2b2b2b;
    z-index: 1000;
}

ul.custmenu li:hover ul li {
    float: none;
    width: 180px;
    border-right: none;
}

ul.custmenu li:hover ul li a {
    border-top: 1px solid #4f4f4f;
    border-right: none;
    padding: 6px 20px 8px;
}

ul.custmenu li:hover ul li a:hover {
    background-color: transparent;
    color: #c1deff;
}

ul.custmenu li:hover ul li:first-child a:hover {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}

.addtomem {
    margin-top: 14px;
}
.pagination {
    border-radius: 0;
}
.page-item:first-child .page-link {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.page-item:last-child .page-link {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: #598ab2;
    border-color: #598ab2;
}
.page-link {
    color: #4d76a2;
}
.pointer {
    cursor: pointer;
}

#links{
        margin-right: 20%;
}
#rechts{
        float: right;
        width: 50%;
}
.list_link {
    display: list-item;
    list-style-type: circle;
    list-style-position: inside;
    margin-left: 50px;
}
/*.list a {display: block;}
.list_link:before {
    
}*/
.clear_block {clear:both; height:1px; overflow:hidden;}


#result{
    margin: 0 auto;
}

.column1{width: 190px;float:left;line-height:1;margin-left:20px; padding: 5px;}
.column2{width: 440px;float:left;line-height:1;margin-left:20px; padding: 5px;}

.card {
    border-radius: 1px;
}
.cards-wrapper {
    display: flex;
}
.cards-wrapper .card {
    margin: 0 .5rem;
    width: calc(100%/4);
}

/* Categories */
.category {
    margin: 5px 20px 5px 20px;
}
.category > a {
  display: block;
  padding: 10px;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  text-decoration: none;
}
.category > a > h4 {
  /*color: #aeadad;*/
  font-size: large;
  font-weight: normal;
  margin: 0;
}
.category:hover h2,
.category:focus h2,
.category:active h2 {
  /*background-color: #4D88B7;*/
  color: #ffffff;
}
.category:hover h4,
.category:focus h4,
.category:active h4 {
    /*background-color: #4D88B7;*/
    color: #ffffff;
}
.category > a:hover,
.category > a:focus,
.category > a:active {
    background-color: #4D88B7;
    color: #f6f6f6;
}
.cat1{width:90%; height:40px; line-height: 40px; margin-top:15px; margin-left:25px; padding:0;font-size:medium; float:left;
}
.cat1 a {display: block;
  padding-left:20px;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}
.cat1 a:hover {
  background: #4D88B7;
  padding-left: 20px;
  color: white;
  text-decoration: none;
  -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
          border-radius: 2px;
}
.cat1-1{width:90%; height:40px; line-height: 40px; margin-top:15px; margin-left:45px; padding:0;font-size:medium; float:left;
}
.cat1-1 a {
  display: block;
  padding-left:20px;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}
.cat1-1 a:hover {
  background:#4D88B7;
  padding-left:20px;
  color: white;
  text-decoration: none;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}


.input-mysize { width: 200px }
.input-mysize2 { width: 232px }
.input-mysize3 { width: 478px }

.invalid-feedback {
    margin-top: .125rem;
}

.nav .customnav{width: 115px !important; text-align: center;}
.nav .size1{width: 115px !important; text-align: center;}
.nav .size2{width: 135px !important; text-align: center;}
.nav .size3{width: 165px !important; text-align: center;}
.nav .size4{width: 200px !important; text-align: center;}

.tbl_header {
    text-align: center;
}


    /* MARKETING CONTENT
    -------------------------------------------------- */


    /* Featurettes
    ------------------------- */

    .featurette-divider {
      margin: 80px 0; /* Space out the Bootstrap <hr> more */
    }
    .featurette {
      padding-top: 120px; /* Vertically center images part 1: add padding above and below text. */
      overflow: hidden; /* Vertically center images part 2: clear their floats. */
    }
    .featurette-image {
      margin-top: -120px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */
    }

    /* Give some space on the sides of the floated elements so text doesn't run right into it. */
    .featurette-image.pull-left {
      margin-right: 40px;
    }
    .featurette-image.pull-right {
      margin-left: 40px;
    }

    /* Thin out the marketing headings */
    .featurette-heading {
      font-size: 50px;
      font-weight: 300;
      line-height: 1;
      letter-spacing: -1px;
    }

.breadcrumb {
    margin-bottom: 10px;
    padding: 8px;
    list-style: none;
    background-color: #f8f9fa;
    font-size: small;
}
.breadcrumb > div {
  display: inline-block;
  *display: inline;
  text-shadow: 0 1px 0 #ffffff;
  *zoom: 1;
}
.breadcrumb > div > a:hover {
  text-decoration: none;
  display: inline-block;
}
.breadcrumb > div > .divider {
  padding: 0 5px;
  color: #ccc;
}
.breadcrumb .active {
  color: #999999;
}

.breadcrumb > li {
  display: inline-block;
  *display: inline;
  text-shadow: 0 1px 0 #ffffff;
  *zoom: 1;
}

.breadcrumb > li > .divider {
  padding: 0 5px;
  color: #ccc;
}

.breadcrumb > .active {
  color: #999999;
}

.usrhonpt {
  display: none;
}
.table th,.table td {
    line-height: 16px;
    text-align: left;
    vertical-align: top;
    border-top: 1px solid #ddd
}
.btn {
    transition: 0.3s;
}
.btn-outline-info {
    color: #31709f;
    border-color: #85a7c1;
}
.btn-outline-info:hover {
    color: #fff;
    background-color: #598ab2;
    border-color: #6995b8;
}
.btn-micro{
  padding: 4px 6px;
  margin: 0;
  font-size: 14px;
  -webkit-border-radius: 0;
     -moz-border-radius: 0;
          border-radius: 0
}
.text-auto {
    color: #598AB2 !important;
}
.groupButtons {
    display: flex;
    justify-content: space-between;
}

.btn-micro .caret{margin-top:4px}
button.btn.btn-micro,input[type="submit"].btn.btn-micro{*padding-top:1px;*padding-bottom:1px}

.product-image {
    border: 1px solid #e0dddd;
    border-radius: 1px;
}
.prodimg2 {
    border: 1px solid #e0dddd;
    max-height: 100%;
    height: auto;
    margin: 2px 8px 0px 0px;
    float: left;
}
.product-info p {
    margin: 0;
}
.product-description {
    line-height: 1.2;
}

.catimg {
    border: 1px solid #e0dddd;
    width: 221px;
    height: 80px;
    margin: 2px 8px 0px 0px;
    float: left;
}

.prod {
  width: 100%;
  height: 8px;
  z-index: 4;
    /*background: url("../bg/footer-bar.png") repeat-x scroll center -10px transparent;*/
    margin: 10px 0px;
    border-right: 0px none;
    border-left: 0px none;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    border-width: 1px 0px;
    border-style: solid none;
    border-color: rgb(238, 238, 238) -moz-use-text-color rgb(255, 255, 255);
}

/** Memo Styles **/
input[type="memo"] {
    background-color: #FFF;
    border: 1px solid #CCC;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
}
input[type="memo"] {
    display: inline-block;
    padding: 4px 6px;
    font-size: 14px;
    line-height: 16px;
    color: #555;
    vertical-align: middle;
    border-radius: 2px;
}
input[type="memo-count"] {
    background-color: #FFF;
    border: 1px solid #CCC;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
}
input[type="memo-count"] {
    display: inline-block;
    padding: 4px 6px;
    font-size: 12px;
    line-height: 12px;
    color: #555;
    vertical-align: middle;
    border-radius: 2px;
}
.input-memo {
  width: 52px;
}

.form-control:focus {
    box-shadow: 0 0 0 .1rem rgba(13,110,253,.25);
}
.form-control-sm {
    border-radius: 1px;
}
.form-floating > .form-control, .form-floating > .form-control-plaintext, .form-floating > .form-select {
    height: calc(3rem + calc(var(--bs-border-width) * 2));
    min-height: calc(3rem + calc(var(--bs-border-width) * 2));
    line-height: 1.2;
}

.form-floating > .form-control-plaintext:focus,
.form-floating > .form-control-plaintext:not(:placeholder-shown),
.form-floating > .form-control:focus,
.form-floating > .form-control:not(:placeholder-shown) {
    padding-top: 1.5rem;
    padding-bottom: .5rem;
}
.form-floating > .form-control-plaintext ~ label::after,
.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-select ~ label::after {
    height: 1.125em;
}
.form-floating > label {
    padding: .75rem .375rem;
}

.btn {
    -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
            border-radius: 2px
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary[disabled] {
    color: #FFF;
    background-color: #1B6AAC;
}
.btn-primary {
    color: #FFF;
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.25);
    background-color: #0082F3;
    background-image: linear-gradient(to bottom, #A5C1D0, #4D83AF);
    background-repeat: repeat-x;
    /*border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);*/
    border-left: 1px solid #8FABBB;
    border-right: 1px solid #8FABBB;
    border-top: 1px solid #8FABBB;
    border-bottom: 1px solid #4d83af;
}
.btn-primary:hover {
    border-color: #688ba0;
    background-image: linear-gradient(to bottom, #4E9DC8, #4D83AF);
}

.img-shadow {
  -moz-box-shadow: 3px 3px 2.5px #C5C2C2;
  -webkit-box-shadow: 3px 3px 2.5px #C5C2C2;
  box-shadow: 3px 3px 2.5px #C5C2C2;
  margin: 4px 0px 18px 4px;
}
.img-shadow2 {
  -moz-box-shadow: 3px 3px 2.5px #C5C2C2;
  -webkit-box-shadow: 3px 3px 2.5px #C5C2C2;
  box-shadow: 3px 3px 2.5px #C5C2C2;
  margin: 4px 0px 18px 0px;
  height: 165px;
  width: 314px;
}
p.services-section {
  margin: 0px 6px 0px 0px;
}

.bildquelle {
    font-size: smaller;
    position: absolute;
    bottom: 25px;
}

h1 {
    font-size: x-large;
    text-rendering: optimizelegibility;
    line-height: 1;
}
h2 {
    font-size: 135%;
    text-rendering: optimizelegibility;
}
h4 {
    font-size: large;
    text-rendering: optimizelegibility;
}
.right-box {
    min-height: 100%;
    margin: 0;
    padding: 8px;
    color: inherit;
    background-color:#F5F5F5;
    -webkit-border-radius: 0;
        -moz-border-radius: 0;
            border-radius: 0;
}
.main-box-content {
    padding: 10px 20px 20px 20px;
}
.main-box-content ul {
    list-style-position: inside;
}
.main-box-content li {
    line-height: 1.2;
}
.paragraph {
    margin-bottom: 18px;
}
.paragraph > p {
    font-size: 90%;
    line-height: 1.2;
    margin-bottom: 6px;
}

.category-item h4 {
    margin: 0;
}
.category-item p {
    line-height: 1;
}


@media (max-width: 575.98px) {
    .header {
        min-height: 58px;
    }
    .header__left {
        gap: 0 6px;
    }
    .header__right {
        align-items: flex-start;
        padding: 0 8px 6px;
    }
    .header .lang {
        margin: 4px 0 0;
    }
    .header__lang_title {
        display: none;
    }
    .header a#brand {
        margin: 2px 0 0;
        font-size: .72rem;
        text-align: left;
        text-shadow: none;
    }
    .header__certificate-link {
        display: none;
    }
    .header__left .slogan {
        display: none;
    }
    .logo__img {
        margin-left: 8px;
        height: 40px;
        margin-top: 6px;
    }
}
@media (min-width: 576px) {
    h1 {
        font-size: x-large;
        line-height: 1;
    }
    h2 {
        font-size: larger;
    }
    .header {
        min-height: 74px;
    }
    .header a#brand {
        margin: 4px 8px 0px 0px;
        line-height: .95;
        font-size: 70%;
    }
    .header .contacts{
        display: block;
        margin: 2px 8px 0 0;
    }
    .header .slogan {
        font-size: x-small;
    }
    .logo__img {
        margin-left: 20px;
        height: 52px;
    }
    .right-box {
        margin: 0;
        padding: 8px;
    }
    .main-box-content {
        padding: 10px 20px 20px 20px;
    }
    .main-box-content > p {
        font-size: 100%;
        line-height: 1.5;
    }
    .main-box-content li {
        line-height: 1.5;
    }
    .cookie-consent-banner .cookie-banner-body {
        min-width: 350px;
    }
}

@media (max-width: 767.98px) {
    .header {
        min-height: auto;
    }
    .header .row {
        flex-wrap: nowrap;
        align-items: center;
    }
    .header__left {
        flex: 1 1 auto;
        min-width: 0;
        align-items: center;
        gap: 0 8px;
    }
    .header__right {
        flex: 0 0 auto;
        width: auto;
        max-width: none;
        align-items: flex-start;
        padding: 0 2px 0 0;
        margin-left: auto;
    }
    .header .lang {
        margin: 4px 0 0;
        float: none;
        margin-left: auto;
    }
    .header .lang ul {
        display: flex;
        align-items: center;
        gap: 4px;
        margin: 0;
        padding-left: 0 !important;
        white-space: nowrap;
        justify-content: flex-end;
    }
    .header .lang ul li {
        float: none;
        display: inline-flex;
        margin-right: 0;
        font-size: 14px;
    }
    .header__lang_title,
    .header__certificate-link,
    .header__partner,
    .header a#brand {
        display: none !important;
    }
    .header .contacts {
        display: none !important;
    }
    .header__left .slogan {
        display: block !important;
        width: auto;
        padding-left: 8px;
        margin: 0;
        font-size: 12px;
        line-height: 1.2;
    }
    .logo__img {
        margin-left: 8px;
        height: 40px;
        margin-top: 4px;
    }
}
@media (max-width: 390px) {
    .header__left {
        gap: 0 4px;
    }
    .header__right {
        padding: 0 6px 6px;
    }
    .header .lang ul li {
        margin-right: 4px;
        font-size: 13px;
    }
    .header .contacts,
    .header__left .slogan,
    .header__partner,
    .header a#brand {
        display: none !important;
    }
    .logo__img {
        margin-left: 6px;
        height: 38px;
        margin-top: 4px;
    }
}

@media (max-width: 360px) {
    .header .lang ul li {
        margin-right: 3px;
        font-size: 12px;
    }
    .logo__img {
        margin-left: 4px;
        height: 36px;
        margin-top: 4px;
    }
}
@media (min-width:768px){
    .header {
        min-height: 96px;
    }
    .logo__img{
        margin-left: 22px;
        height: 64px;
    }
    .header__certificate-img{
        max-height: 54px;
    }
    .header .contacts{
        display: block;
        margin: 2px 8px 0 0;
    }
    .header .slogan {
        font-size: small;
    }
    .header__partner,
    .header a#brand{
        display: none !important;
    }
    .navbar{
        justify-content: flex-end;
    }
    .navbar__btn{
        padding: 7px;
        cursor: pointer;
    }
    .navbar__burger{
        display: none;
    }
    .left-box {
        margin-right: 8px;
    }
    .main-box-content > p {
        font-size: 100%;
        line-height: initial;
    }
    .carousel-custom .carousel-inner {
        display: flex;
        padding: .5rem;
    }
    .carousel-custom .carousel-item {
        margin-right: 0;
        flex: 0 0 20%;
        display: block;
    }
    .carousel-custom .card{
        margin: 0 1rem;
        box-shadow: 1px 1px 4px 0 rgba(22, 22, 26, 0.18);
        border: none;
    }
    .carousel-custom .carousel-control-prev,
    .carousel-custom .carousel-control-next{
        background-color: #e1e1e1;
        width: 6vh;
        height: 6vh;
        border-radius: 50%;
        top: 50%;
        transform: translateY(-50%);
    }
    .cookie-consent-banner {
        min-width: 580px;
        max-width: 100%;
        display: grid;
        grid-row-gap: 10px;
    }
    .cookie-consent-banner .cookie-banner-message,
    .cookie-consent-banner .cookie-banner-categories {
        width: calc(580px - 42px);
    }
}

@media (min-width: 992px) {
    h1 {
        font-size: x-large;
        font-family: inherit;
        font-weight: normal;
    }
    h2 {
        font-size: 134%;
        font-family: inherit;
        font-weight: normal;
        line-height: 1.1;
    }
    .header {
        min-height: 124px;
    }
    .header .contacts {
        display: block;
    }
    .header__partner {
        display: block !important;
    }
    .header a#brand {
        display: block !important;
        margin: 5px 10px 0 0;
        line-height: 1.05;
        font-size: large;
    }
    .header .slogan {
        font-size: 16px;
    }
    .logo__img{
        margin-left: 32px;
        height: 80px;
    }
    .header__certificate-img{
        max-height: 72px;
    }
    .navbar__burger{
        display: none;
    }
    .right-box {
        /*margin: 10px 8px 0px 8px;*/
        padding: 11px 10px;
    }
}

@media (min-width: 1200px) {
    .header {
        min-height: 118px;
    }
    .header .contacts {
        display: block;
        margin: 4px 10px 0 0;
    }
    .header .lang {
        margin: 8px 12px 0 0;
    }
    .header a#brand {
        margin: 5px 15px 5px 15px;
        line-height: 1.05;
    }
    .header .slogan {
        font-size: 16px;
    }
    .logo__img{
        margin-left: 40px;
        margin-right: 12px;
        height: 90px;
    }
    .navbar__burger{
        display: none;
    }

}

@media (min-width: 1400px) {
    .header {
        min-height: 118px;
    }
    .header .lang {
        margin: 8px 12px 0 0;
    }
    .header a#brand {
        margin: 5px 15px 5px 15px;
        line-height: 1.05;
    }
    .header .slogan {
        font-size: 16px;
    }
    .logo__img{
        margin-left: 40px;
        height: 90px;
    }
    .navbar__burger{
        display: none;
    }

}

/* Siemens product serie page */
.product-serie-page .serie-nav .btn {
    font-size: 0.78rem;
    padding: 0.2rem 0.5rem;
    line-height: 1.2;
    font-weight: 600;
}

.product-serie-page .serie-nav .btn-outline-primary {
    border-color: #4f88b6;
    color: #4f88b6;
}

.product-serie-page .serie-nav .btn-outline-primary:hover,
.product-serie-page .serie-nav .btn-outline-primary:focus {
    background-image: linear-gradient(to bottom, #4e9dc8, #4d83af);
    border-color: #688ba0;
    color: #fff;
}

/* Keep tooltip hover on disabled-like buttons */
.product-serie-page .serie-nav .btn-outline-secondary.is-disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.product-serie-page .manufacturer-panel {
    border: 1px dashed #9cb3c2;
    background: #f5f9fc;
    padding: 0.75rem 1rem;
}

.product-serie-page .nav-tabs .nav-link {
    color: #30506b;
    background-color: #f3f6f9;
    border-color: #9fb0c0 #9fb0c0 transparent;
    border-style: dotted dotted solid;
    border-width: 1px 1px 1px;
    font-weight: 500;
}

.product-serie-page .nav-tabs .nav-link.active {
    color: #1f3646;
    background-color: #ffffff;
    border-color: #b6c3d0 #b6c3d0 #ffffff;
    font-weight: 500;
}

.product-serie-page .variants-summary {
    border: 1px solid #d6e0e8;
    border-left: 4px solid #5f8bab;
    background: #f8fbfd;
    padding: 0.65rem 0.85rem;
    font-size: 0.9rem;
    color: #335063;
}

.product-serie-page .variant-group {
    border-radius: 0;
    background: #ffffff;
}

.product-serie-page .variant-group + .variant-group {
    margin-top: 1rem;
}

.product-serie-page .variant-group-header {
    border-bottom: 1px solid #e3e9ef;
    background: #f8fafc;
    padding: 0.7rem 0.85rem;
}

.product-serie-page .variant-group-title {
    margin: 0;
    color: #234055;
    font-weight: 600;
}

.product-serie-page .variant-group-subtitle {
    margin-top: 0.25rem;
    color: #5f7485;
    font-size: 0.9rem;
}

.product-serie-page .variant-group-content {
    padding: 0.75rem 0.85rem;
    border: none;
}

.product-serie-page .variant-subgroup-block + .variant-subgroup-block {
    margin-top: 0.8rem;
    margin-left: 0;
}

.product-serie-page .variant-subgroup-block--rest {
    padding-top: 0.6rem;
    border-top: 1px dashed #d5e0e8;
    margin-left: 0;
}

.product-serie-page .variant-major-group-title {
    margin-top: 1rem;
    margin-bottom: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-left: 4px solid #6f97b5;
    background: #eef4f8;
    color: #2c4d64;
    font-size: smaller;
    font-weight: 600;
}

.product-serie-page .variant-major-group-title--subgroup {
    margin-top: 0.65rem;
    margin-bottom: 0.35rem;
    padding: 0;
    border-left: none;
    background: transparent;
    /*color: #4b667a;*/
    font-size: 0.86rem;
    font-weight: 400;
    text-decoration-line: underline;
    text-decoration-style: dashed;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.product-serie-page .variant-major-group-title--subgroup span::after {
    content: ':';
}
.product-serie-page .variant-chip-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.45rem 0.6rem;
}

.product-serie-page .variant-chip-item {
    display: block;
    position: relative;
}

.product-serie-page .variant-chip-media {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    width: 100%;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 0;
    padding: 0.3rem 2.2rem 0.3rem 0.3rem;
    transition: background-color 0.18s ease, border-color 0.18s ease;
}

.product-serie-page .variant-chip-item--selected .variant-chip-media {
    background: aliceblue;
    border-color: #b7cee3;
}

.product-serie-page .variant-chip-memo-btn {
    position: absolute;
    top: 0.28rem;
    right: 0.28rem;
    z-index: 2;
    opacity: 0;
    pointer-events: none;
    border: none;
    background: transparent;
    color: #6a7f91;
    font-size: 0.9rem;
    line-height: 1;
    padding: 0.1rem;
}

.product-serie-page .variant-chip-item:hover .variant-chip-memo-btn,
.product-serie-page .variant-chip-item:focus-within .variant-chip-memo-btn,
.product-serie-page .variant-chip-item--selected .variant-chip-memo-btn {
    opacity: 1;
    pointer-events: auto;
}

.product-serie-page .variant-chip-memo-btn.is-selected {
    color: #1f4f78;
}

@media (max-width: 991.98px) {
    .product-serie-page .variant-chip-memo-btn {
        opacity: 1;
        pointer-events: auto;
    }
}

.product-serie-page .variant-chip-thumb-wrap {
    display: inline-flex;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
}

.product-serie-page .variant-chip-thumb {
    width: 42px;
    height: 42px;
    object-fit: contain;
    border: 1px solid #d7e0e8;
    background: #ffffff;
}

.product-serie-page .variant-chip-body {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
}

.product-serie-page .variant-partno {
    font-size: smaller;
    line-height: 1.2;
    font-weight: 700;
    color: #2f4f67;
}

.product-serie-page .variant-chip-media:hover .variant-partno,
.product-serie-page .variant-chip-media:focus .variant-partno {
    color: #1b6aac;
    text-decoration: underline;
}

.product-serie-page .variant-chip-meta {
    max-width: 19rem;
    line-height: 1.15;
    color: #6a7f8f;
    font-size: 0.76rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (min-width: 992px) {
    .product-serie-page .variant-chip-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1400px) {
    .product-serie-page .variant-chip-list {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.product-serie-page .variant-group-meta {
    margin-top: 0.55rem;
    color: #6a7f8f;
    font-size: 0.84rem;
}

/* Similar slider v2 (scroll-snap, mobile-first) */
.similar-slider {
    margin-top: 0.75rem;
}

.similar-slider__controls {
    display: flex;
    justify-content: flex-end;
    gap: 0.4rem;
}

.similar-slider__control {
    border: 1px solid #b8c9d8;
    background: #ffffff;
    color: #30506b;
    min-width: 2rem;
    height: 2rem;
    line-height: 1;
    font-size: 0.95rem;
    padding: 0;
}

.similar-slider__control[disabled] {
    opacity: 0.45;
    cursor: not-allowed;
}

.similar-slider__viewport {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding: 0.45rem 0.2rem 0.6rem;
}

.similar-slider__track {
    display: flex;
    gap: 0.7rem;
}

.similar-slider__item {
    flex: 0 0 58%;
    scroll-snap-align: start;
}

.similar-slider__card {
    background: #ffffff;
    border: 1px solid #d5e0ea;
    box-shadow: 1px 1px 3px rgba(22, 22, 26, 0.14);
}

.similar-slider__card > a {
    display: block;
    color: inherit;
    text-decoration: none;
}

.similar-slider__card picture {
    display: block;
    width: 100%;
}

.similar-slider__card .product-image,
.similar-slider__card .card-img-top {
    display: block;
    width: 100%;
    height: 116px;
    object-fit: contain;
    border: 0;
    margin: 0;
}

.similar-slider__title {
    margin: 0;
    padding: 0.22rem 0.35rem;
    text-align: center;
    background-color: #6b97bb;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 600;
}


@media (min-width: 576px) {
    .similar-slider__item {
        flex-basis: 38%;
    }
}

@media (min-width: 768px) {
    .similar-slider__item {
        flex-basis: 29%;
    }
}

@media (min-width: 1200px) {
    .similar-slider__item {
        flex-basis: 18%;
    }
}

/* Shared editorial page snippets */
.services-content h1,
.fields-content__intro h1 {
    margin-bottom: 0.65rem;
    color: #173b59;
}

.services-content h2,
.fields-content__section h2 {
    color: #173b59;
    font-size: 1.15rem;
}

.services-content p,
.fields-content__intro p,
.fields-content__section p,
.fields-content__section li,
.fields-content__contact {
    color: #263746;
    line-height: 1.45;
}

.services-content ul,
.fields-content__section ul {
    padding-left: 1.25rem;
    list-style-position: outside;
}

.services-content li {
    color: #263746;
    line-height: 1.45;
}

.services-content__photos,
.fields-content__gallery {
    margin-top: 0.9rem;
    margin-bottom: 1rem;
}

.services-content__photo,
.fields-content__photo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 0.35rem;
    background: #ffffff;
    border: 1px solid #dce5ec;
}

.services-content__photo img,
.fields-content__photo img {
    display: block;
    width: 100%;
    object-fit: cover;
}

.services-content__photo img {
    height: 170px;
}

.fields-content__photo img {
    height: 158px;
}

.services-content__section,
.fields-content__section {
    margin-top: 1rem;
    padding-top: 0.9rem;
    border-top: 1px solid #dce5ec;
}

.services-content__section h2,
.fields-content__section h2 {
    margin-bottom: 0.45rem;
}

.services-content__contact,
.fields-content__contact {
    margin-top: 1rem;
    padding-top: 0.85rem;
    border-top: 1px solid #dce5ec;
}

/* Shared field-of-use page snippets */
.fields-content {
    color: #263746;
}

.fields-content__intro {
    margin-bottom: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid #dce5ec;
}

.fields-content__intro p {
    max-width: 920px;
    margin-bottom: 0;
}

.fields-content__gallery--section {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #dce5ec;
}

.fields-content__gallery + .fields-content__section {
    padding-top: 0;
    border-top: 0;
}

.fields-content__section ul {
    margin-bottom: 0;
}

.fields-content__task-chip {
    display: inline-flex;
    align-items: center;
    width: 100%;
    min-height: 30px;
    padding: 0.28rem 0.55rem;
    color: #40586c;
    font-size: 0.88rem;
    line-height: 1.25;
    background: #f7f9fb;
    border: 1px solid #dce5ec;
    border-radius: 1px;
}