@import "font-awesome.min.css";

@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 400;
    src: url("fonts/Ubuntu-R.ttf");
    font-display: swap;
}



@font-face {
    font-family: 'Ubuntu-Light';
    font-style: normal;
    font-weight: 400;
    src: url("fonts/Ubuntu-L.ttf");
    font-display: swap;
}

@font-face {
    font-family: 'Barlow';
    font-style: normal;
    font-weight: 400;
    src: url("fonts/Barlow-Regular.ttf");
    font-display: swap;
}



@font-face {
    font-family: 'Barlow-Light';
    font-style: normal;
    font-weight: 400;
    src: url("fonts/Barlow-Light.ttf");
    font-display: swap;
}

@font-face {
    font-family: 'Barlow-Semibold';
    font-style: normal;
    font-weight: 400;
    src: url("fonts/Barlow-SemiBold.ttf");
    font-display: swap;
}

@font-face {
    font-family: 'Barlow-Bold';
    font-style: normal;
    font-weight: 400;
    src: url("fonts/Barlow-Bold.ttf");
    font-display: swap;
}

@font-face {
    font-family: 'icomoon';
    src: url('fonts/icomoon.eot?814wz2');
    src: url('fonts/icomoon.eot?814wz2#iefix') format('embedded-opentype'),
        url('fonts/icomoon.ttf?814wz2') format('truetype'),
        url('fonts/icomoon.woff?814wz2') format('woff'),
        url('fonts/icomoon.svg?814wz2#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



.invisible, .realinvisible {
    display: none;
}

#languageselector, #languageselector2 option,
#languageselector_cms{
	font-family:'Barlow', sans-serif;
}
.CMS #languageselector,
.CMS #languageselector2,
.shop #languageselector_cms{
    /*display: none;*/
}



.block {
    display: block;
    overflow: visible;
}

.fromTablet, .back-to-top, #LogoBW, #ScartInfo .SmartphoneAmount,
    #MainNavi .navi-logo, #UserNavi #ScartScroll {
    /*display: none;*/
    visibility: hidden;
    position: absolute;
}

body, .main-content {
    font: 16px/20px Barlow;
    font-style: normal;
    font-weight: 400;
}

[class^="ico-"], [class*=" ico-"] {
    font-family: 'icomoon';    
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#ERPTable td {
    padding: 0.375em 0.625em;
}

.ico-home3:before {
    font-size: 1.55em;
    height: 15px;
    text-align: center;
    padding: 0 1.2em;
}

/* same as font-awesome */
.icom {
    display: inline-block;
    font: normal normal normal 1em/1 icomoon;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#Navi .main-navigation li.ico-home3 a {
    font-size: 0px;
    content: "";
    line-height: 24px;
    padding: 0px;
    margin: auto;
}

#Navi .main-navigation li.ico-home3 a::before {
    width: 40px;
    content: "\e901";
    font-family: icomoon;
    font-size: 24px;
    padding: 0px;
    padding-top: 6px;
}

#Navi .main-navigation li.ico-home3 a:hover {
    color: #fff;
}

.fa {
    font: normal normal normal 1em/1 icomoon;
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

.icon-history-solid:before, .fa-history:before {
    content: "\e928";
}

.ico-config:before {
    content: "\e924";
}

.ico-box:before {
    content: "\e92d";
}

.ico-refresh:before, .fa-refresh:before {
    content: "\e929";
}

.ico-file:before, .fa-file-o:before {
    content: "\e92b";
}

.ico-caret-square-up:before {
    content: "\e925";
}

.icon-chevron-circle-down:after {
    content: "\f13a";
}

.ico-caret-square-down:before {
    content: "\e927";
}

.ico-wrench-solid:before, .fa-wrench:before {
    content: "\e923";
}

.ico-info-circle-solid:before, .fa-info-circle:before {
    content: "\e91a";
}

.ico-check-circle-regular:before, .fa-check-circle:before {
    content: "\e91b";
}

.ico-times-circle-regular:before, .fa-times-circle:before {
    content: "\e91c";
}

.ico-tag-solid:before, .fa-tag:before {
    content: "\e91d";
}

.ico-chart-line-solid:before, .fa-line-chart:before {
    content: "\e91e";
}

.ico-star-solid:before, .fa-star:before {
    content: "\e90e";
}

.ico-chart-bar-regular:before, .fa-bar-chart-o:before {
    content: "\e90f";
}

.ico-sliders-h-solid:before, .fa-sliders:before {
    content: "\e910";
}

.ico-info-solid:before, .fa-info:before {
    content: "\e913";
}

.ico-users-solid:before, .fa-users:before {
    content: "\e914";
}

.ico-euro-sign-solid:before, .fa-euro:before {
    content: "\e915";
}

.ico-truck-solid:before, .fa-truck:before {
    content: "\e916";
}

.ico-cart-plus-solid:before, .fa-cart-plus:before {
    content: "\e917";
}

.ico-facebook-f-brands:before {
    content: "\e90c";
}

.fa-facebook:before {
    content: "\e90c";
    font-size: 19px;
    line-height: 30px;
}

.ico-xing-brands:before {
    content: "\e90d";
}

.fa-xing:before {
    content: "\e90d";
    font-size: 19px;
    line-height: 30px;
}

.ico-shopping-cart:before {
    content: "\e904";
}

.fa-shopping-cart:before {
    content: "\e904";
    font-size: 24px;
    font-family: icomoon;
}

.customerShoppingcart:before {
    content: "\e904";
    font-size: 140px;
    height: 150px;
}

.ico-comments-regular:before {
    content: "\e90a";
}

.fa-comments-o:before {
    content: "\e90a";
    font-size: 32px;
}

.ico-clock-regular:before, .fa-clock-o:before {
    content: "\e911";
    font-size: 16px;
}

.ico-copy-regular:before, .fa-files-o:before {
    content: "\e90b";
}

.ico-angle-doubleright:before {
    content: "\e909";
}

.ico-key:before {
    content: "\e902";
}

.ico-cart:before {
    content: "\e904";
    font-size: 32px;
}

.ico-pencil:before, .fa-pencil-square-o:before, .fa-pencil:before {
    content: "\e905";
}

.ico-angle-down-solid:before, .fa-angle-down:before {
    content: "\e900";
}

.fa-angle-up:before {
    content: "\e92a";
}

.ico-angle-left-solid:before {
    content: "\e903";
}

.ico-angle-up-solid:before {
    content: "\e906";
}

/*.ico-angle-right-solid:before, .fa-angle-right:before {
    content: "\e907";
}

.ico-angle-left-solid:before, .fa-angle-left:before {
    content: "\e907";
    transform: rotate(180deg);
}*/

.ico-book-solid:before, .fa-fastpage:before {
    content: "\e91f";
}

.ico-envelop:before {
    content: "\e945";
}

.ico-eye-slash-regular:before, .fa-eye-slash:before {
    content: "\e921";
}

.ico-eye-regular:before, .fa-eye:before {
    content: "\e922";
}

.ico-calendar:before {
    content: "\e953";
}

.ico-file-text2:before {
    content: "\e926";
}

.ico-menu:before {
    content: "\e9bd";
}

.ico-printer:before, .fa-print:before {
    content: "\e954";
}

.ico-search:before {
    content: "\e908";
}

.ico-bin:before, .fa-trash:before, .fa-trash-o:before {
    content: "\e9ac";
}

.ico-switch:before {
    content: "\e9b6";
}

.ico-list:before, .fa-list:before {
    content: "\e9ba";
}

.ico-list2:before, .fa-list-ul:before {
    content: "\e9bb";
}

.ico-link-solid:before, .fa-link:before {
    content: "\e920";
}

.ico-download3:before, .fa-file-image-o:before {
    content: "\e9c7";
}

.ico-upload3:before {
    content: "\e9c8";
}

.ico-sphere:before {
    content: "\e9c9";
}

.ico-plus:before, .fa-plus-square:before {
    content: "\ea0a";
}

.ico-minus:before, .fa-minus-square:before {
    content: "\ea0b";
}

.icon-cancel-circle:before {
    content: "\ea0d";
}

.ico-cross:before, .fa-times:before {
    content: "\ea0f";
}

.ico-check:before, .fa-check:before {
    content: "\ea10";
}

.ico-enter:before, .fa-sign-in:before {
    content: "\ea13";
}

.ico-exit:before {
    content: "\ea14";
}

.ico-arrow-up2:before {
    content: "\ea3a";
}

.ico-arrow-right2:before {
    content: "\ea3c";
}

.ico-arrow-down2:before {
    content: "\ea3e";
}

.ico-arrow-left2:before {
    content: "\ea40";
}

.ico-circle-up:before {
    content: "\ea41";
}

.ico-circle-right:before {
    content: "\ea42";
}

.ico-circle-down:before {
    content: "\ea43";
}

.ico-circle-left:before {
    content: "\ea44";
}

.ico-table2:before {
    content: "\ea71";
}

.ico {
    width: 16px;
    height: 16px;
}

html, body {
    /*background: #e00;   */
    -webkit-font-smoothing: antialiased;
}

#PrintView body {
    font: 16px/20px Barlow;
}

img, a img {
    border: none;
}

ol, ul {
    list-style: none outside none;
}

a {
    text-decoration: none;
    color: #333;
}

a:hover {
    cursor: pointer;
    color: #08405f;;
    text-decoration: none;
}

img {
    border: none;
}

.ClearLeft {
    clear: left;
}

.ClearRight {
    clear: right !important;
}

.ClearBoth {
    clear: both !important;
}

.FloatLeft {
    float: left;
}

.FloatRight {
    float: right;
}

.MarginBottom {
    margin-bottom: 20px;
}

.MarginBottom5 {
    margin-bottom: 5px;
}

.MarginRight {
    margin-right: 2%;
}

.MarginLeft {
    margin-left: 2%;
}

.MarginTop5 {
    margin-top: 5px;
}

.MarginTop10 {
    margin-top: 10px;
}

.MarginBottom10 {
    margin-bottom: 10px;
}

.Padding5 {
    padding: 5px;
}

.PaddingBottom10 {
    padding-bottom: 10px;
}

.Padding0 {
    padding: 0;
}

.BorderBottom {
    border-bottom: 6px solid #d8d8d8;
}

.Block {
    display: block;
}

.inline-block {
    display: inline-block;
}

a:focus {
    text-decoration: none;
}

a:active {
    text-decoration: none;
}

.Top {
    vertical-align: top;
}

.Bottom {
    vertical-align: bottom;
}

.BottomRight {
    position: absolute;
    bottom: 10px; /*right:10px;*/
}

.Nowrap {
    white-space: nowrap;
}

header, nav, section, article, aside, footer {
    display: block;
}

h1 {
    position: relative;
    font-size: 2.0em;
    margin: 0 0 20px 0;
    font-weight:normal;
}

h2 {
    position: relative;
    font-size: 1.6em;
    margin: 0 0 20px 0;
    font-weight: normal;
}

h3 {
    position: relative;
    font-size: 1.3em; /**1.5em*/
    margin: 0 0 20px 0;
}

h4 {
    font-size: 1.1em;
}

p {
    margin-bottom: 1em;
}

aside h1 {
    text-transform: uppercase;
}

/*-------------------------------------*/
/* Standardklassen Forms */
/*-------------------------------------*/
html select, html input, html textarea {
    border: 1px solid #ccc;
    padding: 3px;
    color: #000;
    padding: 0.5em;
    border-radius: 0;
    font-size: 16px;
    background: #fff;
}

.FloatingButtonRight {
    right: 0px;
    top: 220px;
    position: fixed;
    width: 30px;
    height: 104px;
    z-index: 100;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}

.floatingMenuContact {
    top: 165px;
    right: -310px;
}

.floatingMenuContactActive {
    top: 165px;
    right: 0px;
}

.floatingMenuContact:hover {
    right: -292px;
}

.floatingEffect {
    -webkit-transition: right 0.5s; /* Safari prior 6.1 */
    transition: right 0.5s;
}

body.safari .floatingMenuContact {
    top: 320px;
    right: -303px;
}

body.safari .floatingMenuAktionen {
    right: -15px;
}

#DemoShopNote {
    clear: left;
    background: white;
    border: 1px solid #333;
    font-size: 12px;
    font-weight: bold;
    padding: 5px 10px;
    text-align: center;
    margin: 0 0 10px 0;
    line-height: 1.5em;
}

.error404 {
    height: 180px;
    background: url(/tradepro/shop/layout/404-grafik.jpg) bottom right
        no-repeat #f3f3f3;
}

.errorSerps {
    background: url(/tradepro/shop/layout/suchfehler-grafik-resp.jpg) center
        right no-repeat #fff;
}

.error404-resp {
    background: url(/tradepro/shop/layout/404-grafik-resp.jpg) bottom right
        no-repeat #fff;
    min-height: 390px;
}

.error p {
    width: 50%;
}

.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 7000;
    height: 51px;
}

.floatingMenuAktionen {
    /*top: 169px;*/
    top: 300px;
    right: -16px;
    background-color: #c41522;
    width: 44px;
}

.floatingMenuAktionen>a {
    text-decoration: none;
    text-indent: 20px;
}

.floatingMenuAktionen:hover {
    right: 2px;
}

.floatingPlaceholder {
    width: 129px;
    height: 70px;
}

.floatingMenu {
    pointer-events: none;
    position: fixed;
    z-index: 100;
    cursor: pointer;
    display: block;
}

.floatingMenu>table {
    border-spacing: 0;
    border: 0px;
    padding: 0px;
    z-index: 100;
    position: relative;
}

.floatingMenu table {
    background: transparent;
}

.floatingMenu .trigger {
    /* background-color: #e31d3c; */
    vertical-align: top;
}

.floatingMenu table td {
    padding: 0;
}

.floatingTriggerBasic {
    background-color: #08405f;
    color: #fff;
    pointer-events: all;
    overflow: hidden;
}

.floatingTextRotated {
    transform: rotate(-90deg);
    color: #fff;
    z-index: 9999;
    width: 102px;
    height: 96px;
    display: block;
    font-size: 1em;
    text-align: center;
    padding: 1px;
    white-space: nowrap;
}

.floatingTextSalesContact {
 	width: 52px;
    text-indent: -9px;
    height: 109px;
    padding-top: 73px;
    margin-left: -70px;
    margin-top: 0px;
    padding-right: 107px;
}

/* definiert die maxBreite der Box */
.floatingPlaceholder {
    width: 250px;
    height: 10px;
    display: block;
}

.floatingMenu .content {
    background-color: #fff;
    pointer-events: all;
}

.floatingMenu .floatingMenuContent {
    padding: 5px 20px;
    background-color: #fff;
    border: 1px solid #ccc;
    min-height: 155px;
    width: 292px;
}

#floatingMenuContent {
    z-index: 101;
}

.floatingMenu .content ul li {
    padding: 10px 0;
}

.floatingMenu h4 {
    font-size: 1.3em;
}

.floatingMenu h5, .floatingMenu h4 {
    margin: 0;
}

.floatingMenu h5, .floatingMenu p {
    margin-top: 0;
    font-size: 1em;
}

#floatingMenuTele {
    z-index: 10;
    position: relative;
    padding: 10px;
    /*border: 1px solid #ccc;*/
    background-color: #f1f1f1;
    margin: 0px 40px;
    text-align: center;
    top: -45px;
    width: 240px;
}

.floatingMenu table td {
    padding: 0;
}

.FloatingButtonRight:hover {
    right: 0px;
}

.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.wrapper {
    position: relative;
    margin: 0 auto;
}

.FFSContent {
    float: right;
    width: 75%;
    position: relative;
}

/* Shop-Buttons */
button, html .button, html input.submit, .feature-box-link {
    padding: 10px 30px;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    background: #fff;
    border: 1px solid #000;
    white-space: nowrap;
    color: #000;
    font-size: 1em;
    cursor: pointer;
    border-radius: 0px;
    box-shadow: none;
    text-shadow: none;
    text-transform: uppercase;
    box-shadow: none;

}

#CompareTable a{
    color: #08405f;
}

#CompareTable tr.Order a.button{
    color: #333;
    border: none;
}
#CompareTable tr.Order a.button:hover{
    background: none;
    color: #08405f;
}

/*
a#DetailPrint{
    border: none;
}

a#DetailPrint:hover{
    background: #fff;
}
*/
html .button-icon {
    padding: 10px 15px;
}

html .button-icon:hover i {
    color: #fff;
}

html .button:hover, html input.submit:hover, html .button:focus, html .button:active,
    html .button.active, .feature-box-link:hover {
    background: #08405f;
    border: 1px solid #08405f;
    color: #fff;
}

html .button_blue {
    color: #fff;
    background-color: #08405f;
    border: 1px solid #08405f;
}

html .button_small {
    font-size: 1.2em;
    padding: 0.4em;
    line-height: 1em;
    margin: 0.1em;
}

.buttonRubView {
    font-size: 1.2em;
    padding: 0.4em;
    margin-right: 0.2em;
}

html .button_x-small {
    font-size: 0.8em;
    padding: 0.4em;
    line-height: 1em;
}

html .button:hover {
    color: white;
    text-decoration: none;
    cursor: pointer;
}

button.-small, .button.-small, input[type="submit"].-small {
    padding: 0.16em 0.57em;
    font-size: 1em;
}

.buttoninactive {
    background-color: #e3e3e3;
    background-image: none;
    color: #333;
    cursor: default;
}

.back-to-top {
    display: none;
}

.back-to-top a:after {
    z-index: 9999;
    font-family: 'icomoon';
    font-size: 3em;
    content: "\e906";
    color: #363636;
    padding: 2px 10px;
    line-height: 100%;
    background: rgba(250, 250, 250, 0.7);
    border: 1px solid #ccc;
    display: block;
    position: fixed;
    bottom: 20px;
    right: 20px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

.ShopTable {
    position: relative;
    clear: both;
    width: 100%;
    margin: 15px 0;
    border-collapse: separate;
    border-bottom: 1px solid #ccc;
    border-radius: 0px;
}

.tblcontainer {
    border-bottom: none;
}

.fixedscreen .ShopTable input{
	font-size:13px;
	margin: 4px 0px;
}

.fixedscreen table td {
	padding:0.1em 0.1em;
}

#InfoDemoShop {
    position: relative;
    top: 2.5em;
}

/* Umschaltung kleine oder große Ansicht */
.mega-dropdown {
    max-width: 1920px;
}

.fixedscreen .mega-dropdown {
    max-width: 1920px;
}

.fixedscreen #Navi, .fixedscreen .StartContent, .fixedscreen .wrapper,
    .fixedscreen .page-header, .fixedscreen .SiteContainer, .fixedscreen #eprocMainNav
    {    
    margin-left: auto;
    margin-right: auto;
}

.inner-wrapper{
    max-width: 1920px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    margin: 0 auto;
}

.fixedscreen .inner-wrapper{
    max-width: 1440px;    
}

.fixedscreen .SiteContainer {
    max-width: 1440px;
}

.fixedscreen .SiteContainer.ela {
    max-width: 1460px;
}

.widescreen #eprocMainNav {
    max-width: 1800px;
    padding-left: 10px;
    padding-right: 10px;
}

.widescreen #Navi, .widescreen .StartContent, .widescreen .wrapper,
    .widescreen .page-header, .widescreen .SiteContainer, .artCMS {        
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    position: relative;
}

.widescreen .SiteContainer {
    /*max-width: 1815px;*/
    max-width: 1920px;
}

.widescreen #Navi {
    /*padding-left: 3px;
    padding-right: 3px;*/
    padding-left: 0px;
    padding-right: 0px;    
}

#UserNavi .sf-menu {
    position: relative;
    height: 40px;
    display: block;
}

#UserNavi .sf-menu .loginCMS {
    background-color: #fff;
    left: -180px;
    
}

.small_size {
    height: 375px;
    width: 1200px;
}

.big_size {
    width: 1800px;
    height: 600px;
}

.widescreen .block_rechts, .widescreen .block_links {
    display: none;
}

.fixedscreen .block_rechts_flex, .fixedscreen .block_links_flex {
    display: none;
}

.image_container video {
    display: block;
    width: 100%;
    height: auto;
}

html table, html table th, html table td {
    border: none;
}

/*-------------------------------------*/
/* Shop-Layout */
/*-------------------------------------*/
html {
    margin-bottom: 20px;
}

body {
    /*border-top: 5px solid #08405f;*/
    margin: 0px;
    background-attachment: fixed;    
}

body.shop{
    margin-top: 115px;
}

body.start{
    margin-top: 157px !important;
}
body.CMS{
    margin-top: 147px !important;
}

html, body {
    font-size: 1em;
    /*max-width: 1920px;*/
    margin-left: auto;
    margin-right: auto;
}

.SiteContainer {
    position: relative;
    margin: auto;
    background: rgba(255, 255, 255, 1);
    border: none;
    padding: 18px;
    max-width: 1920px;
}

.shop a[target="_blank"]::after {
    display: none;
}

/* Highlight Attribute über Suchergebnis */
.hla {
    background: #fff;
    padding: 1em;
    border-radius: 3px;
    border: 1px solid #ccc;
    box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2);
    margin-bottom: 2.25em;
}

.hla strong {
    background: #0274bc;
    display: block;
    padding: .333em .333em .333em 1em;
    color: #fff;
    font-weight: normal;
    margin: -1em -1em .5em -1em;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.hla a {
    min-width: 10%;
    margin: 1% 1% 0 0;
    color: #666;
    
}

.hla a.active:after {    
    float: right;
    font-family: "icomoon";
    content: "\e91c";
    color: #fff;
    margin-left: .5em;
}

.hla a img {
    display: block;
    max-height: 120px;
    margin-bottom: .5em;
    margin-left: auto;
    margin-right: auto;
}

html .hla .button {
    transition: background 0.3s ease-in-out;
}

/* ------------------------------------------------------------------------------ */
/* Meta Menu*/
.meta-menu-container {
    padding: 2px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.meta-menu-container ul.meta-menu {
    margin-top: 2px;
    margin-bottom: 2px;
    width: 100%;
    text-align: right;
}

.meta-menu-container ul.meta-menu li {
    list-style: none;
    display: inline;
}

.meta-menu-container ul.meta-menu li a {
    color: #333;
    font-size: 14px;
}

.meta-menu-container ul.meta-menu li:after {
    content: "|";
    margin: 0 5px 0 10px;
}

.meta-menu-container ul.meta-menu li:last-child:after {
    content: " ";
    margin: 0 0 0 10px;
}

/* ------------------------------------------------------------------------------ */
/* Header */
header, #header {
    height: 100px;
    /*z-index: 7000;*/
    background-color: #fff;
}

/* Header Logo */
#LogoDivHeader {
    position: absolute;
    top: 10px;
    left: 12px;
    margin-top: 0;
}

#Logo {
    width: auto;
    height: 82px;
    background: url('/tradepro/shop/layout/logo.png') 
        no-repeat;
    background-size: contain;
}

/* Header FactFinder */
#FactFinder {
    position: absolute;
    top: 30px;
    left: 50%;
    margin-left: -401px;
    width: 700px;
    border-bottom: 1px solid white;
}

#FactFinder input {
    top: 0;
    left: 0;
    margin: 0;
    height: 42px;
    padding-left: 45px;
    font-size: 1em;
    border: 1px #CCCCCC;
    border-style: solid;
}

header #FFquery {
    width: 98%;
}

#FactFinder button {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 7%;
    margin: 0;
    font-size: 1em;
    color: #666;    
    height: 42px;        
    padding: 0px;
    border: none;
    background: transparent;        
}

#ScartInfo .scartcounternumber, .scartcounternumber {
    width: 26px;
    height: 26px;
    display: block;
    border-radius: 100%;
    font-size: 14px;
    color: #fff;
    line-height: 26px;
    text-align: center;
    background: #08405f;
    position: relative;
    top: -13px;
    left: -1px;
}

.CMS #ScartInfo .scartcounternumber, .scartcounternumber {
    top: -13px;
    left: -6px;
}


#FactFinder button i {
    font-size: 1.4em;
    padding: 0.5em 10px;
    color: #000;
}

#suggestLayer {
    max-width: 650px;
    top: 70px;
    left: 50%;
    margin-left: -400px;
}

.isSlc {
    color: #01a000;
    line-height: inherit;
    vertical-align: text-top;
    margin-right: 5px;
}

/* Header Warenkorb */
/*
#ScartInfo {
    position: absolute;
    right: 30px;
    top: 30px;
    width: 45px;
    height: 42px;
}
*/

.user-menu {
    position: absolute;
    right: 5px;
    top: 5px;        
    display: inline-flex;
}

.user-menu li{
    display: block;
    margin-bottom: 3px;
}

.LoginForm>li{
    margin-bottom: 0px;
}

.LoginForm .level_2{
    padding-left: 0px;
}

/*
#ScartInfo i {
    color: #000;
    float: left;
    font-size: 2em;
    padding: 4px 6px;
    margin-left: 5px;
}
*/

.user-menu i {
    color: #000;    
    font-size: 1.6em;
    /*padding: 4px 6px;*/
    margin-left: 15px;
}

.CMS .user-menu i {    
    margin-left: 10px;
}

#ScartInfo i  {
    margin-top: 16px;
    float: left;
}

#ScartInfo:hover, #ScartInfo a:hover {
    text-decoration: none;
    color: #000;
}

#ScartInfo p {
    margin: 0;
    font-weight: normal;
    color: #000;
}

#ScartInfo a p span {
    font-size: 1em;
}

#ScartInfo a p > span {
    font-size: 1.35em;
    display: block;
    padding: 30px 0px 5px 50px;
    text-align: center;
}

#ScartInfo .SmartphoneAmount {
    display: none;
}

.ScartItemDetails {
    position: absolute;
    width: 130%;
    top: 40px;
    z-index: 10000;
    box-sizing: border-box;
    border-radius: 0 0 3px 3px;
    display: none;
    right: 0;
}

#Navigationbar {
    width: 100%;
    margin-bottom: 10px;
    overflow: visible;
    background-color: #fff;
    padding-bottom: 0px;    
}

#Navigationbar {
    max-width: 1920px;
    margin: 0 auto;
}

.fixedscreen #Navigationbar {
    max-width: 1440px;    
}

#Navigationbar div {
    color: #333;
}

#Navigationbar .block {
    overflow: visible;
}

#Navigationbar .main-navigation {
    height: auto;
    padding: 0;
    position: relative;
    /*z-index: 7000;*/
    text-transform: uppercase;
    font-family: "Barlow-SemiBold";
}

.CMS #Navigationbar .main-navigation {
    z-index: 7000;
}

.main-navigation .login-open {
    opacity: 1;
    max-height: 9999px;
    pointer-events: auto;
    padding: 14px 16px;
}

.main-navigation .login-button-open {
    background-color: #08405f;
}

.main-navigation .login-button-open>a, .main-navigation .login-button-open>i,
    .main-navigation .login-button-open>.ico-key {
    color: #fff !important;
}

.dynamicsearch-campaign {
    background-color: #fff;
    border-radius: 3px;
    border: 1px solid #ccc;
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .2);
    margin-bottom: 15px;
    padding: 15px;
    position: relative;
}

.dynamicsearch-campaign-icon {
    font-size: 50px;
    width: 50px;
    left: 15px;
    top: -10px;
    position: absolute;
    color: #737373;
}

.dynamicsearch-campaign-question {
    font-size: 20px;
    font-weight: bold;
    margin-left: 60px;
    min-height: 45px;
    color: #737373;
}

.dynamicsearch-campaign-answers {
    margin-left: 60px;
}

.dynamicsearch-campaign-answer {
    display: inline-block;
}

.dynamicsearch-campaign-answer a, .dynamicsearch-campaign-answer a:visited
    {
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 3px;
    margin-right: 5px;
    padding: 10px 15px;
    text-decoration: none;
}

.dynamicsearch-campaign-answer a:hover, .dynamicsearch-campaign-answer a:focus
    {
    background-color: #08405f;
    color: #fff;
}

.dynamic_score {
    text-align: center;
    width: 100px;
    height: 22px;
    padding: 2px;
    margin: 0;
    background-color: #f00;
    position: absolute;
    bottom: 0;
    left: 0;
    color: #fff;
    font-weight: bold;
    font-size: 10px;
}

.shop .ce_text h1 {
    font-size: 28px;
    color: #666;
}

.main-navigation>ul>li.-mega {
    position: static;
}

.main-navigation>ul>li>ul li {
    border-bottom: none;
}

#ResponsiveButton {
    display: none;
    color: #fff;
    cursor: pointer;
}

#Navi {
    margin: auto;
    display: block;
    height: 50px;
}

#Navi i {
    font-size: 1.0em;
    color: #333;
}

.login-button-open .ico-key {
    /*margin-left: -10px;*/
    color: white !important;
}

#MainNavi {
    display: block;
    float: left;
    /*width: 69%;*/
}

/* ICONS IM NAVI */
#Navi .main-navigation li.fa::before {
    display: none;
}

#Navi .main-navigation li a.fa::before {
    color: #333;
    font-family: FontAwesome;
    font-size: 20px;
    margin-top: 10px;
    text-indent: 0;
}

#Navi .main-navigation li.fa a {
    font-size: 0;
    text-indent: -1000px;
}

#Navi .main-navigation li a.fa {
    width: 40px;
}

#UserNavi {
    display: block;
    float: right;
    width: 66px;
}

.CMS #MyFav{
    margin-left: 20px !important;
    margin-right: 10px !important;
}

#UserNavi .level_2,
#UserNavi .sf-menu .level2{
    left: -86px;
}

#UserNavi .sf-menu .level2{
    left: -100px;
}


#navLogin .level_2 {
    left: -129px;
    background-color: #fff;
}

#navLogin {
    padding-left: 7px;
}

.CMS #navLogin {
    padding-left: 0px;
}

#Navi .level1>li>a, #Navigationbar .level_1>li>a {
    display: block;
    color: #333;
    text-align: center;
    content: "\e901";
}

#Navi a {
    color: #fff;
}

#Navi .lostpw a {
    background-color: #fff;
    color: #000;
}

.level_2.split {
    width: auto;
}

.main-navigation a:before, .main-navigation span.active:before,
    .main-navigation span.trail:before, .main-navigation span.forward:before
    {
    content: none;
    display: none;
}

.main-navigation ul {
    display: inline;
    margin: 0;
    padding: 0;
}

.main-navigation>ul>li {
    position: relative;
    height: 100%;
}

#MainNavi>ul>li {
    float: left;
    padding-top: 6px;
}

#UserNavi>ul>li {
    float: right;
    padding-top: 6px;
}

.CMS #UserNavi>ul>li {
    margin-top: 7px;
}

.no_small_screen {
    display: block;
}

.small_screen {
    display: none;
}

.main-navigation>ul>li.-mega {
    position: static;
}

.main-navigation>ul>li:not(#navLogin):hover, .main-navigation>ul>li:not(#navLogin):hover>a,
    .main-navigation>ul>li:not(#navLogin):hover>a>i {
    background: #08405f;
    color: #fff !important;
    /* ein Beispiel für ein sinnvolles !important */
}

.main-navigation>ul>li:before {
    position: absolute;
    top: 50%;
    left: -1.1em;
    margin-top: -0.55em;
}

.main-navigation>ul>li>a, .main-navigation>ul>li>span.active,
    .main-navigation>ul>li>span.trail, .main-navigation>ul>li>span.forward
    {
    position: relative;
    float: left;
    height: 100%;
    padding: 0 8px;
    font-size: 17px;
}

.main-navigation>ul>li>ul {
    position: absolute;
    top: 100%;
    left: 0px;
    display: block;
    overflow: hidden;
    max-height: 0;
    min-width: 11.25em;
    padding: 0;
    background: #08405f 0% 0% no-repeat padding-box;
    opacity: 1;
    pointer-events: none;
}

.main-navigation>ul>li>ul li {
    position: relative;
    display: block;
    border-bottom: none;
    white-space: nowrap;
}

.main-navigation>ul>li>ul a, .main-navigation>ul>li>ul span.active,
    .main-navigation>ul>li>ul span.trail, .main-navigation>ul>li>ul span.forward,
    #UserNavi #NaviLogin {
    position: relative;
    display: block;
    /*padding: 0.21429em 0.42857em;*/
    margin: 0;
    font-size: 1em;
}

.main-navigation>ul>li>ul a {
    border-radius: 0px;
    color: #fff;
    text-transform: none;
    background: none;
}

.main-navigation>ul>li>ul a:hover {
    background: none;
}

.main-navigation>ul>li.last>ul {
    left: 0;
    right: auto;
}

.widescreen .mega-dropdown {
    padding-left: 60px;
    padding-right: 60px;
}

.mega-dropdown {
    position: absolute;
    width: 100vw;
    left: 0px;
    top: 100%;
    display: block;
    overflow: hidden;
    border-top: 0px solid #6d6d6d;
    font-size: 0.875em;
    background: #363636;
    opacity: 0;
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.main-navigation>ul>li>a:after, .main-navigation>ul>li>span.active:after,
    .main-navigation>ul>li>span.trail:after, .main-navigation>ul>li>span.forward:after
    {
    border-top: none;
    top: 0;
}

.mega-dropdown .rs-column.-large-col-1-1 {
    width: auto;
    background: #fff;
}

.mega-dropdown-column {
    list-style: none;
    flex-wrap: wrap;
    margin: 20px 0 0 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    width: 100%;
}

.mega-dropdown-column ul a {
    padding: unset;
    padding-left: 5px;
    padding-right: 5px;
    height: 1.12 vw;
}

.mega-dropdown-column ul a:hover {
    color: #f1f1f1;
}

#Navi .mega-dropdown {
    background: #08405f 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
}

.fixedscreen #Navi .mega-dropdown {
    max-width: 1440px;
    /*margin-left: 2px !important;*/
    margin-right: auto;
}

.fixedscreen #Navigationbar ul.productsnav {
	grid-template-columns: 20% 20% 20% 20% 20%;
	
}


.fixedscreen #Navi .mega-dropdown.level_3 {
	overflow-y:auto;	
}


#Navigationbar ul.level_1 {
    display: block;
    height: 50px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.fixedscreen #Navigationbar ul.productsnav {
    list-style: none;
    flex-wrap: wrap;
    margin: 20px 0 0 0;
    padding: 0;
    display: grid;
    grid-template-rows: auto auto auto auto;
    grid-template-columns: 20% 20% 20% 20% 20%;
    width: 100%;
}


#Navigationbar ul.productsnav {
    list-style: none;
    flex-wrap: wrap;
    margin: 20px 0 0 0;
    padding: 0;
    display: grid;
    grid-template-rows: auto auto auto auto;
    grid-template-columns: 14% 14% 14% 14% 14% 14% 14%;
    width: 100%;
}



.main_category a:hover {
    text-decoration: underline;
}

.main_category {
    white-space: nowrap;
    flex: 1;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    position: relative;
    font-size: 16px;
    font-weight: normal;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 20px;
    max-width: 260px;
    text-transform: none;
    font-family: 'Barlow';
}

#Navigationbar ul.productsnav.level_2 ul.level_3 ul.level_4 {
    display: none;
}
/*
#Navi>nav>ul>li>ul>li>a:before {
    position: absolute;
    font-family: "icomoon";
    content: "\e907";
    display: block;
    margin-right: 24px;
    text-indent: -14px;
}
*/
/* Navigation über mehrere Kategorieebenen */
/* Header: 2 Ebenen anzeigen*/
#Navigationbar ul.productsnav.level_2 ul {
    list-style: none;
    flex-wrap: wrap;
    padding: 0;
    display: flex;
    flex-direction: row;
    width: 100%;
    font-size: 13px;
    font-weight: normal;
}

.main_category a::before {
    display: inline-block;
}

/*#Navigationbar ul.level_2 {
	overflow: visible;
}*/
#Navigationbar ul.productsnav li>ul.level_3 {
    display: block;
}

#Navigationbar ul.productsnav li>ul.level_3  a::before {
    display: inline-block;
    content: "»";
}

#Sitemap ul.split {
    float: left;
}

div#languages {
    float: right;
    position: absolute;
    width: 100%;
    display: none;
}

.UserBoxStartseite {
    float: right;
    width: 23%;
}

.UserBoxStartseite>* {
    padding: 10px;
}

.UserBoxStartseite .LoginBoxStartseiteContent {
    background-color: #f1f1f1;
    border: 1px solid #d3d3d3;
    border-top: 0;
    border-bottom: 0;
}

.UserBoxStartseite h3 {
    color: #fff;
    background-color: #08405f;
    border-radius: 3px 3px 0 0;
    margin-bottom: 0;
    font-size: 1.2em;
}

.UserBoxStartseite h3 span {
    display: block;
    font-size: 0.75em;
    color: #fff;
}

.UserBoxStartseite .LoginBoxButtons {
    border: 1px solid #d3d3d3;
    background-color: #f1f1f1;
    padding: 0;
    border-radius: 0 0 3px 3px;
}

.UserBoxStartseite button {
    width: 100%;
    border-radius: 0;
}

.UserBoxStartseite .button i {
    color: #006bbb;
}

.UserBoxStartseite .button_two {
    width: 49%;
    float: left;
    border-radius: 0px;
    padding: 10px 0px;
    margin: 0px;
    border: 0;
    display: block;
    overflow: hidden;
}

.UserBoxStartseite a.button_two {
    font-size: 0.8em;
}

.UserBoxStartseite .button_first {
    float: left;
    border-radius: 0 0 0 3px;
}

.UserBoxStartseite .button_second {
    float: right;
    border-radius: 0 0 3px 0;
}

.UserBoxStartseite .LoginBoxButtons:after {
    content: " ";
    clear: both;
    display: block;
}

.UserBoxStartseite input {
    box-sizing: border-box;
    width: 100%;
}

.UserBoxStartseite form>div {
    margin: 10px 0;
}

#LoginToggle {
    border-radius: 3px;
    cursor: pointer;
}

#LoginToggle.active {
    border-radius: 3px 3px 0 0;
}

.login-toggle {
    background: url("/tradepro/shop/layout/login-toggle.gif") no-repeat
        scroll left top transparent;
    height: 18px;
    position: absolute;
    right: 15px;
    top: 13px;
    width: 18px;
    cursor: pointer;
}

#LoginToggle.active .login-toggle {
    background-position: left bottom;
}

#MainPageSlideshow {
    position: relative;
    overflow: hidden;
    max-width: 1920px;
    margin-left: auto;
    margin-right: auto;
    border: none;
    top: -10px;
}

.fixedscreen #MainPageSlideshow {
    max-width: 1920px;
}

.slider-content {
    position: absolute;
    width: 95%;
    left: 0px;
}

.slider-content.sc-top {
    top: 0px;
}

.slider-content.sc-left {
    left: 0px;
}

.slider-content.sc-right {
    right: 0px;
    text-align: right;
    left: auto;
}

.slider-content h1 {
    font-size: 28px;
    font-weight: normal;
}

.slider-content.sc-w30 {
    width: 30%;
}

.slider-content.sc-w70 {
    width: 70%;
}

#MainPageSlideshow .ce_text.slider-content {
    /*	background-color: rgba(255,255,255,0.5);
	 padding: 10px;  */
    margin: 1em;
}

.ShopContent {
    float: left;
    width: calc(100% - 325px);
}

.det .ShopContent {    
    width: 100%;
}

.FFBlock {
    background-color: #fff;
    display: block;
}

#SearchResult a {
    margin-left: 0;
    margin-right: 0;
}

#SearchResult {
    padding-left: 5px;
    margin-top: 0;
}

#RubView li {
    background-color: #fff;
}


.StartContent #RubView li {
    width: 18.4%;
}


#RubView li ins {
    font-size: 1.2em;
    display: block;
    text-align: left;
    color: #333;
}
.artCMS > h3{
    background: #f1f1f1;
    color: #000;
    padding: .5em;
    margin-bottom: 1em;
    border-top: 1px solid rgb(204,204,204);
    border-bottom: 1px solid rgb(204,204,204);
}


.artCMS > h2 {
    background: #f1f1f1;
    color: #000;
    padding: .5em;
    margin-bottom: 1em;
    border-top: 1px solid rgb(204,204,204);
    border-bottom: 1px solid rgb(204,204,204);

}

/*
 *
 * Artikel im CMS - Galerieansicht
 *
 */

#RubView.ArtCMSview ul { margin-top: 0 }


/*
 *
 * Artikel im CMS - Listenansicht
 *
 */

#ListView.ArtCMSview li { margin-left: 0 !important }
.listProductTitle { font: inherit }



/*
 *
 * Artikel im CMS - Slider
 *
 */

.articleSlider {
    border: 1px solid #ccc
}

.articleSlider .innerSlide {
    position: relative;
    padding: 1em 4em;
    /*border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;*/
}

.articleSlider .innerSlide .banner {
    position: absolute;
    left: 0;
    top: 0;
}

.articleSlider h3 { margin-top: 0 }

.articleSlider h3 a { font: inherit }

.articleSlider a.button { clear: both}

.articleSlider .slick-slide img {
    width: auto;
    height: auto
}

.webPikto {
    height: 50px;
    line-height: 50px;
    margin-bottom: 1.5em;
}
.webPikto img {
    display: inline-block !important;
    margin-right: 10px;
    vertical-align: middle;
}

.slick-slider { margin: 0 }
.slick-prev, .slick-next { box-shadow: none }


/*
 *
 * Artikel im CMS - Tabelle
 *
 */

.articleTable { margin: 30px 0; border-radius:0px;}
.articleTable tr.odd {
    background: #f1f1f1;
}
.aTabHeadline + .articleTable { margin-top: 0}

h1.aTabHeadline,
h2.aTabHeadline,
h3.aTabHeadline,
h4.aTabHeadline { margin: 1em 0 .5em 0 }

.articleTable th { border-bottom: 1px solid #ccc }
.articleTable .aTabPreis { text-align: right; width: 14% }

.articleTable .summe td { border-top: 1px solid #ccc; font-style: normal }

.infoAngebot { float: right }

.artCMS #RubView li ins {
    height: 28px;
}

#RubView li .item-overlay-shop, #RubView .offerItem .item-overlay-shop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*z-index: 1000;*/
}

#RubView .banner, #DetailImageContainer .banner, #ListView .banner {
    position: realtive;
    top: 0px;
    left: 0px;
    padding: 5px 7px;
    /*border-radius: 0 0 5px 0;*/
    text-transform: uppercase;
    font-weight: bold;
    width: fit-content;
    display: inline-block;
    margin-right: 3px;
}

.banner_container {
    position: absolute;
    top: 0px;
    width: 100%; 
}

.banner_new, .banner_neuheit {
    background-color: #07C1A1;
    color: #fff;
}

.banner_aktion {
    background-color: #E4225D;
    color: #fff;
}

.banner_angebot {
	background-color:#ffcf03;
	color:white;
}

.main-content .ArticleElement, .galerie .ArticleElement {
    width: 220px;
    display: flex;
    position: relative;
    border: 1px solid #f1f1f1;
    overflow: hidden;
    -moz-hyphens: auto;
    hyphens: auto;
    float: left;
    overflow: hidden;
    padding-top: 10px;
    word-wrap: break-word;
    margin-bottom: 20px;
    margin-right: 10px;
}

.articlelist .btn-container {
    bottom: 31px;
    padding-bottom: 0;
}

.offerItem .btn-container .button {
    min-width: 32px;
    height: 32px;
    margin-bottom: 7px;
}

#RubView {
    margin-bottom: 20px;
}

.alignCMSprice {
    height: unset;
}

.block_links_flex {
    flex-shrink: 1;
    padding-right: 5px;
}

.block_rechts_flex {
    flex-shrink: 1;
    padding-left: 5px;
}

.flexblock {
    min-width: 260px;
    max-width: 300px;
    margin-top: 20px;
}

.flexcontainerMultilist {
    list-style: none;
    flex-wrap: wrap;
    margin: 20px 0 0 0;
    padding: 0;
    grid-template-rows: auto auto auto auto;
    grid-template-columns: 25% 25% 25% 25%;
    width: 100%;
}

.flexcontainer, .articlelist {
    list-style: none;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
}

.FFS-Flex {
    display: flex;
    background-color: transparent;
}

.innerBox {
    background-color: #fff;
    /*height: 283px;*/
    overflow: hidden;
    /*border: 1px solid #f1f1f1;*/
    background-color: #fff;

    height: 400px;    
    background-color: #F5F4F5;
}

#RubView li.noprice {
    height: 360px;
}

.fixedscreen #RubView li.noprice {
    height: 275px;
}

.fixedscreen .innerBox {    
    height: 360px;     
}

.fixedscreen .FFSContent #RubView li {
    max-width: 255px;
}

.addProductsFrame {
    height: 320px;
}

.artCMS .addProductsFrame {
    height: 100%;
}

.FFSContent #RubView li {
    transition: border 0.3s ease-in-out 0.1s;
}

.FFSContent #RubView li .innerBox {
    transition: height 0.3s ease-in-out;
}
/*
.FFSContent #RubView li:hover .innerBox {
    border: 1px solid #fff;
    height: 375px;
    overflow: hidden;
}

#RubView li:hover .itemContent {
    z-index: 1700;
}
*/
.ias-noneleft {
    width: 100%;
}

.FFSContent #RubView li, #RubView #TopProducts li, .ShopContent #RubView li,
    .StartContent #RubView li, #RubView .offerItem {    
    margin: 20px;
    flex: 1 1 0px;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;        
    min-width: 330px;    
    position: relative;
    overflow: hidden;
    margin-bottom: -80px;
}

.fixedscreen .FFSContent #RubView li, .fixedscreen #RubView #TopProducts li, .fixedscreen .ShopContent #RubView li,
.fixedscreen .StartContent #RubView li, .fixedscreen #RubView .offerItem {    
    min-width: 255px;    
}

.FFSContent #RubView li, #RubView #TopProducts li, .ShopContent #RubView li,
    .StartContent #RubView li{
    max-width: 360px;
}

.FFSContent #RubView li.cms-between {
    max-width: 100%;
    width: 100%;
    flex-basis: 100%;
    height: auto;    
    border: 0;
    margin: 7px 5px 10px;
    border: 1px solid #f1f1f1;
    padding: 5px;
}

.FFSContent #RubView li.cms-between p {
    margin: 5px 0;
}

.FFSContent #RubView li.cms-between:hover {
    height: auto;
    border: 0;
    margin: 7px 5px 10px;
    border: 1px solid #f1f1f1;
}

#RubView>div .offerItem, #RubView>div  .offerItem:hover, .artCMS #RubView .offerItem
    {
    margin-bottom: 0px;
}

.artCMS #RubView .offerItem {
    height: 410px;
}

.RubViewForm {
    margin-top: unset;
    margin-bottom: unset;
}

.offerItem {
    min-width: unset;   
}

.StartContent #RubView li, .artCMS #RubView li, .DetailCrossList .offerItem
    {
    flex: 1;
    min-width: 240px;
    max-width: 255px;
}

.artCMS #RubView li {
    width: 220px;
	/*z-index: 200 !important;*/
}

.StartContent {
    padding-left: 10px;
    padding-right: 10px;
    overflow: hidden;
}

.FFSContent #RubView li, #RubView .offerItem {
    /*border: 12px solid transparent;*/
    margin-bottom: 0px;
    background-color: transparent;
    /*max-width: 300px;*/
}

.isFavo {
    color: #e7bb02;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.StartSlider {
    border: 7px;
}

.CMS .FFSContent #RubView li:hover, #RubView .offerItem:hover {
	z-index: 0 !important;
    margin-bottom: 0px;
}

.CMS .FFSContent #RubView li, #RubView .offerItem:hover {
	z-index: 0 !important;
    margin-bottom: 0px;
}

#RubView li, #RubView .offerItem {
    height: 475px;
}

.fixedscreen #RubView li, .fixedscreen #RubView .offerItem {
    height: 390px;
}

#RubView li .itemButtonMoreText {
    display: none;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1650;
}

#RubView li .itemButtonMoreText i {
    font-size: 1.3em;
    color: #666;
}
/*
#RubView li:hover .itemButtonMoreText {
    display: block;
}
*/

#RubView .itemContent div {
    font-size:1em;
    position:relative;
    margin: 0 0 20px 0;
    line-height: 1.5;
    font-weight: normal;
}

#RubView .first {
    clear: left;
}

#RubView .last {
    margin-right: 0;
}

#RubView .thumb {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    text-align: center;
    margin-bottom: 100px;
    min-height: 186px;
    border: 0;
}

#RubView .thumb img {    
    margin-top: 0;    
    position: absolute;
    left: 50%;     
    max-width: 360px;
    max-height: 360px;
    margin-left: -180px;
}

.fixedscreen #RubView .thumb img {    
    /*
    max-width: 200px;
    max-height: 200px;
    margin-left: -100px;
    */
    max-width: 220px;
    max-height: 220px;
    margin-left: -109px;
    mix-blend-mode: darken;
    padding: 16px;
    margin-top: 10px;
}

.thumbNoAnimation {
    height: 200px;
}

#RubView .thumbNoAnimation img {
    margin-top: 0;
    max-height: 200px;
    height: 200px;
    position: relative;
    left: 50%;
    top: 100px;
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translate(-50%, -50%);
    mix-blend-mode: darken;
}

#RubView .productNameContainer {
    height: 80px;
}

.artCMS #RubView .productNameContainer {
    height: 100px;
}

#RubView .productNameContainer h2 {
    font-size: 16px;
    padding-left: 10p;
    padding-right: 10p;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align: center;
    margin-top: 11px;
}

#RubView .productNameContainer div.CrossArticleTitle {
    font-size: 16px;
    padding-left: 10p;
    padding-right: 10p;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align: center;
    margin-top: 11px;
    margin-bottom: 7px;
    height: 60px;
}



#RubView .itemContent h4 {
    font-size: 0.9em;
    height: 40px;
    width: 100%;
    display: block;
    overflow: hidden;
    line-height: 20px;
    padding: 0px 10px 0px 10px;
    margin: 0;
}

#RubView h3 a {
    color: #333;
    font-weight: normal;
    font-size: 0.9em;
    display: block;
}

#RubView a {
    color: #000;
    text-decoration: none;
}

.RubImageContainer {
    /*height: 196px;
    width: 196px;*/
    height: 100%;
    width: 100%;
    display: block;
    background-color: #f5f5f5;
}

#RubView p {
    margin: 10px 10px 10px 10px;
    padding: 0;
    bottom: 0px;
    position: relative;
}

#RubView li .btn-container ins {
    color: #333;
    padding-top: 0px;
    padding-bottom: 6px;
    margin-top: -3px;
    margin-bottom: 20px;
}

#RubView ins {
    text-decoration: none;
    font-weight: bold;
    color: #000;
}

#RubView .btn-container, .Info .btn-container {
    width: 100%;
    position: relative;
    padding: 0;
    text-align: center;
    display: block;
    margin-bottom: 0.5em;
}


.start #RubView .btn-container, .Info .btn-container {
    width: 100%;
    position: relative;
    padding: 0;
    text-align: left;
    /*display: none;*/
    margin-bottom: 0.8em;
}



.FFSContent #RubView .btn-container {
    margin-bottom: 0;
}

.ArtCMSview .itemContent {
    width: 220px;
    position: inherit;
}

#RubView .itemContent {
    position: absolute;
    left: 0px;
    top: 290px;
    background-color: #ffffff;
    padding-left: 0px;
    padding-right: 0px;
    height: 120px;
    width: 100%;    
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    font-size: 20px;
    text-align: left;
}

.fixedscreen #RubView .itemContent {    
    top: 240px; 
}

#RubView li:not(.cms-between) h2 {
    font-size: 1.0em;
    margin-bottom: 7px;
    height:60px;
}

.FFS-Flex #RubView .itemContent div {
    font-size: 1.0em;
    margin-bottom: 7px;
    height: 75px;
    margin: 0 0 3px 0;
    font-weight: normal;
    line-height: 1.3;
    position: relative;
}
.FFS-Flex #RubView .itemContent div.content,
.artCMS #RubView .productNameContainer{
    /*        DevOps: 41370 - ... anstatt overflow      */
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.FFS-Flex #RubView .itemContent.showdesc > .content {
    display: block;
    height: 100%;
    position: relative;
    background: #fff;
}
.FFS-Flex #RubView .itemContent.showdesc p {
    height: 100%;
    max-height: 135px;
    overflow: hidden auto;
    position: absolute;
    top: 0;
    background: #fff;
    margin: 0;
}

.FFS-Flex #RubView .itemContent .btn-container {
    margin-bottom: 20px;
    margin-top: 0px;
}


#RubView .itemContentNoAnimation {
    background-color: #ffffff;
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
    height: 100%;
    border-top: 1px solid #e3e3e3;
}
#RubView .itemContentNoAnimation .button {
    width: auto;
}

#RubView .button {
    bottom: 1em;
    position: static;
    padding: 5px;
}

#RubView .offerItem.noprice {
    height: auto;
}

#RubView li .itemlogo {
    position: absolute;
    right: -100px;
    width: 100px;
    top: 0px;
    z-index: 1;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    pointer-events: none;
}

#RubView input.amountSmall {
    width: 60px;
    height: 32px;
    /*line-height: 40px;*/
    margin-right: 4px;
}

#RubView form {
    height: 37px;
    margin-right: 7px;
    margin-top:0px !important;
}

/***
 * Thumbs in Rubrikenansicht
 */
 
.rvThumbs {
    position: absolute;
    top: 46%;
    left: -100%;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background-color: #fff;/*#F5F4F5;*/
    padding: 5px;
    z-index: 99;
    width: 100%;
}

.rvThumbs .moreColours {
    float: right;
    height: 60px;
    line-height: 60px;
    font-weight: bold;
    color: #08405f;
    font-size: 30px;
}

.rvThumbs img {
    padding-left: 2px;
    max-width: 43px;
    max-height: 43px;
}
.rvThumbs a:first-child img {
    padding-left: 0px;
}

#RubView li:hover .rvThumbs {
    left: 0;
}

/***
 * Thumbs in Listenansicht
 */
.lvThumbs {
    float: left;
    position: relative;
}

.lvThumbs img {
    margin-left: 5px;
    display: inline-block;
}

.lvThumbs img:hover {
    border: 1px solid #08405f;
}

.slick-slider {
    /*padding-left: 60px;
    padding-right: 60px;*/
    width: 100%;/*calc(100% - 15px);*/
}


.fixedscreen .slick-slider {
    padding-left: 0px;
    padding-right: 0px;
    width: calc(100% - 18px);
}


.slick-arrow {
    color: #000000;
    font-size: 1em;
    position: relative;
    z-index: 1;
    margin-left: 28px;
}

.slick-arrow.slick-disabled{
    color: #737373; 
}

.fixedscreen .prev-arrow {
    top: 132px;
    left: -68px;
}

.prev-arrow {
    top: 132px;
    margin-left: -57px;
}

.next-arrow {
    float: right;
    top: -170px;
    left: 30px;
    margin-right: 0px;
}


.fixedscreen .next-arrow {
    float: right;
    top: -176px;
    margin-right: 0px;
}

#RubView li:hover .itemlogo {
    position: absolute;
    right: -10px;
    top: 0px;
}

#RubView li .itemlogo img {
    margin: 0 auto;
    display: block;
    max-width: 100%;
    background-color: #ffffff;
    padding: 2px;
}

/* ------------------------------------------------------------------------------ */
/* Listenansicht */
.lvThumbs {
    float: left;
    position: relative;
}

.lvThumbs img {
    margin-left: 5px;
    display: inline-block;
}

.lvThumbs img:hover {
    border: 1px solid #08405f;
}

#ListView ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#ListView li {
    border-bottom: 1px dashed #ccc;
    width: 100%;
    overflow: hidden;
    margin-bottom: 10px;
    padding-bottom: 10px;
    position: relative;
}

#ListView .thumb {
    float: left;
    position: relative;
    display: block;
    margin-bottom: 10px;
    background-color: #f1f1f1;
}

#ListView .thumb img {
    display: block;
    mix-blend-mode: darken;
    padding: 14px;
}

#ListView .thumb .banner {
    /*position: absolute;*/
    top: 0px;
    left: 0px;
    border: none;
    font-size: 14px;
}

#ListView .hersteller {
    float: right;
    max-height: 20px;
}

#ListView h3 {
    margin: 0 110px 10px 110px;
    padding: 0;
}


#ListView div.ArticleTitle {
   /* margin: 0 110px 10px 110px;*/
    padding: 0;
    position: relative;
    font-size: 1.8em;
    line-height: 1em;
}

#ListView i.fa.fa-history.isSlc, i.fa.fa-star.isFavo {
    font-size: 16px;
    vertical-align: text-top;
}

#ListView .button {
    margin-right: 2px;
    margin-top: -2px;
}

#Pages {
    clear: left;
    float: right;
    padding-bottom: 30px;
    padding-top: 30px;    
    z-index: 99;
    position: relative;
}

#Pages strong {
    display: block;
    float: left;
    height: 2em;
    text-align: center;
    line-height: 19px;
    margin: 5px 5px 0 10px;
}

#Pages ul {
    float: left;
    list-style: none;
    padding: 0;
    margin: 0;
}

#Pages a, #Pages li {
    display: block;
    width: 2em;
    height: 2em;
    line-height: 2em;
    text-align: center;
    border-radius: 3px;
    text-decoration: none;
}

#Pages li {
    float: left;
    color: #000;    
    font-weight: 700;
    margin: 0 0 4px 4px;
}

#Pages li.active a {
    color: #08405f;
}

#Pages li:after {
    content: none;
    margin: 0 0 0 4px;
}

/* Detailseite */
#ZoomContainer {
    position: relative;
    float: left;
    width: 550px;
}

#Zoomlinks {
    position: relative;
    float: left;
    margin: 0 0 20px 0;
}

#zoomzcontainer {
    position: absolute;
    right: 0px;
    top: 0.5em;
    width: 100%;
    height: 100%;
    z-index: 5;
    box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
    background: white;
}

.zoomz {
    visibility: hidden;
}

.zoomz.hover {
    visibility: visible;
}

#zoomField {
    position: absolute;
    cursor: zoom-in;
    background: url('/tradepro/shop/layout/zoomsprite.png') repeat;
    pointer-events: none;
    visibility: hidden;
}

#DetailImageContainer:hover #zoomField {
    visibility: visible;
}

#DetailImageContainer {
    position: relative;
    display: block;
    overflow: hidden;
    background-color: #f5f5f5;
}

#DetailImage {
    display: block;
    width: 100%;
    height: auto;
    mix-blend-mode: darken;
    max-width: 400px;
}

#DetailThumbs {
    padding: 0px 15px 0px 0px;
    overflow: hidden;
    float: left;  
    max-width: 90px; 
    margin-right: 45px; 
}

#DetailThumbs a{
    background-color: #f5f5f5;
    border: 5px solid white !important;
}

#DetailThumbs .slick-vertical .slick-slide {    
    border: 1px solid white !important;
}

#DetailThumbs img {
    display: block;
    width: 76px;
    border: none;
    background-color: #f1f1f1;
    padding-bottom: 5px;    
    mix-blend-mode: darken;
}

#ZoomlinkInfo {
    clear: left;
    margin: 0;
    padding: 5px 0;
    text-align: center;
}

#DetailInfo {
    float: right;
    /*margin: 0 3.1% 20px 2%;*/
    width: calc(100% - 550px);;
    position: relative;
    padding: 0 5px;
    display: grid;
    grid-template-areas: 'title title' 'text logo' 'button-l button-r';
    grid-template-columns: auto 120px;
}

#DetailInfo h3 {
    margin: 0 0 20px 0;
    line-height: 1.5;
    font-weight: normal;
    position: relative;
    font-size: 1.5em;
}

#DetailInfo h1 {
    margin: 0 0 20px 0;
    line-height: 1.5;
    font-weight: bold;
    position: relative;
    font-size: 2em;
    grid-area: title;
}

#DetailInfo ul {
    padding-left: 0;
}

#DetailInfo ul li, .Info ul li {
    list-style-type: square;        
    list-style-position: outside;
    margin-left: 20px;
}

#DetailText {
    margin: 0 0 30px 0;
    font-size: 18px;
    line-height: 20px;
}

#DetailHersteller {
    float: right;
    max-width: 100px;
    grid-area: logo;
    justify-self: end;
}

#readmorecontainer {
    grid-area: text;
}

#readmorebutton, #DetailMoreInfos {
    grid-area: button-l;
}
#DetailMoreInfos {
    grid-area: button-l;
    justify-self: end;
}

#DetailAttributes {
    margin: 0;
}

#readmorecontainer {
    margin: 0 0 2em 0;
    overflow: hidden;
    max-width: 720px;
}

#DetailAttributes dt {
    float: left;
    clear: left;
    width: 40%;
    margin: 0 0 10px 0;
    font-weight: bold;
    word-break: break-all;
}

#DetailAttributes dd {
    float: left;
    margin: 0 0 10px 0;
    width: 60%;
}

.hToggle {
    display: block;
    position: relative;
    margin: 0 0 30px 0;
    overflow: hidden;
    padding-bottom: 0;
}

#DetailMoreInfos {
    clear: right;
    float: right;
    /*margin: 0px 10px 0 0;*/
}

#DetailTableLoading {
    clear: left;
    margin: 10px 0;
    text-align: center;
}

#DetailTableShow {
    clear: both;
}

#DetailTable .fastpageicon {
    width: auto;
    height: 12px;
}

#DetailFastpageAllArticles {
    /* clear: right; */
    float: right;
    margin: 10px 10px 0 0;
}

#submitform {
    clear: both
}

#DetailTable, #DetailCross {
    border-collapse: separate;
}

#DetailCross {
    flex: 2;
}

#DetailTable tbody tr:nth-child(2n), .tblcontainer tbody tr:nth-child(2n) {
    background: #eee;
}

.InnerContainer {
    /*	max-width: 1200px;  */
    margin: auto;
}

.RubMaxWidth {
    max-width: 350px;
    height: 334px;
}

.RubMaxWidthButtons {
    max-width: 350px;
    height: 350px;
}

#DetailCross td, #DetailTable th, #DetailTable td {
    padding: 5px 10px;
    position: static;
    font-size: 1em;
}

.DetailCross .thumb {
    width: 100px;
    text-align: center;
}

.DetailCrossList li {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#RubView .DetailCrossList h3 a
{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.artCMS .DetailCrossList .inactive {
    height: 0px;
}

#PrintView #PrintHead img {
    margin: 10px 5px;
}


.DetailCrossHeadline .toggle_position {
    padding: 10px;
    position: relative;
    top: 3px;
}

.InfoHead .Toggle, .Info .Toggle, .DetailHeadline .Toggle {
    Display: inline;
    margin: 10px;
}

#DetailTable th, #DetailTable th i {
    background: #fff;
    color: #000;    
}

#DetailTable th:not(.noborderline){
    border-bottom: 3px solid #000;
}

.Toggle i {
    font-size: 1em;
    margin-top: 5px;
}

#detTab {
    clear: both;
    padding-bottom: 2em;
    /*	max-width:1200px; */
    margin: auto;
}

#detTab .resp-tab-content {
    padding: 2em 0 0;
}

div#video {
	clear:left;
    width: 50%;
}

/* Detailtabs Artikeltabelle */
#detTab .ShopTable {
    margin-top: 0;
}

.ShopTable th.DetailLiefer i {
    font-size: 1.5em;
}

.technische_daten_container {
    position: relative;
    float: left;
	width: 100%;
}

.technischer_container {
    width: calc(50% - 5px);
    position: relative;
}

.technische_daten_container>div:nth-of-type(2n+1) {
    float: left;
}

.technische_daten_container>div:nth-of-type(2n) {
    float: right;
}

.technischer_container>div:nth-of-type(2n+1) {
    background-color: #f1f1f1;
}

.technischer_container>.technische_line.technischer_header {
    padding: 2px 10px;
    background-color: #f1f1f1;
    color: #000;
}

.technische_line>div {
    width: 50%;
    display: inline-block;
    padding: 2px 10px;
}

.sav_variation_banner {
    background-color: #08405f;
    color: #fff;
    font-size: 25px;
    padding: 10px;
    position: relative;
}

.sav_variation_banner.sav_ico:before {
    font-family: "icomoon";
    margin-right: 10px;
    top: 2px;
    position: relative;
}

.sav_variation_banner.info:before {
    content: "\e91a";
}

.sav_variation_banner.wrench:before {
    content: "\e923";
}

.einzelansicht {
    padding: 5px 10px;
}

/* Detailtabs Downloads */
#downloadList {
    width: 50%;
    padding: 2em 0em;
    margin-top: 45px;
}

#downloadList li {
    height: 2em;
    line-height: 2em;
    margin-bottom: .5em;
}

#downloadList li i {
    font-size: 1.33em;
    margin-right: .5em;
    color: #ccc;
}

#downloadList li i:before {
    content: "\e92b";
    color: #08405f;
}

#downloadList li:hover i:before {
    content: "\e92b";
    color: #08405f;
}

#downloadList a.button {
    float: right;
    padding: 0 1em;
    height: 1.8em;
    margin-top: .1em;
}

.resp_tabs_cont {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    height: auto;
    border-bottom: 1px solid #ccc;
    margin-left: 3px;
}

/* Detailtabs Videos */
.videoContainer {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    margin-bottom: 2em;
}

.videoContainer iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* ------------------------------------------------------------------------------ */
/* Detailbuttons */

.det #DetailScart,
.sav #DetailScart {
	margin:0px;
	font-size:15px;
	float:none;
	padding: 10px 35px;
    text-transform: uppercase;
}

#DetailScart, #resetBtn {
    margin: 24px 0px;
    float: right;
    padding: 13px 42px;
    font-size: 16px;
}

#resetBtn {
    margin-right: 15px;
}

#DetailPrint {
    margin: 0 10px 0 0;
    text-transform: uppercase;
}

/* Detailtabelle */
#DetailTable a.nolink {
    cursor: default;
    color: #333;
}

#DetailTable a:hover {
    text-decoration: none;
}

#DetailTable .showmobile {
    display: none;
}

#DetailTableClone {
    position: relative;
    overflow: hidden;
    max-width: 100%;
}

#DetailTableCloneConf {
    position: relative;
    
}

#DetailCross th, #ScartTable th, #ERPTable th, #DirectOrderTable th,
    .ShopTable th {
    /*font-size:1.6em;*/
    border-bottom: 3px solid #000;
    border-left: 0;
    border-right: 0;
    text-align: left;
    vertical-align: top;
    background-color: #fff;
}

#ScartTable th, #ScartTable td {
    padding: 0.375em 5px;
}

#DirectOrderTable th {
    padding: 10px 5px;
}

#scartFooter {
    padding-left: 0 !important;
}

#CCTable .headLeft, #ScartTable .headLeft {
    text-align: left;
}

#CCTable .headRight, #ScartTable .headRight {
    text-align: right;
}

.Right {
    text-align: right !important;
}

.Center {
    text-align: center !important;
}

#CompareTable td, #CompareTable th {
    border-bottom: 1px solid #ccc;
}

#CompareTable .Order th, #CompareTable .Order td {
    border-bottom: 0px;
}

.ShopTable td {
    position: relative;
    font-weight: normal;
}

.ShopTable .Article .previewthumb {
    width: 90px;
    height: auto;
    vertical-align: top;
    mix-blend-mode: darken;
}

#CCTable {
    margin-top: 20px;
}

#CCTable th {
    /*font-size:1.2em;*/
    border-bottom: 1px solid #ccc;
}



#DirectOrderTable {
    /*margin-bottom: 40px;*/
    margin-top: 0;
    border-bottom: 1px solid #ccc;
    max-width: 100%;
}

#DirectOrderTable #MengeWert {
    width: 45px;
}

.ShopTable thead>tr {
    border: none;
}

.tableBreak {
    border-top: 1px solid #ccc;
}

.ShopTable strong, .ShopTable strong b {
    font-weight: normal;
}

.ShopTable p {
    margin-top: 0;
}

.CCinArticle>span {
    display: block;
}

.CCinArticle>.CCLabel {
    float: left;
    text-align: left;
}

.CCinArticle>.CCInput {
    float: right;
}

.CCinArticle>.CCInput>input, .CCinArticle>.CCInput>select {
    box-sizing: border-box;
    width: 75% !important;
}

.ShopTable hr {
    border: 1px #ccc;
    border-style: none none dashed none;
}

#ScartOrderButton {
    text-align: right;
    width: 40%;
    overflow: hidden;
    border-left: 1px solid #ccc;
}

#WaitSubmit {
    display: none;
}

#ScarStepsExplain {
    width: 56%;
}

#ScartOrderButton select {
    width: 95% !important;
}

#ScartOrderButton .os_scart_payment_txt {
    margin: 1em 0 0 0;
}

#scartFooter table td, #scartSummary table td {
    border: none;
}

/* Sitemap */
#Sitemap {
    position: relative;
    background: #08405f;
    clear: both;
    overflow: hidden;
    margin: 20px 0 0 0;
    padding: 55px 0;
    text-align: left;
    margin-top: 0;
}

#Sitemap nav, #Sitemap div.ce_text {
    float: left;
    /*width:23%;*/
    /*width: auto;*/
    min-width: 20%;
    padding: 0 3%;
}

#Sitemap nav h1, #Sitemap div h2 {
    text-transform: uppercase;
    margin: 0 0 10px 0;
    color: #fff;
    font-weight: normal;
    padding-bottom: 0.3em;
    font-size: 1.3em;
    line-height: 1.5;

}





#Sitemap nav ul, #Sitemap div ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#Sitemap nav ul li, #Sitemap div ul li {
    padding: 3px 0px;
}

#Sitemap nav ul li, #Sitemap div ul li {
    color: #fff;
}

#Sitemap nav ul li a, #Sitemap div ul li a {
    color: #fff;
}

#Sitemap div ul li a {
    font-weight: normal;
    font-size: 16px;
    text-decoration: none;
}

#Sitemap .productsnav ul.level_3 {
    display: none;
}

#Sitemap .productsnav li.main_category {
    margin: 0;
}

#CreditInfoWrapper {
    padding-top: 30px;
    text-align: center;
    clear: both;
}

/* ------------------------------------------------------------------------------ */
/* Breadcrum */
#Breadcrum {
    padding-bottom: 30px;
    background: #f1f1f1;
    height: 16px;
    padding-top: 5px;
    padding-left: 10px;
}

#Breadcrum strong {
    margin-right: 6px;    
}

#Breadcrum a {
    margin-right: 6px;
    color: #333;
    margin-left: 3px;
}

#Breadcrum a:hover {
    color: #08405f;
    text-decoration: none;
}

#Breadcrum ul {
    display: inline;
    list-style: none;
    margin: 0;
    padding: 0;
}

#Breadcrum li {
    display: inline;
}

#Breadcrum li a::before {
    content: "/";
    margin-right: 7px;
    color: #08405f;
}


footer {
    position: relative;
    bottom: -30px;
    left: 0;
    text-align: center;
    clear: both;
}

.start footer {
    bottom: 0px;
}

footer>ul, footer>div>ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

footer>ul>li, footer.page-footer>div>ul>li, footer>div>ul>li {
    display: inline;
    font-style: normal;
    text-shadow: 1px 1px 0 white;
    white-space: nowrap;
    font-size: 18px;
}

footer>ul>li:after, footer.page-footer>div>ul>li:after, footer>div.ce_text>ul>li:after
    {
    content: '|';
    margin: 0 10px;
}

footer>ul>li:last-child:after, footer.page-footer>div>ul>li:last-child:after,
    footer>div.ce_text>ul>li:last-child:after {
    content: none;
}

footer>ul>li a, footer.page-footer>div>ul>li a, footer>div.ce_text>ul>li a
    {
    color: #333;
    font-size: 18px;
}

/* Meine Startseite */
#customerMenu a div.TwoColumns {
    background-color: #eee;
    margin-bottom: 1%;
    overflow: hidden;
    position: relative;
}

.TwoColumns {
    width: 49%;
    margin-left: 0.5%;
    margin-right: 0.5%;
}

.TwoColumns h2 {
    font-weight: lighter;
}

#customerMenu a:hover div.TwoColumns {
    background-color: #08405f;
}

#customerMenu a:hover * {
    color: #fff;
}

#customerMenu>a>div>i {
    font-size: 10em;
    color: #ccc;
    margin-left: -5%;
}

#customerMenu div.textContainer {
    position: absolute;
    top: 0.4em;
    left: 10em;
    margin-right: 2%;
}

#customerMenu div.textContainer div {
    font-size: 1.4em;
    margin: 10px 0px 10px 0px;
}

#myIndex .textbox {
    float: left;
    width: 500px;
    position: relative;
}

#myIndex .card {
    position: relative;
    float: right;
    width: 319px;
    background-color: #fff;
    padding: 10px;
    border: 1px solid #CCCCCC;
}

#myIndex .card p {
    float: left;
    line-height: 14px;
    margin-bottom: 0px;
    font-size: 10px;
    margin-left: 11px;
    position: relative;
    top: 0px;
}

/* Rubrikenansicht */
#SearchFilter {
    position: relative;
    clear: left;
    /*border-bottom: 1px solid #e6e6e6;*/
    border-width: 1px 0;
    margin-bottom: 20px;
    padding: 10px 5px;
    height: 50px;
}

#SearchFilter select {
    float: right;
    padding: 0.3em;
    /*border-radius: 3px;*/
    margin-right: 7px;    
    background-color: #fff;
}

#SearchFilter .layoutSwitch {
    background: #fff;
    border: 1px solid #ccc;
    padding: 4px 6px;
    font-size: 16px;
    float: right;
    margin-right: 7px;
    height: 30.5px;
    width: 30.5px;
}

#SearchFilter .layoutSwitch i {
    font-size: 14px;
    color: #999
}

#SearchFilter .layoutSwitch.active {
    background: #fff;
    border: 1px solid #000;
    cursor: pointer;    
}

#SearchFilter .layoutSwitch i {
    font-size: 18px;    
    line-height: 21px;
}

#SearchFilter .layoutSwitch.active i { 
    color: #000;    
}

#SearchFilter a.layoutSwitch.inactive:hover i {
    color: #333;
}

.image_container.float_right, .image_container.float_left {
    max-width: 330px;
}

#myIndex .RubView {
    margin-bottom: 20px;
}

#myIndex .RubView ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#myIndex .RubView li {
    position: relative;
    float: left;
    margin: 0px 15px 20px 0;
    width: 135px;
    height: 200px;
    border: 1px solid #ccc;
    background-color: #f3f3f3;
}

#myIndex .RubView .thumb {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    overflow: hidden;
    border-bottom: 1px solid #ccc;
    background-color: #fff;
}

#myIndex .RubView .thumb img {
    width: 100%;
    height: auto;
    margin-top: 0;
}

#myIndex .RubView h3 {
    position: relative;
    margin: 0 10px 10px 10px;
    padding: 10px 0 0 0;
}

#myIndex .RubView p {
    margin: 0 5px;
    padding: 0;
    line-height: initial;
}

/* ------------------------------------------------------------------------------ */
/* Payment */
#PaymentInfo {
    display: none;
}

#tabnav .menu {
    list-style: none;
    margin: 0;
    padding: 0;
    height: 44px;
}

#tabnav .menu li {
    float: left;
    padding: 8px 10px;
}

#tabnav .menu li.active {
    border: 1px solid #ccc;
    padding: 4px;
    -webkit-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
    background-color: #f3f3f3;
}

#tabnav .menu li a {
    display: block;
    width: 50px;
    height: 32px;
    background: url(/tradepro/shop/layout/payment_light.gif) no-repeat;
}

#tabnav .menu li a.tab1 {
    background-position: -100px 0;
}

#tabnav .menu li a.tab2 {
    background-position: -150px 0;
}

#tabnav .menu li a.tab3 {
    background-position: -50px 0;
}

#tabnav .menu li a.tab4 {
    background-position: 0 0;
}

#tabnav .menu li a.tab5 {
    background-position: -200px 0;
}

#tabnav .menu li a.tab6 {
    background-position: -250px 0;
}

#tabnav .menu li a.tab7 {
    background-position: -300px 0;
}

#tabnav .menu li a.tab8 {
    background-position: -350px 0;
}

#tabnav .menu li a.tab9 {
    background-position: -400px 0;
}

#tabnav .content {
    clear: left;
    height: 600px;
    overflow: auto;
    background: white;
    margin: 20px 0 0 0;
    padding: 10px;
}

.TableTwoColumns {
    width: 50%;
    clear: none;
}

/* Warenkorb aktualisieren */
.scartRefresh {
    border: none;
    background: none;
    padding: 0;
    margin: 0;
    display: none;
    position: relative;
    top: 3px;
    box-shadow: none;
    text-shadow: none;
}

.scartRefresh, .scartRefreshDummy {
    width: 22px;
    height: 20px;
}

/* Geschenkartikel */
.Gift {
    min-height: 120px;
    overflow: hidden;
}

.Gift .thumb {
    float: left;
}

.Gift .thumb img {
    width: 90px;
}

.Gift .content {
    margin-left: 100px;
}

.Gift .content .GiftTitle {
    margin: 0 0 1em 0;
    clear: none;
    font-size:1.3em;
    position:relative;
}

.Gift .content a strong {
    color: #08405f;
}

.Gift .content p {
    margin: 0 0 1em 0;
}

.Gift .content button {
    padding: 8px 20px;
    white-space: nowrap;
}

html .rotating-boxes-item-content, html .rotating-boxes-item-cover, html .ce_accordion .toggler,
    html .ce_accordion .accordion, html .ce_accordion+.ce_accordion .toggler
    {
    border-radius: 0px;
    -webkit-border-radius: 0px;
    border: 1px solid #e5e5e5;
}

.CMS.twocolumnleft section.main-content {
    width: calc(100% - 280px);
    /*margin: 2.5em 0 0 2%;*/
    float: right;
}

.CMS .content-wrapper {
    max-width: 1440px;
}

.CMS .sidebar li .active {
    font-weight: bold;
}

.CMS sup, .CMS sub {
    font-size: .83em;
    line-height: 0.5em;
    vertical-align: baseline;
    position: relative;
}

.CMS sup {
    top: -0.4em
}

.CMS sub {
    bottom: -0.4em
}

/******* ANPASSUNG KONTAKTFORMULAR *******/
.button-kontakt,
button.g-recaptcha.submit {
    color: #fff;
    background-color: #08405f;
    border: 1px solid #08405f;
}

.button-kontakt:hover,
.button-kontakt:focus,
.button-kontakt:active,
button.g-recaptcha.submit:hover,
button.g-recaptcha.submit:focus,
button.g-recaptcha.submit:active {
        color: #fff;
        background: #08405f;
        border: 1px solid #08405f;
}

.h3bottom {
    border-bottom: 1px solid #ccc;
}

.kontakt-25 {
    width: 25%;
    float: left;
}

.kontakt-75 {
    width: 73%;
    float: left;
    margin-left: 2%;
}

/* jQuery Zoomz */
.zoomz {
    overflow: hidden;
    position: relative;
    display: inline-block;
    font-size: 0
}

.zoomz img {
    display: block
}

.zoomz .target {
    position: absolute;
    opacity: 0;
    transition: opacity .5s;
    width: 100%;
}

.zoomz.hover .target {
    opacity: 1
}

.zoomz-ready {
    cursor: -webkit-zoom-in;
    cursor: -moz-zoom-in;
    cursor: zoom-in
}

.hidden {
    display: none;
}

#scart-popup-container {
    top: 110px;
    right: 10px;
    height: 800px;
    width: 400px;
    z-index: 7001;
    pointer-events: none;
    position: fixed;
}

#scart-popup-container .scart-add-popup .title {
    color: #797979;
}

.scart-add-popup {
    padding: 5px 5px 5px 90px;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid #666;
    margin-bottom: 5px;
    box-shadow: 3px 3px 10px rgba(0, 0, 0, .35);
    display: none;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.scart-add-popup .background {
    position: absolute;
    top: -70px;
    left: 80px;
    right: 0;
    bottom: 0;
    overflow: hidden;
    text-align: center;
    z-index: 1;
}

.scart-add-popup .background i {
    top: -128px;
    text-align: center;
}

#scart-popup-container .scart-add-popup .background i {
    color: rgba(130, 130, 130, .2);
    font-size: 280px;
}

.scart-add-popup .amount {
    font-weight: bold;
}

.scart-add-popup .image {
    width: 80px;
    min-height: 80px;
    float: left;
    margin-left: -85px;
    position: relative;
    z-index: 2;
}

.scart-add-popup .title {
    position: relative;
    z-index: 2;
}

.scart-add-popup .image img {
    max-width: 80px;
    max-height: 80px;
}

tr.alternating:nth-of-type(2n+1) td,
.manual-odd td {
    /* odd = ungerade = 1, 3, 5,... */
    background-color: #FFF;
}

tr.alternating:nth-of-type(2n) td,
.manual-even td{
    /* even = gerade = 2, 4, 6,... */
    background-color: #F1F1F1;
}

/*
 * Login-Seite für geschlossenen Shop
 */
body.closed-shop-login {
    background-color: #08405f;
}

body.closed-shop-login .login-box {
    position: relative;
    width: 430px;
    max-width: 90%;
    margin: 10% auto;
}

body.closed-shop-login .login-box>div {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .5);
    padding: 15px;
    box-shadow: 0 0 5px rgba(213, 166, 26, .5);
    border-radius: 6.66px;
}

body.closed-shop-login .login-box p {
    color: #ccc;
    margin-top: 20px;
    font-size: 10px;
    text-align: center;
    line-height: 1.4em;
}

body.closed-shop-login label {
    display: block;
    font-weight: bold;
}

body.closed-shop-login input {
    margin-bottom: 15px;
    width: 96%;
}

.updowncontainer i {
    display: block;
}

.menge+.updowncontainer {
    /* nur anzeigen wenn Mengenfeld vorhanden */
    width: 1.1em;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -2px;
}

.increase, .decrease {
    cursor: pointer;
    display: block;
    color: #fff;
    background-color: #000;
    font-size: 10px;
    padding: 2px;
    text-align: justify;
    margin: 2px;
    margin-top: 4px;
}

/***
 * 	 STRIPE CSS
 */
/* MODAL BEI PAYMENT PROZESS */
#stripe-modal-wrapper {
    display: none;
    position: fixed;
    z-index: 20000201;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.3);
    width: 100%;
    height: 100%;
}

#stripe-modal {
    width: 300px;
    height: auto;
    background: none;
    text-align: center;
    color: #202020;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -150px;
    margin-top: -100px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

/* STATUS IN BESTELLÜBERSICHT */
span.stripestatus {
    display: inline-block;
    color: #fff;
    width: 100px;
    height: 26px;
    border-radius: 3px;
    font-size: .85em;
    line-height: 26px;
    display: inline-block;
    text-align: center;
    text-shadow: 0 0 1px #000;
}

.stripestatus-green, .stripestatus-green i {
    color: #fff;
    background-color: #3e8600
}

.stripestatus-red, .stripestatus-red i {
    color: #fff;
    background-color: #7f0000
}

.stripestatus-orange, .stripestatus-orange i {
    color: #fff;
    background-color: orange
}

.stripestatus-grey, .stripestatus-grey i {
    color: #fff;
    background-color: #ccc
}

.stripestatus-blue, .stripestatus-blue i {
    color: #fff;
    background-color: rgba(43, 134, 186, 1)
}

/* STRIPE ENDE */
.flags {
    position: relative;
    bottom: -4px;
}

.erpbutton {
    min-width: 70px;
    background-color: #fff;
    display: inline-block;
    border: 1px solid #000;
    text-align: center;
    font-size: 12px;
    color: #000;
}

a.erpbutton:hover {
    color: #fff;
    background-color: #08405f;
    border-color: #08405f;
}

#languageselector, #languageselector2,
#languageselector_cms{
    padding: 0;
    font-size: 14px;
    box-shadow: none;
    border: none;
    background-color: transparent;
    color: #333;
    width: 40px !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
    text-transform: uppercase;    
}

select:focus-visible {
    outline: none !important;
}

/* PassMeter (kundendaten ändern) */
/* Passmeter */
.pwtest {
    width: 80%;
    font-weight: bold;
    text-align: center;
}

.pwtest.passMeter-bad {
    background: red;
    color: #fff;
    box-shadow: inset 0px 0px 9px #920000;
}

.pwtest.passMeter-low {
    background: yellow;
    color: #000;
    box-shadow: inset 0px 0px 9px #909200;
}

.pwtest.passMeter-good, .pwtest.passMeter-strong {
    background: lightgreen;
    color: #000;
    box-shadow: inset 0px 0px 9px #00ad00;
}

#footer>div.ce_text, #footer #CreditInfoWrapper {
    background-color: #f1f1f1;
}

.categoryselector {
    display: none;
    position: absolute;
    font-size: 15px;
    left: 0;
    top: 0;
    height: 42px;
    background-color: #f1f1f1;
    color: #000;
    border: 1px solid #ccc;
    padding: 9px 8px 0 8px;
    overflow: hidden;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

#categorydropdown {
    left: 0;
    right: 0;
    top: 0;
    bottom: 4px;
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/*
.block_links {
    width: 300px;
    height: 50px;
    position: absolute;
    left: -305px;
}

.block_rechts {
    width: 300px;
    height: 50px;
    position: absolute;
    right: -305px;
}
*/
.innerScrollDetailTable {
    overflow: auto;
    /*width: 100%;
	 height: 200px;*/
}

.innerScrollDetailTableConf {
    overflow: auto;
    width:100%;
    /*width: 100%;
	 height: 200px;*/
}

#DetailTable th.fixedColumn {
    position: sticky;
    left: 0;
    z-index: 1;
}

#DetailTable th {
    vertical-align: middle;
}

.filter_select{
    font-weight: bold;
}

#DetailTableCloneConf th.fixedColumn {
    position: sticky;
    left: 0;
    z-index: 1;
}

#DetailTableCloneConf table {
	border-spacing:2px 0px;
}

#DetailTable th.lastFix {
    position: sticky;
    right: 0;
    z-index: 1;
}

#DetailTableCloneConf th.lastFix {
    position: sticky;
    right: 0;
    z-index: 1;
}

#DetailTable td.fixedColumn {
    position: sticky;
    left: 0;
    z-index: 1;
}

#DetailTableCloneConf td.fixedColumn {
    position: sticky;
    left: 0;
    z-index: 1;
    
}

#DetailTable td.lastFix {
    position: sticky;
    right: 0;
    z-index: 1;
}

#DetailTableCloneConf td.lastFix {
    position: sticky;
    right: 0;
    z-index: 1;
}

.asn_colorbox {
    display: block;
    height: 40px;
    list-style: none;
    margin: 0 auto;
    padding: 0;
}

.colorbox {
    float: left;
    display: block;
    margin: 0 10px 10px 0;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 3px;
    box-shadow: 1px 1px 1px #ccc;
}

.rainbow {
    background: -moz-linear-gradient(top, rgba(253, 0, 23, 1) 0%,
        rgba(253, 0, 23, 1) 16%, rgba(253, 151, 42, 1) 17%,
        rgba(253, 151, 42, 1) 33%, rgba(254, 253, 66, 1) 34%,
        rgba(254, 253, 66, 1) 50%, rgba(59, 254, 60, 1) 51%,
        rgba(59, 254, 60, 1) 67%, rgba(28, 156, 251, 1) 68%,
        rgba(28, 156, 251, 1) 84%, rgba(104, 61, 249, 1) 85%,
        rgba(104, 61, 249, 1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(253,
        0, 23, 1)), color-stop(16%, rgba(253, 0, 23, 1)),
        color-stop(17%, rgba(253, 151, 42, 1)),
        color-stop(33%, rgba(253, 151, 42, 1)),
        color-stop(34%, rgba(254, 253, 66, 1)),
        color-stop(50%, rgba(254, 253, 66, 1)),
        color-stop(51%, rgba(59, 254, 60, 1)),
        color-stop(67%, rgba(59, 254, 60, 1)),
        color-stop(68%, rgba(28, 156, 251, 1)),
        color-stop(84%, rgba(28, 156, 251, 1)),
        color-stop(85%, rgba(104, 61, 249, 1)),
        color-stop(100%, rgba(104, 61, 249, 1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(253, 0, 23, 1) 0%,
        rgba(253, 0, 23, 1) 16%, rgba(253, 151, 42, 1) 17%,
        rgba(253, 151, 42, 1) 33%, rgba(254, 253, 66, 1) 34%,
        rgba(254, 253, 66, 1) 50%, rgba(59, 254, 60, 1) 51%,
        rgba(59, 254, 60, 1) 67%, rgba(28, 156, 251, 1) 68%,
        rgba(28, 156, 251, 1) 84%, rgba(104, 61, 249, 1) 85%,
        rgba(104, 61, 249, 1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(253, 0, 23, 1) 0%,
        rgba(253, 0, 23, 1) 16%, rgba(253, 151, 42, 1) 17%,
        rgba(253, 151, 42, 1) 33%, rgba(254, 253, 66, 1) 34%,
        rgba(254, 253, 66, 1) 50%, rgba(59, 254, 60, 1) 51%,
        rgba(59, 254, 60, 1) 67%, rgba(28, 156, 251, 1) 68%,
        rgba(28, 156, 251, 1) 84%, rgba(104, 61, 249, 1) 85%,
        rgba(104, 61, 249, 1) 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, rgba(253, 0, 23, 1) 0%,
        rgba(253, 0, 23, 1) 16%, rgba(253, 151, 42, 1) 17%,
        rgba(253, 151, 42, 1) 33%, rgba(254, 253, 66, 1) 34%,
        rgba(254, 253, 66, 1) 50%, rgba(59, 254, 60, 1) 51%,
        rgba(59, 254, 60, 1) 67%, rgba(28, 156, 251, 1) 68%,
        rgba(28, 156, 251, 1) 84%, rgba(104, 61, 249, 1) 85%,
        rgba(104, 61, 249, 1) 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fd0017',
        endColorstr='#683df9', GradientType=0); /* IE6-9 */
    background: linear-gradient(top, rgba(253, 0, 23, 1) 0%,
        rgba(253, 0, 23, 1) 16%, rgba(253, 151, 42, 1) 17%,
        rgba(253, 151, 42, 1) 33%, rgba(254, 253, 66, 1) 34%,
        rgba(254, 253, 66, 1) 50%, rgba(59, 254, 60, 1) 51%,
        rgba(59, 254, 60, 1) 67%, rgba(28, 156, 251, 1) 68%,
        rgba(28, 156, 251, 1) 84%, rgba(104, 61, 249, 1) 85%,
        rgba(104, 61, 249, 1) 100%); /* W3C */
}

#ShopMenu .asn_colorbox li:before, .colorbox:before {
    content: "";
}

.colorbox a:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.6) 0%,
        rgba(255, 255, 255, 0) 100%);
    z-index: 99;
}

#ShopMenu {
    position: relative;
    background: none;
    float: right;
    width: 270px;
    margin-bottom: 20px;
}

.CMS.twocolumnleft aside.sidebar {    
    float: left;
    width: 270px;
    margin-left: 0;
}

#ShopMenu .Filter {
    display: none
}

#ShopMenu section, #ShopMenu>div {
    background-color: #fff;
}

#ShopMenu>div#Filter {
    background: none;
}

#ShopMenu .angebote li {
    margin-bottom: 10px;
}

#ShopMenu .angebote li:before {
    content: "";
}

#ShopMenu>section, #ShopMenu>#Filter>section, #ShopMenu>.ce_text {    
    padding: 10px 0px 10px 0px;
    /*margin-bottom:15px;*/
    position: relative;
}

#ShopMenu>section:not(.angebote), #ShopMenu>#Filter>section{
    border-bottom: 1px solid #ccc;
}

#ShopMenu>*, #ShopMenu>#Filter>* {
    /*border: 1px solid #f1f1f1;*/
    margin: 0 0 1.5em 0;
}

#ShopMenu.FFSMenu {
    float: left;
    left: 3px;
}
/*
er {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    border: none;
}
/*
/*#ShopMenu h1 {
	font-size: 1.3em;
	text-shadow: 1px 1px 0 white;
	margin: 0;
	position: relative;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	hyphens: auto;
	color: #242424;
}*/
#ShopMenu h1 .ASN_Toggle, .toggle {
    background: url("/tradepro/shop/layout/ASN_toggle.png") no-repeat scroll
        left top transparent;
    height: 18px;
    position: absolute;
    right: 5px;
    top: 2px;
    width: 18px;
    cursor: pointer;
}

#ShopMenu h1 .ASN_Toggle.close, .toggle.close {
    background-position: left bottom;
}

#ShopMenu>#Filter {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    border: none;
}

#ShopMenu h6 {
    color: #ff00ff;
}

#ShopMenu h1 {
    font-size: 1em;
    text-shadow: 1px 1px 0 white;
    margin: 0;
    position: relative;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    padding-right: 25px;
    font-weight: bold;
}

#ShopMenu h1 .ASN_Toggle, .toggle {
    background: url("/tradepro/shop/layout/ASN_toggle.png") no-repeat scroll
        left top transparent;
    height: 16px;
    position: absolute;
    right: 5px;
    top: 2px;
    width: 18px;
    cursor: pointer;
}

#ShopMenu h1 .ASN_Toggle.close, .toggle.close {
    background-position: left bottom;
}

#ShopMenu ul {
    margin: 10px 0 0 0;
    padding: 0;
    list-style: none;
}

#ShopMenu.NoMargin ul, #DirectOrderTable button {
    margin-top: 0px;
}
/*
#ShopMenu li:before {
    position: absolute;
    font-family: "icomoon";
    content: "\e907";
    margin-top: 0.7em;
    font-size: 0.6em;
    text-indent: 1px;
}
*/
#ShopMenu li {
    position: relative;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
}
/*
#ShopMenu li.active {
    background-color: #08405f;
    color: #fff;
    margin-bottom: 3px;
}

#ShopMenu li.active a:after {
    position: absolute;
    font-family: "icomoon";
    content: "\ea0f";
    top: 0.7em;
    right: 6px;
    color: #fff;
    font-size: 9px;
}
*/
#CMS #ShopMenu li.active a:after {
    content: "";
}

#ShopMenu li.open {
    background-image: url(/tradepro/shop/layout/arrow_down.png);
    background-position: 0 3px;
}

#ShopMenu section a {
    display: block;
    /*margin: 0 0 0 15px;*/
    padding: 0.4em 0 0.4em 0;
    color: #333;   
}

#ShopMenu section a:hover {
    color: #08405f;
    text-decoration: none;
}
/*
#ShopMenu li.active a {
    color: #fff;
}
*/
#ShopMenu section a.button:hover {
    color: #fff;
}

#ShopMenu a.active:after {
    font-family: 'FontAwesome';
    font-size: 1em;
    float: right;
    content: '\f00d';
    padding-top: 0.2em;
    padding-right: 5px;
    line-height: 100%;
}

#ShopMenu section span {
    color: #999;
}

#ShopMenu select {
    width: 100%;
    margin-bottom: 10px;
}

#ShopMenu .level2 {
    margin-left: 12px;
}

#topseller span {
    font-weight: bold
}

#topseller span::after {
    content: ")"
}

#topseller span::before {
    content: "("
}

/* Kundenkonto */
#CustAccount a#os_link_customer {
    margin: 0;
    padding: 0;
    display: block;
    /*position: relative;*/
}

#CustAccount img {
    position: absolute;
    top: 10px;
    right: 10px;
    max-width: 50px;
}

#CustAccount form {
    width: 100%;
    overflow: hidden;
    margin-bottom: 10px;
}

#CustAccount form>div {
    position: relative;
    margin-top: 5px;
    clear: both;
}

#CustAccount form>div:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

#CustAccount form label {
    float: left;
    width: 33%;
    margin: 6px 0 6px 0;
    padding: 0;
    line-height: 20px;
}

#CustAccount form input.Input {
    float: right;
    width: 66%;
    box-sizing: border-box;
}

#CustAccount form button.Submit {
    padding: 5px 15px;
    float: right;
}

/* Zuletzt gesehen */
#CustLastEmpty {
    background: none;
}

#ShopMenu #CustLastEmpty:before {
    content: "";
}

.elasticsearchbackground {
    background-image: url('/tradepro/shop/elastic.png');
    background-repeat: no-repeat;
    background-position: center;
    background-position: 90%;
}

.factfinderbackground {
    background-image: url('/tradepro/shop/fact-finder.png');
    background-repeat: no-repeat;
    background-position: center;
    background-position: 90%;
}

/* Contao Geraffel für Slider Inhalte neues Design */
.image_container {
    margin: 0;
}

.slider-content h1 {
    line-height: 0;
}

.mWidth500 {
    margin-top: 0.5 vw;
    max-width: 25vw;
    display: block;
    font-size: 1vw;
    background-color: #f1f1f1;
    opacity: 0.8;
    padding: 1vw;
    display: flex;
    margin: 0;
    margin-bottom: 0.5 vw;
}

.teaser_center {
    display: table-cell;
    vertical-align: middle;
}

.teaser_block {
    max-width: 50%;
    display: block;
}

.fixedscreen .teaser_block {
	max-width:100%;
}

.teaser_container {
    position: relative;
}

.teaser_image {
    background-size: cover;
    background-position: center center;
    display: block;
    height: 400px;
    width: 50%;
    margin: 0px;
    padding: 0px;
}



.teaser_flatbox {
    width: 50%;
}

.teaser_rechts .teaser_flatbox {
    margin-left: 50%;
}

.teaser_rechts .teaser_block {
    float: left;
}

.teaser_links .teaser_block {
    float: right;
}

.teaser_links .teaser_flatbox {
    margin-left: 0%;
}

.teaser_rechts .teaser_image {
    background-position: center center;
}

.teaser_links .teaser_image {
    background-position: center center;
    margin-left: 50%;
}

.teaser_rechts .teaser_flatbox,
.teaser_links .teaser_flatbox {
    display: block;
    margin: 0px;
    position: absolute;
}

.teaserTopicBlack {
    background: #000;
    opacity: 1;
    font-size: 1.2 vw;
    color: #fff;
    padding: 15px;
    display: inline-block;
    margin-top: 20px;
}

.teaser_rechts .teaser_flatbox {
    right: 0px;
    top: 0;
    height: 400px;
}

.teaser_links .teaser_flatbox {
    left: 0px;
    top: 0;
    height: 400px;
}

.teaser_links .teaser_block,
.teaser_rechts .teaser_block {
    float: none;
    margin: 0px auto;
    max-width: 100%;
}

.teaser_center {
    display: table;
    vertical-align: middle;
    width: 100%;
    height: 100%;
    text-align: center;
}

.teaser_links .teaser_block,
.teaser_rechts .teaser_block {
    display: table-cell;
    vertical-align: middle;
}

.teaserTextBlack {
    opacity: 1;
    font-size: 2vw;
    color: #000;
    padding: 5px;
    display: inline-block;
    margin-top: 15px;
    line-height: 2.1 vw;
    font-weight: bold;
    text-transform: uppercase;
}

.teaserButton .button {
    margin-top: 15px;
    border-radius: 25px;
    text-transform: uppercase;
}

.teaser_weiss {
    background-color: #FFFFFF;
}

.teaser_gelb {
    background-color: #FFD13D;
}

.teaser_gruen {
    background-color: #54B751;
}

.teaser_rot {
    background-color: #E51616;
}

.teaser_blau {
    background-color: #182869;
}

.teaser_blau .teaserTextBlack {
	color:white;

}

.teaser_hellgrau {
    background-color: #f1f1f1;
}

.teaser_dunkelgrau {
    background-color: #545558;
}

.teaser_dunkelgrau .teaserTextBlack {
    color: white;
}

.teaser_schwarz {
    background-color: #000000;
    color:white;
}

.teaser_schwarz .teaserTopicBlack {
    background-color: #555555;
}

.teaser_schwarz .teaserTextBlack {
    color: white;
}

.sliderTopicBlack {
    background: #000;
    opacity: 1;
    font-size: 1.2 vw;
    color: #fff;
    margin-bottom: 0.5 vw;
    display: flex;
    justify-content: center;
    align-content: center;
}

.rsts-nav {
    display: flex;
    justify-content: center;
    align-content: center;
    width: 100%;
}

.innerTopicBlack {
    padding: 0.5vw;
}

.topicResponsive {
    left: 2vw;
}

.slider-contentbox-top {
    position: absolute;
    top: 2vw;
}

.slider-contentbox-middle {
    position: absolute;
    left: 3vw;
}

.slider-contentbox-bottom {
    position: absolute;
    bottom: 2vw;
}

.slider-contentbox-left {
    left: 3vw;
}

.slider-contentbox-center {
    left: 3vw;
}

.slider-contentbox-right {
    right: 3vw;
    text-align: right;
}

.slider-subheadline {
    background: #08405f;
    opacity: 1;
    color: #fff;
    margin: 1em 0 0.1em;
    /*text-align: center;*/
    padding: 0.5em;
    /*width: 17vw;*/
    font-size: 1.4em;
    display: inline-block;
    font-family: "Barlow";
    text-transform: uppercase;    
    font-weight: bold;
}

.slider-linktext {
    /*background-color: #08405fcc;*/
    color: #fff;
    font-weight: normal;
    font-size: 3.4em;
    padding: 1rem 0.5rem;
    line-height: unset;
    text-decoration: none;
    margin-top: 0.5vw;
    text-transform: uppercase;
    text-shadow: 1px 1px #666 !important;    
    max-width: 600px;
    line-height: 1em;    
}

.slider-linktext a {
    color: #fff;
    text-decoration: none;
    font-family: "Barlow-SemiBold";
}

.slider-linktext a:hover {
    opacity: 0.9;
}

.break {
    flex-basis: 100%;
    height: 0;
}

.sliderBlueTransparent {
    background-color: #08405f;
    color: #fff;
    font-weight: normal;
    font-size: 2.4vw;
    padding: 1.3vw 1.2vw 1.3vw 1.2vw;
    display: flex;
    opacity: 0.8;
    line-height: unset;
    text-decoration: none;
    margin-top: 0.5vw;
}

.containerFlex {
    display: flex;
    justify-content: center;
    align-content: center;
}

.sliderBlueTransparent:hover {
    text-decoration: none;
    opacity: 0.9;
    color: #fff;
}

.sliderBlueTransparent .ico {
    font-size: 2vw;
    margin-left: 1vw;
    margin-top: -0.2 vw;
}

.pos-tradepro {
    position: absolute;
    left: 3vw;
    top: 2vw;
}

.TopicBlackTradepro {
    max-width: 17vw;
}

.pos-responsive {
    position: absolute;
    left: 4vw;
    top: 0vw;
}

.TopicBlackResponsive {
    max-width: 15vw;
}

.pos-hautpflege {
    position: absolute;
    left: 20vw;
    bottom: 3.2 vw;
}

.TopicBlackHautpflege {
    max-width: 15vw;
}

.pos-visualLinks {
    position: absolute;
    left: 35vw;
    bottom: 5vw;
}

.TopicBlackvisualLinks {
    max-width: 15vw;
}

.slidervisualLinks {
    max-width: 17vw;
}

.TopicBlackKuechenpflege {
    top: 17vw;
    left: 18vw;
}

.pos-Karriere {
    position: absolute;
    bottom: 5vw;
    left: 18vw;
}

.TopicBlackKarriere {
    max-width: 10vw;
}

.sliderKarriere {
    max-width: 20vw;
}

.posPSA {
    bottom: 6vw;
    left: 8vw;
    position: absolute;
}

.TopicBlackPSA {
    max-width: 10vw;
}

.sliderPSA {
    max-width: 45vw;
}

.rsts-skin-default .rsts-nav {
    position: absolute;
    bottom: 30px;
    text-align: right;
    display: flex;
    justify-content: center;
    align-content: center;
    right: unset;
}

.rsts-skin-default .rsts-nav-bullets a {
    width: 20px;
    height: 20px;
    border: 0;
}

.rsts-skin-default .rsts-nav-bullets a:hover, .rsts-skin-default .rsts-nav-bullets a.active
    {
    background-color: #08405f;
    border: 0;
}

.rsts-prev, .rsts-next {
    display: none;
}

/* Allgemein */
.Width45 {
    width: 45px;
}

.ZweiSpalten {
    width: 49%;
}

.widescreen.CMS .content-wrapper {
    max-width: 1800px;
}

.teaser_container {
    /* float: left; */
    display: block;
    margin-bottom: 50px;
}

.FormTwoColumns {
    width: 49%;
}

.FormTwoColumns:first-of-type {
    margin-right: 2%;
}

html table {
    border-radius: 0px;
}

.InfoText ul {
    list-style: disc;
    margin-left: 20px;
    padding: 0px;
}



h1.InfoHead {
    position: relative;
    font-size: 1.8em;
    clear: left;
    margin: 20px 0 5px 0;
    padding: 10px 0 5px 0;
    color: 000;
    border-bottom: 1px solid #ccc;
    font-weight:normal;
}


.InfoHead {
    position: relative;
    clear: left;
    margin: 20px 0 5px 0;
    padding: 10px 0 5px 0;
    color: 000;
    border-bottom: 1px solid #ccc;
}


h2.Info {
    position: relative;
    font-size: 1.8em;
    clear: left;
    margin: 20px 0 5px 0;
    padding: 10px 0 5px 0;
    color: 000;
    border-bottom: 1px solid #ccc;
}



#ListView li {
    border-bottom-style: solid;
}

/* CMS */
.CMS table th.col_first {
    border-left: 0px;
}

.CMS table th.col_last {
    border-right: 0px;
}

.CMS table {
    border-radius: 0px;
}

.CMS table thead th {
    border-bottom: 1px solid #ccc;
}

.CMS table th {
    background-color: #f1f1f1;
}

.CMS table tbody th {
    border-right: 1px solid #ccc;
}

.ce_downloads, .ce_downloads hr {
    border-color: #f1f1f1;
}

.ce_downloads h3 {
    background: #f1f1f1;
    color: #222;
}

/* NEWS */
.naiTextContainer {
    float: left;
    width: 73%;
}

.naiImageContainer {
    display: block;
    float: left;
    width: 25%;
    margin-right: 2%;
    border: 10px solid #fff;
}

.naiImageContainer img {
    display: block;
    float: none;    
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}

.mod_newslist>div {
    border-bottom: 1px solid #e3e3e3;
    position: relative;
}

.newsArchiveItem {
    padding: 0 0 1em 0;
    margin: 1em 0 1em 0;
}

.newsArchiveItem .more a {
    display: block;
    margin-top: .75em;
    font-weight: 700;
    color: #08405f;
}

.mod_newslist h1 a, .mod_newslist h1 {
    font-size: 1.1em;
    font-weight: bold;
    color: #08405f;
}


.mod_newslist h2 a, .mod_newslist h2 {
    font-size: 0.8em;
    font-weight: bold;
    color: #08405f;
}

/* WARENKORB */
select#directorder {
    width: 100%;
    max-width: 100%;
}

#ScartSteps li strong {
    bottom: 20px;
}

/* NAVIGATION */
#ScartScroll .scartcounternumber {
    top: 0px;
    right: -5px;
    position: absolute;
    left: auto;
}

#ScartScroll {
    margin-right: 10px;
    padding-bottom: 10px;
}

/* Artikel im CMS */
.articleTable thead {
    background: #f1f1f1;
}

/* Artikel im CMS - Slider */
.articleSlider.artCMS .slick-arrow {
    position: absolute;
    display: block;
    height: 100%;
    top: 0px;
    width: 45px;
    line-height: 0;
    font-size: 0;
    cursor: pointer;
    background: transparent;
    color: #eee;
    padding: 0;
    border: none;
    outline: none;
}
.articleSlider .slick-slide .webPikto img {
    max-width: 40px;
}
.articleSlider.artCMS .slick-arrow:before {
    font: normal normal normal 1em/1 icomoon;
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    content: "\e907";
    font-size: 50px;
}

.articleSlider.artCMS .slick-prev.slick-arrow:before {
    transform: rotate(180deg);
}

.articleSlider.artCMS .slick-next.slick-arrow {
    right: 0px;
}

.articleSlider.artCMS .slick-prev.slick-arrow {
    left: 0px;
}

/* SAV Box Ansicht */
#ShopMenu .savorderbox2 {
    border: 0;
    box-shadow: none;
}

.DetailMenu {
    width: 287px;
    /*border: 1px solid #f1f1f1;*/
}

.savorderbox2 table, .savorderbox2 tr, .savorderbox2 td {
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0;
}

.savorderbox2 {
    position: relative;
}

.savorderbox2 .preisbox {
    background-color: #f1f1f1;
    height: 45px;
    padding: 10px;
    color: #000;
}

.savorderbox2 .preisbox .amountcontainer {
    position: absolute;
    right: 2px;
    top: 6px;
}

.savorderbox2 .lineelement {
    position: relative;
    padding: 3px 10px;
    border-bottom: 1px solid #ededed;
    font-weight: 700;
    font-size: 14px;
}

.savorderbox2 .lineelement .right {
    position: absolute;
    right: 10px;
    text-align: right;
    top: 3px;
}

.savorderbox2 .buttonline {
    text-align: right;
    padding: 10px 8px;
    
}

.savorderbox2 .buttonline a {
    /*background-color: #ededed;*/
    padding: 4px;
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    border-radius: 0px;    
}

.savorderbox2 .buttonline a:hover {    
    color: #08405f;    
}


#savorderbox2 {
    margin-bottom: 5px;
}

#PrintView #Zoomlinks, #PrintView #DetailImageContainer, #PrintView #DetailImage
    {
    width: 180px;
}

.OlistWrapper {
    display: block;
    overflow: auto;
}

table.scroll {
    width: 100%;
    background-color: #fff;
}

table.scroll thead {
    width: 100%;
    background: #f1f1f1;
    color: #000;
}

table.scroll thead tr:after {
    content: '';
    overflow-y: scroll;
    visibility: hidden;
}

table.scroll thead th {
    flex: 1 auto;
    display: block;
}

table.scroll tbody {
    display: block;
    width: 100%;
    overflow-y: auto;
    height: auto;
    max-height: 200px;
}

table.scroll thead tr, table.scroll tbody tr {
    display: flex;
}

table.scroll tbody tr td {
    flex: 1 auto;
    word-wrap: break;
    border: 1px solid #ccc;
}

table.scroll thead tr th, table.scroll tbody tr td {
    min-width: 120px;
    padding: 5px;
    text-align: left;
}

table.scroll input {
    max-width: 45px;
}

#debug {
    padding: 0.3em;
    background: #08405f;
    opacity: 0.7;
    color: #fff;
    font-family: OpenSansBold;
    font-size: 12px;
    position: fixed;
    left: 1.5em;
    top: 0;
    z-index: 10000;
    transform-origin: top left;
    transform: rotate(90deg);
    line-height: 1em;
    white-space: nowrap;
}

.cselected a {
    padding: 0;
    position: relative;
    margin: 0;
}

.cselected a:after, .colorbox:hover a:after {
    font-family: 'icomoon';
    font-size: 22px;
    font-weight: bold;
    content: '\ea10';
    line-height: 100%;
    position: absolute;
    top: 3px;
    left: 4px;
    color: #fff;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px
        0 #000;
    z-index: 200;
}

.cselected a:hover:after {
    content: '\ea0f';
}

#Navi .mega-dropdown.level_3 {
    overflow-y: auto;
    /*left: -3px;*/
}

.main-navigation>ul>li>a.trail, .main-navigation>ul>li>a.forward {
    font-weight: normal
}

.page>.content-wrapper {
    padding-left: 12px;
    padding-right: 12px;
}

#RubView li.no-article {
    height: 0px !important;
    margin: 0;
}

#RubView li.no-article:hover {
    border: none;
    margin-left: 14px;
}

#scartsummator>td:nth-of-type(2n) {
    padding-left: 10px;
}

#scartsummator>td:nth-of-type(2n+1) {
    padding-right: 10px;
}

.minorder {
    font-size: 1.5em;
    color: #f00;
    display: inline-block;
    margin-bottom: 10px;
    font-weight: bold;
}

.main-navigation>ul>li>a.active, .main-navigation>ul>li>a.trail,
    .main-navigation>ul>li>a.forward, .main-navigation>ul>li span.active,
    .main-navigation>ul>li span.trail, .main-navigation>ul>li span.forward,
    .main-navigation>ul>li>ul>li span.active, .main-navigation>ul>li>ul>li span.trail,
    .main-navigation>ul>li>ul>li span.forward {
    font-weight: normal;
}

.required, input[type="checkbox"].required, input[type="radio"].required,
    input[type="image"].required, input.mandatory, input[type="checkbox"].mandatory,
    input[type="radio"].mandatory, input[type="image"].mandatory {
    box-shadow: 0 0 2px rgba(255, 0, 0, .8);
}

label {
    display: block;
    margin-bottom: 0.35714em;
    /*font-size: 0.875em;*/
    color: #717c8e;
}

form.fullwidthform input[type="text"], form.fullwidthform input[type="password"],
    form.fullwidthform select, form.fullwidthform textarea, form.fullwidthform input {
    width: 100% !important;
}

form.fullwidthform input[type="checkbox"]{
    width: 24px !important;
}

form[name="Bestellung"].fullwidthform select {
    width: 100% !important;
}

form.fullwidthform input.plz, form.fullwidthform input.PLZ {
    width: 30% !important;
}

form[name="Bestellung"].fullwidthform input.city {
    margin-left: 10px;
    width: calc(70% - 10px) !important;
}

form.fullwidthform input.city, form.fullwidthform input.Ort {
    margin-left: 10px;
    width: calc(70% - 10px) !important;
}

form.fullwidthform input.hasDatepicker {
    width: calc(100% - 26px);
    margin-right: 10px;
}


table tr td:last-of-type {
    padding-right: 6px;
}

#ListView table tr td:not(td.aktionspreis, td:last-of-type) {    
    min-width: 100px;
}

#ListView table tr td:last-of-type {    
    min-width: 130px;
}

/* Allgemein */
#SearchFilter #ArticlesPerPage li:not(:last-child ):after {
    content: '|';
    color: #333;
    margin: 0 0 0 5px;
}


#SearchFilter {
    position: relative;
    clear: left;
    /*border: 1px solid #bbb;*/
    border-width: 1px 0;
    margin-bottom: 20px;
    padding: 10px 0;
    height: 50px;
}

.fixedscreen #SearchFilter {
    padding: 2px 0;

}

#SearchFilter #ArticlesPerPage {
    float: right;
    padding: 4px 10px 3px 3px;    
}

#ArticlesPerPage span {
	float:left;
	margin-right:6px;
}

#SearchFilter #ArticlesPerPage ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#SearchFilter #ArticlesPerPage li {
    display: inline;
}
/* Favoritenliste */
#Favoliste .updowncontainer {
    float: right;
    position: absolute;
    right: 10px;
    top: calc(50% - 21px);
}

#Favoliste .updowncontainer i {
    font-size: 12px;
}
/* Detailseite */
#DetailVarianten a.button {
    /*margin-top: -12px;
	float: right;*/
    display: inline-block;
}

#DetailVarianten {
    margin-bottom: 3em;
    margin-top: 3em;
    display: inline-grid;
}

.DetailCrossHeadline {
    margin-right: 20px;
}
/* Bestelllisten */
#RubView.olist li {
    float: left;
    border: 1px solid #ccc;
    padding: 10px;
    margin: 5px;
    height: auto;
    width: 250px;
}

#RubView.olist li h3 {
    border-top: 1px solid #ccc;
    font-size: 1em;
    height: 75px;
}

#RubView.olist li h3 a {
    font-size: 1em;
}

#RubView.olist li:hover {
    background: #f1f1f1;
}

#RubView.olist .thumb {
    padding: 10px;
    margin-bottom: 10px;
    height: 200px;
    overflow: hidden;
    background: #fff;
}

#RubView.olist .thumb img {
    width: 100%;
    height: auto;
    max-width: unset;
    max-height: unset;
    position: inherit;
    display: block;
    transform: none;
    left: unset;
    top: 0px;
}

#scart-popup-container .scart-add-popup .background i.fa-star {
    font-size: 200px;
    margin-top: 20px;
}

.scart-add-popup .amount {
    font-weight: bold;
}

.scart-add-popup .image {
    width: 80px;
    min-height: 80px;
    float: left;
    margin-left: -85px;
    position: relative;
    z-index: 2;
}

.scart-add-popup .title {
    position: relative;
    z-index: 2;
}

.scart-add-popup .image img {
    max-width: 80px;
    max-height: 80px;
}

#scart-popup-container .scart-add-popup .background i.red {
    color: rgba(200, 0, 0, .1);
}

#scart-popup-container .scart-add-popup .background i.yellow {
    color: rgba(200, 200, 0, .2);
}

/* Header Warenkorb */
#ScartInfo:hover .ScartItemDetails {
    display: block;
    width: 420px;
    background: #fff;
    right: -30px;
    margin-top: 21px;
}

#ScartScroll:hover .ScartItemDetails {
    display: block;
    width: 420px;
    background: #fff;
    right: -30px;
}

.ScartItemDetails>h1 {
    font-size: 1.5em;
    line-height: 1;
    font-weight: normal;
}

.ScartItemDetails>h1, .ScartItemDetails>a {
    margin: 0;
    background: #08405f;
    padding: 10px 20px;
    left: 0;
    color: #fff;
}

#LanguageMenu a{
    cursor: default;
}

#LanguageMenu {
    cursor: pointer;
}

#NaviLogin {
    padding: 0 !important;
}

#NaviLogin a{
    color: #333;
}

#NaviLogin a:hover{
    color:#08405f;
}

.ScartItemDetails>a>span {
    float: right;
}

.ScartItemDetails>ul {
    padding: 0px;
    margin: 0px;
    border-left: 3px solid #f1f1f1;
    border-right: 3px solid #f1f1f1;
}

.ScartItemDetails>ul>li {
    position: relative;
    width: 100%;
    height: auto;
    /*display: inline-block;*/
    display: flex;
    padding: 5px 20px 5px 15px;
    text-transform: none;       
}

.ScartItemDetails li>a {
    float: left;
    width: calc(100% - 60px);
    padding-left: 5px;
    color: black !important;
}

.ScartItemDetails li>a.moreart {
    width: 100%;
}

.ScartItemDetails .imgCon {
    float: left;
    width: 60px;
    min-height: 60px;
    height: 100%;
    padding-top: 5px;
    text-align: center;
    background: #fff;
    margin-right: 10px;
}

.ScartItemDetails>ul>li:nth-child(2n) {
    background: #f1f1f1;
}

.ScartItemDetails>ul>li:hover {
    background: #ccc;
    border-color: #ccc;
}

.ScartItemDetails>a:hover {
    color: #fff;
}
/* Navigation */
#navLogin .level_2 {
    left: -179px;
}

#Navigationbar .level_2 li>a:hover {
    text-decoration: underline;
}

.productsnav .catimg {
    height: 80px;
}

.catimgcontainercontainer {
    width: 183px;
    text-align: center;
    background: #fff;
    height: 100%;
    padding-top: 10px;
    display: inline-block;
}

.catimgcontainer {
    height: 100px;
    text-align: left;
    margin-bottom: 10px;
}

/* Footer */

a[target="_blank"]:after {    
    font: 0.8125em/1 "RockSolid Icons";
    /*content: "\e151";*/
    content: "";
    -webkit-font-smoothing: antialiased;    
    text-rendering: geometricPrecision;
    text-indent: 0;
    display: inline-block;
    position: relative;
    margin-left: 0.25em;
}

#footer .catimgcontainer, #Sitemap .catimgcontainer {
    display: none;
}
/* ****************************** */

/*-------------------------------------*/
/* Responsive Table to Tabs */
/*-------------------------------------*/
ul.resp-tabs-list {
    margin: 0;
    padding: 0px;
}

.resp-tabs-list li {    
    padding: 30px 0px;
    margin: 0 .5em 0 0;
    list-style: none;
    cursor: pointer;
    float: left;
    font-size: 1.8em;
    border: none;        
    font-weight: bold;
    color: #999;
    margin-right: 30px;
}

.resp-tabs-list li:hover {
    color: #000;
}

.resp_tabs_cont .resp-tabs-list li {
    padding: 10px 0;
}

.resp-tabs-container {
    padding: 0px;
    background-color: fff;
    /*clear: left;*/
}

h2.resp-accordion {
    cursor: pointer;
    padding: 5px;
    display: none;
}

.resp-tab-content {
    display: none;
}

.resp-tabs-list li.resp-tab-active {
    /*border: 1px solid #ccc;
    border-bottom: 1px solid #fff;*/
    border: none;
    margin-bottom: -1px;
    background-color: #fff;
    color: #000;
}

.resp-tabs-list li {
    max-width: 400px;
}

.resp-content-active, .resp-accordion-active {
    display: block;
}

h2.resp-accordion {
    font-size: 1.1em;
    border-bottom: #ccc 1px solid;
    margin: 0px;
    padding: 10px 15px;
}

h2.resp-tab-active {
    border-bottom: 0px solid #ccc;
    margin-bottom: 0px;
    padding: 10px 15px;
}

h2.resp-tab-title:last-child {
    border-bottom: 12px solid #ccc;
    background: blue;
}
/*-----------Vertical tabs-----------*/
.resp-vtabs ul.resp-tabs-list {
    float: left;
    width: 30%;
}

.resp-vtabs .resp-tabs-list li {
    display: block;
    padding: 15px 15px;
    margin: 0;
    cursor: pointer;
    float: none;
}

.resp-vtabs .resp-tabs-container {
    padding: 0px;
    background-color: #fff;
    border: 1px solid #ccc;
    float: left;
    width: 68%;
    min-height: 250px;
    border-radius: 4px;
    clear: none;
}

.resp-vtabs .resp-tab-content {
    border: none;
}

.resp-vtabs li.resp-tab-active {
    border: 1px solid #ccc;
    border-right: none;
    background-color: #fff;
    position: relative;
    z-index: 1;
    margin-right: -1px;
}

.resp-arrow:before {
    float: right;
    font-family: 'FontAwesome';
    content: '\f107';
    margin-left: 0.8em;
}

h2.resp-tab-active span.resp-arrow:before {
    float: right;
    font-family: 'FontAwesome';
    content: '\f106';
    margin-left: 0.8em;
}
/*-----------Accordion styles-----------*/
h2.resp-tab-active {
    background: #F1F1F1;
}

.resp-easy-accordion  h2.resp-accordion {
    display: block;
}

.resp-easy-accordion .resp-tab-content {
    border: 1px solid #ccc;
}

.resp-easy-accordion .resp-tab-content:last-child {
    border-bottom: 1px solid #ccc;
}

.resp-jfit {
    width: 100%;
    margin: 0px;
}

.resp-tab-content-active {
    display: block;
}

h2.resp-accordion:first-child {
    border-top: 1px solid #ccc;
}

#os_scart_form input, #os_scart_form select {
    min-width: 75px;
    width: clac(100% - 18px);
}

#os_scart_form .CCLabel {
    width: 28%;
}

#os_scart_form .CCInput {
    width: 70%;
}

#os_scart_form #couponcode {
    width: calc(78% - 20px);
}

.lds-ring {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 64px;
}

.lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 51px;
    height: 51px;
    margin: 6px;
    border: 6px solid #08405f;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #08405f transparent transparent transparent;
}

.lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
}

.lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
}

.lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
}

@keyframes lds-ring { 
	
0% {
    transform: rotate(0deg);
}

100% {
transform: rotate(360deg);
  
}
}
#RubView .button_dark, html .button_dark {
    color: #fff;
    background-color: #08405f;
    border: 1px solid #08405f;
}

#RubView form {
    /*margin-top: 0;*/    
    width: 60%;
    float: left !important;
    text-align: left;
    margin-top: 5px;
}

.lieferzeit img:hover {
    cursor: pointer
}

dl.lagerdemo {
    width: 200px;
    background: #fcfcfc;
    margin: -8px -8px -8px;
}

dl.lagerdemo dt, dl.lagerdemo dd {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    border-bottom: 1px solid #ddd;
}

dl.lagerdemo dt:nth-of-type(even), dl.lagerdemo dd:nth-of-type(even) {
    background: #FFF;
}

dl.lagerdemo dd {
    width: 30px;
    text-align: center;
    display: inline-block;
    margin: 0;
}

dl.lagerdemo dd img {
    vertical-align: middle;
}

dl.lagerdemo dt {
    width: 170px;
    padding-left: 5px;
    display: inline-block;
}

#FFqueryDO {
    margin-right: 5px;
}

.page-header {
    z-index: auto;
}

.ShopTable th.Center, .Center {
    text-align: center;
}

.ShopTable th.Left, .Left {
    text-align: left;
}

.ShopTable th.Right, .Right {
    text-align: right;
}

th.noborderline {
    border-bottom: none;
}

#SOrder td input {
    width: 80%;
}


/* Ansprechpartner aus CMS */
.contactSidebar .ccontent{
	text-align:center;
}
.contactSidebar .ccontent h1 {
    font-size: 1.5em;
}

.contactSidebar .ccontent figure.image_container {
    box-shadow: none;
    margin: 0;
    border: 1px solid #ccc;
    border-radius: 50%;
    overflow: hidden;
    padding: 0;
    background-image: none;
    background: none;
}
.contactSidebar .ccontent figure.image_container img{
	max-width:200px;
}

/* DEFEKTE ICONS DURCH ICOMOON REPARIEREN */
.fa-plus-square-o, .fa-minus-square-o, .fa-caret-up, .fa-caret-down, .fa-phone, .fa-envelope,
    .fa-user, .fa-angle-left, .fa-angle-right {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.fa-angle-left, .fa-angle-right {
	font-size: 28px;
}

.Scaninfo ol[type="a"] li {
    list-style: disc;
}

.main-content label {
    font-size: 16px;
}

.ce_form select {
    font-size: 16px;
}

.lieferzeit {
    text-align: right;
}

a[href*="agb"], a[href*="datenschutz"], a[href*="terms-and-conditions"], a[href*="data-security"] {
    text-decoration: underline;
}

.rs-column.-small-col-3-1, .tao-no-sidebar .rs-column.-small-col-3-1,
    .page-footer .rs-column.-small-col-3-1 {
    width: 100%;
    margin-bottom: 20px;
}

#DetailCross input.amountSmall {
    width: inherit;
}

.fancybox-margin {
    margin-right: auto !important;
}
/*
rsts-skin-default .rsts-nav-bullets a:hover, .rsts-skin-default .rsts-nav-bullets a.active {
    background-color: #777;
    box-shadow: inset 0 2px 0 -1px rgba(255,255,255,0.5),inset 0 -2px 0 -1px rgba(0,0,0,0.3),0 0 0 1px #555;
}
*/
.rsts-skin-default .rsts-nav-bullets a {
    display: inline-block;
    width: 50px;
    height: 4px;
    overflow: hidden;
    margin: 12px 4px;    
    outline: none;
    text-align: left;
    text-indent: -999px;
    background-color: rgba(255,255,255,0.8);
    background-clip: padding-box;    
}

.rsts-skin-default .rsts-nav-bullets a:hover, .rsts-skin-default .rsts-nav-bullets a.active {
    background-color: #08405f;
}


.rsts-skin-default .rsts-nav li {
    display: inline;
}

.rsts-skin-default .rsts-nav ul {
    margin: 0 !important;
    padding: 0 !important;
}

.rsts-skin-default .rsts-nav li.rsts-nav-prev, 
.rsts-skin-default .rsts-nav li.rsts-nav-next {
    display: none;
} 

#DetailVlink {
    margin-top: 30px;
    padding: 10px 33px;
    width: fit-content;
}


#cookiewookieblock {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0,0,0,.75);
    z-index: 10001;
}


.colorbox.cselected a {
    position: initial !important;
}
.setToggle i.fa.fa-angle-up.close {
    display: inline-block !important;
    /* float: left; */
}

.setToggle i.fa.fa-angle-down.open {
    display: inline-block !important;
    /*float: left;*/
}
.setToggle:not(.closed) i.fa.fa-angle-down.open{
    display:none !important
}
.setToggle.closed i.fa.fa-angle-up.close{
    display:none !important
}

img.pictogram {
	width:40px;
}

.info-map-boxes-item h1 {
	width:90%;
}


.counter-boxes-item {
    text-decoration: none !important;
}

#floatingMenuContent ul {
    padding-left: 0px !important;
}

/*input.Input {
    width: 20%;
}*/

#OrderForm .form-row input, select, textarea {
    width: 75% !important;
}

.customer #OrderForm .form-row input, select:not(select#status, #SearchFilter select, select#porto_bestell, select#porto_payment), textarea {
	width:100% !important;
}

#SearchFilter select {
    width: 195px !important;
}

#OrderForm input[name="ort"], #OrderForm input[name="strasse"], #OrderForm input[name="rort"], #OrderForm input[name="lort"] {
    width: 59% !important;
}

#OrderForm input[name="plz"], #OrderForm input[name="hausnummer"], #OrderForm input[name="rplz"], #OrderForm input[name="lplz"] {
    width: 15% !important;
}

#OrderForm .form-row input[type="submit"] {
    width: 49% !important;
}

#OrderForm input, textarea {
	width:75%;
}

#OrderForm input[type="checkbox"] {
	width:auto;
}


.sav aside#ShopMenu {
    width: 16.25%;
}


li#languageSelection, #languageSelection2 {
    list-style: none;
}


.info-table .image-cell {
    padding: 0% 0%;
}


.naiTextContainer h4 {
    font-size: 15px;
}

.ce_rs_column_start ul {
    list-style-type: disc;
    margin: 1em 0px 0px 2em !important;
    padding: 0px;
}


.sav.fixedscreen aside#ShopMenu {
	width:23%;	
}


.CMS.twocolumnright aside.sidebar {
    width: 22.22222%;
    margin: 2.5em 0 0 0;
}


.CMS.twocolumnright section.main-content {
    width: 76%;
    float: left;
}

.start .artCMS #RubView .offerItem {
    height: 410px;
}

#DetailCross li.offerItem.RubMaxWidthButtons {
    height: auto !important;
}


#DetailCross .artCMS .addProductsFrame {
    height: 384px;
}

#ScartTable .lieferzeit {
	text-align:inherit;
}

button.button.FloatRight {
    font-family: Barlow;
}


.toggle-view .panel {
	display:block;
}



.InfoTitle {
	position: relative;
    font-size: 1.5em;
    margin: 30px 0 10px 0;
    line-height: 1.5;
    font-weight: normal;
}


.InfoTitleScart {
	position: relative;
    font-size: 1.3em;
    margin: 40px 0 10px 0;
    line-height: 1.5;
    font-weight: normal;
}



.ArticleTitleCMS {
	margin: 0 110px 10px 110px;
    padding: 0;
    position: relative;
    font-size: 1.3em;
}


.InfoTitleLogin {
	position: relative;
    font-size: 1.5em;
    margin: 20px 0 5px 0;
    padding: 10px 0 5px 0;
    line-height: 1.5;
    font-weight: normal;
    border-bottom: 1px solid #ccc;
    clear: left;

}

.main-content h1 {
	font-weight:normal;
}

.main-content h2 {
	color:#48484a;
	font-size:1.6em;
}

.mostwanted {
    /* justify-content: space-between; */
    margin: 0 -5px;
}
.mostwanted li {
    min-width: 200px;
    max-width: 300px;
    margin: 5px;
    height: 300px;
    flex: 1 1 0;
    position: relative;
}

#ShopMenu .mostwanted li::before {
    content: '';
}
#ShopMenu .mostwanted a {
    margin:0 ;
}
.mostwanted li .innerBox {
    padding-bottom: 5px;
    height:100%
}

.mostwanted .RubImageContainer {
    width: 100%;
    height: auto;
    border-bottom:1px solid #f1f1f1;

}

.mostwanted .RubImageContainer img {
    max-width: 90%;
    padding-left: 10%;
}
.mostwanted .btn-container {
    background-color: #f00;
    position: absolute;
    bottom: 10px;
    left: 10px;
    right: 10px;
}

.mostwanted .btn-container .button {
    width: 100%;
}

.mostwanted .mosttitle {
    position: relative;
    left: 10px;
    right: 10px;
    height: 42px;
    overflow: hidden;       
    padding-top: 5px;
}





/* Quagga Start */

#quaggarea {
    position: absolute;
    right: 30px;
    top: 7px;
}

#interactive{
    z-index: 2000000;
    display: none;
}

i.fa.fa-barcode {
    font-size: 31px;
    font-family:fontawesome;
    display:inline-block;
    text-rendering:auto;
    -webkit-font-smoothing:antialiased;
}

.collapsable-source pre {
    font-size: small;
}

.input-field {
    display: flex;
    align-items: center;
    width: 260px;
}

.input-field label {
    flex: 0 0 auto;
    padding-right: 0.5rem;
}

.input-field input {
    flex: 1 1 auto;
    height: 20px;
}

.input-field button {
    flex: 0 0 auto;
    height: 28px;
    font-size: 20px;
    width: 40px;
}

.icon-barcode {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiI+PHBhdGggZD0iTTAgNGg0djIwaC00ek02IDRoMnYyMGgtMnpNMTAgNGgydjIwaC0yek0xNiA0aDJ2MjBoLTJ6TTI0IDRoMnYyMGgtMnpNMzAgNGgydjIwaC0yek0yMCA0aDF2MjBoLTF6TTE0IDRoMXYyMGgtMXpNMjcgNGgxdjIwaC0xek0wIDI2aDJ2MmgtMnpNNiAyNmgydjJoLTJ6TTEwIDI2aDJ2MmgtMnpNMjAgMjZoMnYyaC0yek0zMCAyNmgydjJoLTJ6TTI0IDI2aDR2MmgtNHpNMTQgMjZoNHYyaC00eiI+PC9wYXRoPjwvc3ZnPg==);
}

.overlay {
    overflow: hidden;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.3);
}

.overlay__content {
    top: 50%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    max-height: 90%;
    max-width: 800px;
}

.overlay__close {
    position: absolute;
    right: 0;
    padding: 0.5rem;
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
    text-align: center;
    background-color: white;
    cursor: pointer;
    border: 3px solid black;
    font-size: 1.5rem;
    margin: -1rem;
    border-radius: 2rem;
    z-index: 100;
    box-sizing: content-box;
}

.overlay__content video {
    width: 100%;
    height: 100%;
}

.overlay__content canvas {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

#interactive.viewport {
    position: relative;
}

#interactive.viewport > canvas, #interactive.viewport > video {
    max-width: 100%;
    width: 100%;
    max-height: 100%;
}

canvas.drawing, canvas.drawingBuffer {
    position: absolute;
    left: 0;
    top: 0;
}

@media (max-width: 603px) {
  #interactive.viewport {
    width: 100%;
    height: auto;
    overflow: hidden;
  }
}

/* Quagga Stop */


.button.button_dark.linebutton {
    padding: 4px 5px;
    display: inline-block;
    margin: 0px;
    border: 0px;
    vertical-align: middle;
    margin-top: -5px;
    border: 1px solid #08405f;
}
.button.button_dark.linebutton:hover {
    background: #fff;
    border: 1px solid #222;
    color: #222;
}
.linebutton .ico-cart::before {
    font-size: 1.5em;
}
.ce_rsce_pl_teaser_box.overlay-link a,
.ce_rsce_pl_teaser_box.overlay-link div.linkbtn {
    background: rgba(0,0,0,.5);
    width: 100%;
    display: block;
    position: relative;
    color: #fff;
    text-align: center;
}
.ce_rsce_pl_teaser_box.overlay-link .-large-col-4-1 a {
    /*margin-top: -50px;    */
    font-size: 20px;
    line-height: 32px;
}

.ce_rsce_pl_teaser_box.overlay-link .-large-col-3-1 a {
    margin-top: -88px;
    font-size: 35px;
    line-height: 70px;
}

.fixedscreen #customerMenu>a>div>i {
    padding-bottom: 40px;
}

.fixedscreen #ScartTable.TableTwoColumns {
    width: 100%;
}

.fixedscreen .ShopTable.quickbrick td {
    display: block;
    text-align: right;
    position: relative;
    min-height: 40px;
}

.fixedscreen .ShopTable.quickbrick form {
    position: relative;
}

.fixedscreen .ShopTable.quickbrick th {
    display: none;
}
.fixedscreen .ShopTable.quickbrick td:before {
    content: attr(data-title) " ";
    float: left;
    display: block;
}

.fixedscreen .ShopTable.quickbrick tr td:last-of-type {
    padding-right: 0.625em;
}

.fixedscreen .ShopTable.quickbrick tr td table td,
.fixedscreen .ShopTable.quickbrick tr td table td:last-of-type {
    padding-right: 0;
}

.fixedscreen .ShopTable.quickbrick tr td input[type="text"] {
    right: 45px;
    position: absolute;
    margin-bottom: 5px;
    width: calc(100% - 200px);
}

/*Header*/
#header .wrapper {
    border-top: 3px solid #08405f;
    height: 150px;
    box-shadow: 0px 4px 0px rgba(0, 0, 0, .2);
    background-color: #fff;
}

.navigation-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    height: 100px;
    background: #fff;
}

input#FFquery::placeholder {
    color: #000;
    opacity: 1;
}

.LoginForm, .loginCMS {
    z-index: 1001;
    position: absolute !important;
    top: 61px !important;
    background: #fff !important;
    left: 45px;
    /*right: 160px;*/
    width: 245px; 
    /*padding-top: 40px !important;
    padding-bottom: 40px !important;*/
    /*border: 1px solid #f1f1f1 !important;*/
    max-height: unset !important;
    pointer-events: all !important;
    padding: 0px;
}



.formwrapper {
    padding: 20px;
    border: 3px solid #f1f1f1;
    border-top: none;
    padding-top: 24px;
    margin-top: 24px;
}

.full-width{
    width: 100%;
}

.loginHeader {
    background: #08405f;
    min-height: 44px;
    color: #fff;
    padding-top: 9px;
    padding-left: 21px;
    padding-bottom: 0px;   
    margin-bottom: -24px 
}

.loginHeader h3{
    font-size: 1.5em;
    line-height: 1;
    font-weight: normal;
    padding-bottom: 9px; 
    height: fit-content;
    white-space: normal;   
}

#LanguageMenu p{
    line-height: 24px;
    display: grid;
    grid-template-columns: auto auto;
}

.LoginForm {
    display: none;
}

.icon-world {
    margin-left: -12px !important;
    padding-left: 0;
}

.CMS #LanguageMenu{
    margin-top: 19px;
}

/*Angebote*/
.promotion-header {
    text-align: center;
}
.promotion-header h2{
    font-weight: bold;
    font-size: 1.8em;
    text-transform: uppercase;
}
.articleInfo{
    height: 72px;
}

/*Teaser*/
.teaser-boxes-item h1, .team-boxes-item h1 { 
    font-size: 2em;    
    font-weight: bold;
    font-family: Barlow-Light;
}

.teaser-boxes-item p, .team-boxes-item p { 
    font-size: 1.3em;        
}

.teaser-boxes-item a.button, .team-boxes-item a.button { 
    font-size: 1.3em;
    text-transform: uppercase;        
}

/*Footer*/
#Sitemap .wrapper {
    display: flex;
}
.desktop-2{
    flex: 2;
    min-width: 420px;
}
.desktop-1{
    flex: 1;
}
.desktop-1.grid{
    min-width: 300px;
}

#Sitemap div.ce_text {
    width: 100%;
}
.desktop-2 ul{
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 15px;
}
.contact-hero {
    font-size: 28px;
    line-height: 30px;
}

.fixedscreen .contact-hero {
    font-size: 26px;    
}
#Sitemap div h2 {    
    font-size: 1.1em;    
    font-family: "Barlow-Light";
    font-weight: bold;
}
.h-100 {
    height: 100px;
}
.connect ul li {
    display: inline-block; 
}

.connect ul li a::before {
    font-size: 32px; 
}

/*Prefooter*/
#Prefooter {
    background: #f5f5f5;
    margin-bottom: 0;
    height: 380px;
    padding-top: 80px;
}
#Prefooter h2 {
    text-transform: uppercase;
    font-size: 1.7em;
    font-weight: bold;
}

#Prefooter h3 {     
    font-weight: bold;
}

#Prefooter .elements {
    display: grid;
    grid-template-columns: auto auto auto auto;
    margin-top: 60px;
}

#Prefooter .content {
    text-align: left;
}

#Prefooter .icon i::before {
    font-size: 4em;
    margin-top: 15px;
}

.prefooter-text {
    display: grid;
    grid-template-columns: auto auto;
}

.prefooter-text h3 {
    margin: 5px 0;
}

.prefooter-text p {
    margin: 0;
}

.prefooter-text .content {
    max-width: 250px;
}

#footer .wrapper, .page-footer .wrapper {
    max-width: 1920px;
}

.fixedscreen #footer .wrapper, .fixedscreen .page-footer .wrapper {
    max-width: 1440px;
}

/* the slides */
.slick-slide {
    margin: 0 35px !important;
}
/* the parent */
.slick-list {
    margin: 0 -40px;
}

#DetailThumbs .slick-slide.slick-current.slick-active img {
    border: 1px solid rgba(0, 0, 0, .2) !important;
}

.det .resp-tabs-list li {
    width: auto;
    font-size: 1.5em;
    border: 1px solid #999;
    border-bottom-color: black;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    height: 15px;
    padding: 15px 15px 30px 15px;
    border-bottom: none;    
    margin-right: 15px;
}

.resp-tab-active{
    border: 1px solid black;
}

/* Suchseite */
#Filter a input[type="checkbox"] {
    accent-color: #333;    
    margin-top: -3px;
    margin-right: 5px;
}

.price_from {
    font-size: 16px;
    font-weight: normal;
    margin-right: 6px;
}

.FFSContent h1, .FFSContent p a {
    margin-left: 20px;
    white-space: normal;
}



/*Detailseite*/
.MengeCompare .button.-small{
    border: none;
    background-color: transparent;
}

.MengeCompare .button:hover  {
    color: #08405f;    
}

button.dt-button:hover{
    background: #08405f;
    color: #fff;
    border-color: #08405f;
}

#DetailAttributes dt:not(.first, .attGroup), #DetailAttributes dd:not(.first, .attGroup){
    padding-top: 10px;
    padding-bottom: 3px;
    border-top: 1px solid #eaeaea;
    font-size: 16px;
}

#DetailAttributes dt:first-child, #DetailAttributes dd:nth-child(2){
    border-top: none !important;
}

.chevron::before {
	border-style: solid;
	border-width: 0.25em 0.25em 0 0;
	content: '';
	display: inline-block;
	height: 0.45em;
	left: 0.15em;
	position: relative;
	top: 0.15em;
	transform: rotate(-45deg);
	vertical-align: top;
	width: 0.45em;
}

.chevron.right:before {
	left: 0;
	transform: rotate(45deg);
}

.chevron.bottom:before {
	top: 0;
	transform: rotate(135deg);
}

.chevron.left:before {
	left: 0.25em;
	transform: rotate(-135deg);
}

.DetailCrossHeadline.promotion-header.left {
    text-align: left;
    margin-left: 15px;
}

:root {
    --form-control-color: #08405f;
}

input[type="radio"] {
    /* Add if not using autoprefixer */
    -webkit-appearance: none;
    /* Remove most all native input styles */
    appearance: none;
    /* For iOS < 15 */
    background-color: var(--form-background);
    /* Not removed via appearance */
    margin: 0;
  
    font: inherit;
    color: currentColor;
    width: 1.15em;
    height: 1.15em;
    border: 0.15em solid currentColor;
    border-radius: 50%;
    transform: translateY(-0.075em);    
    place-content: center;
  }
  
  input[type="radio"]::before {
    content: "";
    width: 0.65em;
    height: 0.65em;
    border-radius: 50%;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    box-shadow: inset 1em 1em var(--form-control-color);
    /* Windows High Contrast Mode */
    background-color: CanvasText;
    display: block;
    margin: 3px;
  }
  
  input[type="radio"]:checked::before {
    transform: scale(1);    
  }
  
  .main-content ul li[data-icon]::before, .main-content ul li[class^="icon-"]::before, .main-content ul li[class*=" icon-"]::before, .main-content ol li[data-icon]::before, .main-content ol li[class^="icon-"]::before, .main-content ol li[class*=" icon-"]::before,
  .rotating-boxes-item-cover, .rotating-boxes-item-content::before, .counter-boxes-item p{
    color: #08405f;
  }  

.block_links{
    max-width: 50%;
    float: left;
}
.block_rechts{
    max-width: 50%;
    float: right;
}

.fixedscreen .block_links,
.fixedscreen .block_rechts {
    max-width: 300px;
    height: 50px;
    position: absolute;
}

.fixedscreen .block_links {
    left: -305px;
}

.fixedscreen .block_rechts {
    right: -305px;
}

#TitleBanner, #print_pictos {
    display: none;
}

.fullwidth {
    width: 100%;
}

/*
.CMS .user-menu {     
    top: 20px;                
}
*/

ul.user-menu{    
    padding-left: 40px !important;
    margin-top: 16px !important;
}

.user-menu #LanguageMenu p, .user-menu #MyFav p{        
    margin-top: 16px !important;
}

.user-menu #navLogin p{        
    margin-top: 8px !important;
}

.user-menu{
    /*background-color: pink;*/
    width: auto;
}

.CMS #navLogin i, .CMS #MyFav i{
    margin-left: -4px !important;
}

.user-menu li:not(.loginCMS li, .LoginForm li, .ScartItemDetails li) {
    display: block;
    margin-bottom: 3px;
    /*width: 48px !important;*/
    margin-left: 5px !important;
    margin-right: 5px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
    /*overflow: hidden;*/
    margin-top: 0 !important;
    padding-top: 0 !important;
    text-align: left !important;    
    float: none !important;
}

#ScartInfo{    
    width: 75px;
}

.CMS .user-menu {    
    right: 0px;    
}
/*
.CMS #ScartInfo{
    padding-left: 10px !important;
}
*/



/*Steps*/
.step-wrapper {
    background: #f1f1f1;
    padding: 1px;
}

#ScartSteps {
    position: relative;
    list-style: none;
    width: 100%;
    height: 100px;
    overflow: hidden;
    margin: 24px 0 10px 0;
    padding: 0;    
}

#ScartSteps li {
    position: relative;
    width: 25%;
    height: 48px;
    float: left;
    text-align: center;
}

#ScartSteps li div {
    width: 100%;
    height: 90px;
}

#ScartSteps li strong {        
    font-size: 1.8em;
    font-weight: bold;
    color: #333;
    border: 1px solid #333;
    border-radius: 50%;
    height: 48px;
    width: 48px;
    display: inline-block;
    padding-top: 12px;
}

#ScartSteps li.active strong {
    background-color: #08405f;
    border-color: #08405f;
    color: #fff;
}

#ScartSteps li.active p {    
    color: #08405f;    
}

#ScartSteps li strong:before,
#ScartSteps li strong:after{
    content:'';
    width: 50%;    
    border-bottom:1px solid #333;
    position:absolute;
    top:50%;
}

#ScartSteps li strong:after
{    
    left: calc(50% + 24px);
}

#ScartSteps li strong:before
{
 
    right: calc(50% + 24px);
}

#ScartSteps li:first-child strong:before,
#ScartSteps li:last-child strong:after{
    border: none;
}

#OrderForm #DirectOrderButton{
    padding: 1px 10px;
}
#Show {
    padding: 0px 15px;
}

/*
#pw, #pwrepeat{
    width: 200px !important;
}
*/
.pwinfo {
    margin-left: 42px;
}
.pwinfo p {
    margin-top: 0;
}

.w66p{
    width: 66%;
}

.Width150 {
    width: 150px;
}

.Width16 {
    width: 16%;
}

.scrat_price{
    width: 90px;
    text-align: right;
}

.scart_article{
    width: calc(100% - 100px);
}

#COUPON td:first-child{
    width: 155px;
}

tr.Article {
    height: 54px;
}

option { 
    padding: 10px;
}


/*List-View*/
li.list_item {
    display: grid;
    grid-template-areas: 'image header header logo' 
                         'image desc desc info'
                         'image staffeln staffeln info' 
                         'thumbs thumbs thumbs button'
                         'tbl tbl tbl tbl'
                         'more more more more'; 
    grid-template-columns: 160px auto 205px 200px;
    margin-top: 20px;
    grid-gap: 12px 12px;
    grid-template-rows: 50px auto 55px;
    margin-bottom: 75px !important;
}

.staffeln {
    margin-top: 15px;
    display: grid;
    grid-template-columns: auto auto;
}

.staffeln .red {
    color: red;
}

.morecontainer {
    grid-area: more;
    text-align: center;
}

.tblcontainer {
    grid-area: tbl;
    margin-bottom: 0;
}

.listimage_container {
    grid-area: image;
}
.ArticleTitle {
    grid-area: header;
}
.description {
    grid-area: desc;
}

.staffeln {
    grid-area: staffeln;
}

#ListView .artnr_container {
    grid-area: info;
    font-size: 1.7em;
    position: absolute;
    bottom: 0;    
    right: 0;
}
.btn_container {
    grid-area: button;
}
.thumbcontainer {
    grid-area: thumbs;
    height: 52px;
}
#ListView .hersteller {
    max-height: 50px;
    grid-area: logo;
    position: absolute;
    right: 0;
}
#ListView {
    padding-left: 20px;
}

#ListView.cmsSearch .thumb img {
    width: 120px;
}

.cmsSearch li.list_item {
    display: grid;
    grid-template-areas: 'image header header logo' 'image desc desc desc';
    grid-template-columns: 130px auto 205px 200px;
    margin-top: 20px;
    grid-gap: 13px;
}

.cms-link {
    margin-left: 0 !important;
}

.campaigns h1, .campaigns_list h1{
    margin-left: 0px !important;
}

.campaigns {
    padding: 0px 40px 0px 21px;
}

.campaigns_list {
    padding: 0px 2px 0px 21px;
}
.resp-tab-item a{
    color: #666;
}

.resp-tab-active a{
    color: #333;
}

.resp-tab-item a:hover{
    color: #08405f;
}

.CMSsearch, .cmsSearch {
    padding-left: 3px !important;
    margin-left: 0px;
}

.mobile_only, .mobile_only_inline{
    display: none !important;
}

#DetailImage .slick-list {
    margin: 0 -30px;
}

#DetailImage .slick-slide img {    
    height: auto;    
    margin: 0 auto;        
    margin-top: calc(50% - 180px);
    max-height: 360px;
    max-width: 360px;
}

.fancygal {
    height: 390px;
    width: 390px !important;
}

.w50{
    width: 50% !important;
}

.fixedscreen .ShopTable.quickbrick td::before {
    content: attr(data-title) " ";
    float: left;
    display: block;
    width: 100px;
    text-align: left;
}

.fixedscreen .ShopTable.quickbrick td { 
    text-align: right;    
    vertical-align: center;
}

.fixedscreen .ShopTable.quickbrick tr td input[type="text"] {
    right: 0;
    position: relative;
    margin-bottom: 0px;
    width: calc(100% - 200px);
}

.fixedscreen .ShopTable.quickbrick tr td {
    padding-right: 0 !important;
}

.previewthumb{
    mix-blend-mode: darken;
}

#pickUpTimeFrame{
    width: 100%;
    text-align: left;
    margin-bottom: 15px;
    margin-left: 31px;
    color: #1ba399;
    font-weight: bold;
    line-height: 21px;
    display: grid;
    grid-template-columns: 30px auto;
}
#pickUpTimeFrame::before{
    font-family: icomoon;
    font-weight: bold;
    font-size: 21px;
    color: #000;
    content: "\e911 ";
    display: inline;    
}

.artCMS #ListView{
	padding-left: 0px;
}

.artCMS #ListView .thumb {
  margin-right: 20px;
}

.artCMS .flexcontainer {
	padding-left: 0;
}

.artCMS ul.flexcontainer li{
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.artCMS #RubView .offerItem{
    min-width: 255px;
}

.artCMS .flexcontainer {
    justify-content: space-between;
}

.disabled {
    color: #666 !important;
    border-color: #666 !important;
    background-color: #eee !important;
    cursor: not-allowed !important;
}

.disabled:hover{
    color: #666 !important;
    border-color: #666 !important;   
}

.product-list-grid{
    display: grid;
    grid-template-areas: 'image header header logo' 'image desc desc desc';
    grid-template-columns: 240px auto auto 80px;
}

.product-list-grid-image {
    grid-area: image;
    max-height: 220px !important;
    max-width: 220px !important;
}

.product-list-grid-logo {
    grid-area: logo;
    float: right;
}

.product-list-grid-header {
    grid-area: header;
    margin: 0 !important;
}

.product-list-grid-desc {
    grid-area: desc;
}




 /* The switch - the box around the slider */
 .switch {
    position: relative;
    display: inline-block;
    width: 42px;
    height: 24px;
    margin-top: 18px;
  }
  
  /* Hide default HTML checkbox */
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  /* The slider */
  .slider-round {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #999;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .slider-round:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
    background-image: url(/tradepro/shop/layout/uncheck.svg);
    background-position: center;
    background-size: 12px;
    background-repeat: no-repeat;
  }
  
  input.checked + .slider-round {
    background-color: #003366;
  }
  
  input:focus + .slider-round {
    box-shadow: 0 0 1px #003366;
  }
  
  input.checked + .slider-round:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);    
    background-image: url(/tradepro/shop/layout/check.svg);
  }
  
  /* Rounded sliders */
  .slider-round {
    border-radius: 34px;
  }
  
  .slider-round:before {
    border-radius: 50%;
  } 


#UpperASN .showall .text:before {
    position: absolute;
    font-family: "icomoon";
    content: "\e907";
    margin-top: 0.8em;
    font-size: 1em;    
    text-indent: -21px;
    transform: rotate(90deg);
    margin-left: -16px;
}

#UpperASN {
    padding-left: 20px;
    width: 100%; /*calc( 100% - 20px );*/
  }

#UpperASN .showall .text{
    text-align: center;
}

#UpperASN #FilterNotCategory {
    display: grid;
    grid-template-columns: 25% 25% 25% 25%;
}

#UpperASN section.nocat h1 {
    font-size: 18px;    
    text-transform: uppercase;
}


#UpperASN section.nocat.active {
    display: block;
}
/*
#UpperASN section.nocat .checklink{
    display: none;
}
*/
#UpperASN section.nocat {
    display: block;
    float: left;
    width: calc(100% - 0.5em);
	height:100px;
}

#UpperASN section.nocat:not(.nodrop) ul.open {
    z-index: 10;
    background: #fff;
	max-height: 350px;
	overflow-y: scroll;
	border-bottom: 1px solid #a5a5a5;
}

#UpperASN section.nocat {
    display: block;
    float: left;
    width: calc(100% - 0.5em);
	height:90px;
}

#UpperASN section.nocat:not(.nodrop) ul.open {
    z-index: 99;
    background: #fff;
	max-height: 350px;
	overflow-y: scroll;
	border-bottom: 1px solid #a5a5a5;
    width: calc(100% - 0.5em);
}

#UpperASN section.nocat:not(.nodrop) li {
	display: none;
	cursor: pointer;
	padding: 5px 10px;
	border-top: 1px solid #a5a5a5;
	min-width: 150px;
}
#UpperASN section.nocat:not(.nodrop) li:first-child {
	display: block;
	border: 1px solid #a5a5a5;
}
#UpperASN section.nocat:not(.nodrop) ul {
	background:#fff;
	display: inline-block;
	padding: 0;
	border-radius: 2px;
	position: relative;
	width:90%;
    margin: 0px;
}
#UpperASN section.nocat ul li:hover {
background-color: #ddd;
}

#UpperASN section.nocat ul li:first-child:hover{
background-color: transparent;
}

#UpperASN section.nocat ul.open li {
	display: block;
	border-left: 1px solid #a5a5a5;
	border-right: 1px solid #a5a5a5;
}

#UpperASN section.nocat ul.open span:before {
content: "\2191";
}

#UpperASN section.nocat:nth-child(n+9) {
    display: none;
}

#UpperASN section.nocat.active {
    display: block;
}

#UpperASN .showall.active .text .show{
	display:none;
}
#UpperASN .showall:not(.active) .text .shownot{
	display:none;
}
#UpperASN .showall.active .text:before {
	transform: rotate(-90deg);
    text-indent: 21px;
    margin-left: -32px;
}

#FilterNotCategory {
    margin-top: 15px;
  }

.first.dummy {
    color: #afafaf;
}

.first.act {
    color: teal;
    font-weight: bold;
}

.nocat h1 {
    margin-left: 0px; 
    margin-bottom: 10px;   
}

#MainNavi .submenu.hide-childreen > ul {
    display: none;
}

li.submenu ul {
    margin: 0;
}

.det .offerItem.RubMaxWidthButtons {
    margin-right: 18px !important;
    margin-left: 18px !important;
}

.det .artCMS .flexcontainer {
    justify-content: start;
}

.det .artCMS #RubView .offerItem {
    min-width: 175px;
    max-width: 204px;
}

li.active a input[type="checkbox"] {
    accent-color: #333;
    margin-top: -3px;
    margin-right: 5px;
}

.typeahead {
    width: 100%;
}

.tp_prod_tab>td {    
    vertical-align: middle !important;
}

[class*="stock-"] {
    height: 14px;
    width: 14px;    
    display: block;    
    border-radius: 50%;
    margin: 0 auto;
    display: inline-block;
}

.stock-red {    
    background: red;    
}

.stock-green {    
    background: #3AAA35;    
}

.stock-amber {    
    background: #ffbf00;    
}

.stocksym_container [class*="stock-"]{
    height: 18px;
    width: 18px;    
}

.stocksym_container_rub [class*="stock-"]{
    height: 24px;
    width: 24px;    
}

ins [class*="stock-"] {    
    margin: 0 5px 0 0;
}

.stocksym_container {
    /*
    position: absolute;
    bottom: 10px;
    left: 10px;
    */
    display: inline-block;
    margin-right: 15px;
}
/*
.stocksym_container_rub {
    position: absolute;
    top: 195px;
    left: 10px;
}
*/

span.small {
    font-size: 14px;
    font-weight: normal;    
}

.streichpreis {
    text-decoration-color:red !important;
    text-decoration: line-through;
}

.price_from {
    text-decoration: none;
}

span.aktionspreis {
    float: right;    
}

.price_container {
    float: right;
    width: 100%;
    margin-bottom: 10px;
}

.price_container span.small {
    float: right;    
}

.price_container .stocksym_container, .price_container .list_price_main {    
    float: right;
}

.submenu.hide-childreen ul.level_2 {
    margin-left: 12px;
}

#RubView .itemContent .thumb {
    display: none;
}

.rvThumbs img {
    mix-blend-mode: darken;
}
.fixedscreen .innerBox {
    height: 385px;
}


.FFS-Flex #RubView .itemContent .btn-container {
    margin-bottom: 20px;
    margin-top: 0px;
    background: #fff;
}

.FFS-Flex #RubView .itemContent div.content { 
    height: 80px;
}

.rvThumbs .moreColours {
    padding-right: 5px;
}

.list_item .description {
    margin-top: 0;
    margin-bottom: 0;
}

#ListView .thumb {    
    margin-bottom: 0px;    
}

#ListView .artnr_container {    
    top: 0;    
}

.noprice .itemContent {
    padding-left: 10px !important;
}

.zoomThumb img {
    mix-blend-mode: darken;
}

.arthighlight .zoomThumb img {
    mix-blend-mode: unset;
}

.FFS-Flex #RubView .itemContent div.content, .artCMS #RubView .productNameContainer {    
    background: #fff;
    margin-bottom: 0;
    padding-top: 5px;
}


.FFSContent #RubView li{
    margin-right: 10px;
}

.flexcontainer {    
    justify-content: flex-start;
    flex-flow: row wrap;
    /*margin-left: 20px;*/
    margin-right: -12px;
}

.flexcontainer::after {
    content: "";
    flex: auto;
}

.freset {
    padding: 10px 16px !important;
}

.fixedscreen #SearchFilter {
    margin-right: 4px;
}

#UpperASN #FilterNotCategory {
    display: flex;
    flex-flow: wrap;
    justify-content: flex-start;
    margin-right: -34px;
}

#UpperASN section.nocat {    
    width: 245px;
    margin-right: 41px;
}

#UpperASN section.nocat:not(.nodrop) ul {    
    width: 100%;
}

.noprice {
    min-width: 244px !important;
}

#RubView .offerItem.noprice {
    height: 300px;
}

.banner_table {
    width: auto;
    text-transform: uppercase;
    display: inline-block;
    padding-left: 5px;
    padding-right: 5px;
}

.color_indicator {
    height: 24px;
    width: 24px;
    background: conic-gradient(red, orange, yellow, gold, green, teal, blue, purple);
    right: 10px;
    position: absolute;
    top: 195px;
    border-radius: 50%;
}

tr.Article.Order {
    vertical-align: baseline;
}

tr.Article.Order .Input{
    width: 100%;
}

.det .artCMS #RubView .productNameContainer {
    height: 160px;
}

.vpmenge {
    background: url(/tradepro/shop/layout/icon_vpmenge.png) bottom right
    no-repeat !important;
    height: 24px;
    width: 24px;
    display: inline-block;
}

.art_name{
    min-width: 375px;
}

.top-1em {
    margin-top: 1em !important;
}

.video_container {
    text-align: center;
}
.elastic_explain {
    padding: 15px 15px 45px 15px;
    border: 1px solid #e9ecef;
    border-radius: 5px;
    background-color: #fdfdfd;
    margin-bottom: 10px;
    border-left-width: 65px;
    border-left-color: #0075BC;
    position: relative;
}

.elastic_explain i {
    font-family: FontAwesome;
    position: absolute;
    left: -50px;
    margin-top: -10px;
    font-size: 40px;
    color: #fff;
}

.elastic_explain p {
    margin: 30px 0 0 0;
}

.elastic_explain code {
    background-color: #b9b7b7;
    margin-right: 1ex;
}

.elastic_explain ul li {
    list-style: square;
}

.sav #DetailInfo {
    width: calc(100% - 490px);
}

.ff_btnarea {
    position: absolute;
    top: 0;
    right: 20px;
    width: auto;
    height: auto;
    display: inline-grid;
    grid-auto-flow: column;
}
.ff_btnarea .ff_btn{
    display: contents;
}

#quaggarea > i {
    padding-top: 7px;
}

.CMS #quaggarea > i {
    padding-top: 0px;
}

.CMS #quaggarea { 
    right: 20px;    
}

.CMS .user-menu {
    right: 1px;
}

.CMS #LanguageMenu {
    right: 1px;
}

.video_container iframe {
    max-width: 100%;
}

.sidebar {    
    font-size: 1em !important;
}

.sidebar li {
    padding: 6px 0px;
}

.rotating-boxes h2 {
    margin-bottom: 30px;
}

/*Artikel arthighlight*/
tr.arthighlight td {
    background: #98cbfe !important;
}

span#SearchResult a {
    color: #08405f;
    font-weight: bold;
}

span.aktion {
    text-decoration: line-through;
    text-decoration-color: red;
}

.Width65 {
    min-width: 65px;
}

/* Language Menu */
#LanguageMenu {
    display: flex;
    margin-top: 16px !important;
}

ul#languageselector2 {
    width: 100%;
    margin-top: 3px;
}
ul#languageselector2 li:not(.selected){
    display: none;
}

ul#languageselector2.show .menu{
    border: 1px solid black;
    display: inline-block;
    padding-left: 0px;  
    margin-left: 3px;
}
ul#languageselector2.show .menu li {
    display: block; 
    margin: 0px 0px !important;
    padding: 2px !important;
    width: 32px;
    text-align: center !important; 
}

ul#languageselector2.show .menu li:hover a, ul#languageselector2.show .menu li:hover, ul#languageselector2.show .menu li a:hover {
    background-color: #08405f;
    color: #fff;
    cursor: pointer;
}

.icon-world {    
    height: 28px !important;
}

p.confirmation, p.information, p.warning, div.confirmation, div.information, div.warning {    
    margin: 0.8em 0.5em 1.2em 0.5em;    
}

div#infoframe { 
    margin-top: 164px;
    width: 100%;
}

.CMS div#infoframe { 
    margin-top: 0px;
    width: 100%;
}

.jserror {
    padding: 0;
    margin-top: -10px;
}

#topMarken {
    width: 100%;
}

#topMarken ul {        
    width: 100%;
    display: inline-flex;    
    align-items: center;
    justify-content: space-around;
}

.marken>.mega-dropdown-inner {
    display: grid;
    grid-template-columns: auto auto auto auto auto auto;
}

.thx li#uvp, .bestellen li#uvp {
    display: none;
}

.stock-indicator .stocktooltip {
    visibility: hidden;
    width: 120px;
    background-color: #FAFAFA;
    color: #1f1f1f;
    text-align: center;
    border-radius: 1px;
    border: 1px solid #1f1f1f;
    padding: 2px 0;
    font-style: normal;
    /* Position the tooltip */
    position: absolute;
    z-index: 2;
    margin-top: -35px;
    margin-left: -55px;
    font-size: 16px;
    font-weight: normal;
    line-break: normal;
}

#RubView .stock-indicator .stocktooltip {    
    left: 90px;    
    width: 170px;
}

#ListView .stocksym_container.stock-indicator .stocktooltip {    
    right: 0;    
    width: 170px;
}

.stock-indicator:hover .stocktooltip {
    visibility: visible;
}

.itemContent .content {
    margin-bottom: 7px !important;
}

.morecontainer-rub {
    font-size: 12px !important;
    height: 15px !important;
}
td.name {
    width: 60%;
}

.tblcontainer th {
    padding: 3px;
}

.tblcontainer tr th:last-of-type {
    padding-right: 6px;
}

.status.Bezahlt {
    color: green;
}

.status.Offen {
    color: red;
}

/* Anpassungen Upper Filter */

.upper-fliter {
    border: 1px solid black;
    padding: 10px 15px;
    margin-right: 15px;
    display: inline-block;    
}

.upper-fliter::after {
    content: "\ea0f";
    font-family: "icomoon";
    margin-left: 5px;
    font-size: 13px;
}

.upper-fliter:hover::after {
    color: red;
}

.freset {
    float: right;    
}

#filter_line {
    margin-top: 15px;
    display: grid;
    grid-template-columns: 120px auto 300px;
}

.upper-fliter {
    margin-bottom: 12px;
}

.filter_msg {
    line-height: 41px;
}

/* ERP Direct - Bestellungen */
#ERPTable span.erp-orderno {
    min-width: 100px;
    display: inline-block;
}

#ERPTable td.red {
    color: red;
}






/* Markenmenu Navigation */

#ShopMenu .desktop_only.brand-overview {
    margin-top: 50px;
   /* border: 1px solid black; */
    background: whitesmoke;
}

nav#markenmenu-navigation > ul > li.submenu {
    padding-left: 5px;
}

#ShopMenu .desktop_only.brand-overview > h1 {
    margin-bottom: 20px;
    background: #fff;
    padding-bottom: 10px;
}

#ShopMenu.FFSMenu {
   position:static;
}

#markenmenu-navigation > ul.level_1 > li {
    height: 35px;
    position: static;
}

#markenmenu-navigation .level_1>li.submenu>a {
    width: 100%;
    height: 100%;
    display: inline-block;
}

#markenmenu-navigation img {
    width: 55%;
    height: auto;
}

#markenmenu-navigation ul.level_2 {
    display: none;
    position: absolute;
    left: 12%;
    top: unset;
    border: 2px solid #66747c;
    background: #fff;
   /* width: 81%; */
    z-index: 10000;
    /* margin-top: -30px;*/
    box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.75);
    justify-content: flex-start;
    flex-direction: row;
}

#markenmenu-navigation  ul.level_2 {
    flex-wrap: wrap;
}

#markenmenu-navigation ul.level_2 li {
    flex-basis: 225px;
    flex-grow: 0;
    flex-shrink: 0;
    display: inline;
    
}

#markenmenu-navigation ul.level_2 > li {
    padding: 0px 0px 5px;
    border: 1px solid #08405f;
    margin: 5px;
}

#markenmenu-navigation ul.level_2 > li.submenu > a {
    display: inline-block;
    background: #08405f;
    color: #fff;
    width: 100%;
    padding: 3px 0px 3px 5px;
    font-family: 'Barlow';
    
}

#markenmenu-navigation ul.level_2 > li.submenu > a:hover {
    background: #259591;   
}


#markenmenu-navigation ul.level_3 > li > a {
    padding-left: 5px;
    display: inline-block;
    width: 100%;
    font-family: 'Barlow';
    font-size: 13px;
}

#markenmenu-navigation ul.level_3  {
   margin-top: 2px;
}


#markenmenu-navigation ul.level_3 > li > a:hover {
    background: #259591;
    color: #ffffff;   
}


#Brands .markenmenu-navigation li ul.level_2 {
    padding-left: 0px;
}

#Brands #markenmenu-navigation ul.level_3 {
    margin-top: 2px;
    padding-left: 1px;
}



#markenmenu-navigation li ul.level_2 {
    width: 81%
}



#Brands ul.level_1 {
    padding-left: 0px;
}

#Brands #markenmenu-navigation img {
    width: 70%;
    height: auto;
}


#Brands h1 {
    font-size: 1em;
    margin-top: 34px;
    font-weight: bold;
    text-shadow: 1px 1px 0 white;
    padding-left: 5px;
}


#Brands #markenmenu-navigation .level_1>li.submenu>a {
    text-align: center;
}

#Brands #markenmenu-navigation .level_1>li.submenu.no-image>a {
    text-align: left;
}

#Brands nav#markenmenu-navigation > ul > li.submenu {
    padding-left:0px
}

#Brands nav#markenmenu-navigation > ul > li.submenu.no-image,
#Brands nav#markenmenu-navigation > ul > li.no-submenu {
    padding-left: 12px;
}


#Brands #markenmenu-navigation img {
    width: 75%;
    height: auto;
    vertical-align: -webkit-baseline-middle;
}

#Brands nav#markenmenu-navigation > ul > li.submenu.no-image {
    padding-left: 12px;
}

#Brands h1 {
    padding-left: 12px;
}

#Brands ul.level_1 {
    margin: 0;
}


#Brands nav#markenmenu-navigation > ul > li.submenu.last-image {
    margin-bottom: 12px;
}


li.list_item {
    grid-template-rows: auto auto 55px;
}

/*

#markenmenu-navigation li.test ul.level_2 {
    display: inline-flex !important;
    
}

#markenmenu-navigation li.test ul.level_2 {
    display: inline-flex !important;
}


#markenmenu-navigation ul.level_1>li:nth-of-type(10) > a > span {
    color: white;
    vertical-align: -webkit-baseline-middle;
}

#markenmenu-navigation li:nth-of-type(5) ul.level_2 {
    display: inline-flex !important;
}

ul.level_1 li:hover a {
    color: white;
}


*/





#markenmenu-navigation ul.level_1>li.no-image:hover>a>span {
    color: white;
}

#markenmenu-navigation ul.level_1>li.no-image:hover {
    background: #259591;
}

#markenmenu-navigation ul.level_1> li > a > span {
    vertical-align: -webkit-baseline-middle;
}






/* Anzeige im Hauptmenu */


#MainNavi .markenmenu-navigation ul.level_2 > li.submenu>a>small {
    display: none;
}

#Navi li.submenu.markenmenu-navigation {
    position: static;
}

#MainNavi .markenmenu-navigation ul.level_2 {
    width: 100vw;
    max-width: 1440px;
}

#Navigationbar #Navi #MainNavi .markenmenu-navigation ul.level_2 {
    display: none;
}

#Navigationbar #Navi #MainNavi .markenmenu-navigation:hover ul.level_2 {
    display: flex;
    /* border-top: 4px solid #08405f; */
    border-bottom: 1px solid #08405f;
}

#Navigationbar #Navi #MainNavi .markenmenu-navigation ul.level_2 {
    flex-wrap: wrap;
    justify-content: flex-start;
    /*
    border-top: 4px solid #cccccc;
    border-bottom: 1px solid #08405f;
    */
    border-right: 1px solid #08405f;
    border-left: 1px solid #08405f;
    background: #fff;
    font-family: 'Barlow';
}

#MainNavi .markenmenu-navigation:hover ul.level_2 ul.level_3 a{
    color: #000;
}


#MainNavi .markenmenu-navigation ul.level_2 > li {
   flex-basis: 19.2%;
   flex-grow: 0;
   flex-shrink: 0;
}

#MainNavi .markenmenu-navigation ul.level_2 > li {
    padding: 0px 0px 5px;
    border: 1px solid #08405f;
    margin: 5px;
}

#MainNavi .markenmenu-navigation ul.level_3 {
    padding-left: 5px;
    padding-right: 5px;
    font-size: 13px;
}


#MainNavi .markenmenu-navigation ul.level_3 {
    display: block;
    position: static;
    background: none;
}


#MainNavi .markenmenu-navigation .level_2 > li > a {
    background: #08405f;
}

#MainNavi .markenmenu-navigation .level_2 > li > a:hover {
    background: #259591;
}

#MainNavi .markenmenu-navigation .level_2 > li > a:hover,
#MainNavi .markenmenu-navigation .level_3 > li > a:hover {
    background: #259591;
    text-decoration: none;
    color: #fff !important;
}





/* Hauptmenu -> Marken*/

#MainNavi .markenmenu-navigation.marken ul.level_4 {
    display: none;
}

#MainNavi .markenmenu-navigation.marken ul.level_3 > li {
    display: none;
}

#MainNavi .markenmenu-navigation.marken ul.level_3 > li:nth-child(-n+5)  {
    display: block;
}

#Navigationbar #Navi #MainNavi .markenmenu-navigation:hover ul.level_2 {
    display: flex;
    /* border-top: 4px solid #08405f; */
    border-bottom: 1px solid #08405f;
    overflow: auto;
    max-height: 80vh;
}






/* Dropshiping*/
td.dropship-select {
    width: 100%;
}

.dropship-text {
    color: #db1818;
    margin-top: 2px;
    margin-bottom: 10px;
    padding-left: 14px;
    display: table;
}

tr.dropship-info {
    display: none;
    margin-bottom: 5px;
}

td.td-input {
    width: 58%;
}







/* Markenmenu Sprachspezifisch*/

html[lang=de] aside#Brands {
    position: static;
    width: 165px;
    float: left;
    margin-right: 10px;
    background: #f1f1f1;
}

html[lang=fr] aside#Brands {
   /*display: none;*/
   position: static;
   width: 165px;
   float: left;
   margin-right: 10px;
   background: #f1f1f1;
}

html[lang=de] .FFSContent {
    width: calc(100% - 470px) !important;
    padding-left: 10px;
    float: left;
}

html[lang=fr] .FFSContent {
    width: calc(100% - 470px) !important;
    padding-left: 10px;
    float: left;
}

html[lang=de] #UpperASN section.nocat {
    width: 270px;
    margin-right: 50px;
}

html[lang=fr] #UpperASN section.nocat {
    width: 270px;
    margin-right: 50px;
}

html[lang=de] #UpperASN #FilterNotCategory {
    display: flex;
    flex-flow: wrap;
    justify-content: flex-start;
    margin-right: -50px;
}

html[lang=fr] #UpperASN #FilterNotCategory {
    display: flex;
    flex-flow: wrap;
    justify-content: flex-start;
    margin-right: -50px;
}

html[lang=de] #ShopMenu.FFSMenu {
    float: right;
    left: 3px;
}

html[lang=fr] #ShopMenu.FFSMenu {
    float: right;
    left: 3px;
}


/* New Delivery Symbol "Wird für dich bestellt "*/


.stock-blue {
    background: #08405f;
}

#Filter a.hidden {
    display: none;
}

.stock-indicator .stocktooltip {
    width: 175px;
    font-size: 14px;
    margin-top: -30px;
    margin-left: -85px;
}


/* Preigruppen Wechsel*/

span.price-switch {
    padding: 0.375em 5px;
    font-size: 18px;
    border-radius: 5px;
}

span.price-switch.red {
    color: #fff;
    background-color: #ff7200;
}

span.price-switch.green {
    color: #fff;
    background-color: #10b1a4;
}

tr#COUPON {
    display: none;
}




/*Optimierungen 2.0*/
.newscounternumber {
    width: 26px;
    height: 26px;
    display: block;
    border-radius: 100%;
    font-size: 14px;
    color: #fff;
    line-height: 26px;
    text-align: center;
    background: #10b1a4;
    position: relative;
    top: -37px;
    left: 40px;
}

span.newscounternumber_menu {
    background: #10b1a4;
    color: #fff;
    padding: 3px 5px;
    border-radius: 5px;
    font-size: 12px;
}

li#navLogin .newscounternumber {
    left: 22px;
}


/* Optimierungen 2.0 - Listview*/

#ListView li.list_item {
    grid-template-areas: 'image header header logo' 
                         'image empty empty info'
                         'image thumbs thumbs staffeln' 
                         '. . . button'
                         'tbl tbl tbl tbl'
                         'more more more more';
    grid-template-columns: 130px auto 205px 215px;
    margin-top: 20px;
    grid-gap: 12px 12px;
    margin-bottom: 30px !important;
    grid-template-rows: auto 15px 52px;
 
}

#ListView li.list_item .ShopTable {
    margin-top: -20px;
}

#ListView .listimage_container img {
    width: 125px;
    height: auto;
}

#ListView div.ArticleTitle,
#ListView .artnr_container  {
    font-size: 1.4em;
}

.staffeln {
    grid-area: staffeln;
}

.thumbcontainer {
    grid-area: thumbs;
    height: 52px;
}

.staffeln {
    margin-top: 0px;
    margin-bottom: 3px;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    margin-left: 49px;
}

.staffeln1,
.staffeln2,
.staffeln3  {
    text-align: right;
}

.staffeln .staffel {
    display: flex;
    justify-content: flex-end;
}


.staffeln .staffel .discount {
    min-width: 80px;
}

.staffeln .staffel .qty {
    min-width: 55px;
}


.staffeln .staffel i.fa.ico-box {
    margin-top: 3px;
}


.price_container .aktionspreis {
    float: right;
    margin-left: 6px;
}



/* Optimierungen 2.0 - FilterDropdown */

#Filter section.nocat:not(.nodrop) li {
    display: none;
    cursor: pointer;
    padding: 5px 10px;
    border-top: 1px solid #a5a5a5;
    min-width: 150px;
}

#Filter section.nocat:not(.nodrop) li:first-child {
    display: block;
    border: 1px solid #a5a5a5;
}

#Filter section.nocat ul.open li {
    display: block;
    border-left: 1px solid #a5a5a5;
    border-right: 1px solid #a5a5a5;
}

#Filter section.nocat:not(.nodrop) ul.open {
    z-index: 99;
    background: #fff;
    max-height: 350px;
    overflow-y: scroll;
    border-bottom: 1px solid #a5a5a5;
    width: calc(100% - 0.5em);
}

#Filter section.nocat.dropdown h1 {
    display: none;
}

#ShopMenu>#Filter>section.nocat.dropdown {
    border-bottom: none;
    margin-bottom: 0px;
}

#ShopMenu #Filter section.nocat.dropdown a.first {
    font-weight: bold;
    font-size: 1em;
}

#ShopMenu #Filter section.nocat.dropdown a.first:hover {
    color: #333;
}

#ShopMenu #Filter section.nocat.dropdown li.extra-border  a.first,
#ShopMenu #Filter section.nocat.dropdown li.extra-border  a.first:hover  {
    color: #10b1a4;
   
}


#Filter section.nocat:not(.nodrop) li.extra-border:first-child {
    border: 2px solid #10b1a4;
}


#ShopMenu #Filter section.nocat.dropdown a:not(.checkbox-filter-submit) {
    pointer-events: none;
}

#Filter input[type="checkbox"] {
    accent-color: #333;
    margin-top: -3px;
    margin-right: 5px;
}


#Filter section.nocat ul li {
    position: relative;
}

#Filter section.nocat ul li.filtervalue {
    padding-left: 34px;
}

#Filter section.nocat ul input[type="checkbox"] {
    position: absolute;
    top: 19px;
    left: 12px;
    opacity: 0;
}



#Filter section.nocat ul span.checkmark {
    position: absolute;
    top: 14px;
    left: 10px;
    height: 16px;
    width: 16px;
    border: 1px solid #08405f;
}

#Filter section.nocat ul .checkmark::after {
    content: "";
    position: absolute;
    display: none;
    left: 5px;
    top: 1px;
    width: 3px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

#Filter section.nocat input[type="checkbox"]:checked ~ .checkmark::after {
    display: block;
}


#Filter section.nocat input[type="checkbox"]:checked ~ .checkmark  {
    background-color: #08405f;
}

#ShopMenu #Filter .checkbox-filter-submit {
    display: block;
    margin-top: 10px;
    border: 1px solid #08405f;
    background: #08405f;
    color: #fff;
    padding: 10px 30px;
    text-align: center;
}



#ShopMenu #Filter .checkbox-filter-submit.hidden {
    display: none !important;
}

#ShopMenu section.cat a {
    display: inline-block;
    /* margin: 0 0 0 15px; */
    padding: 0.4em 0 0.4em 0;
    color: #333;
}


#Filter section.nocat.dropdown.hidden-filter {
    display: none;
}

.show-more-filters,
.show-less-filters {
    cursor : pointer;
    text-align: center;
}


/* Optimierungen 2.0 Filterarea oben*/

#filter_line {
    margin-top: 5px;
}
#filter_line.filter_msg {
    line-height: 30px;
} 

#filter_line .filterReset .freset {
    padding: 4px 16px !important
} 

#filter_line .upper-fliter {
    margin-bottom: 0px;
    padding: 4px 15px;
}

/* Bereiche Ausblenden im CMS */

.anonymous .onlycustomer,
body.onlycustomer.anonymous {
    display: none;
}



.LoginForm.logedin .formwrapper {
    padding-left: 18px;
    padding-right: 18px;
}


span.aktionstaffel {
    display: block;
}

th.Center.aktionspreis.from {
    min-width: 31px;
}

#ListView table tr td.Center.lieferzeit{
    min-width: 40px;
    max-width: 50px;
}

.FFSContent #ListView table tr td.price{
    min-width: 75px;
}


.FFSContent #ListView table tr td.name{
    width: 450px !important;
    min-width: 450px !important;
}


.FFSContent #ListView  th.ohneAktion {
    width: 201px;
}


.FFSContent #ListView table tr td.artno{
    width: 90px;
}

.price_container {
    width: 105%;
}