/* STANDARDFARBEN */
:root { /* Text & Linkfarben */
        --kk-white-color:     #FFF;       /* einsetzen: var(--kk-white-color)      */
		--kk-grey-color:      #4c4c4c;    /* einsetzen: var(--kk-grey-color)       */
		/* BLACKVERLAUF */
        --kk-dgrey-color:     #303030;    /* einsetzen: var(--kk-dgrey-color)      */		
		/* BLAUVERLAUF */
		--kk-blauoben-color:  #28046f;    /* einsetzen: var(--kk-blauoben-color)   */
		--kk-blauunten-color: #11043e;    /* einsetzen: var(--kk-blauunten-color)  */
		/* GELBVERLAUF */
		--kk-gelboben-color:  #e5aa00;    /* einsetzen: var(--kk-gelboben-color)   */
		--kk-gelbunten-color: #b99312;    /* einsetzen: var(--kk-gelbunten-color)  */
		/* HELLGRAUVERLAUF */		
		--kk-whgrey-color:    #FAFAFA;       /* einsetzen: var(--kk-whgrey-color)  */
		--kk-silber-color:    #F0F0F0;       /* einsetzen: var(--kk-silber-color)  */
		
	}
		
/* Seiteneinstellungen */
.container-fluid { padding-top: 10px; padding-right:3px;  padding-left:3px;  margin-right:auto;  margin-left:auto;   max-width: 1800px;}
.row {   margin-right:-0px;  margin-left:-0px}

body                             { color: var(--kk-grey-color); line-height: 130%; margin: 0px; padding:0%; font-family: PTSansRegular; }
a, a:active                      { color: var(--kk-grey-color); text-decoration: none; font-family: PTSansRegular; }
a:hover                          { color: var(--kk-grey-color); text-decoration: underline; }

.white, .white a, .textwhite, .textwhite    { color: var(--kk-white-color) !important; text-decoration: none; }


/* Zentrierung & Titel */
.center { text-align: center; }

/* Standard-Absätze */
p { margin: 0px 0px 5px 0px; font-family: PTSansRegular;}


/* ÜBERSCHRIFTEN */
h1, h2, h3, h4, h5, h6, .page-title, .kk_subtitle, .kk_list_title, .kk_list_subtitle { color: var(--kk-grey-color); font-family: PTSansRegular; color: var(--kk-grey-color); line-height: 130%; font-weight: normal; text-transform: none; }


/* Spezielle Überschrift-Stile */
h1, .page-title { text-transform: uppercase; margin: 13px 0px 9px 0px; }
h2, h3, .kk_subtitle, .kk_list_title, .kk_list_subtitle, .abc-title-3 { margin: 9px 0px 5px 0px;}
h4, h5, h6 { margin: 5px 0px 0px 0px;}
.page-title { text-align: center; }

@media only screen and (max-width: 319px)
{ h1, .page-title { font-size: 16pt; } h2, .kk_subtitle, .kk_list_title, .kk_list_subtitle { font-size: 14pt; } h3, .abc-title-3 { font-size: 13pt; } h4, h5, h6 { font-size: 12pt; }}
@media only screen and (min-width: 320px)
{ h1, .page-title { font-size: 17pt; } h2, .kk_subtitle, .kk_list_title, .kk_list_subtitle { font-size: 15pt; } h3, .abc-title-3 { font-size: 14pt; } h4, h5, h6 { font-size: 13pt; }}
@media only screen and (min-width: 480px)
{ h1, .page-title { font-size: 18pt; } h2, .kk_subtitle, .kk_list_title, .kk_list_subtitle { font-size: 16pt; } h3, .abc-title-3 { font-size: 15pt; } h4, h5, h6 { font-size: 14pt; }}
@media only screen and (min-width: 768px)
{ h1, .page-title { font-size: 19pt; } h2, .kk_subtitle, .kk_list_title, .kk_list_subtitle { font-size: 17pt; } h3, .abc-title-3 { font-size: 16pt; } h4, h5, h6 { font-size: 15pt; }}
@media only screen and (min-width: 992px)
{ h1, .page-title { font-size: 20pt; } h2, .kk_subtitle, .kk_list_title, .kk_list_subtitle { font-size: 18pt; } h3, .abc-title-3 { font-size: 17pt; } h4, h5, h6 { font-size: 16pt; }}
@media only screen and (min-width: 1200px)
{ h1, .page-title { font-size: 21pt; } h2, .kk_subtitle, .kk_list_title, .kk_list_subtitle { font-size: 19pt; } h3, .abc-title-3 { font-size: 18pt; } h4, h5, h6 { font-size: 17pt; }}
@media only screen and (min-width: 1400px)
{ h1, .page-title { font-size: 22pt; } h2, .kk_subtitle, .kk_list_title, .kk_list_subtitle { font-size: 20pt; } h3, .abc-title-3 { font-size: 19pt; } h4, h5, h6 { font-size: 18pt; }}

/* Sicherstellen, dass Text-weiße H-Links auch weiß bleiben */
.white a, .white a:visited, .white a:active, .white a:hover, 
h1.white a, h1.white a:visited, h1.white a:active, h1.white a:hover, h1.white a, 
h2.white a, h2.white a:visited, h2.white a:active, h2.white a:hover, h2.white a, 
h3.white a, h3.white a:visited, h3.white a:active, h3.white a:hover, h3.white a,
h4.white a, h4.white a:visited, h4.white a:active, h4.white a:hover, h4.white a,
h5.white a, h5.white a:visited, h5.white a:active, h5.white a:hover, h5.white a,
h6.white a, h6.white a:visited, h6.white a:active, h6.white a:hover, h6.white a
{ color: var(--kk-white-color) !important; text-decoration: none;}

.white a:hover, h1.white a:hover, h2.white a:hover, h3.white a:hover, h4.white a:hover, h5.white a:hover, h6.white a:hover { color: var(--kk-white-color) !important; text-decoration: underline; }


/* !!!!!!! TEXTE & LINKS !!!!!!! */ 
/* LARGER */ 
.larger,
.larger_white,
.larger_link,
.larger_link:hover,
.larger_link:active,
.larger_link_center,
.larger_link_white,
.larger_link_white:hover,
.larger_link_white:active,
.larger_link_white a,
.larger_link_white a:hover,
.larger_link_white a:active   { font-family: PTSansRegular; line-height: 130%; font-size: 15pt; }

/* Farbvarianten */
.larger,
.larger_link,
.larger_link:hover,
.larger_link:active,
.larger_link_center           { color: var(--kk-grey-color); }

.larger_white,
.larger_link_white,
.larger_link_white:hover,
.larger_link_white:active,
.larger_link_white a,
.larger_link_white a:hover,
.larger_link_white a:active   { color: var(--kk-white-color) !important; }

/* Zentrierte Links */
.larger_link_center,
.larger_link_center a         { display: inline-block; text-align: center !important; }

/* Unterstreichung bei Hover/Aktiv */
.larger_link_center:hover, 
.larger_link:active,
.larger_link_white:active     { text-decoration: underline; }

/* MEDIUM */ 
.medium,
.medium_white,
.medium_link,
.medium_link:hover,
.medium_link:active,
.medium_link_center,
.medium_link_white,
.medium_link_white:hover,
.medium_link_white:active,
.medium_link_white a,
.medium_link_white a:hover,
.medium_link_white a:active   { font-family: PTSansRegular; line-height: 130%; font-size: 13pt; }

/* Farbvarianten */
.medium,
.medium_link,
.medium_link:hover,
.medium_link:active,
.medium_link_center           { color: var(--kk-grey-color); }

.medium_white,
.medium_link_white,
.medium_link_white:hover,
.medium_link_white:active,
.medium_link_white a,
.medium_link_white a:hover,
.medium_link_white a:active   { color: var(--kk-white-color) !important; }

/* Zentrierte Links */
.medium_link_center,
.medium_link_center a         { display: inline-block; text-align: center !important; }

/* Unterstreichung bei Hover/Aktiv */
.medium_link_center:hover, 
.medium_link:active,
.medium_link_white:active     { text-decoration: underline; }


/* SMALLER */ 
.smaller,
.smaller_white,
.smaller_link,
.smaller_link:hover,
.smaller_link:active,
.smaller_link_center,
.smaller_link_white,
.smaller_link_white:hover,
.smaller_link_white:active,
.smaller_link_white a,
.smaller_link_white a:hover,
.smaller_link_white a:active   { font-family: PTSansRegular; line-height: 130%; font-size: 11pt; }

/* Farbvarianten */
.smaller,
.smaller_link,
.smaller_link:hover,
.smaller_link:active,
.smaller_link_center           { color: var(--kk-grey-color); }

.smaller_white,
.smaller_link_white,
.smaller_link_white:hover,
.smaller_link_white:active,
.smaller_link_white a,
.smaller_link_white a:hover,
.smaller_link_white a:active   { color: var(--kk-white-color) !important; }

/* Zentrierte Links */
.smaller_link_center,
.smaller_link_center a         { display: inline-block; text-align: center !important; }

/* Unterstreichung bei Hover/Aktiv */
.smaller_link_center:hover, 
.smaller_link:active,
.smaller_link_white:active     { text-decoration: underline; }


/* TINY */ 
.tiny,
.tiny_white,
.tiny_link,
.tiny_link:hover,
.tiny_link:active,
.tiny_link_center,
.tiny_link_white,
.tiny_link_white:hover,
.tiny_link_white:active,
.tiny_link_white a,
.tiny_link_white a:hover,
.tiny_link_white a:active   { font-family: PTSansRegular; line-height: 130%; font-size: 9pt; }

/* Farbvarianten */
.tiny,
.tiny_link,
.tiny_link:hover,
.tiny_link:active,
.tiny_link_center           { color: var(--kk-grey-color); }

.tiny_white,
.tiny_link_white,
.tiny_link_white:hover,
.tiny_link_white:active,
.tiny_link_white a,
.tiny_link_white a:hover,
.tiny_link_white a:active   { color: var(--kk-white-color) !important; }

/* Zentrierte Links */
.tiny_link_center,
.tiny_link_center a         { display: inline-block; text-align: center !important; }

/* Unterstreichung bei Hover/Aktiv */
.tiny_link_center:hover, 
.tiny_link:active,
.tiny_link_white:active     { text-decoration: underline; }



/* --- Pagination-Margin --- */
.kk_pagination             { margin: 0 13px; }

/* --- Untertitel Suchausgaben & Bilderlisten --- */
.kk_list_subtitle {
    text-align: center;}


/* Ueberschriften Login Register */
.register {font-family: PTSansRegular; color:var(--kk-white-color); line-height: 100%; font-weight: normal; margin:9px 0px 5px 0px; text-transform:uppercase;} 
 @media only screen and (max-width : 319px)  { .register {font-size:13pt; color:var(--kk-white-color);  }}
 @media only screen and (min-width : 320px)  { .register {font-size:13pt; color:var(--kk-white-color);  }}
 @media only screen and (min-width : 480px)  { .register {font-size:14pt; color:var(--kk-white-color);  }}
 @media only screen and (min-width : 768px)  { .register {font-size:15pt; color:var(--kk-white-color);  }}
 @media only screen and (min-width : 992px)  { .register {font-size:16pt; color:var(--kk-white-color);  }}
 @media only screen and (min-width : 1200px) { .register {font-size:17pt; color:var(--kk-white-color);  }}
 @media only screen and (min-width : 1400px) { .register {font-size:18pt; color:var(--kk-white-color);  }}


/* !!!!!!! ALLE BANNER !!!!!!! */

/* BANNER GELB */
.flex-row.kk_banner_yellow          { color: var(--kk-white-color); line-height: 100%; background: linear-gradient(to bottom, var(--kk-gelboben-color) 0%, var(--kk-gelbunten-color) 100%); }
.flex-row.kk_banner_yellow a        { color: var(--kk-white-color); }
.flex-row.kk_banner_yellow a:hover  { color: var(--kk-white-color); }
/* BANNER WEISS */
.flex-row.kk_banner_white           { color: var(--kk-grey-color); background-color:var(--kk-white-color); }
.flex-row.kk_banner_white a         { color:var(--kk-grey-color) }
.flex-row.kk_banner_white a:hover  { color:var(--kk-grey-color) }
/* BANNER BLACK */
.flex-row.kk_banner_black           { background: linear-gradient(to bottom, var(--kk-grey-color) 0%, var(--kk-dgrey-color) 100%); color: var(--kk-white-color); }
.flex-row.kk_banner_black a         { color: var(--kk-white-color); }
.flex-row.kk_banner_black a:hover   { color: var(--kk-white-color); }


/* === Scrollbarer Banner mit scrollbar + 3D-Effekt === */
.flex-row.scroll-banner {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: scroll; /* bewusst scroll statt auto */
  overflow-y: hidden;
  gap: 1rem;
  position: relative; /* nötig für scroll-hint */
  scrollbar-width: thin;
  scrollbar-color: var(--kk-gelbunten-color) #eee;
  -webkit-overflow-scrolling: touch; /* für iOS weiches Scrollen */
}

/* Begrenzung für sehr große Bildschirme */
@media only screen and (min-width: 1450px) {
  .flex-row.scroll-banner {
    max-width: calc(100% - 80px);
    margin-inline: auto;
  }
}

/* === Webkit Scrollbar Styling (Chrome, Safari, Edge Chromium) === */
.scroll-banner::-webkit-scrollbar {
  height: 18px;
}

.scroll-banner::-webkit-scrollbar-track {
  background: #eee; /* hellgrauer Track */
  border-radius: 18px;
  box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.3); /* leichter 3D-Effekt */
}

.scroll-banner::-webkit-scrollbar-thumb {
  background-color: #555;
  border-radius: 6px;
  border: 2px solid #eee; /* passt zum Track-Hintergrund */
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.05));
  box-shadow: inset 0 -1px 2px rgba(0, 0, 0, 0.4);
}

.scroll-banner::-webkit-scrollbar-thumb:hover {
  background-color: #333;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.1));
  box-shadow: inset 0 -1px 3px rgba(0, 0, 0, 0.6);
}

/* !!!!!!! BANNER Links !!!!!!! */
.bannerclaim         { font-size: 18pt; text-transform: uppercase; font-weight: normal; text-decoration: none; white-space: nowrap; }
.bannerclaim a       { text-decoration: none; }
.bannerclaim a:hover { text-decoration: underline; }
@media only screen and (max-width: 479px)   { .bannerclaim, .bannerclaim a, .bannerclaim a:hover { font-size: 14pt; white-space: normal; }}
@media only screen and (min-width: 480px)   { .bannerclaim, .bannerclaim a, .bannerclaim a:hover { font-size: 15pt; white-space: nowrap; }}
@media only screen and (min-width: 768px)   { .bannerclaim, .bannerclaim a, .bannerclaim a:hover { font-size: 16pt; }}
@media only screen and (min-width: 992px)   { .bannerclaim, .bannerclaim a, .bannerclaim a:hover { font-size: 17pt; }}
@media only screen and (min-width: 1200px)  { .bannerclaim, .bannerclaim a, .bannerclaim a:hover { font-size: 18pt; }}

.bannerlink          {font-size:11pt; text-transform:uppercase; }
.bannerlink a        {font-size:11pt; text-transform:uppercase; }
.bannerlink a:hover {font-size:11pt; text-transform:uppercase; }



/* !!!!!!! LAYOUT HEADER !!!!!!!
.kk_nav_top           {margin: 0; margin-bottom: 9px; padding: 0; height:25px;} */

/* dropdown Menue MyShop */
li.kk_myshop ul li {text-transform: uppercase;} 

/* !!!!!!! LOGOS !!!!!!!  */

.kk_toplogo           {margin:0px; padding:0px; margin-top:0px;}
.kk_logo              {margin-top: 9px; margin-bottom: 9px; width:330px}
.kk_logo_mobile       {margin-top: 9px; margin-bottom: 9px; width:200px}
.kk_order_logo        {margin-top: 9px; margin-bottom: 9px; height:60px;}
.kk_order_logo_mobile {margin-top: 9px; margin-bottom: 9px; width:200px}


/* !!!!!!! BREADCRUMB !!!!!!! */
.kk_search select { border-right:0!important ;
                    border: 1px solid #cccccc; padding: 5px 3px; background-color: var(--kk-white-color); }

.kk_search_input  { border:1px 1px 1px 0px solid #ccc; float:right; color: #000; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
                    line-height: 30px; height: 30px; font-family: PTSansRegular,Arial,sans-serif; font-size: 12pt; padding: 2px 6px; margin: 0;
                    border: 1px solid #ccc;}
                    
.kk_search_button { height:30px; font-family:PTSansRegular; width:30px; padding-left:7px; font-size:12pt; line-height:30px;
                    margin-left:0; border:0; background-image:-webkit-linear-gradient(top,#252370 0,#09063f 100%); background-image:-moz-linear-gradient(top,#252370 0,#09063f 100%);
                    background-image:-o-linear-gradient(top,#252370 0,#09063f 100%); background-image:linear-gradient(top,#252370 0,#09063f 100%); color:var(--kk-white-color);
                    filter:progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#252370, endColorstr=#09063f);
                    zoom:1; -ms-filter:"progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#252370, endColorstr=#09063f)"; 
                    background-image:-ms-linear-gradient(top,#252370 0,#09063f 100%)}
                    
/* !!!!!!! BREADCRUMB !!!!!!! */
.breadcrumb { padding: 8px 15px; margin-bottom: 20px; list-style: none; background-color: var(--kk-white-color); border-radius: 4px; }



/* !!!!!!! STANDARD CONTENTS !!!!!!! */
.kk_content, .flex-row.kk_content                  {padding:0px; border: 0px; min-height: 0px;}
.kk_content_white3p, .flex-row.kk_content_white3p  {background-color:var(--kk-white-color) !important; padding:3px; min-height: 0px;}
.kk_content_03p, .flex-row.kk_content_03p          {background-color:var(--kk-white-color) !important; padding:3px; min-height: 0px;}
.kk_content_white, .flex-row.kk_content_white      {background-color:var(--kk-white-color) !important; padding:13px; min-height: 0px;}
.kk_content_13p, .flex-row.kk_content_13p          {background-color:var(--kk-white-color) !important; padding:13px; min-height: 0px;}


/* !!!!! CONTENTS WELL !!!!! */
/* Blauer Banner im Bestellprozess */
.kk_well.kk_top_hotline {padding:10px 10px 10px 10px; margin-bottom: 0px }

/* Abgerundeter Content mit Hellblauverlauf */
.well-wrapper {  background-color: white;  padding: 0 13px; }
@media only screen and (max-width: 1449px) {  .well-wrapper { padding: 0; }}
@media only screen and (min-width: 1450px) {  .well-wrapper { padding: 0 40px; }}

/* Der eigentliche verlaufende Inhalt */
.flex-row.kk_well_light, .kk_well_light {
  padding: 26px;
  border-radius: 8px;
  background-image: linear-gradient(to bottom, #aaaabb 0%, #777791 100%);
  background-color: #777791; /* Fallback */
  color: var(--kk-white-color);
  overflow:hidden;
}
.kk_well a:hover, .flex-row.kk_well_light a:hover {
    text-decoration: underline;
}


/* !!!!! CONTENTS TOP !!!!! */
.flex-row.anmod_row, .anmod_row {padding: 0px;}
@media only screen and (max-width: 1449px) {  .flex-row.anmod_row { padding: 0; }}
@media only screen and (min-width: 1450px) {  .flex-row.anmod_row { padding: 0 40px; }}

 
 .flex-row.indented_nur_row {padding: 13px 250px 13px 250px;}
 @media only screen and (max-width : 319px)  {  .flex-row.indented_nur_row  {padding: 0px 0px 0px 0px; }}
 @media only screen and (min-width : 320px)  {  .flex-row.indented_nur_row  {padding: 6px 6px 6px 6px; }}
 @media only screen and (min-width : 480px)  {  .flex-row.indented_nur_row  {padding: 6px 6px 6px 6px; }}
 @media only screen and (min-width : 768px)  {  .flex-row.indented_nur_row  {padding: 6px 13px 6px 13px;}}
 @media only screen and (min-width : 992px)  {  .flex-row.indented_nur_row  {padding: 13px 26px 13px 26px; }}
 @media only screen and (min-width : 1100px) {  .flex-row.indented_nur_row  {padding: 13px 32px 13px 32px; }}
 @media only screen and (min-width : 1200px) {  .flex-row.indented_nur_row  {padding: 13px 64px 13px 64px; }}
 @media only screen and (min-width : 1350px) {  .flex-row.indented_nur_row  {padding: 13px 96px 13px 96px; }}
 @media only screen and (min-width : 1450px) {  .flex-row.indented_nur_row  {padding: 13px 128px 13px 128px; }}
 @media only screen and (min-width : 1600px) {  .flex-row.indented_nur_row  {padding: 13px 192px 13px 192px; }}
 

/* SPACER MODULE */
.kk_spacer {min-height:1px;}
.kk_spacer2 {height:26px;}
.kk_spacer_footer {height:150px;} 

/* !!!!!!! PFLICHTFELDER & CO. !!!!!!! */
.muted {color: #F41D2B; font-size: large;}


/* !!!!!!! S O N D E R L I N K S !!!!!!! */
/* OWL-Slider */

.owl-title-left           { text-align:left;    color: var(--kk-grey-color); line-height: 100%; text-transform: none; margin: 9px 0px 5px 0px; }
.owl-title-center         { text-align:center;  color: var(--kk-grey-color); line-height: 100%; text-transform: none; margin: 9px 0px 5px 0px; }
.owl-title-right          { text-align:right;   color: var(--kk-grey-color); line-height: 100%; text-transform: none; margin: 9px 0px 5px 0px; }

.owl-title-center-border {
    text-align: center;  
    font: 12pt PTSansRegular;
    text-transform: uppercase; /* Stellt sicher, dass keine doppelte Großbuchstaben-Transformation aktiv ist */
    color: var(--kk-grey-color);  
    background: linear-gradient(to bottom, var(--kk-whgrey-color) 0%, var(--kk-silber-color) 100%);
    line-height: 100%;  
    margin: 2px;
    border: 1px solid var(--kk-grey-color);
    border-radius: 4em;
    padding: 12px 12px 7px 12px;
    display: inline-block !important;
    min-width: 1px;
    max-width: 100%;
    white-space: nowrap; 
}

.owl-title-left a,       .owl-title-center a,       .owl-title-right a        { color: var(--kk-grey-color); text-decoration: none; }
.owl-title-left a:hover, .owl-title-center a:hover, .owl-title-right a:hover  { text-decoration: underline;}

@media only screen and (max-width: 319px)   {  .owl-title-left, .owl-title-center, .owl-title-right,  .owl-title-left a, .owl-title-center a, .owl-title-right a { font-size: 12pt; }}
@media only screen and (min-width: 320px)   {  .owl-title-left, .owl-title-center, .owl-title-right { font-size: 13pt; } .owl-title-left a, .owl-title-center a, .owl-title-right a { font-size: 12pt; }}
@media only screen and (min-width: 480px)   {  .owl-title-left, .owl-title-center, .owl-title-right { font-size: 14pt; } .owl-title-left a, .owl-title-center a, .owl-title-right a { font-size: 13pt; }}
@media only screen and (min-width: 768px)   {  .owl-title-left, .owl-title-center, .owl-title-right { font-size: 15pt; } .owl-title-left a, .owl-title-center a, .owl-title-right a { font-size: 13pt; }}
@media only screen and (min-width: 992px)   {  .owl-title-left, .owl-title-center, .owl-title-right { font-size: 16pt; } .owl-title-left a, .owl-title-center a, .owl-title-right a { font-size: 14pt; }}
@media only screen and (min-width: 1200px)  {  .owl-title-left, .owl-title-center, .owl-title-right { font-size: 16pt; } .owl-title-left a, .owl-title-center a, .owl-title-right a { font-size: 14pt; }}
@media only screen and (min-width: 1400px)  {  .owl-title-left, .owl-title-center, .owl-title-right { font-size: 16pt; } .owl-title-left a, .owl-title-center a, .owl-title-right a { font-size: 15pt; }}

/* Einheitliche Zeilenhöhe für owl-theme 
.owl-theme .owl-img-txt-wrapper, 
.owl-theme .owl-img-txt-wrapper h1, 
.owl-theme .owl-img-txt-wrapper h2, 
.owl-theme .owl-img-txt-wrapper h3, 
.owl-theme .owl-img-txt-wrapper h4, 
.owl-theme .owl-img-txt-wrapper h5, 
.owl-theme .owl-img-txt-wrapper h6
{ line-height: 100%; } */

.owl-theme .owl-img-txt-wrapper {
  color: var(--kk-grey-color);
  height: 0px;
  width: 100%;
  font-size: 12pt !important;
  line-height: 100%;
}

/* OWL-Button */

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-next {width: 50px; height: 50px; border-radius: 50px; color: var(--kk-white-color); background-color: var(--kk-grey-color); opacity: .4; /*top: calc(50% - 50px);*/}
.owl-nav button.owl-next:hover  {width: 51px; height: 51px; border-radius: 51px; color: var(--kk-white-color); background-color: var(--kk-grey-color); box-shadow: 0px 0px 4px 0px var(--kk-grey-color); text-decoration: none; opacity: .7; }
.owl-carousel .owl-nav button.owl-next .fa { margin-top: 3px; margin-left: 2px; color: var(--kk-white-color) }

.owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-prev {width: 50px; height: 50px; border-radius: 50px; color: var(--kk-white-color); background-color: var(--kk-grey-color); opacity: .1; /*top: calc(50% - 50px);*/}
.owl-nav button.owl-prev:hover  {width: 41px; height: 41px; border-radius: 41px; color: var(--kk-white-color); background-color: var(--kk-grey-color); box-shadow: 0px 0px 4px 0px var(--kk-grey-color); text-decoration: none;  opacity: .7;}
.owl-carousel .owl-nav button.owl-prev .fa { margin-top: 3px; margin-left: 2px; color: var(--kk-white-color) }


/* !!!!!!! B U T T O N S !!!!!!! */

.kk_category_pic_txt {
	background: var(--kk-white-color);
	border: 1px solid var(--kk-grey-color);
	padding: 0px 0px;
	position: absolute;
	bottom: 10%;
	left: 10%;
	width: 80%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font: 14pt PTSansRegular;
	text-transform: uppercase;
	color: var(--kk-grey-color);
	opacity: 0.9;
}

.kk_category_pic_txt a { display: block; width: 100%; padding: 3px 0px 0px 0px; color: inherit; text-decoration: none; }
.kk_category_pic_txt:hover, .kk_category_pic_txt a:hover { background: var(--kk-grey-color); color: var(--kk-white-color); }

/*.kk_category_pic_txt {
	background-color:var(--kk-white-color);
	border: 1px solid var(--kk-grey-color);
	padding:5px 15px 2px 15px;
	position: absolute;
	opacity: .9;
	position: absolute; bottom: 10%; left: 10%; width: 80%;
	text-align: center;
	font-family: PTSansRegular;
	font-size: 14pt;
	text-transform: uppercase;
	color: inherit;}
	
.kk_category_pic_txt a:hover,.kk_category_pic_txt.a:hover,.kk_category_pic_txt:hover, .kk_category_pic_txt p:hover, .kk_category_pic_txt.p:hover
{text-decoration:none; background-color: var(--kk-grey-color); color: var(--kk-white-color) !important; color:inherit}
*/

/* !!!!!!! TEXTE AUF BILDERN !!!!!!! */
.txtOnPicStyle {display:block;}
.txtOnPicStyleFix {display:block;}
.txtUnderPicStyle {display:none;}
/*sm*/@media (max-width: 768px) {.txtOnPicStyle {display:none;}.txtUnderPicStyle {display:block; color: var(--kk-grey-color); padding:13px; background-color:var(--kk-white-color) !important;}}


/* B U T T O N S IM CMS */
.buttoneasy, .buttoneasy:hover, .buttoneasy a, .buttoneasy a:hover {
    display: inline-block; margin-top: 16px; font-family: PTSansRegular; line-height: 140%; border: 1px solid var(--kk-grey-color); padding: 4px 20px 0px 20px; text-transform: uppercase; white-space: nowrap; font-size: 12pt; text-decoration: none; }
.buttoneasy, .buttoneasy a             { color: var(--kk-grey-color); background-color: var(--kk-white-color);}
.buttoneasy a:hover, .buttoneasy:hover { color: var(--kk-white-color); background-color: var(--kk-grey-color); text-decoration: none; }


.buttonmini { font-family: PTSansRegular; line-height: 100%; background-color: var(--kk-white-color); font-size: 12pt; color: var(--kk-grey-color); border: 1px solid var(--kk-white-color); padding: 3px 10px 1px 10px; text-transform: none; white-space: nowrap; letter-spacing: 0.1em; }
@media only screen and (max-width: 319px)  { .buttonmini { font-size: 10pt; } }
@media only screen and (min-width: 320px)  { .buttonmini { font-size: 10pt; } }
@media only screen and (min-width: 1200px) { .buttonmini { font-size: 12pt; } }
@media only screen and (min-width: 1400px) { .buttonmini { font-size: 12pt; } }
.buttonmini:hover   { border: 1px solid var(--kk-grey-color); color: var(--kk-grey-color); background-color: #f8f8f8; box-shadow: 0px 0px 4px 0px var(--kk-grey-color); border-radius: 1px; text-decoration: underline; }
.buttonmini:active  { border: 1px solid var(--kk-grey-color); text-decoration: none; }


.buttonblue                               { line-height: 100%; color: var(--kk-white-color); white-space: nowrap; border: 1px solid var(--kk-blauunten-color); border-radius: 2px; box-shadow: 0px 0px 0px 0px var(--kk-grey-color); 
			                                background: linear-gradient(to bottom, var(--kk-blauoben-color) 0%, var(--kk-blauunten-color) 100%);  
			                                 padding: 6px 15px 3px 15px; }
.buttonblue:hover, .buttonblue:active { color: var(--kk-white-color); text-decoration: none; border: 1px solid var(--kk-blauunten-color); border-radius: 2px; box-shadow: 1px 1px 2px 1px var(--kk-grey-color); transition: box-shadow 0.3s ease-in-out; }

@media only screen and (max-width: 319px)  { .buttonblue { font-size: 13pt; margin-top: 9px; } }
@media only screen and (min-width: 320px)  { .buttonblue { font-size: 13pt; margin-top: 9px; } }
@media only screen and (min-width: 480px)  { .buttonblue { font-size: 13pt; margin-top: 9px; } }
@media only screen and (min-width: 768px)  { .buttonblue { font-size: 13pt; margin-top: 9px; } }
@media only screen and (min-width: 992px)  { .buttonblue { font-size: 14pt; margin-top: 9px; } }
@media only screen and (min-width: 1200px) { .buttonblue { font-size: 14pt; margin-top: 9px; } }
@media only screen and (min-width: 1400px) { .buttonblue { font-size: 14pt; margin-top: 9px; } }


/* !!!!!!! Warenkorb_formularlinks !!!!!!!  */
input[type="submit"].kk_basketButton2Link {border:0px; background-image:var(--kk-white-color); color:#575757; background-color:var(--kk-white-color);}

 @media only screen and (max-width : 319px) { .kk_basketButton2Link {font-size: 10pt;}}
 @media only screen and (min-width : 320px) { .kk_basketButton2Link {font-size: 10pt;}}
 @media only screen and (min-width : 480px) { .kk_basketButton2Link {font-size: 10pt;}}
 @media only screen and (min-width : 768px) { .kk_basketButton2Link {font-size: 11pt;}}
 @media only screen and (min-width : 992px) { .kk_basketButton2Link {font-size: 12pt;}}
 @media only screen and (min-width : 1200px){ .kk_basketButton2Link {font-size: 13pt;}}
 @media only screen and (min-width : 1400px){ .kk_basketButton2Link {font-size: 14pt;}} 


.btn-upload {
  background-color: #007BFF;
  color: white;
  border: none;
  padding: 0.6em 1.2em;
  font-size: 1rem;
  border-radius: 0.375rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  font-family: inherit;
  transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.btn-upload::before {
  font-family:bootstrap-icons!important;
 
  
  float:left; font-family:bootstrap-icons!important; font-style:normal; font-weight:400!important;
 font-variant:normal; content:'\f382'; margin-right:10px; margin-top:0px; transition:all .5s
  
  font-weight: 900;
  margin-right: 0.5em;
  color: white;
  display: inline-block;
  transition: transform 0.2s ease;
}

.btn-upload:hover {
  background: linear-gradient(45deg, #0069d9, #339CFF);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
  transform: translateY(-1px);
}

.btn-upload:hover::before {
  transform: scale(1.1) rotate(-5deg);
}



/* LINKE NAVIGATION */
.navtop            { border-bottom: 0px; padding-bottom: 4px; text-transform: uppercase; font-family: PTSansRegular; font-weight: normal; line-height: 130%; font-size: 12pt; }
.navtext           { padding: 0px; line-height: 100%; font-size: 11pt; }
.navlist           { padding: 0px 0px 0px 6px; }
.navend            { text-decoration: none; padding: 0px; text-align: right; margin-top: 5px; margin-bottom: 13px; }
.link-NAVI         { font-family: PTSansRegular; color: var(--kk-grey-color); text-decoration: none; line-height: 100%; white-space: normal; font-size: 11pt; }
.link-NAVI:hover   { font-family: PTSansRegular; color: var(--kk-grey-color); text-decoration: none; line-height: 100%; white-space: normal; font-size: 11pt; text-decoration: underline; }

/*FILTERNAVIGATION bei Suchergebnissen*/
.info_boxes {padding:26px 0px 26px 0px; background-color:var(--kk-white-color);}
.filter_nav {padding: 0px 20px 0px 20px; margin:0px;}
DIV.filter_nav { text-align: left;}
DIV.filter_nav H3 {margin: 0px;  }
DIV.filter_nav UL { clear: both;}
DIV.filter_nav UL LI.fvalues:hover { cursor:pointer; color: #980018; }
DIV.filter_nav UL LI.fvalues { padding: 0px 0px 10px 0px; background-image: url(../img/checksprite.gif) 0px 12px; background-position: 2px 2px; }
DIV.filter_nav UL LI.fvalues-disable DIV { color: #c1c1c1!important;}
DIV.filter_nav UL LI.fvalues-disable:hover { cursor:default!important; color: #333333!important; }
DIV.filter_nav UL LI INPUT {  }
DIV.filter_nav UL LI UL { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;  }
DIV.filter_nav UL LI UL LI { text-align: left;float:left; text-decoration: underline; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; display: block; }
DIV.filter_nav .filter_nav_all { text-align: right; margin: 10px 12px 10px 0px;text-decoration: none; font-weight: bold;}
DIV.filter_nav .filter_nav_all:hover { cursor:pointer; }
DIV.filter_nav DIV.ftext { padding: 0px 0px 0px 2px; text-decoration: none; font-size: 10pt;}
DIV.filter_nav DIV.ftext SPAN {text-decoration: none!important; font-weight: normal;}
DIV.filter_nav DIV.ftext-selected { text-decoration: none!important; font-weight: bold;}
I.fcheck { display:block; width: 13px; height: 13px; background-image: url(../img/checksprite_art.gif);  background-position: -1px -15px;}
I.fcheck-checked {background-position: -1px -1px;}
I.fcheck-checked-disable { background-position: -15px -1px;}
I.fcheck-unchecked-disable { background-position: -15px -15px;}
DIV.filter_nav .badge-filternav {background: none repeat scroll 0 0 rgba(41, 39, 111, 0.2);}

/* Farbfilter in der Suche */
.farbe-filter { position:relative; width: 10%; float: left; border: 1px solid white; border-radius: 3px;}
.farbe-filter-content { position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
/* TODO: Prüfen ob das noch verwendet wird 0*/
.farbe-filter:before { content: ""; display:block; padding-top: 100%;}
.farbe-filter-checked {border: 2px solid black;}
DIV#filter_nav_box HR { height: 1px; border-top: 0px; border-left: 0px; border-right: 0px; border-bottom: 1px solid #f1ebd4;}
.clear {clear:both;}



/* !!!!!!! Texte Footer !!!!!!! */
.kk_footer {margin-top: 20px; border-bottom: 0px solid #bbbbbd; margin-bottom: 13px; text-transform:uppercase; font-family: PTSansRegular; }

/* Nach oben Scroller */    
.backToTop a {
    display: none;
    position: fixed;
    right: 15px;
    bottom: 15px;
    color: var(--kk-white-color);
    text-decoration: none;
    background: linear-gradient(to bottom, var(--kk-gelboben-color) 0%, var(--kk-gelbunten-color) 100%);
    padding: 13px;
    font-size: larger;
}


/* !!!!!!! Rahmenstudio !!!!!!! */
/* Registerzungen */
.fa-caret-down::before {  content: "\f0d7"; line-height: 12px; padding-left: 3px; color: #15144d; }
/* Tooltips Rahmenauswahl */
.tooltip-inner {max-width: 200px; padding: 5px 8px; color: #000; text-align: center; text-decoration: none; background-color: var(--kk-white-color); border-radius: 4px; border: 1px solid #a1a2c1;}
* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.tooltip {font-size: 14px; line-height: 1.4; visibility: visible;}

/* Info Viereck in Rahmenauswahl */
.kk_frameQuestion {height:20px; width:20px; margin: 4px 0px 0px 1px; vertical-align:middle ; font-family: PTSansRegular; padding:0px 0px 0px 0px; color:var(--kk-white-color);  border:1px solid #a87e02;
background-image: -webkit-linear-gradient( top, #c79500 0%, #e8ab00 100%);
background-image: -moz-linear-gradient(top, #c79500 0%, #e8ab00 100%);
background-image: -o-linear-gradient(top, #c79500 0%, #e8ab00 100%);
background-image: linear-gradient(top, #c79500 0%, #e8ab00 100%);
color:var(--kk-white-color); font-size: 11pt; text-shadow:0px 0px 0 #a87e02, 1px 0px 0 #a87e02,1px 0px 1px #a87e02,1px 0px 1px #a87e02,0px 0px 1px #a87e02;}

.kk_framePromo {height:20px; width:20px; margin: 4px 0px 0px 1px; vertical-align:middle ; font-family: PTSansRegular; padding:0px 0px 0px 2px; color:var(--kk-white-color);  border:1px solid #a87e02;
background-image: -webkit-linear-gradient( top, #c79500 0%, #e8ab00 100%);
background-image: -moz-linear-gradient(top, #c79500 0%, #e8ab00 100%);
background-image: -o-linear-gradient(top, #c79500 0%, #e8ab00 100%);
background-image: linear-gradient(top, #c79500 0%, #e8ab00 100%);
color:var(--kk-white-color); font-size: 11pt; text-shadow:0px 0px 0 #a87e02, 1px 0px 0 #a87e02,1px 0px 1px #a87e02,1px 0px 1px #a87e02,0px 0px 1px #a87e02;}

/*aktuelles Material*/
.kk_matSubHeader {margin-top:10px;margin-bottom:5px;}
.kk_singleMatOption {padding:0px 0px 0px 0px;}
                
.kk_matGroup {cursor:pointer;margin-bottom:5px; border:0px; font-size:smaller; }
.kk_matGroup:hover{transition: background 1s ease 0s; background-color:#ededed;}
.kk_matGroupActive {background-color: #ededed;}
.kk_singleMatMainDiv { position:relative; width:121px;}
.kk_singleMatPromoDiv {position:absolute;top:11px;left:80px;}
                
.kk_singleMatPromo { height:20px; width:30px; border:1px solid #a1a2c1;background-image: -webkit-linear-gradient( top, #c79500 0%, #e8ab00 100%);
background-image: -moz-linear-gradient(top, #c79500 0%, #e8ab00 100%); background-image: -o-linear-gradient(top, #c79500 0%, #e8ab00 100%); background-image:
linear-gradient(top, #c79500 0%, #e8ab00 100%); color:var(--kk-white-color);}
.kk_changeMat {clear:both;text-align:right;padding-right:5px;border:0px solid red;}


/*Material Popup*/
.kk_modal-body {position: relative;  overflow-y: visible;  max-height: none;  padding: 15px;}
.kk_moreMatHeadline {padding:10px 10px 0px 10px; margin:0px; text-align: center; }    
.close { float: right; font-size: 50px; line-height: 70%; color: #000; text-shadow: 0 1px 0 var(--kk-white-color); filter: alpha(opacity=20); opacity: .2; }
      
.kk_moreMatShow {display:none;visibility:hidden;position:absolute;left:100px;top:200px;z-index:100;width:1000px;background-color:var(--kk-white-color);overflow-x:hidden;overflow-y:scroll;background-color:#f5f2f3;}
.kk_moreMatActive {background-color: #ededed;}
.kk_moreMatList {width:190px; margin-bottom: 5px;}
.kk_moreMatElement {float:left;padding:5px; margin:5px; width:180px; }
.kk_moreMatType {height:260px;cursor:pointer; width:160px; font-size: smaller; line-height: 125%; float:left; margin:0px; padding:5px 0px 5px 5px;}
.kk_moreMatType:hover {background-color:#ededed; transition: background 1s ease 0s;}
.kk_moreMatPic { margin-bottom: 15px; }
.kk_moreMatText {float:left; padding:10px 5px 10px 10px ;margin-left:5px;height:61px;width:167px;text-align:left; font-size:smaller;}
.kk_moreMatClear {clear:both;}
.kk_moreMatSpace {clear:both;height:20px;}
.kk_moreMatClose {text-align:right;margin:10px; font-size:larger;}
.kk_mirror { cursor: help;  position: relative; }
.kk_matForm {padding:0px;margin:0px;}


/* !!!!!!! CONTENT SEITEN SPECIALS !!!!!!! */

/* Rahmenlistungen im Content */
.cc-frame-list-header {margin-bottom: 9px; margin-top: 9px;}
div.cc-frame {background-color: transparent!important; margin: 9px 0px 0px 0px; }
div.cc-frame-border {border-right: 0px solid transparent!important; }
div.cc-frame-border-inner > div {padding: 5px 13px 5px 13px;}
div.cc-frame div.row div[class^="col-"] {/*font-size:15px;*/ background-color:var(--kk-white-color); margin-top:0px; padding:0px;}
div.cc-frame div.cc-frame-img { padding-top: 13px; border-bottom: 0px solid }
div.cc-frame div.cc-frame-img .cc-frame-title {height: 65px;}
div.cc-frame div.row.cc-frame-keyvalue div:nth-child(2) {text-align: right;}
div.cc-frame div.cc-frame-bottom { margin-top: 0px;}
div.cc-frame .cc-frame-bottom-table {width:100%;}
div.cc-frame .cc-frame-bottom-desc {font-size:smaller; }
div.cc-frame div.cc-frame-bottom { margin-top: 9px; margin-bottom: 0px;}
div.cc-frame div.cc-frame-bottom div.cc-frame-bottom-desc-xs {font-size:smaller;}

.kk_frame_list {padding-bottom:9px; }
.kk_frame_list_space_right {padding-right:9px;}
.kk_frame_desc_background {background-color:var(--kk-white-color);padding:0px;padding-top:0;}
.kk_frame_list_title {font-weight:normal;}
.kk_frame_artno {background-color:var(--kk-white-color);margin:2px;padding:3px;}
.kk_frame_value_artno {margin-bottom:5px;padding:2px;}
.kk_frame_values {font-size:15px;background-color:var(--kk-white-color);margin-bottom:5px;padding:2px;}
.kk_frame_value {text-align:right;font-weight:normal;}
.kk_frame_space_top {padding-top:26px;}
.kk_frame_desc {font-size:15px;color:#777791;padding-top:13px;}
.kk_frame_spacer {padding-top:5px;}
.kk_frame_specal_font {color:#777791;}

/*Rahmeneinzelanzeige*/
.kk_frame_show {min-height: 10px !important;}


/* Bildergalerien */
.content_gallery_item{padding:8px;line-height:1;margin-bottom:10px;position:relative;display:flex;flex-direction:column;}
.content_gallery_item_image_wrapper{flex-grow:1;flex-direction:row;align-items:center}
.content_gallery_item div{margin:0 0 5px 0}

/* Media-unabhängige Standardwerte */
.content_gallery_item img, .max-width-100 {
    width: auto; 
    height: auto; 
    box-shadow: 2px 2px 3px rgba(0,0,0,.3);
}

/* Media Queries mit nur den sich ändernden Werten */
@media only screen and (max-width: 319px)  { .content_gallery_item img, .max-width-100 { max-height: 180px; max-width: 100px;  }}
@media only screen and (min-width: 320px)  { .content_gallery_item img, .max-width-100 { max-height: 180px; max-width: 120px;  }}
@media only screen and (min-width: 480px)  { .content_gallery_item img, .max-width-100 { max-height: 190px; max-width: 140px;  }}
@media only screen and (min-width: 768px)  { .content_gallery_item img, .max-width-100 { max-height: 200px; max-width: 170px;  }}
@media only screen and (min-width: 992px)  { .content_gallery_item img, .max-width-100 { max-height: 220px; max-width: 210px;  }}
@media only screen and (min-width: 1200px) { .content_gallery_item img, .max-width-100 { max-height: 240px; max-width: 230px;  }}
@media only screen and (min-width: 1400px) { .content_gallery_item img, .max-width-100 { max-height: 260px; max-width: 240px;  }}

.content_gallery_item img.img_alike{box-shadow:none!important}
/* .content_gallery_item>.caption>.artist{font-size:smaller;} */
.content_gallery_item>.caption>.artist {font-weight: normal;}
.content_gallery_item>.caption>.delivery{font-size:smaller;margin:0}
.content_gallery_item>.caption>.price{font-size:smaller}



 /*ACCORDION MODUL */
.panel-heading { padding: 5px; border-top-left-radius: 2px; border-top-right-radius: 2px; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; border-bottom: 0px solid transparent;}
.panel-heading + .panel-collapse > .panel-body { border-top: 0px solid var(--kk-white-color); border-top-color: #000000;}
.panel-group .panel-heading + .panel-collapse > .list-group, .panel-group .panel-heading + .panel-collapse > .panel-body { border-top: 2px solid var(--kk-white-color); border-top-color: rgb(255, 255, 255);}
.panel-body { background-color: var(--kk-white-color); }
.panel-body { padding: 2px; }

 /* Layout des Pfeils */
 .modul-panel-heading a:before { float:left; font-family:bootstrap-icons!important; font-style:normal; font-weight:400!important;
 font-variant:normal; content:'\F119'; margin-right:10px; margin-top:0px; transition:all .5s}

.modul-panel-heading.active a:before { -webkit-transform:rotate(-180deg); -moz-transform:rotate(-180deg); transform:rotate(-180deg)}
.modul-panel>.panel-heading { background-color:var(--kk-white-color)!important }
.modul-panel-group { border-top:0px solid var(--kk-white-color); margin-bottom:0!important}
.modul-panel { border-bottom:0px solid var(--kk-white-color)}

.panel-title { font-size: 16px; color: var(--kk-grey-color);}
.panel-default > .panel-heading { color: var(--kk-white-color); }


/* TESTE Zoom Bilder */
 
img.zoomable {  transition: transform 0.5s ease-out, opacity 0.5s ease-out;  opacity: 0.9;}
img.zoomable:hover {  transform: scale(1.15);  opacity: 1;}