/********* Konfigurator Styles ***************************************************************/

/* Konfigurator Teaser */

.konfigurator-teaser {
  display: block;
}
.konfigurator-teaser .konfigurator-teaser-headline {
  font-weight: 700;
  text-shadow: 0px 2px 2px rgba(0,0,0,0.15);
  color: #714729;
  font-size: 20px;
  padding-bottom: 12px;
}
.konfigurator-teaser .konfigurator-teaser-text {
  font-weight: 400;
  font-size: 13px;
  line-height: 22px;
  color: #6a6059;
  padding-bottom: 20px;
}
.konfigurator-teaser .konfigurator-teaser-button {
  font-size: 26px;
  color: white;
  font-weight: 500;
  background-color: #009dd2 !important;
  text-align: center;
  padding: 30px 18px 35px 18px;
  transition: all 0.6s ease-out;
  border-radius: 6px;
  border: none;
  width: 100%;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  line-height: 1.4;
  margin-bottom: 20px;
}
.konfigurator-teaser .konfigurator-teaser-button img {
  width: 340px;
  margin: 25px auto 15px;
  transition: all 0.6s ease-out;
}
.konfigurator-teaser .konfigurator-teaser-button small {
  font-size: 13px;
  font-weight: normal;
  font-family: 'Nunito','Open Sans',Sans-serif;
}
.konfigurator-teaser .konfigurator-teaser-button:hover {
  background-color: #0089bb !important;
}
.konfigurator-teaser .konfigurator-teaser-button:hover img {
  width: 370px;
  transition: all 0.6s ease-out;
}

.konfigurator-popup,
.kondolenz-einstellungen {
  display: none;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 50000;
  border: solid 2px #ccc;
  border-radius: 5px;
  background-color: white;
  color: #444;
  bottom: 0px;
  padding: 0px;
  box-shadow: 0px -2px 3px rgba(0, 0, 0, 0.2);
}
.konfigurator-popup.konfigurator-inline,
.kondolenz-einstellungen.konfigurator-inline {
  display: none;
  width: 100%;
  height: auto;
  position: relative;
  top: 0;
  left: 0;
  z-index: 1;
  border: none;
  border-radius: 0;
  padding: 0px;
  background-color: transparent;
  overflow-y: initial;
}
.konfigurator-popup .konfigurator-spinner,
.kondolenz-einstellungen .konfigurator-spinner {
  display: none;
  width: 300px;
  height: 300px;
  border: solid 1px #ccc;
  background-color: white;
  text-align: center;
  padding: 30px 15px 20px 15px;
  border-radius: 6px;
  box-shadow: 1px 3px 10px rgba(0,0,0,0.2);
  position: fixed;
  z-index: 50001;
  top: 45%;
  left: 45%;
}
.konfigurator-popup .konfigurator-spinner img,
.kondolenz-einstellungen .konfigurator-spinner img {
  width: 180px;
  height: auto;
  margin: 0 auto;
  margin-bottom: 12px;
}
.konfigurator-popup .konfigurator-spinner .konfigurator-spinner-text,
.kondolenz-einstellungen .konfigurator-spinner .konfigurator-spinner-text {
  font-size: 16px;
  font-weight: 600;
  font-style: italic;
  text-align: center;
  color: #999;
}
.konfigurator-popup .konfigurator-spinner .konfigurator-spinner-fehler,
.kondolenz-einstellungen .konfigurator-spinner .konfigurator-spinner-fehler {
  display: none;
  font-size: 16px;
  font-weight: 600;
  font-style: italic;
  text-align: center;
  color: darkred;
}
.konfigurator-popup .btn,
.kondolenz-einstellungen .btn {
  border-radius: 10px;
}
.konfigurator-popup button.konfigurator-opener-button,
.konfigurator-popup button.konfigurator-designer-opener-button,
.kondolenz-einstellungen button.konfigurator-opener-button,
.kondolenz-einstellungen button.konfigurator-designer-opener-button {
  transition: all 0.5s;
  display: inline-block;
  width: 100%;
  margin: 0 0 30px 0;
  text-align: center;
  padding: 20px 30px;
  font-size: 22px;
  line-height: 30px;
  border: none;
  color: white;
  text-shadow: 1px 2px 3px rgba(0,0,0,0.3);
  font-weight: 400;
  box-shadow: 1px 2px 3px rgba(0,0,0,0.3);
  border-radius: 10px;
  background-color: #009dd2;
}
.konfigurator-popup button.konfigurator-opener-button:hover,
.konfigurator-popup button.konfigurator-designer-opener-button:hover,
.kondolenz-einstellungen button.konfigurator-opener-button:hover,
.kondolenz-einstellungen button.konfigurator-designer-opener-button:hover {
  background-color: #0089bb;
  text-shadow: 1px 2px 3px rgba(0,0,0,0.1);
}
.konfigurator-popup button.konfigurator-opener-button .icon-load,
.konfigurator-popup button.konfigurator-designer-opener-button .icon-load,
.kondolenz-einstellungen button.konfigurator-opener-button .icon-load,
.kondolenz-einstellungen button.konfigurator-designer-opener-button .icon-load {
  margin-left: 15px;
  display: none;
}
.konfigurator-popup button.konfigurator-opener-button .icon-edit,
.konfigurator-popup button.konfigurator-designer-opener-button .icon-edit,
.kondolenz-einstellungen button.konfigurator-opener-button .icon-edit,
.kondolenz-einstellungen button.konfigurator-designer-opener-button .icon-edit {
  margin-left: 15px;
  display: inline;
}
.konfigurator-popup .konfigurator-part,
.kondolenz-einstellungen .konfigurator-part {
  display: none;
}
.konfigurator-popup .konfigurator-part .konfigurator-part-close,
.kondolenz-einstellungen .konfigurator-part .konfigurator-part-close {
  position: absolute;
  top: -5px;
  right: -5px;
}
.konfigurator-popup .konfigurator-part .konfigurator-part-close .konfigurator-part-close-btn .fas,
.kondolenz-einstellungen .konfigurator-part .konfigurator-part-close .konfigurator-part-close-btn .fas {
  font-size: 50px;
  color: #e0e0e0;
}
.konfigurator-popup .konfigurator-part .konfigurator-part-close .konfigurator-part-close-btn .fas:hover,
.kondolenz-einstellungen .konfigurator-part .konfigurator-part-close .konfigurator-part-close-btn .fas:hover {
  font-size: 30px;
  color: #cccccc;
}
.konfigurator-popup .konfigurator-view,
.kondolenz-einstellungen .konfigurator-view {
  margin: 0px;
  padding: 20px;
  overflow-y: auto;
  height: 100%;
}
.konfigurator-popup .konfigurator-view h2,
.konfigurator-popup .konfigurator-view h2 a,
.kondolenz-einstellungen .konfigurator-view h2,
.kondolenz-einstellungen .konfigurator-view h2 a {
  margin-top: 10px;
  font-size: 20px;
  color: #7c9ab2;
  font-weight: 400;
  line-height: normal;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile {
  padding: 20px 0 20px 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile:first-child,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile:first-child {
  border-top: none;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile h3,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile h3 {
  margin-top: 0;
  margin-bottom: 20px;
  color: white;
  font-weight: 600;
  background-color: #777;
  padding: 5px 10px 5px 10px;
  border-radius: 2px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile h3 span,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile h3 span {
  font-weight: 300;
  font-style: italic;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-center,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-center {
  width: 100%;
  text-align: center;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-links,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-links {
  width: 100%;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-links img,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-links img {
  margin-bottom: 10px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-rechts,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-rechts {
  width: 100%;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile label,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile label {
  font-weight: 600;
  font-size: 14px;
  width: 100%;
  display: inline-block;
  margin-bottom: 10px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile input[type="color"],
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile input[type="color"] {
  width: 160px;
  height: 40px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile input[type="text"],
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile input[type="text"] {
  padding: 0 10px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile input[type="text"].konfigurator-form-control,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile input[type="text"].konfigurator-form-control {
  padding: 10px 20px;
  font-size: 20px;
  color: #666;
  border-radius: 4px;
  border: solid 1px #ccc;
  text-shadow: 1px 4px 3px #cfcfcf;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile textarea.konfigurator-form-control,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile textarea.konfigurator-form-control {
  height: 150px;
  font-size: 14px;
  padding: 10px 18px;
  border: solid 1px #cfcfcf;
  border-radius: 4px;
  color: #666;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile div,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile div {
  margin-bottom: 5px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-rechts-bestellen,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-rechts-bestellen {
  text-align: center;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-save,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-save {
  width: 100%;
  height: 85px;
  text-align: center;
  background-color: #ffa718;
  color: white;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  border-color: #dd8b06;
  font-size: 17px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-save:hover,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-save:hover {
  background-color: #ffb840;
  border-color: #ef9e15;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-save i,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-save i {
  font-size: 22px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-zurueck,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-zurueck {
  width: 45%;
  margin-top: 20px;
  text-align: center;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-box,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-box {
  margin-bottom: 15px;
  width: 100%;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-box > div,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-box > div {
  margin: 10px 10px 0 0;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spaltenjetag,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spaltenjetag {
  width: 35%;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte,
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  background-color: #f9f6f3;
  padding: 6px 15px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte h4,
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte h4,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte h4,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte h4 {
  font-size: 16px;
  font-style: italic;
  color: #c0a27e;
  margin: 0 0 5px 0;
  display: inline-block;
  width: 100%;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung,
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung {
  width: 70%;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung input,
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung input,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung input,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung input {
  width: 90%;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe,
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe {
  width: 30%;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe input[type="color"],
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe input[type="color"],
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe input[type="color"],
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe input[type="color"] {
  width: 100%;
  height: 40px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-format,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-format {
  font-size: 15px;
  border-bottom: dotted 1px #999;
  padding: 10px 0 10px 5px;
  margin: 0;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-format i,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-format i {
  color: #aaa;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-format.highlight,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-format.highlight {
  background-color: #f8fff4;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-format.highlight i,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-format.highlight i {
  color: #57972d;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-beschriftung,
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-farbe,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-beschriftung,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-farbe {
  width: 60%;
  margin-bottom: 10px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-beschriftung input[type="color"],
.konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-farbe input[type="color"],
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-beschriftung input[type="color"],
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-farbe input[type="color"] {
  width: 100%;
  height: 40px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-head,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-head {
  font-weight: bold;
  font-size: 15px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-flex,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-flex {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 8px;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div input[type="text"],
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div textarea,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div input[type="text"],
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div textarea {
  width: 100%;
}
.konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div .left,
.kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div .left {
  text-align: left;
}
.konfigurator-popup .konfigurator-view .konfigurator-number-div,
.kondolenz-einstellungen .konfigurator-view .konfigurator-number-div {
  width: 110px;
  display: none;
}
.konfigurator-popup .konfigurator-view-2,
.kondolenz-einstellungen .konfigurator-view-2 {
  display: none;
}
.konfigurator-popup .konfigurator-view-2 h3,
.kondolenz-einstellungen .konfigurator-view-2 h3 {
  font-size: 20px;
  margin: 0 0 10px 0;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-zeile img,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-zeile img {
  max-width: 32%;
  max-height: 500px;
  margin-right: 1.88%;
  box-shadow: 1px 3px 10px rgba(0,0,0,0.2);
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-zeile img:last-child,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-zeile img:last-child {
  margin-right: 0;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-links-details div,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-links-details div {
  display: flex;
  flex-direction: row;
  padding: 5px 0 5px 0;
  border-bottom: solid 1px #f0f0f0;
  width: 90%;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-links-details div span:first-child,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-links-details div span:first-child {
  width: 40%;
  display: inline-block;
  vertical-align: top;
  font-size: 12px;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-links-details div span:last-child,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-links-details div span:last-child {
  width: 60%;
  font-style: italic;
  display: inline-block;
  font-size: 12px;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-warenkorb,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-warenkorb {
  width: 100%;
  text-align: center;
  background-color: #ffa718;
  color: white;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  border-color: #dd8b06;
  font-size: 17px;
  height: 80px;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-warenkorb:hover,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-warenkorb:hover {
  background-color: #ffb840;
  border-color: #ef9e15;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-testpdf,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-testpdf {
  font-size: 15px;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-testdruck,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-testdruck {
  width: 50%;
  font-size: 15px;
  text-align: center;
  background-color: #ebdada;
  color: #c30808;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
  border-color: #c30808;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-testdruck:hover,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-testdruck:hover {
  background-color: #f1e6e6;
  border-color: #d90909;
}
.konfigurator-popup .konfigurator-view-2 .konfigurator-vorschau-image,
.kondolenz-einstellungen .konfigurator-view-2 .konfigurator-vorschau-image {
  display: none;
}
.konfigurator-popup input[type="color"],
.kondolenz-einstellungen input[type="color"] {
  width: 160px;
  height: 40px;
}
.konfigurator-popup .konfigurator-add-input,
.kondolenz-einstellungen .konfigurator-add-input {
  background-color: gray;
  color: white;
  border: none;
  font-weight: bold;
}
.konfigurator-popup .konfigurator-add-input:hover,
.kondolenz-einstellungen .konfigurator-add-input:hover {
  background-color: #999999;
  border: none;
}
.konfigurator-popup .konfigurator-nachricht-email,
.konfigurator-popup .konfigurator-nachricht-mobil,
.kondolenz-einstellungen .konfigurator-nachricht-email,
.kondolenz-einstellungen .konfigurator-nachricht-mobil {
  width: 85% !important;
}
.konfigurator-popup .konfigurator-foto,
.kondolenz-einstellungen .konfigurator-foto {
  border: solid 1px #ccc;
  padding: 5px;
  border-radius: 10px;
  max-width: 400px;
  width: 100%;
  min-height: 200px;
  height: auto;
  background-color: white;
  cursor: pointer;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload {
  flex-grow: 1;
  border: dotted 3px #e0e0e0;
  border-radius: 8px;
  width: 100%;
  height: 100%;
  padding: 20px 15px 15px;
  margin-bottom: 0px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload div.dz-message,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload div.dz-message {
  font-size: 14px;
  color: #0b6dbe;
  line-height: 1.5em;
  cursor: pointer;
  text-align: center;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload div.dz-message img,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload div.dz-message img {
  margin: 0 auto 6px;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-preview,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-preview {
  position: relative;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-image img,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-image img {
  display: inline-block;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-size,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-size {
  display: none;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-filename,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-filename {
  font-size: 12px;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-success-mark,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-success-mark {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-success-mark .dz-check,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-success-mark .dz-check {
  position: absolute;
  width: 1px;
  height: 1px;
  border-radius: 50%;
  background-color: green;
  padding: 2px;
  opacity: 0;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-success-mark .dz-check svg,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-success-mark .dz-check svg {
  width: 100%;
  height: 100%;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-error-mark,
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-error-mark {
  position: absolute;
  bottom: 15px;
  right: -27px;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-error-mark g[fill="#FFFFFF"],
.kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-error-mark g[fill="#FFFFFF"] {
  fill: #999999;
  fill-opacity: 0.8;
}
.konfigurator-popup .konfigurator-preview,
.kondolenz-einstellungen .konfigurator-preview {
  width: 100%;
  padding: 0 10px 0 10px;
  order: 2;
}
.konfigurator-popup .konfigurator-edit,
.kondolenz-einstellungen .konfigurator-edit {
  width: 100%;
  order: 1;
}
.konfigurator-popup .konfigurator-layouts > div,
.kondolenz-einstellungen .konfigurator-layouts > div {
  width: 31%;
  margin-bottom: 0;
}
.konfigurator-popup .konfigurator-preview-container,
.kondolenz-einstellungen .konfigurator-preview-container {
  position: relative;
  width: 100%;
  flex: 0 0;
}
.konfigurator-popup .konfigurator-preview-container .konfigurator-preview-image,
.kondolenz-einstellungen .konfigurator-preview-container .konfigurator-preview-image {
  display: block;
  max-width: 100%;
  max-height: 100%;
  height: auto;
}
.konfigurator-popup .konfigurator-preview-container .konfigurator-preview-image-loading,
.kondolenz-einstellungen .konfigurator-preview-container .konfigurator-preview-image-loading {
  font-size: 26px;
  color: black;
  opacity: 0.3;
  position: absolute;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: white;
  padding-top: 40%;
  display: none;
  text-align: center;
}
.konfigurator-popup .konfigurator-preview-container .konfigurator-preview-image-loading.loading,
.kondolenz-einstellungen .konfigurator-preview-container .konfigurator-preview-image-loading.loading {
  display: block;
}
.konfigurator-popup .konfigurator-preview-refresh,
.kondolenz-einstellungen .konfigurator-preview-refresh {
  color: white;
  border: none;
  border-radius: 3px;
  width: 100%;
  background-color: #779f61;
  transition: all 0.5s ease;
}
.konfigurator-popup .konfigurator-preview-refresh i,
.kondolenz-einstellungen .konfigurator-preview-refresh i {
  margin-left: 10px;
}
.konfigurator-popup .konfigurator-preview-refresh:hover,
.kondolenz-einstellungen .konfigurator-preview-refresh:hover {
  background-color: #648b4e;
}
.konfigurator-popup .konfigurator-preview-refresh.loading span,
.kondolenz-einstellungen .konfigurator-preview-refresh.loading span {
  display: none;
}
.konfigurator-popup .konfigurator-preview-refresh.loading i,
.kondolenz-einstellungen .konfigurator-preview-refresh.loading i {
  margin-left: 0px;
  -webkit-animation: fa-spin 2s infinite linear;
  animation: fa-spin 2s infinite linear;
}
.konfigurator-popup .konfigurator-preview-refresh.loading,
.kondolenz-einstellungen .konfigurator-preview-refresh.loading {
  background-color: #93bc6b;
}
.konfigurator-popup .konfigurator-warenkorb-button,
.kondolenz-einstellungen .konfigurator-warenkorb-button {
  width: 100%;
  text-align: center;
  color: white;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  font-size: 17px;
  height: 80px;
}

.kondolenz-einstellungen {
  display: none;
  width: 800px;
  height: auto;
  position: absolute;
  top: 0;
  left: -802px;
  z-index: 2;
  border: none;
  border-right: solid 1px #999;
  border-bottom: solid 1px #999;
  border-radius: 0px;
  padding: 20px;
  background-color: rgba(255,255,255,0.9);
  overflow-y: initial;
  backdrop-filter: blur(5px);
  box-shadow: 3px 0 5px 1px rgba(0,0,0,0.15);
  font-size: 13px;
  line-height: 22px;
}

.konfigurator-preview-details {
  color: #444;
  font-weight: 400;
  font-size: 12px;
  text-align: left;
  margin-top: 10px;
}
.konfigurator-preview-details h3 {
  display: none;
}
.konfigurator-preview-details div {
  display: flex;
  flex-direction: row;
  padding: 4px 0 4px 0;
  border-bottom: solid 1px #f0f0f0;
  width: 100%;
}
.konfigurator-preview-details div span:first-child {
  width: 40%;
  display: inline-block;
  vertical-align: top;
}
.konfigurator-preview-details div span:last-child {
  width: 60%;
  font-style: italic;
  display: inline-block;
}

.konfigurator-preview-images {
  display: flex;
  flex-direction: row;
}
.konfigurator-preview-images .konfigurator-preview-image {
  width: 32%;
  margin-right: 1.88%;
}
.konfigurator-preview-images .konfigurator-preview-image img {
  width: 100%;
  height: auto;
  box-shadow: 1px 3px 10px rgba(0,0,0,0.2);
}

.popup-close {
  position: absolute;
  top: -5px;
  right: -5px;
}
.popup-close .fas {
  font-size: 50px;
  color: #e0e0e0;
}
.popup-close .fas:hover {
  font-size: 30px;
  color: #cccccc;
}

.konfigurator-konfig-uebernehmen,
.konfigurator-konfig-aendern {
  width: 100%;
  height: 34px;
  border-radius: 3px;
  background-color: #6fa7e9;
  border: solid 1px #477ab6;
  color: #fff;
  text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
  font-weight: 400;
  font-size: 14px;
  line-height: 32px;
  cursor: pointer;
  margin: 0;
}
.konfigurator-konfig-uebernehmen:hover,
.konfigurator-konfig-aendern:hover {
  background-color: #80b5f4;
  border: solid 1px #4c86ca;
}

.designer-article-top-button {
  width: 200px;
  height: 30px;
  border-radius: 3px;
  background-color: #6fa7e9;
  border: solid 1px #477ab6;
  color: #fff;
  font-weight: 600;
  font-size: 12px;
  line-height: 26px;
  cursor: pointer;
}
.designer-article-top-button:hover {
  background-color: #7cb1f0;
  border: solid 1px #396ca9;
  text-shadow: 0px 1px 1px rgba(0,0,0,0.2);
}

.konfigurator-number-div {
  width: 110px;
}

.konfigurator-number {
  border: solid 1px #6a6059;
  width: 50px;
  height: 50px;
  border-radius: 50px;
  line-height: 46px;
  font-size: 30px;
  color: #6a6059;
  background-color: white;
  font-family: inherit;
  text-align: center;
  font-weight: 400;
  box-shadow: 1px 2px 4px 2px rgba(0,0,0,0.1);
}

.konfigurator-radio {
  display: none !important;
}
.konfigurator-radio-label {
  opacity: 1;
  cursor: pointer;
  margin-bottom: 4px !important;
}
.konfigurator-radio-label img {
  border: solid 2px transparent;
  border-radius: 3px;
  max-width: 100%;
  height: auto;
}
.konfigurator-radio-label .konfigurator-radio-label-text {
  padding: 15px 0 15px;
  width: 100%;
  text-align: center;
  font-size: 14px;
  font-weight: normal;
}
.konfigurator-radio-label .konfigurator-radio-label-text img {
  display: inline-block;
  width: 90px;
}
.konfigurator-radio-label .konfigurator-radio-label-image {
  padding: 3px;
  max-width: 100%;
  position: relative;
}
.konfigurator-radio-label > div {
  border: solid 2px #e9e4e0;
  border-radius: 3px;
  padding: 10px 8px;
  background-color: white;
  transition: all 0.5s ease;
}
.konfigurator-radio-label > div:hover {
  border: solid 2px #bfb8b3;
}
.konfigurator-radio-label .konfigurator-radio-label-image-loading {
  font-size: 26px;
  color: black;
  opacity: 0.3;
  position: absolute;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: white;
  padding-top: 40%;
  display: none;
  text-align: center;
}
.konfigurator-radio-label .konfigurator-radio-label-image-loading.loading {
  display: block;
}
.konfigurator-radio:checked + label > div {
  border: solid 2px #376497;
  background-color: white;
}

button.konfigurator-preview-cover-button,
a.konfigurator-preview-cover-button.btn,
button.konfigurator-preview-website-button,
a.konfigurator-preview-website-button.btn {
  transition: all 0.5s ease;
  background-color: #0b6dbe;
  color: white;
  font-size: 11px;
  font-weight: 400;
  line-height: 24px;
  padding: 0;
  width: 100%;
  border: none;
  text-align: center;
}
button.konfigurator-preview-cover-button:hover,
a.konfigurator-preview-cover-button.btn:hover,
button.konfigurator-preview-website-button:hover,
a.konfigurator-preview-website-button.btn:hover {
  transition: all 0.5s ease;
  background-color: #1a88e8;
  color: white;
}

a.konfigurator-printfile-flyer.btn {
  transition: all 0.5s ease;
  background-color: #0b6dbe;
  color: white;
  font-size: 14px;
  font-weight: 400;
  width: 400px;
  border: none;
  text-align: center;
  display: inline-block;
  margin-top: 35px;
}
a.konfigurator-printfile-flyer.btn:hover {
  transition: all 0.5s ease;
  background-color: #1a88e8;
  color: white;
}

.konfigurator-popup button i.fa-spinner {
  display: none;
}
.konfigurator-popup button i.fa-check {
  display: none;
}
button.busy i.fa-hand-point-right {
  display: none;
}
button.busy i.fa-spinner {
  display: inline-block;
}
button.busy i.fa-check {
  display: none;
}
button.ready i.fa-hand-point-right {
  display: none;
}
button.ready i.fa-spinner {
  display: none;
}
button.ready i.fa-check {
  display: inline-block;
}

.konfigurator-addtocart {
  text-align: center;
  width: 100%;
  white-space: normal;
  height: auto;
  min-height: 52px;
  line-height: 1.7;
  padding: 14px;
}
.einstellungen-save {
  width: 100% !important;
  height: 85px !important;
  text-align: center;
  background-color: #ffa718;
  color: white;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  border-color: #dd8b06 !important;
  font-size: 17px;
}
.einstellungen-save:hover {
  background-color: #ffb840 !important;
  border-color: #ef9e15 !important;
  color: white !important;
}
.einstellungen-save i {
  font-size: 22px;
}
.einstellungen-save i.fa-spinner {
  display: none;
}
.einstellungen-save i.fa-check {
  display: none;
}

#productDetailPageBuyProductForm button.btn-buy:disabled {
  opacity: 0;
}

@media screen and (min-width: 48em) {
  /* Konfigurator Teaser */

  .konfigurator-teaser .konfigurator-teaser-button {
    font-size: 30px;
  }

  .konfigurator-popup,
  .kondolenz-einstellungen {
    display: none;
    width: 95%;
    height: 90%;
    position: fixed;
    top: 5%;
    left: 2%;
    z-index: 50000;
    border: solid 2px black;
    border-radius: 5px;
    padding: 0px;
    background-color: white;
    color: #444;
  }
  .konfigurator-popup.konfigurator-inline,
  .kondolenz-einstellungen.konfigurator-inline {
    display: none;
    width: 100%;
    height: auto;
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    border: none;
    border-radius: 0;
    padding: 0px;
    background-color: transparent;
    overflow-y: initial;
  }
  .konfigurator-popup .konfigurator-spinner,
  .kondolenz-einstellungen .konfigurator-spinner {
    display: none;
    width: 300px;
    height: 300px;
    border: solid 1px #ccc;
    background-color: white;
    text-align: center;
    padding: 30px 15px 20px 15px;
    border-radius: 6px;
    box-shadow: 1px 3px 10px rgba(0,0,0,0.2);
    position: fixed;
    z-index: 50001;
    top: 45%;
    left: 45%;
  }
  .konfigurator-popup .konfigurator-spinner img,
  .kondolenz-einstellungen .konfigurator-spinner img {
    width: 180px;
    height: auto;
    margin: 0 auto;
    margin-bottom: 12px;
  }
  .konfigurator-popup .konfigurator-spinner .konfigurator-spinner-text,
  .kondolenz-einstellungen .konfigurator-spinner .konfigurator-spinner-text {
    font-size: 16px;
    font-weight: 600;
    font-style: italic;
    text-align: center;
    color: #999;
  }
  .konfigurator-popup .konfigurator-spinner .konfigurator-spinner-fehler,
  .kondolenz-einstellungen .konfigurator-spinner .konfigurator-spinner-fehler {
    display: none;
    font-size: 16px;
    font-weight: 600;
    font-style: italic;
    text-align: center;
    color: darkred;
  }
  .konfigurator-popup .konfigurator-view,
  .kondolenz-einstellungen .konfigurator-view {
    margin: 0px;
    padding: 20px;
    overflow-y: auto;
  }
  .konfigurator-popup .konfigurator-view h2,
  .konfigurator-popup .konfigurator-view h2 a,
  .kondolenz-einstellungen .konfigurator-view h2,
  .kondolenz-einstellungen .konfigurator-view h2 a {
    margin-top: 10px;
    font-size: 30px;
    color: #7c9ab2;
    font-weight: 400;
    line-height: normal;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile {
    border-top: dotted 1px #999;
    padding: 20px 0 20px 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile:first-child,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile:first-child {
    border-top: none;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile h3,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile h3 {
    margin-top: 0;
    margin-bottom: 20px;
    color: white;
    font-weight: 600;
    background-color: #777;
    padding: 5px 10px 5px 10px;
    border-radius: 2px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile h3 span,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile h3 span {
    font-weight: 300;
    font-style: italic;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-center,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-center {
    width: 100%;
    text-align: center;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-links,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-links {
    width: 100%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-links img,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-links img {
    margin-bottom: 10px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-rechts,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-rechts {
    width: 100%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile label,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile label {
    font-weight: 600;
    font-size: 14px;
    width: 100%;
    display: inline-block;
    margin-bottom: 10px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile input[type="color"],
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile input[type="color"] {
    width: 160px;
    height: 40px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile div,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile div {
    margin-bottom: 5px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-rechts-bestellen,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-rechts-bestellen {
    text-align: center;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-save,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-save {
    width: 100%;
    height: 85px;
    text-align: center;
    background-color: #ffa718;
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
    border-color: #dd8b06;
    font-size: 17px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-save:hover,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-save:hover {
    background-color: #ffb840;
    border-color: #ef9e15;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-save i,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-save i {
    font-size: 22px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-zurueck,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-zurueck {
    width: 45%;
    margin-top: 20px;
    text-align: center;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-box,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-box {
    margin-bottom: 15px;
    width: 100%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-box > div,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-box > div {
    margin: 10px 10px 0 0;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spaltenjetag,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spaltenjetag {
    width: 35%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte,
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: #f9f6f3;
    padding: 6px 15px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte h4,
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte h4,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte h4,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte h4 {
    font-size: 16px;
    font-style: italic;
    color: #c0a27e;
    margin: 0 0 5px 0;
    display: inline-block;
    width: 100%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung,
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung {
    width: 70%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung input,
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung input,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung input,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung input {
    width: 90%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe,
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe {
    width: 30%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe input[type="color"],
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe input[type="color"],
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe input[type="color"],
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe input[type="color"] {
    width: 100%;
    height: 40px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-format,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-format {
    font-size: 15px;
    border-bottom: dotted 1px #999;
    padding: 10px 0 10px 5px;
    margin: 0;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-format i,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-format i {
    color: #aaa;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-format.highlight,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-format.highlight {
    background-color: #f8fff4;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-format.highlight i,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-format.highlight i {
    color: #57972d;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-beschriftung,
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-farbe,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-beschriftung,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-farbe {
    width: 60%;
    margin-bottom: 10px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-beschriftung input[type="color"],
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-farbe input[type="color"],
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-beschriftung input[type="color"],
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .designer-terminplaner-deckblatt-farbe input[type="color"] {
    width: 100%;
    height: 40px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-head,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-head {
    font-weight: bold;
    font-size: 15px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-flex,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-flex {
    display: flex;
    flex-direction: row;
    width: 100%;
    gap: 8px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div input[type="text"],
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div textarea,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div input[type="text"],
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div textarea {
    width: 100%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div .left,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-zeile .konfigurator-flex .konfigurator-flex-div .left {
    text-align: left;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-number-div,
  .kondolenz-einstellungen .konfigurator-view .konfigurator-number-div {
    width: 110px;
    display: none;
  }
  .konfigurator-popup .konfigurator-view-2,
  .kondolenz-einstellungen .konfigurator-view-2 {
    display: none;
  }
  .konfigurator-popup .konfigurator-view-2 h3,
  .kondolenz-einstellungen .konfigurator-view-2 h3 {
    font-size: 20px;
    margin: 0 0 10px 0;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-zeile img,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-zeile img {
    max-width: 32%;
    max-height: 500px;
    margin-right: 1.88%;
    box-shadow: 1px 3px 10px rgba(0,0,0,0.2);
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-zeile img:last-child,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-zeile img:last-child {
    margin-right: 0;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-links-details div,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-links-details div {
    display: flex;
    flex-direction: row;
    padding: 5px 0 5px 0;
    border-bottom: solid 1px #f0f0f0;
    width: 90%;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-links-details div span:first-child,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-links-details div span:first-child {
    width: 40%;
    display: inline-block;
    vertical-align: top;
    font-size: 12px;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-links-details div span:last-child,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-links-details div span:last-child {
    width: 60%;
    font-style: italic;
    display: inline-block;
    font-size: 12px;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-warenkorb,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-warenkorb {
    width: 100%;
    text-align: center;
    background-color: #ffa718;
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
    border-color: #dd8b06;
    font-size: 17px;
    height: 80px;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-warenkorb:hover,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-warenkorb:hover {
    background-color: #ffb840;
    border-color: #ef9e15;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-testpdf,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-testpdf {
    font-size: 15px;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-testdruck,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-testdruck {
    width: 50%;
    font-size: 15px;
    text-align: center;
    background-color: #ebdada;
    color: #c30808;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
    border-color: #c30808;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-testdruck:hover,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-testdruck:hover {
    background-color: #f1e6e6;
    border-color: #d90909;
  }
  .konfigurator-popup .konfigurator-view-2 .konfigurator-vorschau-image,
  .kondolenz-einstellungen .konfigurator-view-2 .konfigurator-vorschau-image {
    display: none;
  }
  .konfigurator-popup input[type="color"],
  .kondolenz-einstellungen input[type="color"] {
    width: 160px;
    height: 40px;
  }
  .konfigurator-popup .konfigurator-add-input,
  .kondolenz-einstellungen .konfigurator-add-input {
    background-color: gray;
    color: white;
    border: none;
    font-weight: bold;
  }
  .konfigurator-popup .konfigurator-add-input:hover,
  .kondolenz-einstellungen .konfigurator-add-input:hover {
    background-color: #999999;
    border: none;
  }
  .konfigurator-popup .konfigurator-nachricht-email,
  .konfigurator-popup .konfigurator-nachricht-mobil,
  .kondolenz-einstellungen .konfigurator-nachricht-email,
  .kondolenz-einstellungen .konfigurator-nachricht-mobil {
    width: 85% !important;
  }
  .konfigurator-popup .konfigurator-foto,
  .kondolenz-einstellungen .konfigurator-foto {
    border: solid 1px #ccc;
    padding: 5px;
    border-radius: 10px;
    max-width: 400px;
    width: 50%;
    min-height: 200px;
    height: auto;
    background-color: white;
    cursor: pointer;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
  }
  .konfigurator-popup .konfigurator-foto .konfigurator-foto-upload,
  .kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload {
    flex-grow: 1;
    border: dotted 3px #e0e0e0;
    border-radius: 8px;
    width: 100%;
    height: 100%;
    padding: 20px 15px 15px;
    margin-bottom: 0px !important;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .konfigurator-popup .konfigurator-foto .konfigurator-foto-upload div.dz-message,
  .kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload div.dz-message {
    font-size: 12px;
    color: #0b6dbe;
    line-height: 1.5em;
    cursor: pointer;
    text-align: center;
  }
  .konfigurator-popup .konfigurator-foto .konfigurator-foto-upload div.dz-message img,
  .kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload div.dz-message img {
    margin: 0 auto 6px;
  }
  .konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-preview,
  .kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-preview {
    position: relative;
  }
  .konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-image img,
  .kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-image img {
    display: inline-block;
  }
  .konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-size,
  .kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-size {
    display: none;
  }
  .konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-filename,
  .kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-filename {
    font-size: 12px;
  }
  .konfigurator-popup .konfigurator-foto .konfigurator-foto-upload .dz-success-mark svg,
  .kondolenz-einstellungen .konfigurator-foto .konfigurator-foto-upload .dz-success-mark svg {
    width: 100%;
    height: 100%;
  }

  .kondolenz-einstellungen {
    display: none;
    width: 800px;
    height: auto;
    position: absolute;
    top: 0;
    left: -802px;
    z-index: 2;
    border: none;
    border-right: solid 1px #999;
    border-bottom: solid 1px #999;
    border-radius: 0px;
    padding: 20px;
    background-color: rgba(255,255,255,0.9);
    overflow-y: initial;
    backdrop-filter: blur(5px);
    box-shadow: 3px 0 5px 1px rgba(0,0,0,0.15);
    font-size: 13px;
    line-height: 22px;
  }

  .konfigurator-preview-details {
    color: #444;
    font-weight: 400;
    font-size: 12px;
    text-align: left;
    margin-top: 10px;
  }
  .konfigurator-preview-details h3 {
    display: none;
  }
  .konfigurator-preview-details div {
    display: flex;
    flex-direction: row;
    padding: 4px 0 4px 0;
    border-bottom: solid 1px #f0f0f0;
    width: 100%;
  }
  .konfigurator-preview-details div span:first-child {
    width: 40%;
    display: inline-block;
    vertical-align: top;
  }
  .konfigurator-preview-details div span:last-child {
    width: 60%;
    font-style: italic;
    display: inline-block;
  }

  .konfigurator-preview-images {
    display: flex;
    flex-direction: row;
  }
  .konfigurator-preview-images .konfigurator-preview-image {
    width: 32%;
    margin-right: 1.88%;
  }
  .konfigurator-preview-images .konfigurator-preview-image img {
    width: 100%;
    height: auto;
    box-shadow: 1px 3px 10px rgba(0,0,0,0.2);
  }

  .popup-close {
    position: absolute;
    top: 7px;
    right: 7px;
  }
  .popup-close .fas {
    font-size: 30px;
    color: #e0e0e0;
  }
  .popup-close .fas:hover {
    font-size: 30px;
    color: #cccccc;
  }

  .konfigurator-konfig-uebernehmen,
  .konfigurator-konfig-aendern {
    width: 100%;
    height: 34px;
    border-radius: 3px;
    background-color: #6fa7e9;
    border: solid 1px #477ab6;
    color: #fff;
    text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
    font-weight: 400;
    font-size: 14px;
    line-height: 32px;
    cursor: pointer;
    margin: 0;
  }
  .konfigurator-konfig-uebernehmen:hover,
  .konfigurator-konfig-aendern:hover {
    background-color: #80b5f4;
    border: solid 1px #4c86ca;
  }

  .konfigurator-popup {
    width: 65%;
    height: 90%;
    position: fixed;
    top: 5%;
    left: 20%;
    z-index: 50000;
    border: solid 2px black;
    border-radius: 5px;
    padding: 0px;
  }
  .konfigurator-popup .konfigurator-view {
    margin: 0px;
    padding: 20px;
    overflow-y: auto;
  }
  .konfigurator-popup .konfigurator-view h2,
  .konfigurator-popup .konfigurator-view h2 a {
    margin-top: 10px;
    font-size: 30px;
    color: #7c9ab2;
    font-weight: 400;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile h3 {
    margin-top: 0;
    margin-bottom: 20px;
    color: white;
    font-weight: 600;
    background-color: #777;
    padding: 5px 10px 5px 10px;
    border-radius: 2px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-center {
    width: 100%;
    text-align: center;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-links {
    width: 55%;
    min-width: 200px;
    padding-right: 20px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-zeile .konfigurator-rechts {
    width: 45%;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview {
    width: 50%;
    padding: 0 100px 0 50px;
    order: 1;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-edit {
    width: 50%;
    order: 2;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-layouts > div {
    width: 18%;
    margin-bottom: 0;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview-container {
    position: relative;
    width: 100%;
    flex: 0 0;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview-container .konfigurator-preview-image-loading {
    font-size: 26px;
    color: black;
    opacity: 0.3;
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: white;
    padding-top: 40%;
    display: none;
    text-align: center;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview-container .konfigurator-preview-image-loading.loading {
    display: block;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview-refresh {
    color: white;
    border: none;
    border-radius: 3px;
    width: 50%;
    background-color: #779f61;
    transition: all 0.5s ease;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview-refresh i {
    margin-left: 10px;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview-refresh:hover {
    background-color: #648b4e;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview-refresh.loading span {
    display: none;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview-refresh.loading i {
    margin-left: 0px;
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
  }
  .konfigurator-popup .konfigurator-view .konfigurator-preview-refresh.loading {
    background-color: #93bc6b;
  }
  .konfigurator-popup .konfigurator-warenkorb-button {
    width: 100%;
    text-align: center;
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
    font-size: 17px;
    height: 80px;
  }

  .popup-close {
    position: absolute;
    top: 15px;
    right: 15px;
  }
  .popup-close .fas {
    font-size: 40px;
    color: #e0e0e0;
  }
  .popup-close .fas:hover {
    font-size: 40px;
    color: #cccccc;
  }
}

/* === Foto-Platzhalter (SVG-Icon im Dropzone-Feld) === */
.konfigurator-foto-placeholder {
  display: block;
  width: 56px;
  height: 56px;
  margin: 0 auto 8px;
  color: #b8b8b8;
}

/* === Bildmodus-Auswahl: Bootstrap btn-group/btn-check =====================
   Probleme die hier korrigiert werden:
   - designer.css setzt für Labels font-weight/font-size/margin-right
   - radio-custom JS schiebt einen <span class="radio-custom-dummy"> zwischen
     Input und Label, was Bootstraps `:first-child`/`:last-child` /
     `+ .btn` / `+.btn ~ .btn` Selektoren komplett bricht
   ========================================================================= */

/* Container: volle Breite, echtes Flex-Layout */
.designer-terminplaner .designer-terminplaner-deckblatt-ausrichtung.btn-group {
  display: flex;
  width: 100%;
  margin-top: 10px;
}

/* Labels: gleiche Breite, Designer-Label-Reset, keinen Border-Radius (wird
   gleich gezielt am ersten/letzten Label gesetzt) */
.designer-terminplaner .designer-terminplaner-deckblatt-ausrichtung.btn-group label.btn {
  flex: 1 1 0;
  margin-right: 0;
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.5;
  display: inline-block;
  border-radius: 0;
  position: relative;
}

/* Border-Radius nur am ersten/letzten Label (statt :first/last-child,
   da Bootstraps Standard wegen dummy-span nicht greift) */
.designer-terminplaner-deckblatt-ausrichtung.btn-group label.btn:first-of-type {
  border-top-left-radius: var(--bs-border-radius-sm);
  border-bottom-left-radius: var(--bs-border-radius-sm);
}
.designer-terminplaner-deckblatt-ausrichtung.btn-group label.btn:last-of-type {
  border-top-right-radius: var(--bs-border-radius-sm);
  border-bottom-right-radius: var(--bs-border-radius-sm);
}

/* Buttons aneinanderlegen (negativer Margin überlappt die Borders) */
.designer-terminplaner-deckblatt-ausrichtung.btn-group label.btn:not(:first-of-type) {
  margin-left: calc(var(--bs-border-width) * -1);
}

/* radio-custom-dummy aus dem Layout nehmen */
.designer-terminplaner-deckblatt-ausrichtung.btn-group .radio-custom-dummy {
  display: none !important;
}

/* btn-check sicher unsichtbar halten (radio-custom überschreibt sonst) */
.designer-terminplaner-deckblatt-ausrichtung.btn-group .btn-check {
  position: absolute !important;
  clip: rect(0, 0, 0, 0) !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
}

/* Aktiv-State: durch den dummy-span funktioniert `:checked + .btn` nicht
   – stattdessen `+ .radio-custom-dummy + .btn`, plus :has-Fallback für
   den initialen `checked`-Zustand der frisch geladenen Seite. */
.designer-terminplaner-deckblatt-ausrichtung.btn-group .btn-check:checked + .radio-custom-dummy + .btn,
.designer-terminplaner-deckblatt-ausrichtung.btn-group .btn-check:checked + .btn {
  z-index: 1;
  color: var(--bs-btn-active-color);
  background-color: var(--bs-btn-active-bg);
  border-color: var(--bs-btn-active-border-color);
}
.designer-terminplaner-deckblatt-ausrichtung.btn-group .btn-check:focus-visible + .radio-custom-dummy + .btn,
.designer-terminplaner-deckblatt-ausrichtung.btn-group .btn-check:focus-visible + .btn {
  z-index: 2;
  box-shadow: var(--bs-btn-focus-box-shadow);
}
.designer-terminplaner-deckblatt-ausrichtung.btn-group .btn-check:disabled + .radio-custom-dummy + .btn,
.designer-terminplaner-deckblatt-ausrichtung.btn-group .btn-check:disabled + .btn {
  pointer-events: none;
  opacity: var(--bs-btn-disabled-opacity);
}


/* =============================================================
   Aus designer.css kopierte Styles für konfigurator-dailymax-perfect
   ============================================================= */

/* --- lds-ellipsis (Spinner) --- */
.lds-ellipsis {
  display: block;
  width:70px;
  height:15px;
}
.lds-ellipsis div {
  position: absolute;
  top: 0px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #c0b399;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
  -webkit-animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
  -webkit-animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite;
  -webkit-animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite;
  -webkit-animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite;
  -webkit-animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}

/* --- Schlagschatten / Runde Ecken --- */
.schlagschatten-klein, .ssk {
  box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
  -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
  -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
  /*filter:progid:dxImageTransform.Microsoft.dropShadow(color=#999,offX=1,offY=2 positive=true);*/
}
.rundeecken,.re {
  -moz-border-radius:5px 5px 5px 5px;
  -webkit-border-radius:5px 5px 5px 5px;
  -khtml-border-radius:5px 5px 5px 5px;
  -o-border-radius:5px 5px 5px 5px;
  border-radius:5px 5px 5px 5px;
}
.rundeecken-oben, .reo {
  -moz-border-radius:4px 4px 0 0;
  -webkit-border-radius:4px 4px 0 0;
  -khtml-border-radius:4px 4px 0 0;
  -o-border-radius:4px 4px 0 0;
  border-radius:4px 4px 0 0;
}
.rundeecken-unten, .reu {
  -moz-border-radius:0 0 4px 4px;
  -webkit-border-radius:0 0 4px 4px;
  -khtml-border-radius:0 0 4px 4px;
  -o-border-radius:0 0 4px 4px;
  border-radius:0 0 4px 4px;
}
.rundeecken-klein, .rek {
  -moz-border-radius: 4px 4px 4px 4px;
  -webkit-border-radius: 4px 4px 4px 4px;
  -khtml-border-radius: 4px 4px 4px 4px;
  -o-border-radius: 4px 4px 4px 4px;
  border-radius: 4px 4px 4px 4px;
}

/* --- Designer-Terminplaner-Teaser --- */

.designer-terminplaner-teaser .designer-terminplaner-teaser-headline {
  font-weight: 700;
  font-size:32px;
  text-align: center;
}
.designer-terminplaner-teaser .designer-terminplaner-teaser-link {
  text-align: center;
}
.designer-terminplaner-teaser .designer-terminplaner-teaser-link .designer-terminplaner-konfig-startdatum {
  width:80% !important;
  font-size:20px;
  margin-bottom: 20px;
}

/* --- Designer Buttons (designer-button*) --- */
.designer-button {
  border-radius: 3px;
  background-color:#f3f3f3;
  border:solid 1px #999;
  color:#555;
  font-size:12px;
}
.designer-button:hover {
  border-radius: 3px;
  background-color:#fff;
  border:solid 1px #aaa;
  color:#666;
}
.designer-button-dunkel {
  border-radius: 3px;
  background-color:#666;
  border-color:#333;
  color:white;
  font-weight:bold;
  font-size:12px;
}
.designer-button-dunkel:hover {
  border-radius: 3px;
  background-color:#777;
  border-color:#444;
  color:white;
}
.designer-button-blau {
  border-radius: 3px;
  background-color:#0a64a3;
  border-color:#0a64a3;
  color:white;
  font-weight:bold;
  font-size:12px;
}
.designer-button-blau:hover {}

/* --- Designer Fancy Dropdown / Panel Dropdown --- */
.designer-fancy-dropdown {
  padding: 0rem 2.5rem 0rem 0.625rem;
  line-height: 2.125rem;
  border-radius: 3px;
  background-clip: padding-box;
  background-color: #fff;
  background-image: linear-gradient(to bottom, #fff 0%, #f8f8f8 100%);
  height: 36px;
  /*100%;*/
  width: 100%;
  display: block;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
  border: 1px solid #dedede;
  font-size:13px;
  position:relative;
  color:#666;
}
.designer-fancy-dropdown.small {
  line-height: 1.75rem;
  font-size: 11px;
}
.designer-fancy-dropdown:hover {
  color: #645f59;
  border-color: #827e79;
  text-decoration: none;
  color:#444;
}
.designer-fancy-dropdown::after {
  width: 1.875rem;
  height: 2.5rem;
  top: 0.0625rem;
  -webkit-user-select: none;
  user-select: none;
  line-height: 2.125rem;
  max-height: 100%;
  display: block;
  content: "\f0d7";
  position: absolute;
  right: 0;
  font-size: 11px;
  border-left: 1px solid #dedede;
  text-align: center;
  font-family: 'Font Awesome 5 Pro';
  pointer-events: none;
}
/* panel-select */
.designer-panel-select {
  width:100%;
  height:24px;
  border: solid 1px #999;
  padding:4px 5px 3px 5px;
  font-size:11px;
  color:#666;
  display:flex;
  flex-direction:row;
  margin-bottom: 4px;
}
.designer-panel-select span:first-child {
  flex:1;
  flex-grow: 1;
  text-align:center;
}
.designer-panel-select span:last-child {
  width:12px;
  color:#999;
}
/* panel-dropdown */
/* .designer-panel-dropdown* gehoeren zum Designer (siehe designer.css ab Z. 1807),
   nicht zum Konfigurator. Frueher hier doppelt definiert — entfernt. */

/* --- Designer-Terminplaner Hauptblock (Mobile/Default) --- */
/* Terminplaner-Konfigurator*/
.designer-terminplaner {
  display:none;
  width:100%;
  height:90%;
  position:fixed;
  bottom:0px;
  left:0px;
  z-index: 50000;
  border-top:solid 1px black;
  /*border-bottom:solid 1px black;*/
  border-radius: 0px;
  padding:0px;
  background-color: white;
  box-shadow: 0px -2px 3px rgba(0,0,0,0.2);
  /* overflow-y: auto; */
}
.designer-terminplaner .popup-close {
  position:absolute;
  top:7px;
  right:7px;
}
.designer-terminplaner .popup-close .fas {
  font-size:30px;
  color:#e0e0e0;
}
.designer-terminplaner .popup-close .fas:hover {
  font-size:30px;
  color:#cccccc;
}
.designer-terminplaner .popup-close .btn-popup-close {
  width:40px;
  height:40px;
  border-radius:20px;
  background-color:gray;
}
.designer-terminplaner .popup-close .btn-popup-close .fas {
  font-size:20px;
  color:white;
  line-height: 40px;
  margin:0;
}
.designer-terminplaner .dunkel {
  background-color:#f9f6f3;
  padding:6px 10px;
  overflow:hidden;
  border-radius:6px;
}
.designer-terminplaner .hell {
  background-color:#f9f6f3;
  padding:6px 10px;
  overflow:hidden;
  border-radius:6px;
}
.designer-terminplaner .designer-terminplaner-laden {
  display:none;
  width:100%;
  height:100%;
  border:none;
  background-color:rgba(255,255,255,0.85);
  text-align:center;
  padding:0;
  border-radius: 0px;
  position:absolute;
  z-index: 50001;
  top:0px;
  left:0px;
}
.designer-terminplaner .designer-terminplaner-laden img {
  width:180px;
  height:auto;
  margin:0 auto;
  margin-bottom:12px;
}
.designer-terminplaner .designer-terminplaner-laden .designer-terminplaner-laden-text {
  position: absolute;
  top:calc(50% - 100px);
  left:0px;
  width:100%;
  font-size:20px;
  font-weight:400;
  font-style:normal;
  text-align: center;
  color:#a29e9a;
}
.designer-terminplaner .designer-terminplaner-laden .designer-terminplaner-laden-fehler {
  display:none;
  position: absolute;
  top:calc(50% - 100px);
  left:0px;
  width:100%;
  font-size:16px;
  font-weight:600;
  font-style:italic;
  text-align: center;
  color:darkred;
}
.designer-terminplaner .designer-terminplaner-laden .designer-terminplaner-laden-spinner {
  display: block;
  position: absolute;
  top:calc(50%);
  left:calc(50% - 35px);
}
.designer-terminplaner .designer-terminplaner-laden .designer-terminplaner-laden-spinner div {
  background: #a29e9a;
}
.designer-terminplaner .designer-terminplaner-content, .designer-terminplaner .designer-terminplaner-freigabe {
  padding:20px;
  overflow-y: auto;
  height:100%;
}
.designer-terminplaner .designer-terminplaner-content h2, .designer-terminplaner .designer-terminplaner-freigabe h2, .designer-terminplaner .designer-terminplaner-content h2 a, .designer-terminplaner .designer-terminplaner-freigabe h2 a {
  margin-top:10px;
  font-size:30px;
  color: #7c9ab2;
  font-weight:400;
  line-height: normal;
  text-align: center;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile {
  border-top:dotted 1px #999;
  /*border-bottom:dotted 1px #999;*/
  padding:20px 0 20px 0;
  display:flex;
  flex-direction:row;
  flex-wrap: wrap;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile h3, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile h3 {
  margin-top:0;
  margin-bottom:20px;
  color:white;
  font-weight:600;
  background-color:#777;
  padding:5px 10px 5px 10px;
  border-radius: 2px;
  font-size:20px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile h3 span, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile h3 span {
  font-weight: 300;
  font-style: italic;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-center, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-center {
  width:100%;
  text-align:center;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-links, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-links {
  width:100%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-links img, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-links img {
  margin-bottom:10px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-rechts, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-rechts {
  width: 100%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile label, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile label {
  font-weight: 600;
  font-size:12px;
  display:inline-block;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile input[type="color"] {
  width:100%;
  height:50px;
  /*margin-top:5px;*/
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile input[type="text"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile input[type="text"] {
  margin-top:5px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .select-field, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .select-field {
  margin-top:5px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile div {
  margin-bottom:5px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-div {
  margin-top:10px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-rechts-bestellen, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-rechts-bestellen {
  text-align:center;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-save, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-save {
  width:100%;
  height:85px;
  text-align: center;
  background-color: #ffa718;
  color:white;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  border-color:#dd8b06;
  font-size: 17px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-save:hover, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-save:hover {
  background-color: #e6991c;
  border-color: #bc780c;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-save i, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-save i {
  font-size: 22px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-zurueck, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-zurueck {
  width:100%;
  margin-top:20px;
  text-align: center;
  border:solid 1px #999;
  background-color: #ffffff;
  transition: all .6s ease;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-zurueck:hover, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-zurueck:hover {
  border:solid 1px #ccc;
  background-color: #f0f0f0;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-konto-speichern, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-konto-speichern {
  width:100%;
  margin-top:20px;
  text-align: center;
  border:solid 1px #999;
  background-color: #9f9f9f;
  color:white;
  transition: all .6s ease;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-konto-speichern:hover, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-konto-speichern:hover {
  border:solid 1px #666;
  background-color: #6f6f6f;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-box, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-box {
  margin-bottom:15px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-box > div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-box > div {
  margin:10px 10px 0 0;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-wochentag, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-wochentag {
  width: 100%;
  display: flex;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-wochentag input[type="text"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-wochentag input[type="text"] {
  width:90%;
  margin-left:10px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-wochentag input[type="checkbox"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-wochentag input[type="checkbox"] {
  /*line-height:40px;*/
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-tageansicht, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-tageansicht {
  width: 100%;
  line-height:30px;
  /*clear:left;*/
  /*height:180px;*/
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-flex, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-flex {
  flex-direction: column;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-flex .designer-terminplaner-flex-div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-flex .designer-terminplaner-flex-div {
  margin-bottom:0;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-feiertage, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-feiertage {
  width:55%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-beginn, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-beginn, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-ende, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-pause-beginn, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-pause-beginn, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-pause-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-pause-ende {
  width:45%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-takt, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-takt {
  width:100%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-beginn, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-beginn, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-ende, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-pause-beginn, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-pause-beginn, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-pause-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-pause-ende {
  float:left;
  margin-right:20px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-ohnedatum, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-ohnedatum {
  font-weight: 600;
  margin-bottom:25px !important;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-ohnedatum input[type="checkbox"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-ohnedatum input[type="checkbox"] {
  margin-right:12px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-datum b, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-datum b {
  color:#319600;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-datum-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-datum-ende {
  margin:12px 0 12px 0;
  /*display:none;*/
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-datum-ende b, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-datum-ende b {
  color: #ac0035;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spaltenjetag, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spaltenjetag {
  width:65%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte {
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  background-color:#f9f6f3;
  padding:6px 15px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte h4, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte h4, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte h4, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte h4 {
  font-size:16px;
  font-style: italic;
  /*text-decoration: underline;*/
  color:#c0a27e;
  margin:0 0 5px 0;
  display:inline-block;
  width:100%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung {
  width:70%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung input, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung input, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung input, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung input {
  width:90%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe {
  width:30%;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe input[type="color"], .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe input[type="color"] {
  width:100%;
  height:40px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-format, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-format {
  font-size: 15px;
  /*line-height: 30px;*/
  border-bottom: dotted 1px #999;
  padding: 10px 0 10px 5px;
  margin:0;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-format i, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-format i {
  color:#aaa;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-format.highlight, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-format.highlight {
  background-color:#f8fff4;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-format.highlight i, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-format.highlight i {
  color:#57972d;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe {
  width:100%;
  margin-bottom:20px !important;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung input[type="color"], .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe input[type="color"] {
  width:100%;
  height:50px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung textarea, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung textarea, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe textarea, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe textarea {
  width:100%;
  margin-top:5px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung label, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung label, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe label, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe label {
  line-height: 26px;
  font-size: 11px;
  margin-right:15px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung input[type="radio"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung input[type="radio"], .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe input[type="radio"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe input[type="radio"] {
  margin-right:4px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung .designer-terminplaner-deckblatt-ausrichtung, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung .designer-terminplaner-deckblatt-ausrichtung, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe .designer-terminplaner-deckblatt-ausrichtung, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe .designer-terminplaner-deckblatt-ausrichtung {
  padding-top:10px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung .designer-terminplaner-deckblatt-ausrichtung span, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung .designer-terminplaner-deckblatt-ausrichtung span, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe .designer-terminplaner-deckblatt-ausrichtung span, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe .designer-terminplaner-deckblatt-ausrichtung span {
  width:49%;
  display: inline-block;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-schriftart, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-schriftart, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung-farbe, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung-farbe {
  width:50%;
  margin-bottom:20px !important;
  position: relative;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-galerie, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-galerie {
  border:solid 1px #ccc;
  border-radius: 3px;
  padding:10px;
  margin-top:5px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-galerie .slick-slide, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-galerie .slick-slide {
  padding:5px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-galerie .designer-terminplaner-galerie-item, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-galerie .designer-terminplaner-galerie-item {
  background-color: #fcfcfc;
  display:block;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-galerie .designer-terminplaner-galerie-item:hover, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-galerie .designer-terminplaner-galerie-item:hover {
  box-shadow: 1px 0px 3px 2px rgba(0,0,0,0.15);
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-galerie .designer-terminplaner-galerie-item.selected, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-galerie .designer-terminplaner-galerie-item.selected {
  box-shadow: 1px 0px 3px 2px rgba(32,175,13,0.8);
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-galerie div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-galerie div {
  margin-bottom:0;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-galerie-remove, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-galerie-remove {
  position: absolute;
  top:-25px;
  right:-10px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-galerie-remove a, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-galerie-remove a {
  display: block;
  width:36px;
  height:36px;
  background-color: rgba(191,17,17, 0.5);
  border-radius: 50%;
  text-align: center;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-galerie-remove a i, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-galerie-remove a i {
  font-size:20px;
  color:white;
  line-height:35px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-head, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-head {
  font-weight:bold;
  font-size:15px;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-flex, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-flex {
  display:flex;
  flex-direction: column;
}
.designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-flex .designer-terminplaner-flex-div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-flex .designer-terminplaner-flex-div {
  flex:1;
  flex-grow: 1;
  padding-right:10px;
}
.designer-terminplaner .designer-terminplaner-content input[type="radio"], .designer-terminplaner .designer-terminplaner-freigabe input[type="radio"] {
  margin-right:12px;
}
.designer-terminplaner .designer-terminplaner-content label, .designer-terminplaner .designer-terminplaner-freigabe label {
  font-weight: 400;
  font-size:13px;
  margin-right:25px;
}
.designer-terminplaner .designer-terminplaner-freigabe {
  display:none;
}
.designer-terminplaner .designer-terminplaner-freigabe h3 {
  font-size:20px;
  /*color:#c0a27e;*/
  margin:0 0 10px 0;
  /*display:inline-block;*/
  /*width:100%;*/
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile img {
  max-width:32%;
  max-height:500px;
  margin-right:1.88%;
  box-shadow: 1px 3px 10px rgba(0,0,0,0.2);
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile img:last-child {
  margin-right:0;
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-links-details div {
  display:flex;
  flex-direction: row;
  padding:5px 0 5px 0;
  border-bottom:solid 1px #f0f0f0;
  width:90%;
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-links-details div span:first-child {
  width:40%;
  display:inline-block;
  vertical-align: top;
  font-size:12px;
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-links-details div span:last-child {
  width:60%;
  font-style: italic;
  display:inline-block;
  font-size:12px;
}
.designer-terminplaner .designer-terminplaner-freigabe .konfigurator-save-button {
  width:100%;
  height:85px;
  text-align: center;
  background-color: #64ca64;
  color:white;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  border-color: #51a351;
  font-size: 17px;
}
.designer-terminplaner .designer-terminplaner-freigabe .konfigurator-save-button:hover {
  background-color: #81df81;
  border-color: #51a351;
}
.designer-terminplaner .designer-terminplaner-freigabe .konfigurator-save-button i {
  font-size: 22px;
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-warenkorb, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zum-warenkorb {
  width:100%;
  text-align: center;
  background-color: #7a9d6b;
  color:white;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  border-color:#7a9d6b #6b8b5d #5d7c50;
  border-style:solid;
  border-width:1px;
  box-shadow:0 1px #96b487 inset;
  border-radius: 5px;
  font-size:17px;
  line-height:70px;
  height:80px;
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-warenkorb:hover, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zum-warenkorb:hover {
  background-color: #6b8b5d;
  border-color: #5d7c50;
  color:white;
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-testpdf {
  font-size:15px;
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-testdruck {
  width:100%;
  font-size:15px;
  text-align: center;
  background-color: #ebdada;
  color:#c30808;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
  border-color:#c30808;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 20px;
}
.designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-testdruck:hover {
  background-color: #f8f2f2;
  border-color: #dd2c2c;
}
.designer-terminplaner .konfigurator-foto {
  border:solid 1px #ccc;
  padding:5px;
  border-radius: 10px;
  max-width:100%;
  width:100%;
  min-height:200px;
  height:auto;
  background-color:white;
  cursor:pointer;
  margin:10px 0 0 0;
  display:flex;
  flex-direction: column;
  position: relative;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload {
  flex-grow: 1;
  border:dotted 3px #e0e0e0;
  border-radius:8px;
  width:100%;
  height:100%;
  padding:20px 15px 15px;
  margin-bottom:0px !important;
  display:flex;
  align-items: center;
  justify-content: center;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload div.dz-message {
  font-size:12px;
  color: #0b6dbe;
  line-height:1.5em;
  cursor:pointer;
  text-align: center;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload div.dz-message img {
  margin:0 auto 6px;
  display:block;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-preview {
  position: relative;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-image img {
  display:inline-block;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-size {
  display:none;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-filename {
  font-size:12px;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-success-mark {
  position:absolute;
  top:50%;
  left:50%;
  width:1px;
  height:1px;
  border-radius:50%;
  background-color:green;
  padding:2px;
  opacity:0;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-success-mark svg {
  width:100%;
  height:100%;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-error-mark {
  display:none;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-remove {
  position:absolute;
  top:12px;
  right:12px;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-remove a {
  display: block;
  width:36px;
  height:36px;
  background-color: rgba(191,17,17, 0.5);
  border-radius: 50%;
  text-align: center;
}
.designer-terminplaner .konfigurator-foto .konfigurator-foto-upload .dz-remove a i {
  font-size:20px;
  color:white;
  line-height:35px;
}
.designer-terminplaner-view-details {
  color:#444;
  font-weight:400;
  font-size:12px;
  text-align: left;
  margin-top:10px;
}
.designer-terminplaner-view-details h3 {
  display:none;
}
.designer-terminplaner-view-details div {
  display:flex;
  flex-direction: row;
  padding:4px 0 4px 0;
  border-bottom:solid 1px #f0f0f0;
  width:100%;
}
.designer-terminplaner-view-details div span:first-child {
  width:40%;
  display:inline-block;
  vertical-align: top;
}
.designer-terminplaner-view-details div span:last-child {
  width:60%;
  font-style: italic;
  display:inline-block;
}
.designer-terminplaner-view-images {
  display:flex;
  flex-direction: row;
}
.designer-terminplaner-view-images .designer-terminplaner-view-image {
  width:32%;
  margin-right:1.88%;
}
.designer-terminplaner-view-images .designer-terminplaner-view-image img {
  width:100%;
  height:auto;
  box-shadow: 1px 3px 10px rgba(0,0,0,0.2);
}
.designer-terminplaner-konfig-button {
  font-size:26px;
  color:white;
  font-weight: 500;
  background-color: #009dd2 !important;
  text-align: center;
  padding:30px 18px 35px 18px;
  transition: all 0.6s ease-out;
  border-radius: 6px;
  border:none;
  width:100%;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  line-height: 1.4;
  /*font-family: 'Merriweather';*/
  margin-bottom:20px;
}
.designer-terminplaner-konfig-button img {
  width:340px;
  margin: 25px auto 15px;
  transition: all 0.6s ease-out;
}
.designer-terminplaner-konfig-button small {
  font-size: 13px;
  font-weight: normal;
  font-family: 'Nunito','Open Sans',Sans-serif;
}
.designer-terminplaner-konfig-button:hover {
  background-color: #0988b3 !important;
}
.designer-terminplaner-konfig-button:hover img {
  width:370px;
  transition: all 0.6s ease-out;
}
.designer-terminplaner-teaser {
  padding-bottom:30px;
}
.designer-terminplaner-teaser-new.border,
.designer-terminplaner-teaser-view {
  border: solid 1px #ccc;
  padding:15px;
  text-align: center;
  color:#444;
  font-weight:bold;
  font-size:16px;
  background-color:#fff;
  border-radius: 3px;
  /*display: none;*/
  margin-bottom:15px;
  position:relative;
}
input[type="text"].designer-terminplaner-konfig-startdatum {
  margin:0;
  width:100%;
  text-align: center;
}
.designer-terminplaner-startdatum-laden {
  background-color:rgba(255,255,255,0.8);
  width:100%;
  height:100%;
  position:absolute;
  left:0;
  top:0;
  padding-top:50px;
  text-align: center;
  display:none;
}
.designer-terminplaner-startdatum-laden img {
  margin:0 auto;
  width:50px;
  opacity: 0.5;
}
.designer-terminplaner-startdatum-laden .designer-terminplaner-startdatum-laden-text {
  margin-top:25px;
  font-weight:400;
  font-style: italic;
  /*color:#0B489D;*/
}
.designer-terminplaner-view-details-startdatum {
  font-size:14px;
  font-weight:400;
}
.designer-terminplaner-konfig-uebernehmen,
.designer-terminplaner-konfig-aendern {
  width:100%;
  height:34px;
  border-radius: 3px;
  /*background-color: #6fa7e9;*/
  /*border: solid 1px #477ab6;*/
  color:#fff;
  text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
  /*font-weight: 400;*/
  font-size:14px;
  line-height: 32px;
  cursor: pointer;
  margin:0;
}
.designer-terminplaner-konfig-uebernehmen:hover, .designer-terminplaner-konfig-aendern:hover {
  background-color: #80b5f4;
  border: solid 1px #4c86ca;
  /*text-shadow: 0px 2px 3px rgba(0,0,0,0.4);*/
}

.colorpickle {
  width:500px !important;
  z-index: 51000 !important;
}
.colorpickleModalOverlay {
  z-index: 50999 !important;
}

/* --- Media Query: 30em --- */
@media screen and (min-width: 30em) {
  /* ----------- bisher --------------------*/
  .designer-article-teaser {
    /*display: none;*/
    display:flex;
  }
}

/* --- Media Query: 48em (Desktop) --- */
@media screen and (min-width: 48em) {
  /* ----------- bisher --------------------*/
  .designer-terminplaner {
    width:65%;
    height:90%;
    position:fixed;
    top:5%;
    left:20%;
    z-index: 50000;
    border:solid 2px black;
    border-radius: 5px;
    padding:0px;
  }
  .designer-terminplaner .designer-terminplaner-content, .designer-terminplaner .designer-terminplaner-freigabe {
    margin: 0px;
  }
  .designer-terminplaner .designer-terminplaner-content h2, .designer-terminplaner .designer-terminplaner-freigabe h2, .designer-terminplaner .designer-terminplaner-content h2 a, .designer-terminplaner .designer-terminplaner-freigabe h2 a {
    margin-top: 10px;
    font-size: 30px;
    color: #7c9ab2;
    font-weight: 400;
  }
  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile h3, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile h3 {
    margin-top: 0;
    margin-bottom: 20px;
    color: white;
    font-weight: 600;
    background-color: #777;
    padding: 5px 10px 5px 10px;
    border-radius: 2px;
  }
  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-center, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-center {
    width: 100%;
    text-align: center;
  }
  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-links, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-links {
    width: 55%;
    min-width: 200px;
    padding-right: 20px;
  }
  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-rechts, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-rechts {
    width: 45%;
  }
  .is--ctl-designerlayouts.is--user .sidebar-main {
    display: block;
  }
  .is--ctl-designerlayouts.is--user .sidebar-main + .content--wrapper {
    margin-left: 260px;
  }
  .is--ctl-is--ctl-designerlayouts .sidebar-main .categories--headline, .is--ctl-is--ctl-designerlayouts .sidebar-main .categories--navigation, .is--ctl-is--ctl-designerlayouts .sidebar-main .shop-sites--container {
    display: none;
  }
  .designer-article-teaser {
    display: flex;
    justify-content: center;
  }
  .designer-category-teaser-button {
    cursor:pointer;
  }
  .designer-category-teaser-button div {
    display:block;
  }
  .designer-category-teaser-button .banner-content {
    padding-top:20px;
    padding-bottom: 20px;
  }
  .designer-category-teaser-button img {
    box-shadow: 0 0 0px 0px transparent;
    transition: all 0.5s ease;
  }
  .designer-category-teaser-button:hover img {
    box-shadow: 1px 1px 10px 5px rgba(0,132,255,0.4);
  }
}
@media screen and (min-width: 64em) {
  .designer-terminplaner-konfig-button {
    font-size: 32px;
    padding: 30px 0 35px 0;
  }

  .designer-terminplaner-teaser-new.border,
  .designer-terminplaner-teaser-view {
    border: solid 1px #ccc;
    padding: 15px;
    text-align: center;
    color: #444;
    font-weight: bold;
    font-size: 16px;
    background-color: #fff;
    border-radius: 3px;
    /*display: none;*/
    margin-bottom: 15px;
    position: relative;
  }

  input[type="text"].designer-terminplaner-konfig-startdatum {
    margin: 0;
    width: 55% !important;
  }

  .designer-terminplaner-startdatum-laden {
    background-color: rgba(255, 255, 255, 0.8);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    padding-top: 15px;
    display: none;
  }

  .designer-terminplaner-startdatum-laden img {
    margin: 0 auto;
  }

  .designer-terminplaner-startdatum-laden .designer-terminplaner-startdatum-laden-text {
    margin-top: 15px;
    font-weight: 400;
    font-style: italic;
    color: #0B489D;
  }

  .designer-terminplaner-view-details-startdatum {
    font-size: 14px;
    font-weight: 400;
  }

  .designer-terminplaner-konfig-uebernehmen,
  .designer-terminplaner-konfig-aendern {
    width: 100%;
    height: 34px;
    border-radius: 3px;
    /*background-color: #6fa7e9;*/
    /*border: solid 1px #477ab6;*/
    color: #fff;
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3);
    /*font-weight: 400;*/
    font-size: 14px;
    line-height: 32px;
    cursor: pointer;
    margin: 0;
  }

  .designer-terminplaner-konfig-uebernehmen:hover, .designer-terminplaner-konfig-aendern:hover {
    background-color: #80b5f4;
    border: solid 1px #4c86ca;
    /*text-shadow: 0px 2px 3px rgba(0,0,0,0.4);*/
  }

  .designer-buttons {
    margin-top: 15px;
    padding-right: 0px !important;
  }

  .designer-button-abbrechen {
    transition: all 0.5s;
    width: 160px;
    height: 45px;
    border-radius: 3px;
    background-color: #eee;
    border: solid 1px #999;
    color: #999;
    font-weight: normal;
    font-size: 20px;
  }

  .designer-button-abbrechen:hover {
    background-color: #fff;
    border: solid 1px #777;
  }

  .designer-button-abbrechen text {
    display: inline-block;
  }

  .designer-button-abbrechen i {
    display: none;
  }

  .designer-button-speichern,
  .designer-button-warenkorb-speichern {
    transition: all 0.5s;
    width: 320px;
    height: 45px;
    border-radius: 3px;
    background-color: #4ab900;
    border: solid 1px #368501;
    color: #fff;
    font-weight: normal;
    font-size: 20px;
  }

  .designer-button-speichern:hover, .designer-button-warenkorb-speichern:hover {
    background-color: #61cc1a;
    border: solid 1px #368501;
  }

  .designer-button-speichern text, .designer-button-warenkorb-speichern text {
    display: inline-block;
  }

  .designer-button-speichern i, .designer-button-warenkorb-speichern i {
    display: none;
  }

  .designer-button-bearbeiten {
    transition: all 0.5s;
    width: 220px;
    height: 45px;
    border-radius: 3px;
    background-color: #eeeeee;
    border: solid 1px #999999;
    color: #368501;
    font-weight: normal;
    font-size: 20px;
  }

  .designer-button-bearbeiten:hover {
    background-color: #fcfcfc;
    border: solid 1px #777777;
  }

  .designer-button-bearbeiten text {
    display: inline-block;
  }

  .designer-button-bearbeiten i {
    display: none;
  }

  .designer-button-pdf-speichern,
  .designer-button-konto-speichern {
    border-radius: 3px;
    background-color: #eee;
    border: solid 1px #777;
    color: #666;
    font-weight: normal;
    font-size: 20px;
    order: 10;
  }

  .designer-button-pdf-speichern text, .designer-button-konto-speichern text {
    display: inline-block;
  }

  .designer-button-pdf-speichern i, .designer-button-konto-speichern i {
    display: none;
  }

  .designer-button-pdf-speichern:hover,
  .designer-button-konto-speichern:hover {
    background-color: #fff;
    border: solid 1px #555;
    color: #555;
  }

  .designer-button-konto-speichern {
    display: block;
    order: 8;
  }

  /* panel-dropdown gehoert zum Designer (siehe designer.css), nicht hierher.
     Duplikate aus dem Konfigurator-Stylesheet entfernt. */

  .designer-left-vorschau-buttons .designer-button-pdf-speichern {
    order: 2;
  }

  .designer-left-vorschau-buttons .designer-button-bearbeiten {
    order: 10;
  }

  .designer-left-vorschau-buttons .designer-button-konto-speichern {
    order: 5;
  }

  .designer-button {
    border-radius: 3px;
    background-color: #f3f3f3;
    border: solid 1px #999;
    color: #555;
    font-size: 12px;
  }

  .designer-button:hover {
    border-radius: 3px;
    background-color: #fff;
    border: solid 1px #aaa;
    color: #666;
  }

  .designer-button-dunkel {
    border-radius: 3px;
    background-color: #666;
    border-color: #333;
    color: white;
    font-weight: bold;
    font-size: 12px;
  }

  .designer-button-dunkel:hover {
    border-radius: 3px;
    background-color: #777;
    border-color: #444;
    color: white;
  }

  /* Terminplaner*/
  .designer-terminplaner {
    display: none;
    width: 65%;
    height: 90%;
    position: fixed;
    top: 5%;
    left: 20%;
    z-index: 50000;
    border: solid 2px black;
    border-radius: 5px;
    padding: 0px;
    background-color: white;
    /* overflow-y: auto; */
  }

  .designer-terminplaner .popup-close {
    position: absolute;
    top: 15px;
    right: 15px;
  }

  .designer-terminplaner .popup-close .fas {
    font-size: 40px;
    color: #e0e0e0;
    /*line-height: 40px;*/
    /*margin:0;*/
  }

  .designer-terminplaner .popup-close .fas:hover {
    font-size: 40px;
    color: #cccccc;
    /*line-height: 40px;*/
    /*margin:0;*/
  }

  .designer-terminplaner .popup-close .btn-popup-close {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background-color: gray;
  }

  .designer-terminplaner .popup-close .btn-popup-close .fas {
    font-size: 20px;
    color: white;
    line-height: 40px;
    margin: 0;
  }

  .designer-terminplaner .designer-terminplaner-content, .designer-terminplaner .designer-terminplaner-freigabe {
    padding: 40px;
    overflow-y: auto;
    height: 100%;
  }

  .designer-terminplaner .designer-terminplaner-content h2, .designer-terminplaner .designer-terminplaner-freigabe h2, .designer-terminplaner .designer-terminplaner-content h2 a, .designer-terminplaner .designer-terminplaner-freigabe h2 a {
    margin-top: 10px;
    font-size: 30px;
    color: #7c9ab2;
    font-weight: 400;
    line-height: normal;
    text-align: left;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile {
    border-top: dotted 1px #999;
    /*border-bottom:dotted 1px #999;*/
    padding: 20px 0 20px 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile h3, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile h3 {
    margin-top: 0;
    margin-bottom: 20px;
    color: white;
    font-weight: 600;
    background-color: #777;
    padding: 5px 10px 5px 10px;
    border-radius: 2px;
    font-size: 22px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile h3 span, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile h3 span {
    font-weight: 300;
    font-style: italic;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-center, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-center {
    width: 100%;
    text-align: center;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-links, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-links {
    width: 55%;
    min-width: 200px;
    padding-right: 20px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-rechts, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-rechts {
    width: 45%;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile label, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile label {
    font-weight: 600;
    font-size: 12px;
    display: inline-block;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile input[type="color"] {
    width: 100%;
    height: 50px;
    /*margin-top:5px;*/
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile input[type="text"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile input[type="text"] {
    margin-top: 5px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .select-field, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .select-field {
    margin-top: 5px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile div {
    margin-bottom: 5px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-div {
    margin-top: 10px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-rechts-bestellen, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-rechts-bestellen {
    text-align: center;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-save, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-save {
    width: 100%;
    height: 85px;
    text-align: center;
    background-color: #ffa718;
    color: white;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    border-color: #dd8b06;
    font-size: 17px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-save:hover, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-save:hover {
    background-color: #ca8515;
    border-color: #af710a;
    cursor: pointer;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-save i, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-save i {
    font-size: 22px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-zurueck, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-zurueck {
    width: 80%;
    margin-top: 20px;
    text-align: center;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-konto-speichern, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-konto-speichern {
    width: 80%;
    margin-top: 20px;
    text-align: center;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-box, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-box {
    margin-bottom: 15px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-box > div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-box > div {
    margin: 10px 10px 0 0;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-wochentag, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-wochentag {
    width: 100%;
    /*line-height:30px;*/
    /*clear:left;*/
    /*height:180px;*/
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-wochentag input[type="text"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-wochentag input[type="text"] {
    width: 50%;
    margin-left: 10px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-tageansicht, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-tageansicht {
    width: 100%;
    line-height: 30px;
    /*clear:left;*/
    /*height:180px;*/
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-flex, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-flex {
    flex-direction: column;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-flex .designer-terminplaner-flex-div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-flex .designer-terminplaner-flex-div {
    margin-bottom: 0;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-tageansicht-seiten, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-tageansicht .designer-terminplaner-tageansicht-seiten {
    flex-direction: row;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-grundfarbe-div input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-grundfarbe-div input[type="color"] {
    width: 200px;
    height: 50px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-feiertage, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-feiertage {
    width: 55%;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-beginn, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-beginn, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-ende, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-pause-beginn, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-pause-beginn, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-pause-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-pause-ende {
    width: 45%;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-takt, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-takt {
    width: 45%;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-beginn, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-beginn, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-ende, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-pause-beginn, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-pause-beginn, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-pause-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-pause-ende {
    float: left;
    margin-right: 20px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-ohnedatum, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-ohnedatum {
    font-weight: 600;
    margin-bottom: 25px !important;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-datum b, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-datum b {
    color: #319600;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-datum-ende, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-datum-ende {
    margin: 12px 0 12px 0;
    /*display:none;*/
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-datum-ende b, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-datum-ende b {
    color: #ac0035;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spaltenjetag, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spaltenjetag {
    width: 200px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: #f9f6f3;
    padding: 6px 15px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte h4, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte h4, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte h4, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte h4 {
    font-size: 16px;
    font-style: italic;
    /*text-decoration: underline;*/
    color: #c0a27e;
    margin: 0 0 5px 0;
    display: inline-block;
    width: 100%;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung {
    width: 70%;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung input, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-beschriftung input, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung input, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-beschriftung input {
    width: 90%;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe {
    width: 30%;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-kontrollspalte .designer-terminplaner-spaltenfarbe input[type="color"], .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-spalte .designer-terminplaner-spaltenfarbe input[type="color"] {
    width: 100%;
    height: 40px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-format, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-format {
    font-size: 15px;
    /*line-height: 30px;*/
    border-bottom: dotted 1px #999;
    padding: 10px 0 10px 5px;
    margin: 0;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-format i, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-format i {
    color: #aaa;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-format.highlight, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-format.highlight {
    background-color: #f8fff4;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-format.highlight i, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-format.highlight i {
    color: #57972d;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe {
    width: 100%;
    margin-bottom: 20px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung input[type="color"], .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe input[type="color"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe input[type="color"] {
    width: 200px;
    height: 50px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung textarea, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung textarea, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe textarea, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe textarea {
    width: 100%;
    margin-top: 5px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung label, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung label, .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe label, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe label {
    line-height: 26px;
    font-size: 13px;
    margin-right: 25px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung input[type="radio"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-beschriftung input[type="radio"], .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe input[type="radio"], .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-deckblatt-farbe input[type="radio"] {
    margin-right: 7px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-head, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-head {
    font-weight: bold;
    font-size: 15px;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-flex, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-flex {
    display: flex;
    flex-direction: column;
  }

  .designer-terminplaner .designer-terminplaner-content .designer-terminplaner-zeile .designer-terminplaner-flex .designer-terminplaner-flex-div, .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile .designer-terminplaner-flex .designer-terminplaner-flex-div {
    flex: 1;
    flex-grow: 1;
    padding-right: 10px;
  }

  .designer-terminplaner .designer-terminplaner-content input[type="radio"], .designer-terminplaner .designer-terminplaner-freigabe input[type="radio"] {
    margin-right: 12px;
  }

  .designer-terminplaner .designer-terminplaner-freigabe {
    display: none;
  }

  .designer-terminplaner .designer-terminplaner-freigabe h3 {
    font-size: 20px;
    /*color:#c0a27e;*/
    margin: 0 0 10px 0;
    /*display:inline-block;*/
    /*width:100%;*/
  }

  .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile img {
    max-width: 32%;
    max-height: 500px;
    margin-right: 1.88%;
    box-shadow: 1px 3px 10px rgba(0, 0, 0, 0.2);
  }

  .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-zeile img:last-child {
    margin-right: 0;
  }

  .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-links-details div {
    display: flex;
    flex-direction: row;
    padding: 5px 0 5px 0;
    border-bottom: solid 1px #f0f0f0;
    width: 90%;
  }

  .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-links-details div span:first-child {
    width: 40%;
    display: inline-block;
    vertical-align: top;
    font-size: 12px;
  }

  .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-links-details div span:last-child {
    width: 60%;
    font-style: italic;
    display: inline-block;
    font-size: 12px;
  }

  .designer-terminplaner .designer-terminplaner-freigabe .konfigurator-save-button {
    width: 100%;
    height: 85px;
    text-align: center;
    background-color: #64ca64;
    color: white;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    border-color: #49b849;
    font-size: 17px;
  }

  .designer-terminplaner .designer-terminplaner-freigabe .konfigurator-save-button:hover {
    background-color: #78ea78;
    border-color: #4da34d;
  }

  .designer-terminplaner .designer-terminplaner-freigabe .konfigurator-save-button i {
    font-size: 22px;
  }

  .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-testpdf {
    font-size: 15px;
  }

  .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-testdruck {
    width: 50%;
    font-size: 15px;
    text-align: center;
    background-color: #ebdada;
    color: #c30808;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    border-color: #c30808;
  }

  .designer-terminplaner .designer-terminplaner-freigabe .designer-terminplaner-testdruck:hover {
    background-color: #f3e8e8;
    border-color: #ac0808;
  }

  .designer-terminplaner-view-details {
    color: #444;
    font-weight: 400;
    font-size: 12px;
    text-align: left;
    margin-top: 10px;
  }

  .designer-terminplaner-view-details h3 {
    display: none;
  }

  .designer-terminplaner-view-details div {
    display: flex;
    flex-direction: row;
    padding: 4px 0 4px 0;
    border-bottom: solid 1px #f0f0f0;
    width: 100%;
  }

  .designer-terminplaner-view-details div span:first-child {
    width: 40%;
    display: inline-block;
    vertical-align: top;
  }

  .designer-terminplaner-view-details div span:last-child {
    width: 60%;
    font-style: italic;
    display: inline-block;
  }

  .designer-terminplaner-view-images {
    display: flex;
    flex-direction: row;
  }

  .designer-terminplaner-view-images .designer-terminplaner-view-image {
    width: 32%;
    margin-right: 1.88%;
  }

  .designer-terminplaner-view-images .designer-terminplaner-view-image img {
    width: 100%;
    height: auto;
    box-shadow: 1px 3px 10px rgba(0, 0, 0, 0.2);
  }

  .designer-terminplaner-teaser-new.border,
  .designer-terminplaner-teaser-view {
    border: solid 1px #ccc;
    padding: 15px;
    text-align: center;
    color: #444;
    font-weight: bold;
    font-size: 16px;
    background-color: #fff;
    border-radius: 3px;
    /*display: none;*/
    margin-bottom: 15px;
    position: relative;
  }

  input[type="text"].designer-terminplaner-konfig-startdatum {
    margin: 0;
    width: 55% !important;
  }

  .designer-terminplaner-startdatum-laden {
    background-color: rgba(255, 255, 255, 0.8);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    padding-top: 300px;
    text-align: center;
    display: none;
  }

  .designer-terminplaner-startdatum-laden img {
    margin: 0 auto;
    width: 160px;
  }

  .designer-terminplaner-startdatum-laden .designer-terminplaner-startdatum-laden-text {
    margin-top: 30px;
    font-weight: 400;
    font-style: italic;
    font-size: 30px;
    /*color:#0B489D;*/
  }

  .designer-terminplaner-view-details-startdatum {
    font-size: 14px;
    font-weight: 400;
  }

  .designer-terminplaner-konfig-uebernehmen,
  .designer-terminplaner-konfig-aendern {
    width: 100%;
    height: 34px;
    border-radius: 3px;
    /*background-color: #6fa7e9;*/
    /*border: solid 1px #477ab6;*/
    color: #fff;
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3);
    /*font-weight: 400;*/
    font-size: 14px;
    line-height: 32px;
    cursor: pointer;
    margin: 0;
  }

  .designer-terminplaner-konfig-uebernehmen:hover, .designer-terminplaner-konfig-aendern:hover {
    background-color: #80b5f4;
    border: solid 1px #4c86ca;
    /*text-shadow: 0px 2px 3px rgba(0,0,0,0.4);*/
  }
}