/* company - 240819 */

@import url("/media/css/bootstrap-icons.min.css");

/* company ohne Base-CSS 240610 handyfirst */

/* 	Dies wird die geordnete und bereinigte company.css für 0140 Gold
	und damit die Grundlage für das Basis-Design
	Wo vorhanden, werden die Default Variablen aus dem Design-Editor eingebaut.
	Weitere Variablen, die bereits definiert sind. oder die zusätzloch benigt werden, werden besprochen (Nomenklatur)
	Allgemeingültige Definitionen oder einzelne Bereiche werden hier erstmal rausgenommen und in separate Dateien gespeichert, damit wir später
	aus diesen Dateien ein Design zusammenbauen können */

/* Design CSS */


* {
  font-family: var(--design-editor-font-family);
  /* font-size: var(--design-editor-content-font-size); */
}


/* Remove default margin. */
body {
  margin: 0;
  padding: 0;
  background-color: var(--design-editor-body-color) !important;
}

body, html {
  height: 100%;
}


body,
td.content-td-of-main-content-table,
body,
td,
th,
input,
textarea,
select {
  font-family: var(--design-editor-font-family);
  font-size: var(--design-editor-content-font-size);
  color: var(--design-editor-content-color);
}

nav,
span,
div,
label,
input,
select,
textarea,
th,
td,
p,
a,
a:link,
a:active,
a:visited,
a:hover,
header,
footer,
section {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

/* -------------------------------------------------------------------------- */
/* base css                                                                   */
/* -------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
  font-family: var(--design-editor-headings-font-family);
  font-weight: var(--design-editor-headings-font-weight);
  color: var(--design-editor-header-color);
  line-height: initial; /* base-fix */
  margin: initial; /* base-fix */
  padding: initial; /* base-fix */
}

h1 {
  /*font-size: var(--design-editor-header-font-size);*/ /* 1.5em */
}

h2 {
  font-size: 24px; /* 1.5em */
}

h3 {
  font-size: 18.72px; /* 1.17em */
}

h4 {
  font-size: 16px; /* 1em */
}

h5 {
  font-size: 13.282px; /* .83em */
}

h6 {
  font-size: 10.72px; /* .67em */
}

.content-td-of-main-content-table {
  color: var(--design-editor-content-color);
}

.page-text-container {
  color: var(--design-editor-content-color);
}

/*
  base-fix!
  in einigen templates wurde diese klasse in 'td' eingefügt, was dazu führt,
  dass die angabe in "em" in child-elementen (zb. h1-h6) zu absurden ergebnissen
  führte. ".ueberschrift" sollte nur in span-elementen verwendet werden. siehe
  'span.ueberschrift'
 */
.ueberschrift {
  font-size: unset;
  font-style: unset;
}

/* base-fix: überschrift als required zu markieren ist seltsam */
td.ueberschrift > span.label-form-req::after {
  content: '';
}

/* titel main */
h1,
span.ueberschrift,
.page-headline {
  font-family: var(--design-editor-headings-font-family);
  font-size: var(--design-editor-header-font-size) !important; /* ignoriert die einstellung im cms-typ via element-attribut */
  color: var(--design-editor-header-color) !important; /* ignoriert die einstellung im cms-typ via element-attribut */
  display: block;
  font-weight: var(--design-editor-headings-font-weight);
  margin: 0 0 0.67em 0;
  line-height: 1;
}

/* fix br's nach ueberschrften */
span.ueberschrift ~ br {
  display:none;
}

/* fix br's in span-elementen */
span > br {
  display:none;
}

/* base-fix */
a:hover {
  font-weight: initial;
}


.no-articles-found {
  font-family: var(--design-editor-headings-font-family);
  /*font-size: 1.2em;*/
  font-weight: 400;
  color: var(--design-editor-header-color);
}

/* Abstand Checkbox zum Text */
input[type="radio"],
input[type="checkbox"] {
  margin: 4px 10px 0 0 !important;
}



/* -------------------------------------------------------------------------- */
/* custom css (depends on layout.php)                                         */
/* -------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------- */
/* uncategorized                                                              */
/* -------------------------------------------------------------------------- */


#innerLeftSidebar,
#innerRightSidebar {
  background-color: var(--design-editor-cms-nav-background-color);
}

#innerLeftSidebar,
#innerRightSidebar {
  font-family: var(--design-editor-font-family);
}

#innerLeftSidebar a,
#innerRightSidebar a {
  color: var(--design-editor-cms-nav-color);
}

/* sidebar menüeinträge mit klasse 'sidebar-title' */
#innerLeftSidebar .sidebar-title a,
#innerRightSidebar .sidebar-title a {
  color: var(--design-editor-cms-nav-title-color);
  text-transform: uppercase;
}

#innerLeftSidebar a:hover,
#innerRightSidebar a:hover {
  color: var(--design-editor-cms-nav-hover-color);
}

#innerLeftSidebar .nav_item_active > a,
#innerLeftSidebar .sub_nav_item_active > a,
#innerLeftSidebar a.main_nav_active,
#innerRightSidebar .nav_item_active > a,
#innerRightSidebar .sub_nav_item_active > a,
#innerRightSidebar a.main_nav_active,
li.nav_item_active a,
li.sub_nav_item_active a
{
  color: var(--design-editor-cms-nav-active-color);
  background-image: unset; /* bullet fix, design-editor ignorieren */
}

/* Remove most spacing between table cells. */
table {
  border-collapse: collapse;
  border-spacing: 0;
}



/*!* Main Wrapper *!*/
/*.wrapper.container-fluid {*/
/*  !*--design-editor-body-color: #dab77d;*!*/
/*  padding-left: 0 !important;*/
/*  padding-right: 0 !important;*/
/*  background-color: var(--design-editor-body-color);*/
/*}*/

/*.container {*/
/*  padding: 0;*/
/*}*/

/*.wrapper {*/
/*  width: 1020px; !* wuah?! *!*/
/*  margin: 0 auto;*/
/*  position: relative;*/
/*  z-index: 10;*/
/*}*/

/*.wrapper:before,*/
/*.wrapper:after {*/
/*  display: table;*/
/*  line-height: 0;*/
/*  content: "";*/
/*}*/

/*.wrapper:after {*/
/*  clear: both;*/
/*}*/

/*!* Container *!*/
/*.mainContainer {*/
/*  --design-editor-body-color: #c09ada;*/
/*  width: 100%;*/
/*  float: left;*/
/*  !*padding-top: 1em;*!*/
/*  background-color: var(--design-editor-body-color);*/
/*  border-top: 0;*/
/*}*/

/*.leftContainer {*/
/*  --design-editor-body-color: antiquewhite;*/
/*  width: 20%;*/
/*  float: left;*/
/*  border: 0;*/
/*  padding: 1em 0 2em 10px;*/
/*  -webkit-box-sizing: border-box; !*fixme*!*/
/*  -moz-box-sizing: border-box; !*fixme*!*/
/*  box-sizing: border-box;*/
/*  background-color: var(--design-editor-body-color);*/
/*  height: 100%;*/
/*}*/

/*.mainContent {*/
/*  --design-editor-body-color: #eaf9cd;*/
/*  float: left;*/
/*  width: 100%;*/
/*  -webkit-box-sizing: border-box; !*fixme*!*/
/*  -moz-box-sizing: border-box; !*fixme*!*/
/*  box-sizing: border-box;*/
/*  background-color: var(--design-editor-body-color);*/
/*}*/

/*.mainContent.leftColExists {*/
/*  width: 80%;*/
/*  border: 0;*/
/*  padding-left: 1em;*/
/*}*/

/*.mainContent.rightColExists {*/
/*  width: 80%;*/
/*  border: 0;*/
/*  padding-right: 1em;*/
/*}*/

/*.mainContent.leftColExists.rightColExists {*/
/*  width: 60%;*/
/*  padding-left: 1em;*/
/*  padding-right: 1em;*/
/*}*/



.shoppingCart {
  border-bottom: none;
  padding-top: 0;
}

.content {
  padding: 15px; /* base-fix */
}

/*.contentBg {*/
/*  --design-editor-body-color: #777;*/
/*  background-color: var(--design-editor-body-color);*/
/*}*/

/* Basic stuff */
a,
a:link,
a:visited,
a:active {
  text-decoration: none;
  font-weight: normal; /* base-fix */
}

a,
a:link {
  color: var(--design-editor-link-regular);
}

a:visited {
  color: var(--design-editor-link-visited);
}

a:active {
  color: var(--design-editor-link-hover);
}

a:hover,
a:focus {
  color: var(--design-editor-link-hover);
  text-decoration: var(--design-editor-hover-text-decoration);
}

body,
th,
div {
  color: var(--design-editor-content-color);
}

div.cashbox_popup_content div.headline_link {
  margin: 0;
  font-weight: normal;
  font-size: inherit;
}

div.cashbox_popup_content div.headline_link a:link {
  font-weight: normal;
}


label,
.label {
  color: var(--design-editor-label);
  font-weight: initial;
}

.label-1 {
  color: var(--design-editor-label-1);
  padding: 0 !important;
  font-family: unset;
  font-size: unset;
  font-weight: unset;
}

.label-req,
.label-form-req {
  color: inherit;
  font-weight: inherit;
  font-family: inherit;
  font-size: inherit;
}

tr.subdomain_info_highlight_row {
  background-color: #ffffff !important; /*fixme*/
}

/* Forms */
textarea,
input[type="text"],
select,
.input_field {
  /*background-color: #f7f6f2;*/ /*fixme*/
  /*color: #464646;*/ /*fixme*/
  /*border: solid 1px #c2c2c2;*/ /*fixme*/
  /*padding: 5px;*/
  /*margin: 0 0 5px 0;*/
  /*border-radius: 3px;*/
  /*outline: none;*/
}

/* .input_field {
  font-size: 14px;
} */

.input_button,
button input[type="submit"],
input[type="reset"] {
  background-color: #767b85; /*fixme*/
  color: white; /*fixme*/
  border-radius: 3px;
  padding: 5px 15px;
  outline: none;
}

.number-country-code {
  width: 40px;
}

.number-area-code {
  width: 50px;
}

.number-number {
  width: 90px;
}

/* -------------------------------------------------------------------------- */
/* navbar                                                                     */
/* -------------------------------------------------------------------------- */

.navbar {
  margin-bottom: 0;
  border: none;
  /* hintergrund als border-color, sonst 1px "leer" bei aufgeklapptem submenü */
  border-bottom: 1px solid var(--design-editor-navbar-background);
  border-radius: 0 !important;
  font-size: var(--design-editor-navbar-font-size);
}

.navbar-default {
  background-color: var(--design-editor-navbar-background);
  color: var(--design-editor-navbar-color);
  font-size: var(--design-editor-navbar-font-size);
}

.navbar li {
  font-family: var(--design-editor-navbar-font-family);
}

/* trennlinie unterhalb der navbar und zwischen navbar-formularen */
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: var(--design-editor-main-nav-border-color);
}

.navbar-default .navbar-text {
  color: var(--design-editor-navbar-color);
}

/* Navbar-Toggle */
.navbar-toggle {
  /*position: absolute;*/
  /*padding: 9px 10px;*/
  /*margin-top: 9px;*/
  /*background-color: transparent;*/
  /*background-image: none;*/
  /*border: 2px solid #b29247 !important;*/
  /*border-radius: 4px;*/
  /*margin-left: 15px;*/
  margin-right: 5px;
  border: 0;
}

.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {
  background-color: transparent;
}

/* hamburger hover */
.navbar-default .navbar-toggle:hover .icon-bar {
  background-color: var(--design-editor-navbar-hover-color);
}

.navbar-default .navbar-toggle .icon-bar {
  background-color: var(--design-editor-navbar-color);
}

img.headerlogo {
  width: auto;
  height: var(--jes-navbar-brand-height, 60px);
  vertical-align: middle;
}

.navbar-brand {
  padding: 5px 15px;
}

/* aktiver menüpunkt */
.navbar-nav>.nav_active>a,
.navbar-nav>.nav_active>a:focus {
  /*background-color: #AE6755;*/
  color: var(--design-editor-navbar-color);
  box-shadow:inset 0 -5px 0 0 var(--jes-active-nav-color);
}

/* navbar links ebene 1 */
.navbar-default .navbar-nav>li>a {
  color: var(--design-editor-navbar-color);
}

.navbar-nav>li>.dropdown-menu {
  background-color: var(--design-editor-navbar-background);
}

.navbar-default .navbar-nav>li>a:focus,
.navbar-default .navbar-nav>li>a:hover {
  color: var(--design-editor-navbar-hover-color);
  background-color: var(--design-editor-navbar-hover-background-color);
  outline: none;
}

.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover {
  color: var(--design-editor-navbar-hover-color);
  background-color: var(--design-editor-navbar-hover-background-color);
}

/* navbar aufgeklapptes untermenü, focus und hover */
.navbar-nav> .dropdown .dropdown-menu>li>a:focus,
.navbar-nav> .dropdown .dropdown-menu>li>a:hover {
  color: var(--design-editor-navbar-hover-color);
  text-decoration: none;
  background-color: var(--design-editor-navbar-hover-background-color);
}

/* trenner in navbar, wenn <hr> als item */
#headerNavbar .subNavNoLinkItem > hr {
  margin-top: 4px;
  margin-bottom: 0;
  border-top: 1px solid var(--design-editor-main-nav-border-color);
}

/* -------------------------------------------------------------------------- */

/*div.head_nav_container_inner>ul>li.first {*/
/*  border-left: none !important;*/
/*  margin-left: 3.5em;*/
/*}*/

/*.head_nav_container,*/
/*.head_nav_container_inner {*/
/*  display: block;*/
/*  height: 100%;*/
/*  width: 100%;*/
/*}*/

/*div.head_nav_container_inner>ul {*/
/*  margin: 0;*/
/*  padding: 0;*/
/*  list-style-type: none;*/
/*  display: block;*/
/*  width: 100%;*/
/*  height: 60px;*/
/*}*/

/*div.head_nav_container_inner>ul>li {*/
/*  display: inline-block;*/
/*  line-height: 60px;*/
/*  height: 60px;*/
/*  cursor: pointer;*/
/*  border-right: solid 0 #e7e7e7;  !*fixme*!*/
/*  padding: 0;*/
/*  !*font-family: var(--design-editor-font-family) !important;*!*/
/*  font-weight: 300;*/
/*}*/


/*div.head_nav_container_inner>ul>li>a,*/
/*div.head_nav_container_inner>ul>li>a:link,*/
/*div.head_nav_container_inner>ul>li>a:visited,*/
/*div.head_nav_container_inner>ul>li>a:active {*/
/*  display: block;*/
/*  text-align: center;*/
/*  text-decoration: none;*/
/*  color: var(--design-editor-navbar-color);*/
/*  line-height: 60px;*/
/*  height: 60px;*/
/*  padding: 0 1em;*/
/*  !* -webkit-border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px;*/
/*-moz-border-radius-topright: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; *!*/
/*  !*font-family: var(--jes-main-nav-font-family);*!*/
/*  !*font-weight: 500;*!*/
/*}*/

/*div.head_nav_container_inner>ul>li>a:hover {*/
/*  !*background-color: var(--jes-main-nav-background-color-hover);*!*/
/*  !*color: #ffffff;*!*/
/*  !*font-weight: 500 !important;*!*/
/*  !*transition: all ease 0.3s;*!*/
/*}*/

/*div.head_nav_container_inner>ul>li.nav_active>a,*/
/*div.head_nav_container_inner>ul>li.nav_active>a:link,*/
/*div.head_nav_container_inner>ul>li.nav_active>a:visited,*/
/*div.head_nav_container_inner>ul>li.nav_active>a:active {*/
/*  !*background-color: var(--jes-main-nav-background-color-hover);*!*/
/*  !*color: var(--jes-active-nav-color);*!*/
/*  !*font-family: var(--jes-main-nav-font-family);*!*/
/*  !*font-weight: 500;*!*/
/*}*/

/*div.head_nav_container_inner>ul>li.nav_active>a:hover {*/
/*  text-decoration: var(--design-editor-hover-text-decoration);*/
/*  !*font-family: var(--jes-main-nav-font-family);*!*/
/*  !*font-weight: 500;*!*/
/*  !*background-color: var(--jes-main-nav-background-color-hover);*!*/
/*  !*color: #fff;*!*/
/*}*/

/*.nav>li>a:focus,*/
/*.nav>li>a:hover {*/
/*  !*background-color: var(--jes-main-nav-background-color-hover);*!*/
/*  !*color: #fff;*!*/
/*}*/

/*!* NCart rechts *!*/

/*div.head_nav_container_inner>ul>li.shopping-cart {*/
/*  float: right;*/
/*  border-right: none;*/
/*  display: none;*/
/*}*/

/*div.head_nav_container_inner>ul>li.shopping-cart>a {*/
/*  display: none;*/
/*  width: 50px;*/
/*  height: 50px;*/
/*  background-image: url(/cms_media/my_media/0/design/cart_dark.png);*/
/*  background-repeat: no-repeat;*/
/*  background-position: 50% 50%;*/
/*}*/

/*div.head_nav_container_inner>ul>li.shopping-cart>a:hover {*/
/*  !*background-image: url(/cms_media/my_media/0/design/cart_grey.png);*!*/
/*  !*background-repeat: no-repeat;*!*/
/*}*/

/*!* Ende Cart rechts *!*/

/*#head-nav-table li ul {*/
/*  !*display: none;*!*/
/*}*/



/* Horizontal / Sub-Navigation */
/*.subNav {*/
/*  margin: 0.5em 0 2em 0;*/
/*  box-shadow: 0 3px 3px 0 rgba(100, 100, 100, 0.2); !*fixme*!*/
/*  !*background-color: var(--jes-subnav-background-color);*!*/
/*}*/

/*.subNav .subNavTitleWrapper {*/
/*  !*background-color: var(--jes-subnav-title-background-color);*!*/
/*  box-shadow: 0 3px 3px 0 rgba(100, 100, 100, 0.2); !*fixme*!*/
/*  background-image: url(//graphiken.net/sw-template/arrow-down-white.png); !*fixme*!*/
/*  background-repeat: no-repeat;*/
/*  background-position: 95% 50%;*/
/*}*/

/*.subNav .subNavTitleWrapper a,*/
/*.subNav .subNavTitleWrapper a:link,*/
/*.subNav .subNavTitleWrapper a:visited,*/
/*.subNav .subNavTitleWrapper a:active,*/
/*.subNav .subNavTitleWrapper a:hover {*/
/*  padding: 10px 10px;*/
/*  !*color: var(--jes-subnav-title-color);*!*/
/*  !*font-size: 1.1em !important;*!*/
/*  font-weight: 500 !important;*/
/*  text-decoration: none;*/
/*  font-family: var(--design-editor-font-family) !important;*/
/*}*/

/*.subNav .subNavWrapper {*/
/*  border: solid 1px gainsboro; !*fixme*!*/
/*}*/

/*.subNav .subNavWrapper ul {*/
/*  list-style-type: none;*/
/*}*/

/*.subNav .subNavWrapper ul li a,*/
/*.subNav .subNavWrapper ul li a:link,*/
/*.subNav .subNavWrapper ul li a:visited a:active {*/
/*  display: block;*/
/*  !*color: var(--jes-subnav-nav-color);*!*/
/*  font-weight: 300;*/
/*  text-decoration: none;*/
/*}*/

/*.subNav .subNavWrapper ul li a:hover {*/
/*  !*color: var(--jes-subnav-nav-color-hover);*!*/
/*}*/

/*.subNav .subNavWrapper ul li.nav_active a {*/
/*  !*color: var(--jes-subnav-nav-color-active);*!*/
/*  !*font-weight: 300;*!*/
/*  !* font-size: 13px; *!*/
/*}*/

/*.subNav .subNavWrapper ul li:first-child {*/
/*  margin-top: 10px;*/
/*  !* font-size: 13px; *!*/
/*}*/

/*.subNav .subNavWrapper ul li:last-child {*/
/*  margin-bottom: 10px;*/
/*  !* font-size: 13px; *!*/
/*}*/

/* Schriftgrössen Untermenüpunkte */

a.navi_top:hover {
  font-size: var(--design-editor-navbar-font-size);
  color: var(--design-editor-footer-sitenav-link-hover-color);
}

a.navi_top,
a.navi_top:visited,
a.navi_top:link {
  font-size: var(--design-editor-navbar-font-size);
  color: var(--design-editor-navbar-color);
}

/* navbar eintrag, wenn untermenü aufgeklappt ist */
.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
  color: var(--design-editor-footer-sitenav-link-hover-color);
  background-color: var(--design-editor-navbar-background);
}

/* Header */

.headerWrapper {
  /* ACHTUNG: das taugt nicht als vorlage, da das bild nicht vorhanden ist! */
  /*background-image: url(/cms_media/my_media/0/design/woo_bg.png); *//*fixme*/
  background-repeat: repeat-x;
  background-color: #000000; /*fixme*/
  padding-bottom: 0;
}

header {
  display: block;
  /*
      height: war vorher var(--design-editor-header-height).
      in kleineren screens war height jedoch "auto", was dazu führt, dass
      nur in der breiten ansicht der header mit fester höhe zu sehen war und
      bei allen anderen auflösungen der header dann verschwand, wenn er keinen
      inhalt hatte.
   */
  height: auto;
  /* statt height hier den wert aus dem editor für max-height */
  max-height: var(--design-editor-header-height);

  overflow: hidden;
  /*width: 1020px; fixme wtf?!*/
  width: 100%;
  position: relative;
  margin: 0 auto;
}


.bgheader {
  background-color: var(--design-editor-header-color);
}

/* head row */
.head-row {
  max-width: 1100px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 10px;
}

.head-left-li a {
  color: #000 !important; /*fixme*/
}

.head-left-li a:hover {
  color: #767b85 !important; /*fixme*/
}

.head-left {
  display: inline;
  float: left;
}

.head-left-li {
  display: inline;
  padding-right: 2em;
}

.head-right {
  display: inline;
  float: right;
}

.head-right-li {
  display: inline;
  padding-left: 2em;
}

.head-right-li a {
  color: #000 !important; /*fixme*/
}

.head-right-li a:hover {
  color: #767b85 !important; /*fixme*/
}

#searchbar-lang {
  background-color: transparent; /*fixme*/
  position: absolute;
  right: 5px;
  top: 5px;
}


/* -------------------------------------------------------------------------- */
/* navbar (navigation waagerecht)                                             */
/* -------------------------------------------------------------------------- */

/* für designeditor einstellung, navbar mittig */
.navbar-center {
  float: left;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover {
  background-color: transparent;
  color: var(--design-editor-navbar-hover-color);
}

/* navbar warenkorb-icon nur in mobiler ansicht anzeigen */
#navbar-cart-icon {
  display: none;
}


/* Auswahlbox Sprache */



/* div container der flaggen nebeneinander:  */
.navbar .language-selector > div {
  display: inline-block;
}

/* base-fix */
a.langFlag {
  padding-right: 0;
  margin-right: 0;
}

.navbar .language-selector > div > a {
  margin-right: 0 !important;
  padding-left: 4px; /* abstand der flaggen zueinander */
}

/* Unterdrücken des Headerbild und die hart progeammierten Einstellungen bei der Sprachauswahl */
.langheaderimg .content-td-of-header-table {
  display: none;
}

/* language select element */
#shop_base_language_key {
  -webkit-appearance: none;
  -moz-appearance: none;
  outline: none;
  cursor: pointer;
  color: var(--design-editor-navbar-color);
  background-color: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  text-align: right; /* nicht in safari */
  direction: rtl; /* safari fix */
  line-height: 1.4;
  margin-bottom: 0;
  font-family: var(--design-editor-navbar-font-family);
  font-size: var(--design-editor-navbar-font-size);
}

/* language select element hover */
#shop_base_language_key:hover {
  color: var(--design-editor-navbar-hover-color);
}

/* base-fix (language select element 150px) */
.language-selection {
  width: auto;
}

/* -------------------------------------------------------------------------- */
/* sidebar: Vertikale Navigation                                              */
/* -------------------------------------------------------------------------- */

.navigationVertical ul {
  list-style-type: none;
  margin: 0 0 2em 0;
  padding: 0;
}

.navigationVertical ul > li > a {
  display: block;
  text-decoration: none;
  padding: 5px 10px;
  margin: 0;
}

.navigationVertical ul li,
.navigationVertical a {
  display: block;
}

/*
  für titel beim menüpunkt die css-klasse 'sidebar-title' verwenden!
   dies gilt für alle titel-items in der sidebar und nicht nur für die
   "senkrechte navigation"
   ul.left_nav>li span.noLinkItem {}
 */

/* submenü-links in senkrechrechter navigation */
.navigationVertical .sub_nav_item a {
  padding: 2px 10px 2px 10px;
  text-decoration: none;
}

.navigationVertical a {
  font-size: var(--design-editor-cms-nav-font-size);
  font-family: var(--design-editor-cms-nav-font-family);
}

.navigationVertical .nav_item a:hover,
.navigationVertical .sub_nav_item a:hover {
  color: var(--design-editor-navbar-color);
}

.navigationVertical .sub_nav_item a::before {
  content: '\22EE'; /* ⁝ (tricolon) als kennzeichnung eines submenü-items */
  padding-right: 10px;
}


/* -------------------------------------------------------------------------- */
/* = Warenkorb = */
/* -------------------------------------------------------------------------- */




#cash_central_box {
  margin-bottom: 0;
}

#cb2 {
  padding-top: unset; /* base-fix */
  min-width: unset; /* base-fix */
  color: unset; /* base-fix */
}

#cb2 form {
  padding: 0;
  margin: 0;
  /*display: flex;
  flex: 1 0 auto;
  gap: 15px;*/

  display: grid;
  grid-template-columns: 3fr 1fr;
  column-gap: 15px;
}

#cb2 #left_box {
  /*max-width: 820px;*/
  /*flex: 0 0 75%;*/
}

/* wenn die rechte spalte im warenkorb *nicht* leer ist… */
#right_box:has(div.scroll):has(table) {
  /*width: 25%;*/
  /*flex: 1 1 auto;*/
  background-color: var(--jes-cart-sidebar-background, transparent);
  /*margin-right: -15px;*/
  padding: 15px; /* wenn als box, ansonsten: 0 15px */
  border: 1px solid var(--design-editor-border-color); /* wenn als box */
  /*border-left: 1px solid var(--design-editor-border-color);*/
  border-radius: 4px; /* nur, wenn als box mit hintergrund */
}

/* tabellen der cart sidebar als grid */
#customer_info {
  width: 100% !important;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  align-items: start;
  row-gap: 15px;
  column-gap: 15px;
}

#cb2 table.positions {
  margin-bottom: 15px;
  padding-top: 0;
}

#cb2 table.positions th {
  padding-bottom: 4px;
}
#cb2 #cashbox2_central_total td {
  text-align: left;
  font-size: var(--design-editor-content-font-size);
}
#cb2 .customer_info_value_text {
  padding-left: 0;
}
#cb2 .pos_last td {
  border-bottom: unset;
}
#cb2 table#customer_settings {
  margin-top: unset;
  background-color: unset;
  width: unset;
}
#cb2 table#main_cashbox {
  margin-right: unset;
  height: unset !important;
  width: 100% !important;
}
/* lösch-link für position im warenkorb */
#cb2 a.delete_x {
  text-decoration: none;
  font-size: unset;
}

#cb2 .sum_vat,
#cb2 table.positions td.tax {
  color: unset; /* base-fix */
}

/* blocktitel im warenkorb für summe, lieferkosten, etc */
#cb2 span.blocktitle {
  width: 100%;
  background-color: transparent;
  padding-left: 0;
  font-weight: 400;
  font-size: calc(var(--design-editor-content-font-size) * 1.25);
  color: var(--design-editor-header-color);
  display: block;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--design-editor-header-color);
  white-space: nowrap;
  line-height: calc(var(--design-editor-content-font-size) * 1.45);
  height: calc(var(--design-editor-content-font-size) * 1.6);
}

/* innere box cart sidebar */
#cb2 .customer_info_headline {
  border-bottom: none;
  margin-bottom: 0;
}

/* unterueberschriften warenkorb für anschriften und zahlungsmethoden */
#cb2 span.customer_headline_span {
  display: block;
  background-image: unset;
  background-position: unset;
  background-repeat: unset;
  cursor: unset;
  font-size: calc(var(--design-editor-content-font-size) * 1.25);
  color: var(--design-editor-header-color);
  padding-bottom: 5px;
  padding-top: 0 !important; /* overwrites attribute */
  line-height: calc(var(--design-editor-content-font-size) * 1.45);
  height: calc(var(--design-editor-content-font-size) * 1.6);
}

#cb2 .customer_info_headline td,
#cb2 .customer_info_headline th {
  background: none;
  font-size: var(--design-editor-content-font-size);
  font-weight: normal;
  /*font-size: 13px;*/
  height: 20px;
  padding-left: 0;
  padding-right: 2px;
  text-align: left;
}

#cb2 span.customer_headline_span_inactive {
  font-weight: normal;
  color: var(--design-editor-header-color);
  font-size: calc(var(--design-editor-content-font-size) * 1.25);
  /*font-weight: 500 !important;*/
  /*font-size: 13px !important;*/
  line-height: calc(var(--design-editor-content-font-size) * 1.45);
  height: calc(var(--design-editor-content-font-size) * 1.6);
  padding-top: 0 !important; /* overwrites attribute */
}

/* box für teilzahlung einstellungen (aufgeklappt) */
.partial_payment_box .cashbox-inner-container {
  padding: 0;
  margin-bottom: 15px;
}

input:invalid {
  border-color: var(--design-editor-message-error);
}
input:focus:invalid {
  background: url("/media/icons/svg/exclamation.svg") no-repeat 95% 50% lightpink;
  background-size: 25px;
}

#cb2 .orderCommentInternal {
  width: 100% !important; /* overwrites attribute */
  height: calc(3 * 1.5em + 10px) !important; /* overwrites attribute */
  margin-bottom: 15px !important; /* overwrites attribute */;
}

#cb2 #delivery {
  width: 50%;
}
#cb2 div.cb_container {
  float: unset;
}

#cb2 #basket_list td {
  vertical-align: top;
  padding: 2px;
  font-family: unset; /* base-fix */
  font-size: unset;
  /*color: #272727 !important;*/
}

#cb2 span.note {
  color: var(--design-editor-message-error);
  font-weight: 500;
}

/* br oberhalb von link für addr-änderung */
table#delivery_address div >  br:last-of-type,
table#billing_address div >  br:last-of-type {
  display: none;
}

/* br nach leeren address zeilen */
#delivery_address div >  span:empty + br,
#billing_address div >  span:empty + br {
  display: none;
}

/* base-fix: stückzahl eingabefeld */
#cb2 div.sum_count_input input {
  padding: 2px;
  width: 4rem;
  height: 23px;
}

#cb2 a.art_link,
#cb2 a.art_link:link,
#cb2 a.art_link:visited,
#cb2 a.art_link:active {
  color: #b29247; /*fixme*/
  text-decoration: none;
}

#cb2 a.art_link:hover {
  color: #f31515; /*fixme*/
}

/* kaufen button */
#cb2 .cash {
  width: unset;
}

#cb2 tr.pos_bg1 {
  background-color: transparent;
}

.input_name.btn.forward,
.input_name.btn.js_close {
  display: table-cell !important;
}

div#close a {
  text-decoration: none;
  /*font-size: 14px;*/
  color: #817f82; /*fixme*/
}

div#close a:hover {
  text-decoration: var(--design-editor-hover-text-decoration);
}

#frm_customer_registration {
  margin: 0; /* base-fix */
}

/* = Schrift Beschriftung Summe im Warenkorb = */

#cb2 span.total_sum_label {
  color: var(--design-editor-content-color);
  font-weight: 500;
}

/* = Schrift der Summe im Warenkorb = */
#cb2 .sum_total {
  font-weight: 500;
  text-decoration: none;
  /*color: #000 !important;*/
}

/* = Artikelnummer in Position = */
#cb2 a.art_link:link,
a.art_link:visited,
a.art_link:active {
  color: #000 !important; /*fixme*/
  font-weight: 500;
  text-decoration: none;
}

/* Warenkorb Zahlungsarten ausrichten*/
#cb2 label {
  margin-top: 4px !important;
  font-weight: 300 !important;
}



a.cash-box-link {
  /*font-family: Raleway, sans-serif !important;*/
  /*font-size: 11px !important;*/
  color: #817f82; /*fixme*/
  /*text-decoration: none;*/
  font-weight: 500 !important;
}

a.cash-box-link:hover {
  /*font-family: Raleway, sans-serif !important;*/
  /*font-size: 11px !important;*/
  color: #817f82 !important; /*fixme*/
  text-decoration: var(--design-editor-hover-text-decoration);
  font-weight: 500 !important;
}

/* -------------------------------------------------------------------------- */
/* main (main content)                                                        */
/* -------------------------------------------------------------------------- */
main#mainContent {
  background-color: var(--design-editor-content-background-color);
  margin: 15px;
}

.modal-content {
  background-color: var(--design-editor-content-background-color);
}

/* -------------------------------------------------------------------------- */
/* aside left (sidebar)                                                       */
/* -------------------------------------------------------------------------- */

/* quicknav select element */
select.quicknav-aside-left {
  appearance: none;
  outline: none;
  cursor: pointer;
  color: var(--design-editor-cms-nav-title-color);
  background-color: transparent;
  border: 0;
  border-radius: 0;
  padding: 5px 10px;
  width: 100%;
  text-align: left;
  margin-bottom: 0;
  text-transform: uppercase;
  font-size: var(--design-editor-cms-nav-font-size);
  font-family: var(--design-editor-cms-nav-font-family);
}

select.quicknav-aside-left:hover {
  color: var(--design-editor-cms-nav-hover-color);
}

/* qicknav eintrag ist "selected" */
.navigationQuick.option-is-selected select {
  color: var(--jes-sidebar-active-color);

}

/* die folgenden einstellungen werden nur dann angewandt, wenn die
   aufgeführten sections nicht leer sind! */
/* quicknav section als panel */
/* artikelnav section als panel */
/* shopping cart section als panel */
/* massmenu section als panel */
/* side nav section als panel */
section:has(.quicknav-td-of-main-nav-table),
.navigationArticle:has(table),
section.shoppingCart:has(table),
section.massMenu:has(table),
.left_nav_container {
  border: var(--jes-section-border, none);
  border-radius: var(--jes-section-border-radius, 0);
  background-color: var(--jes-section-background, transparent);
  overflow: hidden;
  /* wenn mit borders, dann rechts auf 10 statt 5 setzen */
  margin: var(--jes-section-margin, 10px 10px 5px 5px);
}

/* zusätzlicher abstand des jeweils 1. menüblocks von oben */
#innerLeftSidebar,
#innerRightSidebar {
  padding-top: 0;
}

main {
  border: var(--jes-section-border);
  border-radius: 10px;
  /*background-color: transparent;*/
  overflow: hidden;
  margin: 25px 10px 5px;
}

/* ähnliche artikel, tabelle */
.navigationArticle > table {
  /*--design-editor-content-background-color: #d7d1f4;*/
  /*background-color: var(--design-editor-content-background-color);*/
  width: 100%;
}

.navigationArticle .navi_cms {
  font-size: var(--design-editor-cms-nav-font-size);
  font-family: var(--design-editor-cms-nav-font-family);
  font-weight: normal;
  color: var(--design-editor-cms-nav-color);
  padding-left: 0 !important;
  padding-right: 0 !important;
  background-color: transparent;
}

/* oberen spacer ausblenden */
.navigationArticle .spacer_cms {
  display: none;
}

/* unterer spacer */
.navigationArticle .spacer_cms_bottom {
  border-bottom: 0;
  height: 8px;
  font-size: 0;
  background-color: transparent;
}

/* abstand der ersten zeile zur titel-zeile */
.navigationArticle tr:nth-child(3) td {
  padding-top: 0px;
}

.navigationArticle .related_article_groups_headline {
  padding: 0px 10px 10px 10px !important;
  /*background-color: color(srgb 0.6802 0.7845 0.895);*/
  /*border-bottom: 1px solid var(--design-editor-border-color);*/
  color: var(--design-editor-cms-nav-title-color);
  text-transform: uppercase;
}


.navigationArticle a.navi_cms,
.navigationArticle a.navi_cms:hover {
  padding: 0 10px 0 10px !important;
  font-family: var(--design-editor-cms-nav-font-family);
  font-size: var(--design-editor-cms-nav-font-size);
  font-weight: 300;
  text-decoration: none;
  background-image: none; /* navicons aus design-editor ignorieren */
}

/* -------------------------------------------------------------------------- */
/* footer (footer sitenav)                                                        */
/* -------------------------------------------------------------------------- */

footer {
  background-color: var(--design-editor-footer-sitenav-background-color);
  /*border-top: 1px solid var(--design-editor-border-color);*/
  font-size: var(--design-editor-footer-sitenav-font-size);
  color: #C1C2C5;
}

div.footerColumn li.firstHeadline,
div.footerColumn li.firstGroup {
  margin-left: 0;
}

/* footer nav spalten-titel */
footer .navFirstHeadline span {
  color: var(--design-editor-footer-sitenav-color);
  font-weight: 300;
  font-size: 1.3em;
}

/* footer nav linie unter dem spaltentitel  */
footer span.navFirstHeadline {
  padding-bottom: 4px;
  display: block;
  border-bottom: 1px dotted var(--design-editor-footer-sitenav-color);
}

/* FooterSiteNav Anfang */

.footerSiteNav .footerSiteNavContainer {
  border-top: 0;
  padding: 15px; /* abstände im footer zu den containern */
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* zentriert ausgerichtet - wenn es linksbündig sein soll, dann "flex-start" benutzen */
  align-items: flex-start;
  column-gap: 30px; /* spaltenabstände der container */
  row-gap: 15px; /* zeilen abstände der container */
}

.footerSiteNav .footerSiteNavContainer .footerColumn {
  padding: 0px;
  /* Footersite mit flex */
  flex: 1 0;
  min-width: 240px;
  max-width: 280px;
  /* deaktiviert die angabe im style-attribut */
  width: initial !important;
}

div.footerColumn ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}



.footerSiteNav .footerSiteNavContainer ul li ul li {
  display: block;
  /*color: var(--design-editor-footer-sitenav-color);*/
  /*padding: 3px 0 0 0;*/
}

.footerSiteNav .footerSiteNavContainer a,
.footerSiteNav .footerSiteNavContainer a:link,
.footerSiteNav .footerSiteNavContainer a:visited,
.footerSiteNav .footerSiteNavContainer a:active {
  display: block;
  text-decoration: none;
  font-weight: 300;
}

/* rollover footer sitenav links */
.footerSiteNav .footerSiteNavContainer a:hover {
  color: var(--design-editor-footer-sitenav-link-hover-color);
}

/* base-fix */
div.footerColumn ul li {
  padding-top: 0;
}

div.footerColumn ul li ul {
  margin-left: 0; /* linke einrückung unterhalb des spaltentitels  */
  margin-top: 0.8rem; /* abstand zur linie unterhalb des spaltentitels */
}

/* FooterSiteNav Ende */

.footerNav  .subNavNoLinkItem {
  margin-bottom: 0;
  color: var(--design-editor-footer-sitenav-color);
}

/* aktiver link im sitenav-footer */
.footerSiteNavContainer a.active {
  color: var(--design-editor-sitenav-footer-link-active);
}

/* -------------------------------------------------------------------------- */
/* footer (outer footer)                                                      */
/* -------------------------------------------------------------------------- */

#outerFooter {
  background-color: var(--design-editor-footer-background-color);
}

.footerWrapper {
  text-align: center;
  padding: 1rem;
}

/* hardcodierter trenner '|' zwischen items */
span.footerSeperator {
  /*display: none;*/
}

/* nav trenner vor erstem menüpunkt ausblenden */
.footerWrapper > span.footerSeperator {
  display: none;
}

/* nav trenner nach letztem menüpunkt ausblenden */
.footerWrapper > span:last-of-type > span.footerSeperator {
  display: none;
}

span.footer,
a.footer,
a.footer:visited {
  font-family: var(--design-editor-font-family);
  text-decoration: none;
  font-size: var(--design-editor-footer-sitenav-font-size);
  color: var(--design-editor-footer-color);
  font-weight: normal;
}

a.footer:hover {
  color: var(--design-editor-footer-sitenav-link-hover-color);
  text-decoration: var(--design-editor-hover-text-decoration);
}

/* -------------------- */

/* Einstellungen fuer Buttons */
input.input_button,
input[type="submit"],
input[type="reset"],
input[type="button"],
#cb2 .cash,
#cb2 a.login_button:link,
#cb2 a.login_button:visited {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid var(--jes-button-border-color, transparent);
  border-radius: 4px;
  font-family: unset;
  background-color: var(--design-editor-button-background-color);
  color: var(--design-editor-button-color);
}

/* Einstellungen fuer Buttons - Mouse Over */
input.input_button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
#cb2 .cash:hover,
#cb2 a.login_button:hover,
#cb2 a.login_button:active {
  color: var(--jes-button-hover-color, var(--design-editor-button-color));
  background-color: var(--jes-button-background-hover-color, var(--design-editor-button-background-color));
  border-color: var(--jes-button-hover-border-color, transparent);
  text-decoration: none;
}

/* -------------------------------------------------------------------------- */
/* sidebar: Massenmenue                                                       */
/* -------------------------------------------------------------------------- */
table.mass-menue-nav-table-right {
  width: 100%; /* fehlt in base, dort nur "table.mass-menue-nav-table-left" */
}

/* base fix */
a.main_nav,
a.main_nav:visited,
a.main_nav:hover,
a.main_nav_active,
a.main_nav_active:visited,
a.main_nav_active:hover {
  /* bullet aus design-editor ignorieren */
  background-image: unset;
  min-height: unset;
  background-position: unset;
  background-repeat: unset;
}

.main_nav_bullet {
  background-image: unset;
}

/* mass menu (erste zeile - kopfzeile) */
.massMenu > table table tr:first-child td {
  text-transform: uppercase;
}

.massMenu .left-mass-menue-table td,
.massMenu .right-mass-menue-table td {
  /*background-image: unset;*/
}

.massMenu .left-mass-menue-table td:hover,
.massMenu .right-mass-menue-table td:hover {
  /*background-color: #F6EDE4;*/
}

/* rollover mass menu titel */
.massMenu > table table tr:first-child td:hover {
  /*background-color: #95B7DC;*/
}

.massMenu .left-mass-menue-table td.main_nav,
.massMenu .right-mass-menue-table td.main_nav {
  padding-left: 0 !important; /* überschreibt die style-property */
  padding-right: 0 !important; /* überschreibt die style-property */
}

.massMenu a,
.massMenu a:link,
.massMenu a:visited,
.massMenu a:hover {
  display: block;
  text-decoration: none;
  padding: 5px 10px 5px 10px;
  font-size: var(--design-editor-cms-nav-font-size);
  font-family: var(--design-editor-cms-nav-font-family);
}

/* ########################################################################## */
/* cms typen und custom properties                                            */
/* ########################################################################## */


/* -------------------------------------------------------------------------- */
/* dashboard panels                                                           */
/* -------------------------------------------------------------------------- */

.dashboard {
  --jes-dashboard-color: var(--jes-dashboard-color, #fff);
  --jes-dashboard-bgcolor: var(--jes-dashboard-bgcolor, #2D2F40);
  --jes-dashboard-border: var(--jes-dashboard-border, 0);

  border: var(--jes-dashboard-border);
  border-collapse: separate;
  border-radius: 10px;
  -webkit-background-origin: border !important;
  -moz-background-origin: border !important;
  background-origin: border-box !important;
  background: var(--jes-dashboard-bgcolor);
  box-shadow: 1px 1px 2px 0px rgba(196,196,196,1);
  padding: 0.3em 1em 0.3em 1em;
  margin: 0 auto;
  color: var(--jes-dashboard-color);
  min-height: 115px;
}

.dashboard-lightgrey {
  --jes-dashboard-color: #000;
  --jes-dashboard-bgcolor: #E9E9E9;
  --jes-dashboard-border: 1px solid #cfcfcf;
}

.dashboard-graphite {
  --jes-dashboard-color: #fff;
  --jes-dashboard-bgcolor: #2D2F40;
  --jes-dashboard-border: 1px solid #272a37;
}

.dashboard-white {
  --jes-dashboard-color: #000;
  --jes-dashboard-bgcolor: #fff;
  --jes-dashboard-border: 1px solid #ededed;
}

.dashboard-blue {
  --jes-dashboard-color: #fff;
  --jes-dashboard-bgcolor: #0960AB;
  --jes-dashboard-border: 1px solid #08589B;
}

.dashboard-green {
  --jes-dashboard-color: #fff;
  --jes-dashboard-bgcolor: #70ab09;
  --jes-dashboard-border: 1px solid #659A07;
}

.dashboard-petrol {
  --jes-dashboard-color: #fff;
  background: linear-gradient(45deg, #789f90, #a96894);
  --jes-dashboard-border: 1px soild #5F6362FF;
}

.dashboard h3 {
  color: var(--jes-dashboard-color) !important;
}


/* -------------------------------------------------------------------------- */
/* suchfeld (artikelsuche)                                                    */
/* -------------------------------------------------------------------------- */

.navbar-search {
  display: none;
}

/* farbe des icons */
.has-search .form-control-feedback {
  right: initial;
  left: 0;
  color: var(--design-editor-search-field-color);
}

.has-search .form-control {
  padding-right: 12px !important;
  padding-left: 34px !important;
}

/* "desk" margins für input[type="text"] in navbar zurücksetzen */
.has-search input[type="text"] {
  margin: initial;
}

.navbar input.suchfeld {
  width: 16em !important; /* breite des suchfeldes in navbar */
  background-color: var(--design-editor-search-field-background-color);
  color: var(--design-editor-search-field-color);
}

.sidebar-search {
  display: block;
  padding: 15px 15px 5px; /* wenn in sidebar und mit borders, dann 10px 10px 5px */
}

#articleListing .sidebar-search {
  padding: 0 0 10px 0;
}
#articleListing .has-search {
  border: 1px solid var(--jes-al-control-border-color);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 0 !important;
}

.sidebar-search .suchfeld {
  width: 100%;
  background-color: var(--design-editor-search-field-background-color);
  color: var(--design-editor-search-field-color);
}

.sidebar-search .has-search {
  width: 100%;
}
/* --------------------- */



/* Aenderung der Navigationen */
.borderBox,
.topNav #head-nav-table li a {
  /*-webkit-box-sizing: border-box;*/
  /*-moz-box-sizing: border-box;*/
  /*box-sizing: border-box;*/
}

/* Obere Navigation */

/* Linke Navigation */
.subNav .subNavWrapper ul li {
  /*position: relative;*/
  /*padding: 10px 20px 10px 10px;*/
  /*-webkit-transition: all 0.25s ease-in-out;*/
  /*-moz-transition: all 0.25s ease-in-out;*/
  /*-o-transition: all 0.25s ease-in-out;*/
  /*transition: all 0.25s ease-in-out;*/
  /*background: var(--jes-subnav-nav-background-color);*/
  /*display: block;*/
  /*font-family: var(--design-editor-font-family) !important;*/
  /*font-size: var(--jes-subnav-nav-font-size);*/
}

.subNav .subNavWrapper ul li:first-child,
.subNav .subNavWrapper ul li.first,
.subNav .subNavWrapper ul li:last-child,
.subNav .subNavWrapper ul li.last {
  /*margin: 0;*/
}

.subNav .subNavWrapper ul li a.link-of-head-nav {
  /*-webkit-transition: all 0.25s ease-in-out;*/
  /*-moz-transition: all 0.25s ease-in-out;*/
  /*-o-transition: all 0.25s ease-in-out;*/
  /*transition: all 0.25s ease-in-out;*/
}

.subNav .subNavWrapper ul li a:after {
  /*  font-size: 10px;*/
  /*  font-weight: 300;*/
  /*  font-family: "FontAwesome";*/
  /*  content: "\f054";*/
  /*  position: absolute;*/
  /*  right: 10px;*/
  /*  top: 50%;*/
  /*  margin-top: -8px;*/
}

/* Obere Navigation - Farben */

/* Linke Navigation - Farben */
.subNav .subNavWrapper ul li a.link-of-head-nav {
  /* Linkfarbe Standard */
  /*color: var(--jes-subnav-nav-color);*/
}

.subNav .subNavWrapper ul li a.active {
  /* Linkfarbe aktiv */
  /*color: var(--jes-subnav-nav-color-active);*/
}

.subNav .subNavWrapper ul li.nav_active {
  /* Farbe fuer Navigationselement aktiv */
  /*background: var(--jes-subnav-nav-background-color-active);*/
}

.subNav .subNavWrapper ul li:hover {
  /* Farbe fuer Navigations elemente Mouseover */
  /*background: var(--jes-subnav-nav-background-color-hover);*/
}

.subNav .subNavWrapper ul li:hover a.link-of-head-nav {
  /* Linkfarbe bei Mouseover */
  /*color: var(--jes-subnav-nav-color-hover);*/
}

/* border und padding entfernen in artikelgruppen-text oberhalb der artikelliste */
.listing-head {
  padding: 0 !important;
  border: none !important;
}

/* Responsive Änderungen */

/* ID-Konto */
.id-cash-out,
.de-dt-create,
.cash-out-status,
.amount {
  padding-right: 2em;
}


.background-image-div {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100% !important;
  margin: auto;
}

.wrapper {
  width: 100%;
}


/* Responsive Tables / iFrame */
.content.container-fluid {
  width: 100%;
  overflow-y: auto; /*fixme*/
  overflow: hidden; /*fixme Property overflow overwrites property overflow-y! */
  /* margin: 0 0 1em 1em; */
}


/* Artikel Darstellung - Responsive Anpassungen  */

/* content-container im iframe/popup */
div.info_content,
div.customer-register-container {
  padding: 15px;
}

h1.info_error {
  /*  font-size: 18px !important;*/
  margin: 0;
}

/* -------------------------------------------------------------------------- */
/* ARTCILE LIST                                                               */
/* -------------------------------------------------------------------------- */
.mv2-article {
  background-color: var(--jes-al-bg-color, #ffffff);
}

/* bereich für name und beschreibung */
.mv2-article-name-wrapper {
  grid-area: name-wrapper;
  text-align: center;
  width: 100%;
}

.mv2-article-picture {
  grid-area: picture;
}

/* article container 3/3, der preis und andere elemente enthalten kann */
.mv2-price-actions-wrapper {
  display: grid;
  grid-area: actions-wrapper;
  height: 100%;
}

.mv2-article-unit-price {
  grid-area: unit-price;
  font-size: 11px;
  color: var(--design-editor-price-color);
  align-self: end;
}

/* -------------------------------------------------------------------------- */
/* ARTCILE LIST GRID                                                          */
/* -------------------------------------------------------------------------- */

/* Merkzettel */

.mv2 .mv2-articleListing .mv2-info-row .mv2-info-value input {
  text-align: center;
}

.add_to_cart_direct_sum {
  margin-left: 1em;
}

/* Merkzettel Ende */

/* grid-fix! */
.mv2 .mv2-listing-grid::before,
.mv2 .mv2-listing-grid:after {
  content: none;
}

.mv2-listing-grid .mv2-article-unit-price {
  text-align: center;
}

/* area price-actions-wrapper */
.mv2 .mv2-listing-grid .mv2-price-actions-wrapper {
  grid-template: "stock-status" min-content "uvp" 0 /*20px*/ "price" auto "unit-price" 12px "actions" auto;
  overflow: hidden;
  padding: 10px;
}

.mv2 .mv2-listing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--jes-algrid-art-min-width, 200px), 1fr));
  grid-template-areas: "article";
  grid-auto-flow: dense;
  /* grid-auto-rows ausblenden, damit alle Elemente in der Liste angezeigt werden */
  /* grid-auto-rows: var(--jes-algrid-art-height, 320px); */
  row-gap: 15px;
  column-gap: 15px;
  margin-bottom: 15px;
}

/* form, welches die 3 artikel elemente beinhaltet
  ┌─────────────────┐
  │ picture         │
  ├─────────────────┤
  │ name-wrapper    │
  ├─────────────────┤
  │ actions-wrapper │
  └─────────────────┘
*/
.mv2 .mv2-listing-grid .mv2-article > form {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 120px 100px 1fr;
  gap: 0px 0px;
  grid-template-areas: "picture" "name-wrapper" "actions-wrapper";
  grid-area: Article;
  width: 100%;
  height: 100%;
}

/* artikelbild im link */
.mv2 .mv2-listing-grid .mv2-article-picture img {
  max-height: 100%;
  object-fit: cover;
  object-position: center;
  height: 100%;
  border-radius: 4px;
}

/* behälter für stock-status, name und kurzbeschreibung
  ┌─────────────────┐
  │ picture         │
  ├─────────────────┤
  │ name-wrapper    │ <-- i am here
  ├─────────────────┤
  │ actions-wrapper │
  └─────────────────┘
 */
.mv2 .mv2-listing-grid .mv2-article-name-wrapper {
  padding: 0 10px; /* base-fix */
}

/* artikel-preis mit optionalem behälter für zusatztext */
.mv2 .mv2-listing-grid .mv2-article-price {
  width: 100%;
  text-align: center;
  font-size: 1.3em;
  font-weight: normal;
  color: var(--design-editor-price-color);
  margin: 0; /* main-fix */
  align-self: end;
  grid-area: price;
}

/* "verfügbar..." */
.mv2 .mv2-listing-grid .stock_status {
  /*position: absolute;*/
  /*top: calc(var(--jes-algrid-image-block-height) + 5px);*/
  width: 100%;
  text-align: center;
  display: block;
  font-size: 11px;
  /*padding-top: 4px;*/
  /*padding-bottom: 4px;*/
}

/* artikel-liste grid: einzelner artikel */
.mv2 .mv2-articleListing.mv2-listing-grid .mv2-article {
  width: unset;
  margin: unset;
  display: block;
  float: unset;
  height: unset;
  padding: unset;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
}

/* base-fix (unpassend) */
.mv2 .mv2-padding-s {
  padding: 0;
}

.mv2 .mv2-articleListing.mv2-listing-grid .mv2-article-picture {
  height: var(--jes-algrid-image-block-height, 128px);
  width: 100%;
  text-align: center;
  position: relative;
  padding: 0;
}

.mv2 .mv2-articleListing.mv2-listing-grid .mv2-article-picture .mv2-article-picture-inner {
  width: auto;
  height: 100%;
  padding: 10px;
}

/* "Sie sparen..." */
.mv2 .mv2-articleListing.mv2-listing-grid .mv2-article-price-uvp,
.mv2 .mv2-articleListing.mv2-listing-list .mv2-article-price-uvp {
  /* wenn oberhalb des preises: */
  /*margin-left: auto;*/
  /*margin-right: auto;*/

  /* wenn als sticker im bild links oben: */
  position: absolute;
  top: 15px; /* bild oberkante ist 10px */
  border-radius: 0;
  clip-path: polygon(0 0,100% 0,73% 100%,0 100%);
  -webkit-clip-path: polygon(0 0,100% 0,73% 100%,0 100%);
  font-style: italic;
  padding-right: 12px;
  padding-left: 4px;
  font-weight: 800;
  background-color: var(--design-editor-price-color);
  color: #ffffff;
}

/* -------------------------------------------------------------------------- */
/* ARTCILE LIST                                                               */
/* -------------------------------------------------------------------------- */

.mv2 .mv2-listing-list::before,
.mv2 .mv2-listing-list:after {
  content: none;
}

/* artikelliste als grid
   ┌──────────┬────────────────┬─────────────────┐
   │ picture  │ name-wrapper   │ actions-wrapper │ <-- article 1
   └──────────┴────────────────┴─────────────────┘
   ┌──────────┬────────────────┬─────────────────┐
   │ picture  │ name-wrapper   │ actions-wrapper │ <-- article 2
   └──────────┴────────────────┴─────────────────┘
   ┌──────────┬────────────────┬─────────────────┐
   │ picture  │ name-wrapper   │ actions-wrapper │ <-- article …
   └──────────┴────────────────┴─────────────────┘
*/
.mv2 .mv2-articleListing.mv2-listing-list {
  display: grid;
  grid-row-gap: 15px;
  grid-template-rows: 1fr;
}

/* artikel-container
   ╭╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╮
   ┊ ┌──────────┬────────────────┬─────────────────┐ ┊
   ┊ │ picture  │ name-wrapper   │ actions-wrapper │ ┊
   ┊ └──────────┴────────────────┴─────────────────┘ ┊
   ╰╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╯
*/
.mv2 .mv2-articleListing.mv2-listing-list .mv2-article {
  height: unset; /* main-fix */
  border: 1px solid var(--design-editor-border-color);
  border-radius: 4px;
  margin-bottom: initial;
  background-color: var(--jes-al-bg-color, #ffffff);
}

/* form-element als grid
   ┌──────────┬────────────────┬─────────────────┐
   │ picture  │ name-wrapper   │ actions-wrapper │
   └──────────┴────────────────┴─────────────────┘
*/
.mv2 .mv2-articleListing.mv2-listing-list .mv2-article form {
  display: grid;
  grid-template-columns: 170px 1fr 180px;
  grid-template-areas: "picture name-wrapper actions-wrapper";
  grid-template-rows: var(--jes-al-art-height, 190px);
  grid-column-gap: 0;
  grid-row-gap: 0;
  gap: 0;
  height: 100%;
}



/* liste, image container links */
.mv2 .mv2-articleListing.mv2-listing-list .mv2-article-picture {
  /*background-color: #e1e9ff;*/
  width: 100%;
  border-radius: 4px 0 0 4px;
  padding: 0;
  overflow: clip;
}

.mv2 .mv2-articleListing.mv2-listing-list .mv2-article-picture .mv2-article-picture-inner {
  padding: 10px;
  width: auto;
}

.mv2 .mv2-articleListing.mv2-listing-list .mv2-article-picture img {
  object-fit: cover;
  object-position: center;
  height: 100%;
  overflow: clip;
  border-radius: 4px;
}

.mv2 .mv2-articleListing.mv2-listing-list .mv2-article-name-wrapper .mv2-article-name {
  margin-bottom: unset; /* main-fix */
}

/* name-wrapper, text linksbündig
   ┌──────────┬────────────────┬─────────────────┐
   │ picture  │ name-wrapper   │ actions-wrapper │
   └──────────┴────────────────┴─────────────────┘
                      ↑
                  i am here
*/
.mv2 .mv2-articleListing.mv2-listing-list .mv2-article-name-wrapper {
  width: 100%; /* base-fix */
  padding: 10px 10px 10px 0; /* base-fix */
  text-align: left;
}

/* rechter block, area "actions-wrapper"
  ┌─────────────────────────┐
  │ stock-status            │
  ├─────────────────────────┤
  │ uvp                     │
  ├─────────────────────────┤
  │ price                   │
  ├─────────────────────────┤
  │ unit price              │
  ├─────────────────────────┤
  │ actions                 │
  └─────────────────────────┘
*/
.mv2 .mv2-articleListing.mv2-listing-list .mv2-price-actions-wrapper {
  display: grid;
  grid-template:
      "stock-status" min-content /*20px*/
      "uvp" min-content /*20px*/
      "price" auto
      "unit-price" min-content
      "actions" auto;
  padding: 10px;
  width: 100%;
  border-radius: 0 4px 4px 0; /* rechts oben und rechts unten runde ecken */
  float: initial;
  position: initial;
  overflow: hidden;
}

/* stock-image in area "actions-wrapper"
  ┌─────────────────────────┐
  │ stock-status            │ ← i am here
  ├─────────────────────────┤
  │ uvp                     │
  ├─────────────────────────┤
  │ price                   │
  ├─────────────────────────┤
  │ unit price              │
  ├─────────────────────────┤
  │ actions                 │
  └─────────────────────────┘
*/
.mv2 .mv2-articleListing.mv2-listing-list .stock_status {
  position: initial;
  align-self: start;
  font-size: 11px;
  grid-area: stock-status;
}

/* preis in area "actions-wrapper"
  ┌─────────────────────────┐
  │ stock-status            │
  ├─────────────────────────┤
  │ uvp                     │
  ├─────────────────────────┤
  │ price                   │ <----- i am here
  ├─────────────────────────┤
  │ unit price              │
  ├─────────────────────────┤
  │ actions                 │
  └─────────────────────────┘
*/
.mv2 .mv2-articleListing.mv2-listing-list .mv2-article-price {
  font-size: 1.75em;
  font-weight: normal;
  color: var(--design-editor-price-color);
  align-self: end;
  grid-area: price;
}



/* höhe aller container (base-fix) */
.mv2 .mv2-articleListing.mv2-listing-list .mv2-article-picture,
.mv2 .mv2-articleListing.mv2-listing-list .mv2-article-name-wrapper,
.mv2 .mv2-articleListing.mv2-listing-list .mv2-price-actions-wrapper {
  height: initial;
}

/* liste, button container */
.mv2 .mv2-articleListing.mv2-listing-list .mv2-price-actions-wrapper .mv2-actions-container {
  padding: 0;
  position: unset;
  bottom: unset;
  left: unset;
  align-self: end;
  grid-area: actions;
}

.mv2 .mv2-articleListing.mv2-listing-list .mv2-button-inner {
  text-align: left;
  padding:0;
  margin: 0;
}


/* -------------------------------------------------------------------------- */
/* ARTCILE DETAILS                                                            */
/* -------------------------------------------------------------------------- */

.mv2 .mv2-article-details .mv2-article-picture {
  width: 100% !important;
  text-align: center;
  overflow: hidden;
}

.mv2 .mv2-article-details .mv2-details-wrapper-back {
  margin-bottom: 2em;
}

.mv2 .mv2-details-wrapper-top {
  margin-bottom: 2em;
}




/* Ampel Artikeldetails */
.mv2 .mv2-article-details #stock_image {
  position: relative;
  margin-top: 25px;
  margin-right: 1em;
}

.mv2 .mv2-article-details .mv2-art-name {
  /*  font-size: 1.7em !important;*/
  font-weight: 500;
  margin: 0px 0px 1em;
  padding: 0px 0px 0.25em;
  border-bottom: 1px solid #dfdfdf;
}

/* Attribute und Info Artikeldetailansicht Gruppen Artikel-Details */

.mv2 .mv2-article-details .mv2-info-row .mv2-info-label {
  width: 20%;
}

.mv2 .mv2-article-details .mv2-info-row .mv2-info-value {
  width: 80%;
}

.mv2 .mv2-article-details .mv2-article-info .mv2-attribute-select {
  width: 80%;
}

.mv2 .mv2-article-details .mv2-article-info {
  border-bottom: solid 1px #d9aeae;
  margin-bottom: 1em;
  padding-bottom: 1em;
}

/* Button in der Artikeldetailansicht runtersetzen, damit man überhaupt was sieht - JO 20.07.2016 */
.mv2 .mv2-article-details .mv2-detail-actions {
  margin-top: 1em;
}

/* -------------------------------------------------------------------------- */
/* ARTCILE COMMON                                                             */
/* -------------------------------------------------------------------------- */

.mv2 .mv2-article-price-uvp {
  background-color: #28a745;
  min-width: 10px;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  border-radius: 10px;
  align-self: start;
  grid-area: uvp;
}

.mv2 .mv2-articleListing .mv2-article-picture a:focus {
  outline: none;
}

/* artikel behälter */
.mv2 mv2-frame {
  background-color: var(--jes-al-bg-color, #ffffff);
}






.mv2 .mv2-articleListing .mv2-actions-container {
  margin-left: auto;
  margin-right: auto;
  position: initial;
  align-self: end;
  grid-area: actions;
}

.mv2 .mv2-articleListing .mv2-article-name-link {
  /*height: 2.8em;*/
  /*overflow: hidden;*/
  /*text-overflow: ellipsis !important;*/
  /*font-weight: normal !important;*/
  /*display: block;*/
}


.mv2 .mv2-articleListing .mv2-article-price .info-text-article-price {
  /* background-color: #fff !important; */
  color: lightgray;
  font-size: calc(var(--design-editor-content-font-size) * .8);
  font-weight: normal;
  margin-top: -3px;
}


.mv2 .mv2-actions-container > a {
  display: none;
}


.mv2 .mv2-articleListing .mv2-article-description {
  font-size: 12px;
  color: #b3b3b3;
  line-height: 1.3em;
  height: calc(var(--jes-al-desc-lines, 3) * 1.3em) !important;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: var(--jes-al-desc-lines, 3);
  -webkit-box-orient: vertical;
}

.stock_status_0_2 {
  color: #61C74A;
}

.stock_status_1_2 {
  color: #2BAFA3;
}

.stock_status_2_2 {
  color: #CF9C39;
}

.stock_status_3_2 {
  color: #CA4D64;
}

.stock_status_1_2::before,
.stock_status_3_2::before,
.stock_status_0_2::before {
  content: '\25A0  ';
}

/* artikelname */
.mv2 .mv2-articleListing h2.mv2-article-name {
  font-weight: normal;
  /*  font-size: 1.5em !important;*/
  margin: 0 0 0.25em;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  color: var(--design-editor-article-link-regular);
  display: -webkit-box;
  -webkit-line-clamp: 2; /* anzahl zeilen */
  -webkit-box-orient: vertical;
}

.mv2 .mv2-articleListing h2.mv2-article-name:hover {
  color: var(--design-editor-article-link-hover);
}

/* Infotext unterhalb vom Preis */
.info-text-article-price {
  /*  font-size: 0.7em !important;*/
  color: #292d21;
}

.mv2 .mv2-button {
  background-color: transparent;
  background-image: unset;
  margin-top: 0;
  width: 100%;
  /* width: unset; */
  margin-bottom: 1em;
}

.mv2 .mv2-button:hover {
  background-color: unset;
  border: none;
}

.mv2 .mv2-button-primary {
  background-color: #10265c !important;
  border-radius: 3px;
  text-decoration: none !important;
}

.mv2 .mv2-button-primary:hover {
  /* background-color: #10265c !important; */
  background-color: #5B8B2E !important;
}

.mv2 .mv2-button .mv2-button-inner {
  /* width: auto !important; */
  background: var(--design-editor-add-to-shopping-cart-color);
  color: var(--design-editor-button-color);
  margin-left: auto;
  margin-right: auto;
  line-height: 1;
  /* padding: 6px 12px !important; */
  font-size: 1em;
  border: 1px solid var(--jes-shopping-cart-button-border-color, var(--design-editor-add-to-shopping-cart-color));
}

.mv2 .mv2-button .mv2-button-inner:hover {
  color: #fff !important;
  background-color: #5B8B2E;
  border-color: #527D2A;
}

.mv2 .mv2-button.mv2-button-big .mv2-button-inner {
  /*background-color: #767b85;*/
  background-image: linear-gradient(rgba(255, 255, 255, 0.1) 0%,
  rgba(255, 255, 255, 0.25) 50%,
  transparent 51%,
  transparent 100%); /*fixme*/
  /* background: transparent url("/media/icons/articles/arrow-right-white.png") no-repeat scroll 95% 50%; */
  background: unset;
}

.mv2 .mv2-button-inner, .mv2 .mv2-button-primary-inner {
  text-align: center !important;
}

.mv2 .mv2-button.mv2-button-big .mv2-button-inner:hover {
  /* background: transparent url("/media/icons/articles/arrow-right-white.png") no-repeat scroll 95% 50%; */
  color: #fff !important;
}

.mv2 .mv2-button.mv2-button-big .mv2-button-inner {
  padding: 0.6em;
  margin: 0px !important;
}

.mv2-button-inner:hover {
  color: #fff !important; /*fixme*/
}

/* ########################################################################## */

#fancybox-inner {
  position: absolute;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0;
  margin: 0;
  outline: none;
  overflow: hidden;
}

/* ungut! */
ul,
ol {
  margin-top: 0px;
  margin-bottom: 0px !important;
  /*company.css: 10px */
}







/** Ende Attribute und Info **/

.mv2 .mv2-info-label,
.mv2 .mv2-info-value {
  color: #292d21;
}

.mv2 .mv2-tabs-tabs li.selected a,
.mv2 .mv2-tabs-tabs li.selected a:link,
.mv2 .mv2-tabs-tabs li.selected a:visited {
  color: #292d21;
}

.mv2 .mv2-tabs-tabs li.selected {
  background-image: linear-gradient(#fafafa, #ebebeb);
  margin-top: 0px;
}

.mv2 .mv2-tabs-tabs li.selected:hover {
  background-color: #e1e1e1;
}

.mv2 .mv2-tabs-tabs li {
  display: inline-block;
  margin-top: 0.8em;
  margin-right: 0.5em;
  position: relative;
  top: 1px;
  background-image: none;
  padding: 1em;
}

.mv2 .mv2-tabs-tabs li:hover {
  background-image: linear-gradient(#fafafa, #ebebeb);
}




/* -------------------------------------------------------------------------- */
/* artikelliste, paginator                                                    */
/* -------------------------------------------------------------------------- */

/* "doppelten rahmen" um buttons verhindern */
.mv2 .mv2-control .mv2-paginator span,
.mv2 .mv2-control .mv2-paginator a {
  margin: 0 0 0 -1px;
  border-radius: 0;
  text-decoration: none;
  height: 21px;
  line-height: 18px !important;
  font-size: 14px;
  color: var(--design-editor-content-color);
}

/* prev- und next-buttons sichtbar machen, default ausgeblendet */
.mv2 .mv2-control .mv2-paginator span.next,
.mv2 .mv2-control .mv2-paginator span.prev {
  display: inline-block;
  background-color: transparent !important;
  color: var(--design-editor-navbar-color) !important;
}

/* ersten button links abgerundet */
div.mv2-paginator-inner > :first-child {
  margin-left: 0 !important;
  border-top-left-radius: 4px !important;
  border-bottom-left-radius: 4px !important;
}

/* letzten button rechts abgerundet */
.mv2-paginator-inner > :last-child {
  border-top-right-radius: 4px !important;
  border-bottom-right-radius: 4px !important;
}

/* aktuelle seite */
.mv2 .mv2-control .mv2-paginator span.current {
  background-color:var(--jes-al-control-active-bgcolor, var(--design-editor-navbar-background));
  color:var(--jes-al-control-active-color, var(--design-editor-navbar-hover-color));
}

/* seitensteuerung hover */
.mv2 .mv2-control .mv2-paginator a:hover {
  color: unset;
  border-color: unset;
  background-color: var(--jes-al-control-hover-bgcolor, #f2f2f2);
}

/* paginator enthält keine links? ausblenden! */
.mv2-control-line.line-2:not(:has(.mv2-paginator-inner > a)) {
  display: none !important;
}

/* -------------------------------------------------------------------------- */
/* artikelliste, steuerungs-elemente oben und unten */
/* -------------------------------------------------------------------------- */

.mv2-control {
  background-color: #ffffff !important;
  padding: 10px !important;
  border: 1px solid var(--design-editor-border-color) !important;
  border-radius: 4px !important;
}

.mv2 .mv2-control select,
.mv2 .mv2-control .mv2-control-view .mv2-view-switch,
.mv2 .mv2-control .mv2-paginator span,
.mv2 .mv2-control .mv2-paginator a {
  border-color: var(--jes-al-control-border-color, var(--design-editor-border-color));
}

.mv2-control .mv2-label {
  display: block !important;  /* overwrite */
  font-weight: 300 !important; /* overwrite */
  font-size: 11px;
  height: initial !important;  /* overwrite */
  float: initial !important;  /* overwrite */
  line-height: initial !important; /* overwrite */
  margin: 0 !important; /* overwrite */
  padding-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mv2 .mv2-control .mv2-control-view {
  text-align: left;
}

.mv2 .mv2-control .mv2-control-line.line-1 {
  display: grid;
  grid-template-areas: "sorting view per-page";
  grid-template-columns: max-content minmax(max-content, 1fr)  minmax(50px, min-content);
  border-bottom: 0; /* main-fix */
  padding-bottom: 0; /* main-fix */
  gap: 0 10px;
  column-gap: 10px;
  /*max-width: 100%;*/
}

/* paginator und page-anzeige  */
.mv2 .mv2-control .mv2-control-line.line-2::before {
  display: none; /* grid-fix! */
}

.mv2 .mv2-control .mv2-control-line.line-2 {
  padding: 0;
  display: grid;
  grid-template-columns: 1fr max-content;
}

.mv2 .mv2-control .mv2-paginator {
  width: initial;
}

.mv2 .mv2-control select {
  border-radius: 4px;
  padding: 2px 0 2px 4px;
  font-size: 12px;
}

.mv2 .mv2-control .mv2-page-information {
  width: initial; /* base-fix */
  align-content: end; /* ausrichtung unten */
}

.mv2-control-sorting {
  grid-area: sorting;
  width: unset !important;
}
.mv2-control-view {
  grid-area: view;
  width: unset !important;
}

.mv2 .mv2-control .mv2-control-view .mv2-view-switch {
  background-image: none;
}

.mv2 .mv2-control .mv2-control-view .mv2-view-grid span {
  background-image: url(/media/icons/svg/grid.svg);
  background-size: 14px 14px;
  background-position: center;
  margin: 0;
}

.mv2 .mv2-control .mv2-control-view .mv2-view-list span {
  background-image: url(/media/icons/svg/view-list.svg);
  background-size: 14px 14px;
  margin: 0;
  background-position: center;
}

.mv2-view-active {
  background-image: none !important;
  background-color: var(--jes-al-control-active-bgcolor, var(--design-editor-navbar-background)) !important;
  color: var(--jes-al-control-active-color) !important;
}

.mv2 .mv2-control .mv2-control-view .mv2-view-switch.mv2-view-grid {
  margin: 0 !important;
  border-radius: 4px 0 0 4px;
  height: 21px;
}
.mv2 .mv2-control .mv2-control-view .mv2-view-switch.mv2-view-list {
  margin: 0 0 0 -1px;
  border-radius:  0 4px 4px 0 ;
  height: 21px;
}

.mv2-control-countPerPage {
  grid-area: per-page;
  width: unset !important;
}

/* -------------------------------------------------------------------------- */
/* artikel-liste, loading-layer */
/* -------------------------------------------------------------------------- */

/* loading-layer nicht anzeigen */
.mv2-loading-layer {
  display: none;
}

/* -------------------------------------------------------------------------- */

.article-details-name {
  /*  font-size: 30px;*/
  font-weight: 300 !important;
  /*font-family: Raleway, sans-serif;*/
  color: #5c5c5c;/*fixme*/
}

/* was ist das? */
#photos.galleryview,
ul.filmstrip {
  background: white !important;/*fixme*/
}
/* was ist das? */
#pointer {
  border: 0px solid rgba(136, 136, 136, 0) !important;/*fixme*/
}






/* -------------------------------------------------------------------------- */
/* WARENKORB                                                                  */
/* -------------------------------------------------------------------------- */


#cb2 .voucher_input,
#cb2 .voucher {
  padding: 5px 0 0 0;
}

#cb2 .voucher_input input {
  width: 100%;
}

/* eingabefelder und date-fields für abo im warenkorb */
input.date-pick {
  width: 150px; /* base-fix */
  margin-left: 0;
  font-size: unset;
  padding: 5px 10px;
  display: inline;
}

/* abo-auswahlfeld */
select.date-pick {
  font-size: unset;
  display: inline;
  padding: 5px 10px;
  width: auto !important;
}

/* abo-options block */
#cb2 div.abo_options {
  padding-left: 0;
}

#cb2 table.abo_options td,
#cb2 table.abo_options th {
  padding-left: 0 !important;
  font-weight: normal;
}

/* einzelner warenkorb-container mit positionen */
#cb2 .basket {
  padding: 15px;  /* wenn als card, ansonsten 0 */
  background-color: var(--jes-cart-background-color, transparent);
  border-radius: 4px;
  border: var(--jes-cart-border, 0);
  margin-bottom: 15px;
}
/************ Warenkorb Überschrift neu**********************/

#cb2 .basket .vendor_inner_inactive {
  background-color: transparent !important;
  border-bottom: 2px #d1d2d5 solid !important;/*fixme*/
}

#cb2 .basket .vendor {
  background-color: transparent;
  /*border-bottom: 2px #d1d2d5 solid;*//*fixme*/
  background-image: unset; /* base-fix, wk icon ausblenden*/
  background-position: unset; /* base-fix */
  background-repeat: unset; /* base-fix */
  padding-left: 0; /* icon padding entfernen */
  cursor: default;
  display: block;
  height: unset; /* base-fix */
}

/* titel-zeile pro warenkorb: icon zum einklappen entfernen, cursor default */
#cb2 .basket .vendor_inner {
  background-color: transparent;/*fixme*/
  color: var(--design-editor-header-color);
  /*padding-left: 5px;*/
  background-image: unset; /* base-fix */
  cursor: default;
  padding-left: 0; /* überschrfit "warenkorb" links ohne padding! */
  height: initial; /* base-fix */
  border-top: 0; /* base-fix */
  border-bottom: 0; /* base-fix */
  font-weight: initial; /* base-fix */;
  font-size: 125%;
  margin-bottom: 15px;
}


/* Warenkorb Artikel bestellen */








/* Überschriften Positionen */
#cb2 .basket .positions th {
  /*  font-size: 14px;*/
  font-weight: 600;
  text-align: right;
}


/* -------------------------------------------------------------------------- */
/* sidebar cart (kleiner Warenkorb)                                           */
/* -------------------------------------------------------------------------- */

/* base-fix */
table.shopping-cart-right-side,
table.shopping-cart-right-side-inner {
  width: 100% !important;
}

.shopping_cart .cartVatHint::first-letter {
  margin-left: -10px;
}

.shopping_cart {
  --dimmed-text-color: color-mix(in srgb, var(--design-editor-cms-nav-background-color), var(--design-editor-cms-nav-color) 70%);
  border-bottom: 1px dotted var(--dimmed-text-color);
  color: var(--dimmed-text-color, var(--design-editor-cms-nav-color));
  font-family: var(--design-editor-cms-nav-font-family);
  font-size: calc(var(--design-editor-cms-nav-font-size) * 0.9);
  font-weight: 300;
  vertical-align: bottom;
  padding: 5px 10px 5px 10px;
}

.cms-shopping-cart-side-td-of-column-right-table {
  padding: 10px;
}

/* in den summenspalten alle elemente als block-elemente, damit die texte mit
   den zugehörigen summen ausgerichtet sind */
td.shopping_cart > * {
  display: block;
}

.shoppingCart a {
  display: inline-block;
}

/* titel sidebar warenkorb (td) */
section.shoppingCart .small_headline {
  border-bottom: none;
  padding: 0;
  color: var(--design-editor-cms-nav-title-color);
}

/* titel-block des sidebar warenkorbs (span) */
.shoppingCart .small_headline span {
  display: block;
  padding: 10px 10px 5px 10px;
  margin: -10px -10px 0 -10px;
  font-weight: normal;
  font-size: var(--design-editor-cms-nav-font-size);
  text-transform: uppercase;
  cursor: pointer;
  font-family: var(--design-editor-cms-nav-font-family);
}

/* summen-betrag sidebar cart */
.shopping_cart .label-1 nobr {
  font-size: inherit;
  color: var(--design-editor-cms-nav-color);
  padding: 0;
  font-weight: normal;
}

/* sidebar cart titel hover */
.shoppingCart .small_headline span:hover {
  color: var(--design-editor-cms-nav-hover-color);
}


section.shoppingCart .shopping_cart:first-child,
section.shoppingCart .shopping_cart:last-child {
  padding-left: 0;
  padding-right: 0;
}

/* linie unter der summenzeile entfernen */
.shopping-cart-right-side-inner tr:nth-last-of-type(2) td {
  border-bottom: 0;
}

/* erste spalte "Summe" in letzter summenzeile entfernen */
.shopping-cart-right-side-inner tr:nth-last-of-type(2) td:nth-child(1) span {
  display: none;
}

td.shopping_cart:has(.cash-box-link) {
  display:none; /* link "warenkorb" in sidebar wegblenden */
}

/* br-elemente ausblenden, da sämtliche elemente als block definiert sind */
.shopping_cart br {
  display: none;
}


/************************************************************************
 Bis hier Warenkorb
 *************************************************************************/

/* Link als Button */

.linkbutton a,
.linkbutton a:active,
.linkbutton a:visited {
  border: 1px solid #008f33;/*fixme*/
  border-collapse: separate;
  border-radius: 5px;
  -webkit-background-origin: border !important;
  -moz-background-origin: border !important;
  background-origin: border-box !important;
  background: #008f33;/*fixme*/
  box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.25);/*fixme*/
  /*  border-width: 0; */
  padding: 0.3em 1em 0.3em 1em;
  margin: 0 auto;
}

.linkbutton a,
.linkbutton a:active,
.linkbutton a:visited {
  text-decoration: none;
  /* font-size: 1em; */
  /* font-family: var(--design-editor-font-family); */
  font-weight: 500;
  font-style: normal;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  text-align: center;
  color: #fff !important;/*fixme*/
  cursor: pointer;
  text-indent: 0;
  line-height: 1.6em;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  border: 1px solid #008f33;/*fixme*/
}

.linkbutton a:hover {
  background: #666666;/*fixme*/
  box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.25);/*fixme*/
  color: #fff !important;/*fixme*/
  text-decoration: var(--design-editor-hover-text-decoration);
  border: 1px solid #008f33;/*fixme*/
}

/* Link als Button reverse */

.linkbuttonrev a,
.linkbuttonrev a:active,
.linkbuttonrev a:visited {
  border: 1px solid #008f33;/*fixme*/
  border-collapse: separate;
  border-radius: 5px;
  -webkit-background-origin: border !important;
  -moz-background-origin: border !important;
  background-origin: border-box !important;
  background: #666666;/*fixme*/
  box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.25);/*fixme*/
  /*  border-width: 0; */
  padding: 0.3em 1em 0.3em 1em;
  margin: 0 auto;
}

.linkbuttonrev a,
.linkbuttonrev a:active,
.linkbuttonrev a:visited {
  text-decoration: none;
  /* font-size: 1em; */
  /* font-family: var(--design-editor-font-family); */
  font-weight: 500;
  font-style: normal;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  text-align: center;
  color: #fff !important;/*fixme*/
  cursor: pointer;
  text-indent: 0;
  line-height: 1.6em;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  border: 1px solid #008f33;/*fixme*/
}

.linkbuttonrev a:hover {
  background: #008f33;/*fixme*/
  box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.25);/*fixme*/
  color: #fff !important;/*fixme*/
  text-decoration: none;
  border: 1px solid #008f33;/*fixme*/
}

/* Ende linkbutton */
/* Link als span-Klasse */

.linkinline a,
.linkinline a:active,
.linkinline a:visited {
  border-collapse: separate;
  border-radius: 5px;
  -webkit-background-origin: border !important;
  -moz-background-origin: border !important;
  background-origin: border-box !important;
  background: #008f33;/*fixme*/
  background-origin: padding-box;
  box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.25);/*fixme*/
  border-width: 0;
  padding: 0 0.1em;
  margin: 0 auto;
}

.linkinline a,
.linkinline a:active,
.linkinline a:visited {
  text-decoration: none;
  /*  font-size: 1em;*/
  /* font-family: var(--design-editor-font-family);*/
  font-weight: 300;
  font-style: normal;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  text-align: center;
  color: #fff !important;/*fixme*/
  cursor: pointer;
  text-indent: 0;
  line-height: 1.3em;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  border: 1px solid #008f33;/*fixme*/
}

.linkinline a:hover {
  background: #666666;/*fixme*/
  box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.25);/*fixme*/
  color: #fff !important;/*fixme*/
  text-decoration: none;
  border: 1px solid #008f33;/*fixme*/
}

/* Ende Link als span-Klasse */

/* Zwischenüberschriften Nav senkrecht (Kein Inhalt / Nur Menüpunkt) */

.subNav .subNavNoLinkItem {
  /*  font-size: 1.1em !important;*/
  background-color: #b29247 !important;/*fixme*/
  color: #fff;/*fixme*/
  font-weight: 500;
  /* font-family: var(--design-editor-font-family) !important; */
  border: solid 1px #5c5c5c;/*fixme*/
  box-shadow: 0 3px 3px 0 rgba(100, 100, 100, 0.2);/*fixme*/
}

.subNav .subNavNoLinkItem:hover {
  background-color: #008f33;/*fixme*/
}

.subNav .subNavNoLinkItem::after {
  /*  font-size: 0.7em;*/
  font-weight: 300;
  /*noinspection CssNoGenericFontName*/
  font-family: "FontAwesome";
  content: "\f078";
  position: relative;
  right: -10px;
  top: 50%;
  float: right;
  color: #fff;
}

/* ENDE */








/* Ende Anpassungen Artikellistenansicht */

body .honeycombs .hcwrapper .honeycomb-container .honeycomb-group .honeycomb .inner .heading {
  top: 0;
  /* font-family: var(--design-editor-font-family) !important; */
  /* "Helvetica Neue Roman" !important; */
  /*  font-size: 11px !important;*/
  color: #fff !important;
}

/* Bonusrechner */
.b_count {
  width: 100%;
}

.p_relat {
  width: 100%;
}

.p_absol {
  width: 100%;
}

/* FORMULARFELDER und BESCHRIFTUNGEN */


.input-field,
.select-field,
.text-area-input {
  margin-bottom: 0.5em;
}

.myaccount-input-field.submit-input {
  padding-top: 1em;
  margin-top: 0.5em;
}

.special-letter-helptext {
  padding-bottom: 1em;
}

/*Asterisk bei Formularfeldern (Pflichtfelder) hinzufuegen */

body.cashbox_2 span.label-req:after,
span.label-form-req:after,
span.label-req:after,
.required-input label:after,
.label-form-err:after {
  content: var(--jes-label-req-symbol, '*');
  color: var(--design-editor-label-req);
}


.label-form-err {
  /* font-family: var(--design-editor-font-family); */
  /*  font-size: 16px !important;*/
  color: var(--design-editor-message-error);
}

.myaccount-input-field.checkbox-input .label-field {
  display: block;
  /*none*/
}

/* Aussehen Formular-Labels (keine Pflichtfelder) */
.label,
td.label {
  /* font-family: var(--design-editor-font-family); */
  color: #292d21 !important;
  /*  font-size: 16px;*/
  padding: 0 !important;
}

.not_editable {
  padding: 5px;
  border: 1px solid gainsboro; /*fixme*/
  width: 200px;
  /*  font-size: 1em;*/
}

.width-tiny {
  width: 400px;
}

.label-form {
  font-weight: 300;
  /*font-family: var(--design-editor-font-family);*/
  /*  font-size: 14px;*/
  color: #292d21;
}

/* Border bei angeklicktem Feld */
textarea:focus,
input[type="text"]:focus,
select:focus,
.input_field:focus {
  border-color: #292d21;
}

.input_name {
  font-family: unset;
  font-weight: 300;
  /*  font-size: 14px !important;*/
  color: #808080 !important;
  padding-left: 0 !important;
}

.input-field,
.select-field,
.text-area-input {
  margin-bottom: 1em;
}

.number-separated label {
  padding: 0;
}

.input-field,
.select-field,
.text-area-input,
.info-field {
  margin-bottom: 0.5em !important;
}

.myaccount-input-field.submit-input {
  padding-top: 2em;
}

/* Infofeld im responsiven Registrierformular ausblenden */
.myaccount-input-field.text-input .info {
  display: none;
}

.label-field {
  /*font-family: var(--design-editor-font-family);*/
  /*  font-size: 14px;*/
}

.info-field {
  /* font-family: var(--design-editor-font-family); */
  /*  font-size: 1em;*/
  width: 200px;
  height: 100%;
  min-height: 30px;
  background-color: #e1e1e1;
  color: #1e1e1e;
  border: solid 1px #c2c2c2;
  padding: 5px;
  margin: 0 0 5px 0;
  border-radius: 3px;
  outline: none;
}

/* Abstand Eingabe und Selectfelder */

/*button,*/
optgroup,
select,
textarea {
  margin-bottom: 5px;
  cursor: pointer;
}

/* wenn im designeditor eine höhe eingestellt ist, aber kein content existiert */
.content-td-of-header-table:empty {
  display: none;
}

/*Adressenanzeige im Kontaktformular */
.address-box {
  padding-bottom: 2em;
}

.address-name-1 {
  padding-bottom: 0.3em;
}

.address-name {
  padding-bottom: 0.6em;
}

.address-street {
  padding-bottom: 0.3em;
}

.address-zip-location {
  padding-bottom: 0.6em;
}

.address-phone,
.address-fax {
  padding-bottom: 0.3em;
}

.adress-email {
  padding-bottom: 2em;
}

/* Dokumente hochladen */
.table-of-documents {
  width: 100%;
}

/*iphone scroll */
/* body erweitern */
html,
body {
  position: relative;
  overflow-x: hidden;
}

.dialog-header {
  border-bottom: 1px solid #ccc;
  height: 2em;
  padding: 15px;
}

#cashbox_dialog.UIDinfo_window {
  margin: 0 auto;
  left: calc((100vw - 300px) / 2) !important;
}

#cashbox_dialog.UID_login {
  left: 10% !important;
  top: 15px !important;
  right: 10% !important;
  bottom: 15px;
  max-width: 800px !important;
  width: 80% !important;
  height: 60% !important;
  margin: 0 auto;
}

#cashbox_dialog.UIDcashbox_popup {
  left: 10% !important;
  top: 15px !important;
  right: 10% !important;
  bottom: 15px; !important;
  max-width: 640px !important;
  width: 80% !important;
  height: 60% !important;
  margin: 0 auto;
  max-height: calc(100vh - 30px);
}

#cashbox_dialog.UIDpayment_dialog {
  left: 20vw !important;
  top: 15px !important;
  right: 20vw !important;
  bottom: auto;
  max-width: 450px !important;
  margin: 0 auto;
}

.modal-header > h1 {
  margin-bottom: initial;
  text-decoration: initial;
}

/* ID-Konten */
.results-table {
  width: 100%;
  max-width: 1200px;
}

.table-of-bills {
  width: 100%;
}

.table-of-bills .transaction-id,
.table-of-bills .transaction-date,
.table-of-bills .account-text,
.table-of-bills .amount-cashout-relevant {
  padding-right: 1em;
  vertical-align: top;
}

.table-of-bills .amount-cashout-relevant,
.table-of-bills .amount {
  text-align: right;
}

.sum-cash-out-amount,
.sum-amount {
  text-align: right;
  padding-right: 2em;
}

.amount {
  text-align: right;
}

/* ID-Konto Übersicht / Rechnungsliste - responsive */

/*Summen unterhalb der Buchungen ausblenden */
.sum-amount {
  display: none !important;
}

div.sum-amount {
  display: none;
}

.sum-cash-out-amount {
  display: none;
}

/* Global */
.list_of_bills,
.transaction-id,
.transaction-date,
.account-text,
.amount-cashout-relevant,
.amount {
  /*  font-size: 1em;*/
}

#filter-account-balance,
#filter-cashout-relevant {
  /*  font-size: 1.5em;*/
}

.transaction-id,
.transaction-date,
.account-text {
  padding: 5px;
  /*  font-size: 1em;*/
}

.amount-cashout-relevant,
.amount {
  padding: 5px;
  text-align: right;
  /*  font-size: 1em;*/
}



/* iframe asressauswahl */
div.address_select_container {
  width: 100%;
}
/* breite der adressenblöcke in warenkorb-adressauswahl */
div.address_selection_block {
  width: 100%;
  border-radius: 4px;
}


/* Downline Navigator */

/* Padding, wenn rechte Spalte ausgeblendet */
.downline_navigator {
  padding-right: 1em;
  background: transparent;
}

/* Abstände der Überschriften und Schriftgrößen Inhalt */
.dn_detail_bold .dn_detail_text {
  padding-top: 1em;
  padding-bottom: 0.5em;
}

.dn_address.dn_details_collapsed.has_children {
  /* font-family: var(--design-editor-font-family); */
  /*  font-size: 14px; */
}

.dn_address.dn_details_collapsed.has_children:hover {
  /*font-family: var(--design-editor-font-family);*/
  /*  font-size: 14px;*/
}

.dn_address a.dn_expand_details:hover {
  /*  font-size: 14px !important;*/
  text-decoration: var(--design-editor-hover-text-decoration);
}

/* Bilder Icons */
.dn_address a.dn_expand_details img {
  width: auto;
}

.content.col-md-12 .downline_navigator img {
  width: auto !important;
}


div.head_nav_container_inner>ul>li {
  /*    font-size: 1em;*/
}



/* fixes -------------------------------------------- */

/* warenkorb positionen tr */
#cb2 tr.pos_bg1,
#cb2 tr.pos_bg2 {
  border-top: 1px solid lightgrey;
  background-color: transparent;
}
/* warenkorb lieferkosten summe */
#cb2 .shipping_type_cost {
  text-decoration: initial;
}

/* meldung, leerer warenkorb */
#cb2 div.alert > b {
  font-weight: normal;
}

#cb2 #cash_central_pay_button td {
  display: none;
}

/* warenkorb-positionen: überschriften der ersten 3 spalten */
#cb2 .basket .positions th:nth-child(-n + 3) {
  text-align: left;
}

/* warenkorb-positionen: überschriften ab spalte 4 */
#cb2 .basket .positions th:nth-child(n + 4) {
  text-align: right; /* todo: in template align=right entfernen! */
  padding-right: 2px; /* analog zu padding-left der ersten 3 spalten! */
}

/* warenkorb-positionen: überschriften */
#cb2 .basket .positions th {
  padding-top: 10px; /* abstand zum titel */
}

/* warenkorb-positionen: plus-minus-icons für anzahl einer position */
#cb2 img.mini_plus,
#cb2 img.mini_minus {
  width: 11px;
  height: 11px;
  background-color: #fff;
  border-radius: 1px;
  border: 0;
}

/* base-css: margin von 7px */
#cb2 div.select_sub_address_link a {
  font-size: inherit;
}

/* -------------------------------------------------- */



div.cashbox_popup_content {
  padding: 15px;
}

.breadcrumb {
  background-color: var(--jes-breadcrumb-background);
}

span.confirm {
  display: block;
}

/* base-fix */
label {
  font-weight: normal;
}

/* ==========  BS3: Non-Mobile First   ========== */

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

  .two-columns {
    column-count: 2;
    column-gap: 40px;
    column-rule-style: solid;
    column-rule-width: 1px;
  }


}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {


  .two-columns {
    column-count: 1;
    column-gap: 40px;
    column-rule-style: solid;
    column-rule-width: 1px;
  }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {

}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}

/*********Ab hier passt nicht mehr die breite Ansicht**********/
@media (max-width: 1200px) {

  .content.container-fluid {
    overflow: hidden;
  }
  #cb2 form {
    display: block;
  }
  #right_box #customer_settings {
    width: 100% !important;
  }

  #right_box table {
    position: relative;
    width: 100% !important;
  }

  #left_box table {
    position: relative;
    width: 100% !important;
  }

  .topNav #head-nav-table li {
    /*padding: 0 1px !important;*/
  }

  .navbar-collapse.collapse.in {
    /*padding-bottom: 10px;*/
  }
}

/* iFrame Cashbox responsive   */

@media (max-width: 1000px) {
  .UIDwk {
    width: 97% !important;
  }

  .closeUIDwk {
    width: 30px !important;
    height: 20px !important;
    z-index: 3005;
    top: 30px !important;
    left: 100px !important;
    position: fixed;
    border: none;
    cursor: pointer;
    transform: rotate(90deg);
  }
}
@media (min-width: 992px) and (max-width: 1020px) {
  .container {
    width: 100% !important;
  }
}
@media (max-width: 992px) {
  .container {
    width: 100% !important;
    padding: 0 !important;
  }
}
@media screen and (max-width: 991px) {



  .collapsing {
    overflow: hidden !important;
  }

  /* linker container volle breite */
  .leftContainer {
    width: 100% !important;
    padding: 1em 1em 2em 10px;
  }

  /* rechter container volle breite */
  .rightContainer {
    width: 100% !important;
    padding: 1em 1em 2em 10px;
  }

  /* header-bild ausblenden */
  header {
    display: none;
  }

  .head_nav_container,
  .head_nav_container_inner {
    display: inline-block;
  }

  /* rechte spalte im warenkorb, wenn unterhalb der warenkörbe */
  #right_box:has(div.scroll):has(table) {
    margin-left: 0;
    width: 100%;
  }

  #cb2 #left_box {
    max-width: unset;
    width: 100%;
  }

  /* card für einen warenkorb-block */
  #cb2 .basket {
    width: 100%;
  }

  /* adressauswahl in modal */
  div.address_selection_block,
  div.address_select_container {
    width: 100%;
  }

  div.address_selection_block_actions {
    margin: 0;
  }
}





/* bs navbar default break point -1 */
@media screen and (max-width: 767px) {
  /* navbar warenkorb-icon in mobiler ansicht anzeigen */
  #navbar-cart-icon {
    display: inline-block;
    float: right;
    margin-top: 9px;
    margin-bottom: auto;
    cursor: pointer;
  }

  /* navbar warenkorb-icon in mobiler ansicht */
  #navbar-cart-icon > i.bi {
    font-size: 1.5em;
  }


  /* untereinträge der navbar, wenn aufgeklappot */
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: var(--design-editor-navbar-color);
  }
  /* untereinträge der navbar, wenn aufgeklappot (focus/hover) */
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover {
    color: var(--design-editor-navbar-hover-color);
  }
}
/* Warenkorb früher umbrechen bei fnc */
  @media screen and (max-width: 770px) {
  /*
  summary tabelle besteht aus tabelle, die 2 weitere tabellen in zeile 1
  beinhaltet. diese zeile als flex deklarieren …
  */
  #cb2 .summary > tbody > tr {
    display: flex;
    flex-wrap: wrap;
    column-gap: 15px;
  }

  /* lieferkosten (flex-element), siehe .summary > tbody > tr */
  #cb2 #delivery {
    width: 50%;
    flex: 1 1 auto;
  }

  /* warenkorb-summen (flex-element), siehe .summary > tbody > tr */
  #cb2 #sum {
    width: 50%;
    flex: 1 1 300px;
  }

  /* platzhalter-spalte zwischen lieferkosten und summe ausblenden, da dies mit
     column-gap eingestellt werden kann */
  #cb2 #delivery_sum_space {
    display: none;
  }

  /* warenkorb-summen, links mit abstand vor bezeichnung */
  #cb2 #sum table td {
    padding-left: 15px;
  }

  /* spalte für lieferkosten ausblenden, wenn td-element kein span enthält, da
   sonst links neben der summen-tabelle ein leerer raum angezeigt wird. */
  #cb2 .shopping_cart_block:not(:has(>span)) {
    display: none;
  }

  /* navbar - aktiver menüpunkt */
  .navbar-nav>.nav_active>a,
  .navbar-nav>.nav_active>a:focus {
    color: var(--design-editor-navbar-color);
    box-shadow:inset 5 0 0 0 var(--jes-active-nav-color);
  }

  /* border und radius entfernen */
  main {
    border-radius: 0;
    border: 0;
  }

  /* content ohne äusseren rand */
  main#mainContent {
    margin: 0;
  }

  #left_box {
    width: 100% !important;
  }

  table.positions td {
    display: block;
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  #cb2 #basket_list td {
    padding-left: 0;
  }

  /* Hide table headers (but not display: none;, for accessibility) */
  .positions thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }

  #left_box th {
    display: none !important;
  }

  #cb2 #basket_list .positions td:first-child {
    border: none;
  }

  div.sum_count_container {
    display: inline-block;
  }

  /* lösch-icon abstand von oben */
  #cb2 a.delete_x.visible-xs-inline-block {
    vertical-align: -.125em;
    margin-left: 10px;
  }



  /* hover weg… */
  #cb2 tr:hover {
    background-color: inherit !important;
  }

  div.sum_count_container {
    text-align: right;
  }

  .positions td .article_legal_notice {
    font-weight: 400;
    display: block;
    padding-left: 25%;
    white-space: break-spaces;
  }

  .positions td .basket_order_position_comments_header {
    font-weight: 400;
    /*padding: 5px;*/
    padding-left: 25%;
    display: block;
  }

  /* zeilenumbruch entfernen unter freitexte-titel, da block-element */
  .basket_order_position_comments_header + br {
    display: none;
  }

  .bfield > a[onclick*="tpl=order_comments"],
  .basket_order_position_comment_line {
    padding-left: 25%;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  /* label der positionen */
  .positions td::before {
    content: attr(data-name);
    width: 25%;
    vertical-align: top;
    text-align: left;
    font-weight: 600;
    display: block;
    float: left;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  #cb2 #basket_list {
    width: 100% !important;
  }

  #sum.shopping_cart_block {
    /* 50% (siehe oben) zerschreddert die tabelle */
    width: 100%;
  }

  #cb2 #basket_list td {
    /* innere linien in positionsliste */
    border-bottom: none;
    border-top: none;
  }

  #cb2 .basket table.summary {
    padding-left: 0;
  }

  .content.container-fluid {
    overflow: scroll;
  }

  #cb2 div.cb_container {
    float: unset; /*base-fix*/
    width: 100%;
  }

  /* summenblock unter einem warenkorb, hier wieder als tabelle */
  #sum table {
    display: table;
  }
  #sum table tr {
    display: table-row;
  }
  #sum table tr td,
  #sum table tr th {
    display: table-cell;
    white-space: nowrap;
    text-align: right;
  }
  #sum table tr th {
    display: table-cell !important;
  }
  #sum table tr th {
    color: transparent;
  }

  /* labels und options in abo-optionen */
  #cb2 table.abo_options th,
  #cb2 table.abo_options td {
    color: inherit;
    text-align: left !important;
    padding-left: 0 !important;
  }

  #sum table tbody {
    display: table-row-group;
  }
  #sum table tr >:first-child {
    width: 100%;
    text-align: right;
  }

  /* .container {
			padding-right: 5px !important;
			padding-left: 5px !important;
		} */
  /*.navbar-collapse.collapse.in {
          padding-bottom: 10px;
      }*/
  /*******************************************************
   Pop-Up Fenster
   ********************************************************/

  .cashbox_dialog {
    min-width: auto !important;
    width: auto !important;
    height: auto !important;
  }

  /* .gb_doverlay {
			height: 100% !important;
			width: 100% !important;
		} */
  h1.shopping_cart_headline {
    /*    font-size: 15px !important;*/
    /*font-weight: 600;*/
  }


  div.address_select_container {
    width: 100% !important;
  }

  /************************************************
		 Rechnungsanschrift ändern im Pop-Up Fenster
		 ************************************************/
  /* Force table to not be like tables anymore*/
  #editAddress table {
    width: 100%;
  }

  #editAddress tr {
    display: block;
    position: relative;
  }

  #editAddress td.label,
  #editAddress td.label-req {
    width: 30%;
  }

  #editAddress td.input {
    width: 50%;
  }

  /************************************************
		 Login ändern im Pop-Up Fenster
		 ************************************************/

  #cashbox_dialog.UID_login,
  #cashbox_dialog.UIDcashbox_popup {
    left: 15px !important;
    top: 15px !important;
    right: 15px !important;
    bottom: 15px !important;
    width: calc(100vw - 30px) !important;
    /*height: 60% !important;*/
    margin: 0 auto;
  }

  #cashbox_dialog.UIDpayment_dialog {
    left: 15px !important;
    top: 15px !important;
    right: 15px !important;
    bottom: auto;
    width: calc(100vw - 30px) !important;
    margin: 0 auto;
  }

  .closeBtnArticle {
    left: auto !important;
    top: 10px !important;
    right: 10px;
  }

  .cashbox_2 {
    overflow: scroll !important;
  }

  .cashbox_2 .frm-content {
    min-width: 380px !important;
    width: 90%;
  }

  /*
  frm-content {
    min-width: none;
    border: 2px solid #ff0000 !important;
  }
   */

  table.frm-content {
    min-width: 380px !important;
    display: inline;
  }

  table.frm-content td {
    display: block !important;
  }

  body.cashbox_2 {
    min-width: 100px;
    max-width: 100%;
  }

  /* schliessen-knopf an iframe ausblenden */
  .closeUIDpayment_dialog {
    display: none;
  }

  td.input {
    display: block;
    padding-top: 5px;
  }

  /* nur im iframe? */
  #data_form {
    /*width: 95%;*/
    /*margin-top: 40px;*/
  }

  form#frm_customer_registration td.label,
  form#frm_customer_registration td.label-req {
    display: inline !important;
    max-width: 300px;
  }
}

@media screen and (max-width: 720px) {
  .rsOverflow {
    /*float: center;*/
    margin: 0 auto;
  }

  .mv2 .mv2-article-details .mv2-article-picture {
    width: 100% !important;
    text-align: center;
    overflow: hidden;
  }

  .mv2 .mv2-article-details .mv2-article-main {
    padding-left: 1em !important;
    min-width: 0 !important;
  }



  .container {
    padding: 0 !important;
  }
}

@media screen and (max-width: 640px) {

  .mv2 .mv2-articleListing.mv2-listing-list .mv2-article-picture img {
    /*object-fit: contain;
    width: 100%;
    height: 100%;
    max-height: 100%;
    border-radius: 4px;*/
  }

  /* artikel-listenansicht anpassen:
     price-actions-wrapper unterhalb von bild und text verschieben.
       ┌─────────────┬──────────────────────┐
       │ picture     │ name-wrapper         │
       ├─────────────┴──────────────────────┤
       │ actions-wrapper                    │
       └────────────────────────────────────┘
   */
  .mv2 .mv2-articleListing.mv2-listing-list .mv2-article form {
    grid-template-columns: minmax(50px, 140px) 1fr; /* = 2fr! */
    grid-template-rows: 1fr min-content;
    /*noinspection CssBrowserCompatibilityForProperties*/
    grid-template-areas: "picture name-wrapper" "actions-wrapper actions-wrapper";
  }


  /* price-actions-wrapper aufteilen in 2 spalten und den warenkorb-button
     rechts abbilden, den rest links:
     ┌───────────────────┬──────────────────────┐
     │ stock-status      │                      │
     ├───────────────────┤                      │
     │ uvp               │                      │
     ├───────────────────┤                      │
     │ price             │                      │
     ├───────────────────┤                      │
     │ unit-price        │              actions │
     └───────────────────┴──────────────────────┘
  */
  .mv2 .mv2-articleListing.mv2-listing-list .mv2-price-actions-wrapper {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: min-content min-content 1fr min-content;
    /*noinspection CssBrowserCompatibilityForProperties*/
    gap: 0;
    /*noinspection CssBrowserCompatibilityForProperties*/
    grid-template-areas: "stock-status actions" "uvp actions" "price actions" "unit-price actions";
    padding-top: 0;
  }

  /* warenkorb-button in artikel-liste nach rechts */
  .mv2 .mv2-button .mv2-button-inner {
    margin-left: auto !important;
  }

  .mv2 .mv2-listing-list .mv2-article-picture {
    max-width: 170px;
  }



  .dn_addr_details {
    /*    font-size: 14px;*/
  }

  .dn_address a.dn_expand_details {
    /* font-family: var(--design-editor-font-family); */
    /*    font-size: 14px !important;*/
  }



  .rsOverflow {
    /*float: center;*/
    margin: 0 auto;
  }

  .mv2 .mv2-article-details .mv2-article-picture {
    width: 100% !important;
    text-align: center;
    overflow: hidden;
    height: 100% !important;
  }

  .mv2 .mv2-article-details .mv2-info-row .mv2-info-label {
    width: 40% !important;
  }

  .mv2 .mv2-article-details .mv2-info-row .mv2-info-value {
    width: 60% !important;
  }

  .mv2 .mv2-tabs-tabs li {
    margin-top: 0 !important;
    margin-right: 0 !important;
    width: 100%;
  }

  /* FIXME: test */
  .container {
    padding: 0 !important;
  }
}

@media screen and (max-width: 520px) {
  .container {
    padding: 0 !important;
  }
}

@media screen and (max-width: 480px) {

  /* anzeige "Seite x von y" ausblenden, da redundant durch seitensteuerung */
  .mv2 .mv2-control .mv2-page-information {
    display: none;
  }
  #cashbox_dialog.UIDinfo_window {
    left: 15px !important;
    width: calc(100vw - 30px) !important;
    right: 15px !important;
    margin: 0 auto;
    max-width: 300px;
  }
  #cashbox_dialog.UIDpayment_dialog {
    left: 15px !important;
    top: 15px !important;
    right: 15px !important;
    bottom: auto;
    width: calc(100vw - 30px) !important;
    max-width: unset !important;
    margin: 0 auto;
  }
  /*.searchWrapper {*/
  /*  left: 35px;*/
  /*}*/

  input[name="btn_add_to_cart"] {
    /*margin: unset !important;*/
  }

  /* headerbild td */
  .content-td-of-header-table {
    padding-top: 5px;
    height: auto !important;
  }

  table {
    height: auto;
    position: relative;
    /*width: 90%;*/
    margin: auto;
  }

  /*********************************************
		 Produktansicht anpassen
		 **********************************************/
  .mv2 .mv2-article-details .mv2-article-main {
    padding-left: 1em !important;
    min-width: 0 !important;
  }

  .mv2-art-name {
    /*    font-size: 1.4em !important;*/
  }

  .mv2 .mv2-button.mv2-button-big {
    /*    font-size: 0.9em !important;*/
    /*width: 90%;*/
  }

  /*******************************************************
		 Pop-Up Fenster
		 ********************************************************/

  .closeBtnArticle {
    left: auto !important;
    top: 10px !important;
    right: -20px;
  }

  .address_select_container {
    width: 100% !important;
  }

  #editAddress tr {
    display: block;
    position: relative;
    width: 100% !important;
    height: auto !important;
  }

  #editAddress td.label {
    display: block;
  }

  #editAddress td.input {
    display: block;
  }

  #editAddress .width-def {
    width: 100% !important;
  }

  #editAddress .width-small {
    width: 100%;
  }

  #editAddress .label {
    white-space: normal !important;
  }

  /************************************************
		 Domainnamen ändern im Pop-Up Fenster
		 ************************************************/

  #uploadDocument {
    width: 100% !important;
  }

  #uploadDocument table {
    position: relative;
    width: 100% !important;
  }

  /* Force table to not be like tables anymore*/
  #uploadDocument table,
  #uploadDocument thead,
  #uploadDocument tbody,
  #uploadDocument th,
  #uploadDocument td,
  #uploadDocument tr {
    display: block;
  }

  #uploadDocument th {
    display: none !important;
  }

  #uploadDocument td {
    /* Behave  like a "row" */
    border: none;
    position: relative;
    padding-left: 50%;
    /*font-family: var(--design-editor-font-family) !important;*/
    /*    font-size: 13px !important;*/
    font-weight: 500 !important;
  }

  #uploadDocument td {
    padding: 5px;
    display: block;
  }

  #uploadDocument td .control {
    /*font-family: var(--design-editor-font-family);*/
    /*    font-size: 11px;*/
    font-weight: 400;
    padding: 5px;
    display: block;
  }

  #uploadDocument td .width-big .input-req {
    /*font-family: var(--design-editor-font-family);*/
    /*    font-size: 12px;*/
    font-weight: 400;
    padding: 5px;
    display: block;
  }

  #uploadDocument td::before {
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
    height: 14px;
    vertical-align: bottom;
    text-align: left;
    padding-bottom: 3px;
    padding-left: 2px;
    /*font-family: var(--design-editor-font-family);*/
    /*    font-size: 12px;*/
    font-weight: 600;
    line-height: 1.42857143;
    color: #333;/*fixme*/
  }

  #uploadDocument .width-big {
    width: 100%;
  }

  /************************************************
		 Login ändern im Pop-Up Fenster
		 ************************************************/
  #login_username {
    width: 100% !important;
  }

  #password {
    width: 100% !important;
  }


  /***************margin: -15px überschreiben******************/
  .row {
    margin-right: 0px !important;
    margin-left: 0px !important;
  }
  input.input_button,
  input[type="submit"],
  input[type="reset"],
  input[type="button"] {
    /*margin-left: 15px !important;*/
    /*margin-top: 15px;*/
  }

  .cashbox_2 {
    overflow: scroll !important;
  }

  .cashbox_2 .frm-content {
    min-width: 100px !important;
    width: 90%;
  }

  .frm-content {
    min-width: unset;
    width: 90%;
  }

  table.frm-content {
    min-width: 100px !important;
    width: 90%;
    display: inline;
  }

  table.frm-content td {
    display: block !important;
  }

  body.cashbox_2 {
    min-width: 100px;
    max-width: 100%;
  }

  /* schliessen-knopf an iframe ausblenden */
  .closeUIDpayment_dialog {
    display: none;
  }

  td.input {
    display: block;
  }

  /* nur im iframe? */
  #data_form {
    /*width: 95%;*/
    /*margin-top: 40px;*/
  }

  .dn_addr_details {
    /*font-family: var(--design-editor-font-family);*/
    /*    font-size: 12px;*/
    margin-left: 0 !important;
    padding: 5px;
  }

  .dn_address a.dn_expand_details {
    /* font-family: var(--design-editor-font-family); */
    /*    font-size: 12px !important;*/
  }


  .list_of_bills,
  .transaction-id,
  .transaction-date,
  .account-text,
  .amount-cashout-relevant,
  .amount {
    /*    font-size: 0.8em;*/
  }

  #filter-account-balance,
  #filter-cashout-relevant {
    /*    font-size: 1.3em;*/
  }
}

@media screen and (max-width: 410px) {
  /* grid-darstellung wechseln zu list-darstellung! */
  .mv2 .mv2-listing-grid {
    grid-auto-rows: initial;
    grid-template-columns: initial;
  }
  .mv2 .mv2-listing-grid .mv2-article > form {
    grid-template-columns: 0.7fr 1.3fr; /* = 2fr! */
    grid-template-rows: 1fr min-content;
    /*noinspection CssBrowserCompatibilityForProperties*/
    grid-template-areas: "picture name-wrapper" "actions-wrapper actions-wrapper";
  }

  .mv2 .mv2-articleListing.mv2-listing-list .mv2-article form {
    grid-template-columns: 0.7fr 1.3fr; /* = 2fr! */
    grid-template-rows: 1fr min-content;
  }

  .mv2 .mv2-articleListing.mv2-listing-grid .mv2-price-actions-wrapper {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: min-content min-content 1fr min-content;
    /*noinspection CssBrowserCompatibilityForProperties*/
    gap: 0;
    /*noinspection CssBrowserCompatibilityForProperties*/
    grid-template-areas: "stock-status actions" "uvp actions" "price actions" "unit-price actions";
    padding: 0 10px 10px 10px;
  }

  .mv2 .mv2-listing-grid .stock_status,
  .mv2 .mv2-listing-grid .mv2-article-price,
  .mv2 .mv2-listing-grid .mv2-article-name-wrapper {
    text-align: left;
  }

  .mv2 .mv2-listing-grid .mv2-article-name-wrapper {
    padding: 10px 10px 0 0;
  }

  .mv2 .mv2-listing-grid .mv2-actions-container .mv2-button-inner {
    margin-right: 0;
  }

  .mv2-article-main #stock_image {
    /*margin-top: 25px;*/
  }

  .list_of_bills,
  .transaction-id,
  .transaction-date,
  .account-text,
  .amount-cashout-relevant,
  .amount {
    /*    font-size: 0.7em;*/
  }

  #filter-account-balance,
  #filter-cashout-relevant {
    /*    font-size: 1.2em;*/
  }
}

/* Formular für iphone SE anpassen */
@media screen and (max-width: 320px) {
  .width-def {
    width: 160px;
  }

  .width-date-text {
    width: 120px;
  }

  td.label-req {
    width: 20% !important;
  }

  td.label {
    /*    font-size: 11px !important;*/
    width: 20% !important;
  }

  td.input {
    width: 80% !important;
  }
}



#sum.shopping_cart_block {
/*bei mehreren warenkörben bewirkt dies eine gleichmässige aufteilung der zwischensummen */
  width: 50%;
}

#cb2 a.login_button {
/* login-button kommt mit margin 10px daher… */
  margin: 0 !important;
}



/* th hat für diese spalte nur 50, das ist zu wenig, wenn eingabefeld breiter */
#cb2 div.sum_count_container {
  width: calc(4rem + 14px);
}

/* <br> aus divs entfernen */
div.errors > br,
div.alert > br {
  display: none;
}


.xdebug-var-dump {
  display: none;
}
td.error {
  white-space: normal !important;
}

img[src$="/articles/image.svg"] {
  height: 100%;
  opacity: 0.05;
}

/* ########################################################################## */
/* iframe "kaufen"
/* ########################################################################## */
body.cashbox_2 {
  /* inhalt immer 100% höhe */
  height: 100%;
  padding: 0;
  margin: 0;
  background-color: var(--design-editor-content-background-color) !important;
}

/* cashbox iframes */
iframe#cashbox_dialog {
  border: 0 !important; /* überschreibt style-attribut */
  border-radius:6px;
  box-shadow: 0 5px 15px rgba(0,0,0,.5);
  overflow: scroll !important;
  /*overflow: scroll !important;*/
  -webkit-overflow-scrolling: touch;
  /*transform: translate3d(0, 0, 0) !important;*/
  /*-webkit-transform: translate3d(0, 0, 0) !important;*/
}

/* iframes backdrop */
.gb_doverlay {
  position: fixed !important;
  height: unset !important;
  width: unset !important;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000 !important;
  filter: alpha(opacity=50) !important;
  opacity: .5 !important;
}

/* ausblenden der schliessen-knöpfe am rechten rand von iframes */
.closeUIDpayment_dialog,
.closeUIDcashbox_popup,
.closeUIDinfo_window,
.closeUID_login {
  display: none;
}

.cashbox_quickdialog_container {
  padding: 0px;
}

.cashbox-dialog-container {
  width: 100% !important;
  margin: 0 !important;
}

.cashbox_quickdialog_container td.input {
  width: 100% !important;
}

.cashbox_quickdialog_container th {
  border-bottom: 1px solid #E5E5E5 !important;
}

/* cashbox progressbar */
.cashbox-loader {
  width:80%;
  margin:0 auto;
  border-radius:10px;
  border:4px solid transparent;
  position:relative;
  padding:1px;
}
.cashbox-loader::before {
  content:'';
  border:1px solid var(--jes-active-nav-color);
  border-radius:10px;
  position:absolute;
  top:-4px;
  right:-4px;
  bottom:-4px;
  left:-4px;
}
.cashbox-loader .cashbox-loader-bar {
  position:absolute;
  border-radius:10px;
  top:0;
  right:100%;
  bottom:0;
  left:0;
  background:var(--jes-active-nav-color);
  width:0;
  animation:borealisBar 2s linear infinite;
}

@keyframes borealisBar {
  0% {
    left:0%;
    right:100%;
    width:0%;
  }
  10% {
    left:0%;
    right:75%;
    width:25%;
  }
  90% {
    right:0%;
    left:75%;
    width:25%;
  }
  100% {
    left:100%;
    right:0%;
    width:0%;
  }
}


/* custom css */

/* Navigation SubNav - nur Titel */
.subNavNoLinkItem {
  color: #10265c;
  background-color: #cdd0da;
  padding: 3px 20px;
}

.subNavNoLinkItem::after {
  font-family: fontawesome;
  content: '\f107';
  font-weight: 200;
  position: absolute;
  right: 15px;
}


/* Flexbox */

.jes-flexbox-1200 {display: flex; justify-content: space-between; align-items: center; gap: 1em 100px; margin-left: auto; margin-right: auto; max-width: calc(1200px); }
.jes-flexbox-800 {display: flex; justify-content: space-between; align-items: center; gap: 1em 100px; margin-left: auto; margin-right: auto; max-width: calc(800px); }
/* wegen dem Design hier eine andere Einstellung für gap */
.jes-flexbox-598 {display: flex; justify-content: space-between; align-items: center; gap: 2em 5%; margin-left: 16% ; margin-right: 16%; margin-bottom: 2em; } 
.jes-flexbox-buttons { gap: 2em; flex-wrap: wrap; justify-content: flex-start; text-align: center; }
.jes-flexitem-only-text {flex: 0 1 auto; padding: 1em; word-spacing: 1px;}
.jes-flexitem-text {flex: 0 1 auto; width: 50%;}
.jes-flexitem-text-70 {flex: 0 1 auto; width: 45%;}
.jes-flexitem-img-30 {flex: 1 1 auto; width: 20%; justify-content: flex-end; display: flex;}
.jes-flexitem-img {flex: 1 1 auto; }
.jes-flexitem-text-box {flex: 1 1 auto; }
.jes-img-float-right { float: right; }
.jes-img-float-left { float: left; }

@media (max-width: 1200px) {
    .jes-flexbox-1200 { margin-left: 2em; margin-right: 2em; }
    .wrap1200 {flex-wrap: wrap;}
    .jes-flexitem-text {width: 100%; margin: 2em 0;}
    .jes-nodisplay-1200 { display: none; }
    .jes-img-center-1200 { margin-left: auto; margin-right: auto; float: unset; }
}

@media (max-width: 800px) {
    .jes-flexbox-800 { margin-left: 2em; margin-right: 2em; }
    .jes-flexbox-598 { margin-left: 2em; margin-right: 2em; }
    .wrap800 {flex-wrap: wrap;}
    .jes-flexitem-only-text {margin: 2em 0;}
    .jes-flexitem-text-box {margin: 0;}
    .jes-nodisplay-800 { display: none; }
    .jes-img-center-800 { margin-left: auto; margin-right: auto; float: unset; }
}

@media (max-width: 598px) {
    .jes-flexbox-598 { margin-left: 2em; margin-right: 2em; }
    .wrap598 {flex-wrap: wrap;}
    .jes-flexitem-text-70 { width: 100%; }
    .jes-flexitem-img-30 { width: 100%; justify-content: center;}
}

/* hero-sektion */
.hero1 {font-size: 6em !important; color: #fff !important; font-weight: 500 !important; font-family: 'Open Sans', sans-serif;}
.hero2 {font-size: 30px; color: #fff; font-weight: 500; font-family: 'Open Sans', sans-serif;}

@media (max-width: 1200px) {
    .hero1 {font-size: 4.5em !important;}
    .hero2 {font-size: 28px;}
}

@media (max-width: 991px) {
    .hero1 {font-size: 4em !important;}
    .hero2 {font-size: 24px;}
}

@media (max-width: 800px) {
    .hero1 {font-size: 3.5em !important;}
    .hero2 {font-size: 22px;}
}

@media (max-width: 640px) {
    .hero1 {font-size: 2.5em !important;}
    .hero2 {font-size: 20px !important;}
}

@media (max-width: 480px) {
    .hero1 {font-size: 2em !important;}
    .hero2 {font-size: 20px !important;}
}

@media (max-width: 360px) {
    .hero1 {font-size: 2em !important;}
    .hero2 {font-size: 18px !important;}
}