/* 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)  */
		
	}
 
 /*  Wird das benötigt?
 
 * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;  }
 */ 
 
/* SCHRIFTEN - Generated by Font Squirrel (http://www.fontsquirrel.com) on June 4, 2013 06:41:32 AM America/New_York */
@font-face {    font-family: "PTSansRegular";    src: url("../vendor/fonts/pt_sans/PTS55F-webfont.eot");    src:     url("../vendor/fonts/pt_sans/PTS55F-webfont.eot?#iefix")        format("embedded-opentype"),      url("../vendor/fonts/pt_sans/PTS55F-webfont.woff") format("woff"),      url("../vendor/fonts/pt_sans/PTS55F-webfont.ttf") format("truetype"),      url("../vendor/fonts/pt_sans/PTS55F-webfont.svg#PTSansRegular")        format("svg");
    font-weight: normal;    font-style: normal;    font-display: swap;  }
	
/* ITALIC */
@font-face {    font-family: "PTSansItalic";    src: url("../vendor/fonts/pt_sans/PTS56F-webfont.eot");    src:      url("../vendor/fonts/pt_sans/PTS56F-webfont.eot?#iefix")        format("embedded-opentype"),      url("../vendor/fonts/pt_sans/PTS56F-webfont.woff") format("woff"),      url("../vendor/fonts/pt_sans/PTS56F-webfont.ttf") format("truetype"),      url("../vendor/fonts/pt_sans/PTS56F-webfont.svg#PTSansItalic") format("svg");
    font-weight: normal;    font-style: normal;    font-display: swap;  }
	
/* BOLD */
@font-face {    font-family: "PTSansBold";    src: url("../vendor/fonts/pt_sans/PTS75F-webfont.eot");    src:      url("../vendor/fonts/pt_sans/PTS75F-webfont.eot?#iefix")        format("embedded-opentype"),
      url("../vendor/fonts/pt_sans/PTS75F-webfont.woff") format("woff"),      url("../vendor/fonts/pt_sans/PTS75F-webfont.ttf") format("truetype"),      url("../vendor/fonts/pt_sans/PTS75F-webfont.svg#PTSansBold") format("svg");
    font-weight: normal;    font-style: normal;    font-display: swap;  }
	
/* BOLD ITALIC */
  @font-face {    font-family: "PTSansBoldItalic";    src: url("../vendor/fonts/pt_sans/PTS76F-webfont.eot");    src:      url("../vendor/fonts/pt_sans/PTS76F-webfont.eot?#iefix")        format("embedded-opentype"),      
	url("../vendor/fonts/pt_sans/PTS76F-webfont.woff") format("woff"),      url("../vendor/fonts/pt_sans/PTS76F-webfont.ttf") format("truetype"),      url("../vendor/fonts/pt_sans/PTS76F-webfont.svg#PTSansBoldItalic")        format("svg");
    font-weight: normal;    font-style: normal;    font-display: swap;  }
	
/* CAPTION KLEINGEDRUCKT */  
  @font-face {     font-family: "PTSansCaptionRegular";    src: url("../vendor/fonts/pt_sans/PTC55F-webfont.eot");     src:      url("../vendor/fonts/pt_sans/PTC55F-webfont.eot?#iefix")        format("embedded-opentype"),      url("../vendor/fonts/pt_sans/PTC55F-webfont.woff") format("woff"),      url("../vendor/fonts/pt_sans/PTC55F-webfont.ttf") format("truetype"),      url("../vendor/fonts/pt_sans/PTC55F-webfont.svg#PTSansCaptionRegular")        format("svg");
    font-weight: normal;     font-style: normal;    font-display: swap;  }
	
/* CAPTION BOLD KLEINGEDRUCKT */    
  @font-face {    font-family: "PTSansCaptionBold";    src: url("../vendor/fonts/pt_sans/PTC75F-webfont.eot");    src:      url("../vendor/fonts/pt_sans/PTC75F-webfont.eot?#iefix")        format("embedded-opentype"),      url("../vendor/fonts/pt_sans/PTC75F-webfont.woff") format("woff"),      url("../vendor/fonts/pt_sans/PTC75F-webfont.ttf") format("truetype"),      url("../vendor/fonts/pt_sans/PTC75F-webfont.svg#PTSansCaptionBold")        format("svg");
    font-weight: normal;    font-style: normal;    font-display: swap;  }
	
/* SCHMAL */      
  @font-face {    font-family: "PTSansNarrowRegular";    src: url("../vendor/fonts/pt_sans/PTN57F-webfont.eot");    src:      url("../vendor/fonts/pt_sans/PTN57F-webfont.eot?#iefix")        format("embedded-opentype"),      url("../vendor/fonts/pt_sans/PTN57F-webfont.woff") format("woff"),      url("../vendor/fonts/pt_sans/PTN57F-webfont.ttf") format("truetype"),      url("../vendor/fonts/pt_sans/PTN57F-webfont.svg#PTSansNarrowRegular")        format("svg");
    font-weight: normal;    font-style: normal;    font-display: swap;  }
	
/* SCHMAL BOLD*/      
  @font-face {    font-family: "PTSansNarrowBold";    src: url("../vendor/fonts/pt_sans/PTN77F-webfont.eot");    src:      url("../vendor/fonts/pt_sans/PTN77F-webfont.eot?#iefix")        format("embedded-opentype"),      url("../vendor/fonts/pt_sans/PTN77F-webfont.woff") format("woff"),      url("../vendor/fonts/pt_sans/PTN77F-webfont.ttf") format("truetype"),      url("../vendor/fonts/pt_sans/PTN77F-webfont.svg#PTSansNarrowBold")        format("svg");
  font-weight: normal;    font-style: normal;    font-display: swap;  }
  

 

  
  html {  height: 100%;    width: 100%;    padding: 0;    margin: 0;  }
  
 /* !!!!!!! STANDEINSTELLUNGEN SEITE !!!!!!! */
  body                               {    font-family: PTSansRegular, sans-serif;   /* color: var(--kk-grey-color);    line-height: 130%;    margin: 0;    padding: 0%; */  }
  a, a:active                        {    font-family: PTSansRegular, sans-serif;  text-decoration: none;           color: var(--kk-grey-color); }
  a:hover                            {    font-family: PTSansRegular, sans-serif;  text-decoration: underline; /*   color: var(--kk-grey-color); */  }

  p                                  {    margin: 0 0 7px 0;  }  
  .white,  .white:hover,  .white a   {    color: var(--kk-white-color);    text-decoration: none;  }
  .white a:hover,  .white a:active   {    color: var(--kk-white-color);    text-decoration: underline;  }
  .center                            {    text-align: center;  }
  .smaller                           {    font-size: smaller;  } /*raus ??? */
  .larger                            {    font-size: larger;   } /*raus ??? */
  
/* ÜBERSCHRIFTEN */

h1, .page-title,                      {font-size: clamp(1.2rem, 8vw, 1.6rem);}
/* SM */   @media (min-width: 576px)  { h1, .page-title { font-size: 1.6rem; } }
/* MD */   @media (min-width: 768px)  { h1, .page-title { font-size: 1.8rem; } }
/* LG */   @media (min-width: 992px)  { h1, .page-title { font-size: 2.0rem; } }
/* XL */   @media (min-width: 1200px) { h1, .page-title { font-size: 2.2rem; } }
/* XXL */  @media (min-width: 1400px) { h1, .page-title { font-size: 2.4rem; } }
.page-title                           { text-align: center; }


h2         {font-size: clamp(1.0rem, 8vw, 1.2rem);}
/* SM */   @media (min-width: 576px)  { h2 { font-size: 1.2rem; } }
/* MD */   @media (min-width: 768px)  { h2 { font-size: 1.4rem; } }
/* LG */   @media (min-width: 992px)  { h2 { font-size: 1.6rem; } }
/* XL */   @media (min-width: 1200px) { h2 { font-size: 1.8rem; } }
/* XXL */  @media (min-width: 1400px) { h2 { font-size: 2.0rem; } }

h3, h4, h5, h6, .kk_list_subtitle {   font-size: clamp(1.0rem, 8vw, 1.3rem);}
/* SM */   @media (min-width: 576px)  { h3, h4, h5, h6, .kk_list_subtitle { font-size: 1.4rem; }}
/* MD */   @media (min-width: 768px)  { h3, h4, h5, h6, .kk_list_subtitle { font-size: 1.5rem; }}
/* LG */   @media (min-width: 992px)  { h3, h4, h5, h6, .kk_list_subtitle { font-size: 1.6rem; }}
/* XL */   @media (min-width: 1200px) { h3, h4, h5, h6, .kk_list_subtitle { font-size: 1.7rem; }}
/* XXL */  @media (min-width: 1400px) { h3, h4, h5, h6, .kk_list_subtitle { font-size: 1.8rem; }}


/* Spezielle Überschrift-Stile */
h1, h2                                    {font-family: PTSansRegular, sans-serif;    color: var(--kk-grey-color);    line-height: 130%;    font-weight: normal; text-transform: uppercase;  }
h3,  h4,  h5,  h6, .kk_list_subtitle      {font-family: PTSansRegular, sans-serif;    color: var(--kk-grey-color);    line-height: 130%;    font-weight: normal; text-transform: none;  }


/* Spezielle Überschrift-Ränder */
h1,                                       { 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;  }


.kk_list_subtitle                         { text-align: center }
  
 /* Sicherstellen, dass Text-weiße H-Links auch weiß sind  */
.white a,  .white a:visited,  .white a:active,  .white a:hover,  h1. white, h1.white a,  h1.white a:visited,  h1.white a:active,  h1.white a:hover,  h1.white a, h2.white, h2.white a,  h2.white a:visited,  h2.white a:active,  h2.white a:hover,  h2.white a, h3.white, h3.white a,  h3.white a:visited,  h3.white a:active,  h3.white a:hover,  h3.white a, h4.white, h4.white a,  h4.white a:visited,  h4.white a:active,  h4.white a:hover,  h4.white a, h5.white, 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 {    text-decoration: underline;  }
  
/* !!!!!!! TEXTE & LINKS !!!!!!! */ 
/* LARGER_LINK */ 
.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; }


 
  .abc-title-3 {
    font-family: PTSansRegular, sans-serif;
    color: var(--kk-grey-color);
    background-color: white;
    padding: 13px 13px 13px 13px;
    line-height: 100%;
    text-transform: none;
  }
  
  /* Ueberschriften Login Register */
  .register {
    font-family: PTSansRegular, sans-serif;
    color: var(--kk-white-color);
    line-height: 100%;
    font-weight: normal;
    margin: 9px 0 5px 0;
    text-transform: uppercase;
  }

.content_links {
    font-family: PTSansRegular, sans-serif;
    line-height: 100%;
    font-weight: normal;
    text-transform: uppercase;
	color: var(--kk-blauunten-color) !important;
  }


  /* HINTERRUNDFARBEN FÜR BOOTSTRAP */  
  
  /* Verläufe: oben dunkel (4. Ton), unten Weiß */
  .grad-cream  { background: linear-gradient(to bottom, #f2ede4 0%, #ffffff 100%); }
  .grad-grey   { background: linear-gradient(to bottom, #e4e2de 0%, #ffffff 100%); }
  .grad-blue   { background: linear-gradient(to bottom, #ccdbe9 0%, #ffffff 100%); }
  .grad-green  { background: linear-gradient(to bottom, #d5dfd7 0%, #ffffff 100%); }
  .grad-yellow { background: linear-gradient(to bottom, #f8edc3 0%, #ffffff 100%); }
  .grad-red    { background: linear-gradient(to bottom, #f6d2cc 0%, #ffffff 100%); }
  .grad-rose   { background: linear-gradient(to bottom, #f7ddda 0%, #ffffff 100%); }
  
  
  /* Farbkarte FÜR BOOTSTRAP */    
  
.bg-cream         {   background-color: #faf7f4 !important; }
/* ======= Cream (hell → dunkel) ======= */
.bg-cream-01 { background-color: #ffffff; }
.bg-cream-02 { background-color: #fcfbfa; }
.bg-cream-03 { background-color: #faf7f4; }
.bg-cream-04 { background-color: #f2ede4; }
.bg-cream-05 { background-color: #ebe3d6; }
.bg-cream-06 { background-color: #e1d7c6; }
.bg-cream-07 { background-color: #d5c8b3; }
.bg-cream-08 { background-color: #cabfae; }
.bg-cream-09 { background-color: #bfb29f; }
.bg-cream-10 { background-color: #b0a692; }
.bg-cream-11 { background-color: #9d927e; }
.bg-cream-12 { background-color: #8f8573; }
.bg-cream-13 { background-color: #7b7365; }
.bg-cream-14 { background-color: #6b6659; }
.bg-cream-15 { background-color: #5c574b; color:#fff; }
.bg-cream-16 { background-color: #4e4a3f; color:#fff; }
.bg-cream-17 { background-color: #403c33; color:#fff; }
.bg-cream-18 { background-color: #322f28; color:#fff; }
.bg-cream-19 { background-color: #26231e; color:#fff; }

/* ======= Grey (hell → dunkel) ======= */
.bg-grey-01 { background-color: #ffffff; }
.bg-grey-02 { background-color: #f7f6f4; }
.bg-grey-03 { background-color: #eeedea; }
.bg-grey-04 { background-color: #e4e2de; }
.bg-grey-05 { background-color: #dbd8d2; }
.bg-grey-06 { background-color: #d1cdc7; }
.bg-grey-07 { background-color: #c7c2bb; }
.bg-grey-08 { background-color: #bcb6af; }
.bg-grey-09 { background-color: #b0aaa2; }
.bg-grey-10 { background-color: #a49d96; }
.bg-grey-11 { background-color: #999188; }
.bg-grey-12 { background-color: #8d857e; }
.bg-grey-13 { background-color: #817973; }
.bg-grey-14 { background-color: #756e69; }
.bg-grey-15 { background-color: #69625f; color:#fff; }
.bg-grey-16 { background-color: #5d5755; color:#fff; }
.bg-grey-17 { background-color: #514c4a; color:#fff; }
.bg-grey-18 { background-color: #454241; color:#fff; }
.bg-grey-19 { background-color: #383635; color:#fff; }

/* ======= Blue (hell → dunkel) ======= */
.bg-blue-01 { background-color: #f7fbfd; }
.bg-blue-02 { background-color: #e9f1f7; }
.bg-blue-03 { background-color: #dbe6f0; }
.bg-blue-04 { background-color: #ccdbe9; }
.bg-blue-05 { background-color: #bbcfe1; }
.bg-blue-06 { background-color: #a9c1d8; }
.bg-blue-07 { background-color: #97b3cf; }
.bg-blue-08 { background-color: #84a4c6; }
.bg-blue-09 { background-color: #7296bc; }
.bg-blue-10 { background-color: #6287b3; }
.bg-blue-11 { background-color: #5678a2; }
.bg-blue-12 { background-color: #4b6a91; color:#fff; }
.bg-blue-13 { background-color: #415c80; color:#fff; }
.bg-blue-14 { background-color: #384e70; color:#fff; }
.bg-blue-15 { background-color: #2f405f; color:#fff; }
.bg-blue-16 { background-color: #26324f; color:#fff; }
.bg-blue-17 { background-color: #1f283f; color:#fff; }
.bg-blue-18 { background-color: #171f30; color:#fff; }
.bg-blue-19 { background-color: #101622; color:#fff; }

/* ======= Green (hell → dunkel) ======= */
.bg-green-01 { background-color: #f8fbf8; }
.bg-green-02 { background-color: #edf2ed; }
.bg-green-03 { background-color: #e1e9e2; }
.bg-green-04 { background-color: #d5dfd7; }
.bg-green-05 { background-color: #c8d5cb; }
.bg-green-06 { background-color: #bbcbbf; }
.bg-green-07 { background-color: #adc1b2; }
.bg-green-08 { background-color: #9fb6a4; }
.bg-green-09 { background-color: #91ab97; }
.bg-green-10 { background-color: #83a08a; }
.bg-green-11 { background-color: #76957d; }
.bg-green-12 { background-color: #688b70; }
.bg-green-13 { background-color: #5b8063; color:#fff; }
.bg-green-14 { background-color: #4e7557; color:#fff; }
.bg-green-15 { background-color: #42694b; color:#fff; }
.bg-green-16 { background-color: #375d40; color:#fff; }
.bg-green-17 { background-color: #2c5235; color:#fff; }
.bg-green-18 { background-color: #22472b; color:#fff; }
.bg-green-19 { background-color: #193c21; color:#fff; }

/* ======= Yellow (hell → dunkel) ======= */
.bg-yellow-01 { background-color: #fffdf5; }
.bg-yellow-02 { background-color: #fef9e8; }
.bg-yellow-03 { background-color: #fcf3d8; }
.bg-yellow-04 { background-color: #f8edc3; }
.bg-yellow-05 { background-color: #f4e7ae; }
.bg-yellow-06 { background-color: #f0e099; }
.bg-yellow-07 { background-color: #ebd984; }
.bg-yellow-08 { background-color: #e6d26f; }
.bg-yellow-09 { background-color: #e0cb5a; }
.bg-yellow-10 { background-color: #dac445; }
.bg-yellow-11 { background-color: #d3bd30; }
.bg-yellow-12 { background-color: #cdb623; }
.bg-yellow-13 { background-color: #bba91f; }
.bg-yellow-14 { background-color: #a99b1b; color:#fff; }
.bg-yellow-15 { background-color: #978e17; color:#fff; }
.bg-yellow-16 { background-color: #857114; color:#fff; }
.bg-yellow-17 { background-color: #735412; color:#fff; }
.bg-yellow-18 { background-color: #61460f; color:#fff; }
.bg-yellow-19 { background-color: #4f390c; color:#fff; }

/* ======= Red (hell → dunkel) ======= */
.bg-red-01 { background-color: #fff8f7; }
.bg-red-02 { background-color: #fdecea; }
.bg-red-03 { background-color: #fadfdb; }
.bg-red-04 { background-color: #f6d2cc; }
.bg-red-05 { background-color: #f1c4bd; }
.bg-red-06 { background-color: #ecb6ad; }
.bg-red-07 { background-color: #e6a99e; }
.bg-red-08 { background-color: #df9b8f; }
.bg-red-09 { background-color: #d78d80; }
.bg-red-10 { background-color: #ce7f71; }
.bg-red-11 { background-color: #c57163; color:#fff; }
.bg-red-12 { background-color: #b96658; color:#fff; }
.bg-red-13 { background-color: #ad5b4e; color:#fff; }
.bg-red-14 { background-color: #a15044; color:#fff; }
.bg-red-15 { background-color: #95353a; color:#fff; }
.bg-red-16 { background-color: #842c31; color:#fff; }
.bg-red-17 { background-color: #742428; color:#fff; }
.bg-red-18 { background-color: #631c20; color:#fff; }
.bg-red-19 { background-color: #521418; color:#fff; }

/* ======= Rose (hell → dunkel) ======= */
.bg-rose-01 { background-color: #fff9f8; }
.bg-rose-02 { background-color: #fdf1ef; }
.bg-rose-03 { background-color: #fae7e4; }
.bg-rose-04 { background-color: #f7ddda; }
.bg-rose-05 { background-color: #f3d3cf; }
.bg-rose-06 { background-color: #efc9c5; }
.bg-rose-07 { background-color: #eabfb9; }
.bg-rose-08 { background-color: #e4b5ae; }
.bg-rose-09 { background-color: #dda9a2; }
.bg-rose-10 { background-color: #d69c97; }
.bg-rose-11 { background-color: #cf8e8b; color:#fff; }
.bg-rose-12 { background-color: #c8807f; color:#fff; }
.bg-rose-13 { background-color: #c07273; color:#fff; }
.bg-rose-14 { background-color: #b66368; color:#fff; }
.bg-rose-15 { background-color: #ac555d; color:#fff; }
.bg-rose-16 { background-color: #a04752; color:#fff; }
.bg-rose-17 { background-color: #8e3b46; color:#fff; }
.bg-rose-18 { background-color: #7b2f3b; color:#fff; }
.bg-rose-19 { background-color: #692330; color:#fff; }

  /* !!!!!!! PFLICHTFELDER & CO. !!!!!!! */
  .muted {
    color: #f41d2b;
    font-size: large;
  }
  
  /* !!!!!!! ALLE BANNER !!!!!!! */

.row.banner_yellow         {  color: var(--kk-white-color);  background: linear-gradient(    to bottom,    var(--kk-gelboben-color) 0%,    var(--kk-gelbunten-color) 100%  );}
.row.banner_yellow a       {  color: var(--kk-white-color); }
.row.banner_yellow a:hover {  color: var(--kk-white-color);}

.row.banner_blue           {  padding-top: 1px; color: var(--kk-white-color);  background: linear-gradient(    to bottom,    var(--kk-blauoben-color) 0%,    var(--kk-blauunten-color) 100%  );}
.row.banner_blue a         {  color: var(--kk-white-color);}
.row.banner_blue a:hover   {  color: var(--kk-white-color);}

.row.banner_white          {  color: var(--kk-grey-color);  background-color: var(--kk-white-color);}
.row.banner_white a        {  color: var(--kk-grey-color);}
.row.banner_white a:hover  {  color: var(--kk-grey-color);}

.row.banner_black          {  background: linear-gradient(  to bottom,    var(--kk-grey-color) 0%,    var(--kk-dgrey-color) 100%  );  color: var(--kk-white-color);}
.row.banner_black a        {  color: var(--kk-white-color);}
.row.banner_black a:hover  {  color: var(--kk-white-color);}
  
/*!!!!!!! BANNER Links !!!!!!!*/

.bannerclaim {font-size: clamp(1.0rem, 8vw, 1.6rem); 
  text-transform: uppercase;
  font-weight: normal;
  text-decoration: none;
  white-space: nowrap;
  line-height: 100%;}

@media (min-width: 576px)   { .bannerclaim { font-size: 1.6rem; }}
@media (min-width: 768px)   { .bannerclaim { font-size: 1.8rem; }}
@media (min-width: 992px)   { .bannerclaim { font-size: 2.0rem; }}
@media (min-width: 1200px)  { .bannerclaim { font-size: 2.2rem; }}
@media (min-width: 1400px)  { .bannerclaim { font-size: 2.4rem; }}


.bannerclaim a {
  text-decoration: none;
}

.bannerclaim a:hover {
  text-decoration: none;
}

.bannerlink {
  font-size: 11pt;
  text-transform: uppercase;
  line-height: 110%;
}

.bannerlink a {
  font-size: 11pt;
  text-transform: uppercase;
  line-height: 110%;
}

.bannerlink a:hover {
  font-size: 11pt;
  text-transform: uppercase;
  line-height: 110%;
}

 /* !!!!!!! BANNER COUNTER !!!!!!! */
.count-box {
  background: #fff;
  color: #000;
  min-width: 2.6rem;
  padding: 4px 2px;
  border-radius: 6px;

  display: flex;
  flex-direction: column;
  justify-content: center;   
  align-items: center;       

  line-height: 1;            
}

.count-number {
  font-size: 1.4rem;
  font-weight: bold;
  position: relative;
  top: 6px;           
              
}

.count-label {
  font-size: 0.6rem;
  margin-top: 2px;    
  position: relative;
  top: 2px;
}


  /* !!!!!!! ALLE CONTENTS !!!!!!! */
  
  
 /* !!!!!!! WELL LIGHT !!!!!!! */ 
.well-wrapper { padding: 1rem; border-radius: 1rem; background-color: #aaaabb; /* heller blauton → Rundung sichtbar */ }
 
  
  
  
  
    
  a.button {
    font-family: PTSansRegular, sans-serif;
    font-size: 12pt;
    background-color: #a1a2c1;
    color: #ffffff;
    padding: 4px;
    border: 0;
    background-image: -webkit-linear-gradient(
      to bottom,
      #252370 0%,
      #09063f 100%
    );
    background-image: -moz-linear-gradient(to bottom, #252370 0%, #09063f 100%);
    background-image: -o-linear-gradient(to bottom, #252370 0%, #09063f 100%);
    background-image: linear-gradient(to bottom, #252370 0%, #09063f 100%);
  }
  
  
  button,
  input[type="button"],
  input[type="submit"],
  input[type="reset"] {
    font-family: PTSansRegular, sans-serif;
    font-size: 12pt;
    background-color: #a1a2c1;
    color: #ffffff;
    border: 0;
    /*background-image: -webkit-linear-gradient(*/
    /*  to bottom,*/
    /*  #252370 0%,*/
    /*  #09063f 100%*/
    /*);*/
    /*background-image: -moz-linear-gradient(to bottom, #252370 0%, #09063f 100%);*/
    /*background-image: -o-linear-gradient(to bottom, #252370 0%, #09063f 100%);*/
    /*background-image: linear-gradient(to bottom, #252370 0%, #09063f 100%);*/
  }
  
  
  
  
  .btn-file {    position: relative;    overflow: hidden;  }
  
  .btn-file input[type="file"] {    position: absolute;    top: 0;    right: 0;    min-width: 100%;    min-height: 100%;    font-size: 100px;    text-align: right;    filter: alpha(opacity=0);
    opacity: 0;    outline: none;    background: white;    cursor: inherit;    display: block;  }
  
  input[type="checkbox"],  input[type="radio"] {    height: 13px;  }
  
  
  /* TODO: Prüfen ob das noch verwendet wird 0*/
  /*icons*/
  .icon-caret-down {    color: #05063c;    width: 23px;    height: 12px;    position: absolute;    top: -13px;    left: 1px;  }
  .img-fluid.cc_pic_left {    float: left;    margin: 0 13px 13px 0;  }
  .img-fluid.cc_pic_right {    float: right;    margin: 0 0 13px 13px;  }
  
 
  /* CONTENT */
  /* TODO: Prüfen ob das noch verwendet wird 0*/
  .nav-living {    width: 100%;    text-align: center;    background-image: url(../images/template-pics/navi.jpg);    background-repeat: repeat-y;    overflow: visible;  }
  .nav-top-win {    width: 100%;    height: 180px;    text-align: center;    background-image: url(../images/template-pics/win/start_-ohne-text.jpg);    white-space: nowrap;    overflow: hidden;  }
  .nav-win {    width: 100%;    text-align: center;    background-image: url(../images/template-pics/win/navi_ohne-text.jpg);    background-repeat: repeat-y;    overflow: hidden;  }
  .navend {    font-weight: normal;    color: gray;    font-size: smaller;  }
  .navlist {    overflow: hidden;  }
  .navtext {    font-weight: normal;    padding: 0 0 6px 0;  }
  .navtop {    font-weight: normal;    margin-bottom: 5px;    font-size: 12pt;    overflow: hidden;  }
  
  ol.page-bc {    border: 0 solid red;    margin: 13px 0 0 0;  }
 
  .page-bc-filter-color {    position: relative;    margin-top: 3px;    margin-left: 6px;    margin-right: 6px;    border: 1px solid black;    height: 10px;    width: 10px;  }
  
  pre {    background-color: transparent;    border: 0;    border-radius: 0;    display: block;    margin: 0;    padding: 0;    white-space: pre-wrap;    word-break: break-all;    word-wrap: break-word;  }
  
  /* LINK_STYLE */
  .myshop-invoice-link {    color: #7d7d7d !important;  }
  .content_links {    }
  
  /*navigationslinks Link Seite */
  .link-NAVI {    overflow: hidden;  }
  .link-NAVI:active {    text-decoration: underline;    color: #33240d;    font-size: 12pt;    white-space: nowrap;    overflow: hidden;  }
  .link-NAVI:hover {    font-size: 12pt;    overflow: hidden;  }
  
  /*Einstellungen die aus der IIM_CSS kommen ENDE*/
  
  
  
  
  
  /* TODO: Prüfen ob das noch verwendet wird 0*/
  
  .next-page {    border-left: 0;    width: 26px;    height: 66px;    background: none;  }
  .prev-page {    border-right: 0;    width: 26px;    height: 66px;    background: none;  }
  
  /* zum test mehrspaltiger content */
 
  .rotating-testimonials .tabs {    clear: both;    list-style: none outside none;    margin: 0 0 10px;    padding: 0;    text-align: left;  }
  .rotating-testimonials .tabs li {    background: none repeat scroll 0 0 #4c5966;    border: medium none;    display: inline-block;    height: 8px;    margin: 15px 5px 0;    width: 8px;  }
  .no-js .rotating-testimonials .tabs li {    display: none;  }
  .rotating-testimonials .tabs li.active,  .rotating-testimonials .tabs li:hover {    background: none repeat scroll 0 0 #a3b0bb;    padding: 0;  }
  .rotating-testimonials .tabs li a {    display: block;    height: 20px;    overflow: hidden;    padding: 0;    text-indent: 9999px;  }
  .rotating-testimonials .panels {    width: 100%;    font-style: italic;    height: 100%;  }
  .rotating-testimonials .panels blockquote {    background-color: transparent;    border: 0 none;    margin-bottom: 0;  }
  
  /*footer*/
  footer {    margin-top: 20px;  }
 .accordion-group {    border: 0;  }
 .accordion-inner {    padding: 13px 5px 13px 5px;  }
  UL#countrymenu {    list-style-type: none;    margin: 0 !important;    padding: 0 !important;  }
  UL#countrymenu LI {    float: left;  }
  
  /* Flaggen */
  .sf {    background: url("../img/sprite_flags.png") no-repeat scroll 0 0 transparent;    font-size: 1px;    display: block;    width: 13px;    height: 9px;    padding: 0;    float: left;    margin: 2px 3px 0 0;  }
  .sf_0004 {    background-position: -15px -1px;  }
  .sf_2250 {    background-position: -140px -1px;  }
  .sf_0001 {    background-position: -126px -1px;  }
  .sf_9999 {    background-position: -126px -1px;  }
  .sf_1052914620483 {    background-position: -56px -1px;  }
  .sf_10758938612410 {    background-position: -112px -1px;  }
  .sf_1069323085328 {    background-position: -43px -1px;  }
  .sf_99991 {    background-position: -29px -1px;  }
  .sf_1053380918144 {    background-position: -85px -1px;  }
  .sf_105895954107 {    background-position: -99px -1px;  }
  .sf_12198502039011 {    background-position: -155px -1px;  }
  .sf_105731734085 {   background-position: -71px -1px;  }
  .sf_1057318429816 {    background-position: -1px -1px;  }
  .sf_12283959805711 {    background-position: -1px -1px;  }
  
  .metrouicss .tile-group-small {    margin: 0;    float: left;    height: auto;    min-height: 1px;    width: 90px;  }
  .metrouicss .tile-small {    width: 90px;    height: 90px;    margin: 0 0 5px 0;  }
  .metrouicss .tile-small .tile-content-small {    margin: 0;    padding: 0;    display: table-cell;    vertical-align: middle;    height: 90px;    width: 90px;  }
  .border-radius.htc {    background-color: #ffffff;  }
  
  /*Gallerie*/
  .gallery_box {    width: 31%;  }
  .gallery_box_lazy_load_overrides {    height: 100%;    max-height: 300px;  }
  .gallery_article {    padding: 8px;    line-height: 1;    border: 1px solid #f4f2f3;    margin-bottom: 10px;    position: relative;    background-color: #ffffff;  }
  .gallery_article div {    margin: 0 0 5px 0;  }
  .gallery_article img {    width: auto;    height: auto;    max-width: 100%;    max-height: 100%;  }
  .gallery_article_name {    height: 50px;  }

  .loadmore {    text-align: center;    z-index: 100;    position: fixed;    left: 45%;    bottom: 130px;    width: 200px;    padding: 10px;    background: #000000;    opacity: 0.8;    color: #ffffff;    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;    border-radius: 10px;  }
  
  div.gallery_box div.gallery_article div.entry-summary div.title {    margin-bottom: 13px;  }
  div.gallery_box div.gallery_article div.entry-summary div.title a {    font-weight: bold;  }
  div.gallery_box div.gallery_article div.entry-summary div.motiv_info {    margin-bottom: 13px;  }
  
 .wait {    visibility: hidden;    color: #000000;    text-align: center;    background-color: #f6f6f6;    border: 2px solid #fe860c;    margin: 60px 0 10px 0;    padding: 10px 5px 5px 5px;    z-index: 1000;  }
 .wait h4 {    font-size: 14px;    font-weight: bold;  }
 .wait DIV.pic {    border: 1px solid #708090;    padding: 1px 3px 1px 3px;    width: 130px;    position: relative;    left: 50%;  }
 .tabbable {    background-color: #ffffff;  }
 .feedback_site {    background-color: #ffffff;    margin-left: -10px;    padding: 10px 0 0 10px;  }
 .serviceFeedbackBox {    margin: 5px;  }
  .tab-pane {    margin: 0 10px;  }
  .tab-pane .desc {    float: left;    width: 150px;  }
  .tab-pane .val {    float: left;  }
  .linkImagePopup input {    font-size: 10px;    height: 20px;  }
  
  /*Schritte*/
  .steps {    clear: both;    background-color: #ffffff;  }
  .step1 {    clear: both;    background-color: #ffffff;  }
  .stepSpace {    height: 10px;    border: 0 solid red;  }
  .stepSpaceLeft {    margin-left: 5px;  }
  /*Schritte mit Accordion*/
  .fs-promo-percent i {    margin-left: -3px;  }
  
  /* fix position of percent character / icon */
  /*Transportinformationen*/
  #shipping_list {    clear: both;    padding: 10px 0 10px 0;  }
  #shipping_list UL.shipping_company {    list-style-type: none;    float: left;    text-align: center;    margin: 10px 0 10px 20px;  }
  .bsk_deliver_time {    background-color: #f4f2f3;    padding: 5px;  }
  .act_price {    text-decoration: line-through;  }
  .bg_color_promo {    background-color: #d8fcda;  }
  .bg_color_orig {    background-color: #dce7f5;  }
  .bg_color_normal {    background-color: #e6e6e6;  }
  .bg_color_normal2 {    background-color: #ffffff;  }
  
  /* abc Listenansicht*/
  DIV.list-abc {    background-color: #ffffff;    padding: 13px;  }
  a.abc-link {    background-color: #ffffff;    padding: 13px;    width: 100%;    margin-top: 13px;    font-size: 22pt;  }
  a.abc-link:hover {    text-decoration: underline;  }
  
  /*Kollektionen Listenansicht*/
  DIV.list-image TD {    font:      normal 11px Arial,      Verdana,      Geneva,      Helvetica,      sans-serif;  }
  DIV.list-image-box {    background-color: #ffffff;  }
  DIV.list-image-box TD {    font:      normal 11px Arial,      Verdana,      Geneva,      Helvetica,      sans-serif;  }
  DIV.list-image-box,
  DIV.list-image-box-poster,
  DIV.list-image-box-original {    float: left;    overflow: hidden;    margin: 4px;    margin-top: 50px;    width: 200px;    height: 290px;    border: solid 0 #666666;    padding-top: 10px;  }
  DIV.list-image-box-original {    background-color: #ffffff;  }
  DIV.list-image-box-pic {    text-align: center;    padding: 0;    margin: 0;  }
  P.list-image-box-title {    text-align: center;    padding: 0;    margin: 0;  }
  P.list-image-box-artstyle {    text-align: center;    padding: 0 3px 0 3px;    margin: 0;  }
  P.list-image-box-link {    text-align: center;    margin: 0;    border: 1px solid #666666;    background-color: #e0e0e0;    text-decoration: underline;    font-family: Arial, Helvetica, sans-serif;    font-size: 10pt;  }
  table.cust_data2 tr td {    font-size: 9pt;    padding: 2px 3px 2px 3px;  }

  .myImagePreview {    float: left;    margin-right: 13px;  }
  
  #trusted_shop_logo {    width: 70px;    padding-top: 5px;  }
  
  /*MyShop*/
  .panel-myshop > .panel-heading {    background-color: #ffffff;    color: #000000;  }
  
  /*Position für Link auf Bild*/
  /*mittig*/
  .left-middle    {    position: absolute;    left: 0;    top: 50%;    width: 100%;    -webkit-transform: translate(10px, -50%);    -ms-transform: translate(10px, -50%);    transform: translate(10px, -50%);    text-align: left;  }
  .center-middle  {    position: absolute;    left: 0;    top: 50%;    width: 100%;    -webkit-transform: translate(0, -50%);    -ms-transform: translate(0, -50%);    transform: translate(0, -50%);    text-align: center;  }
  .right-middle   {    position: absolute;    left: 0;    top: 50%;    width: 100%;    -webkit-transform: translate(-10px, -50%);    -ms-transform: translate(-10px, -50%);    transform: translate(-10px, -50%);    text-align: right;  }
  /*oben*/
  .left-top       {    position: absolute;    left: 0;    top: 0;    width: 100%;    text-align: left;    padding-left: 10px;  }
  .center-top     {    position: absolute;    left: 0;    top: 0;    width: 100%;    text-align: center;  }
  .right-top      {    position: absolute;    left: 0;    top: 0;    width: 100%;    text-align: right;    padding-right: 10px;  }
  /*unten*/
  .left-bottom    {    position: absolute;    left: 0;    bottom: 0;    width: 100%;    text-align: left;    padding-left: 10px;  }
  .center-bottom  {    position: absolute;    left: 0;    bottom: 0;    width: 100%;    text-align: center;  }
  .right-bottom   {    position: absolute;    left: 0;    bottom: 0;    width: 100%;    text-align: right;    padding-right: 10px;  }
  .cursor-eresize {    cursor: e-resize;  }
  
  
  

  
 /* 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, sans-serif;
    line-height: 140%;
    border: 1px solid var(--kk-grey-color);
    padding: 4px 20px 0 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;
  }
  
  
.buttoneasy_rounded,
  .buttoneasy_rounded:hover,
  .buttoneasy_rounded a,
  .buttoneasy_rounded a:hover {

    display: inline-block;
    margin-top: 16px;
    font-family: PTSansRegular, sans-serif;
    line-height: 140%;
    border: 1px solid #ccc;
    padding: 4px 20px 0 20px;
    text-transform: uppercase;
    white-space: nowrap;
    font-size: 12pt;
    text-decoration: none;
    border-radius: 8px;
    transition: transform 0.25s cubic-bezier(.25,.46,.45,.94);
  }
  
  .buttoneasy_rounded,
  .buttoneasy_rounded a {

    color: var(--kk-grey-color);
    background-color: var(--kk-white-color);
  }
  
  .buttoneasy_rounded a:hover,
  .buttoneasy_rounded:hover {

        text-decoration: none;
        color: var(--kk-grey-color);
        background-color: var(--kk-white-color);
        transform: scale(1.05);

  }
  
  
  
  
  
  .buttonmini {
    font-family: PTSansRegular, sans-serif;
    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;
  }
  
  .buttonmini:hover {
    border: 1px solid var(--kk-grey-color);
    color: var(--kk-grey-color);
    background-color: #f8f8f8;
    box-shadow: 0 0 4px 0 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: 0 0 0 0 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;
  }
  
  /* LINKE NAVIGATION */
  .navtop {
    border-bottom: 0;
    padding-bottom: 4px;
    text-transform: uppercase;
    font-family: PTSansRegular, sans-serif;
    font-weight: normal;
    line-height: 130%;
    font-size: 12pt;
  }
  
  .navtext {
    padding: 0;
    line-height: 100%;
    font-size: 11pt;
  }
  
  .navlist {
    padding: 0 0 0 6px;
  }
  
  .navend {
    text-decoration: none;
    padding: 0;
    text-align: right;
    margin-top: 5px;
    margin-bottom: 13px;
  }
  
  .link-NAVI {
    font-family: PTSansRegular, sans-serif;
    color: var(--kk-grey-color);
    text-decoration: none;
    line-height: 100%;
    white-space: normal;
    font-size: 11pt;
  }
  
  .link-NAVI:hover {
    font-family: PTSansRegular, sans-serif;
    color: var(--kk-grey-color);
    line-height: 100%;
    white-space: normal;
    font-size: 11pt;
    text-decoration: underline;
  }
  
  
  /* 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;
  }
  
  
    /* !!!!!! ALLE SWIPER !!!!!! */  
   /* !!!!!! Slider Kollektionnen Navi !!!!!! */ 	
/* Hintergrund der horizontalen Scrollbar */
.secondary-nav-scrollbar .swiper-scrollbar {
  background: var(--kk-grey-color);
  height: 12px;        /* Gesamtdicke der Scrollbar */
  border-radius: 6px;
  position: relative;  /* wichtig für zentrierten Drag */
}

/* Gelber Drag-Balken (Scroller) */
.secondary-nav-scrollbar .swiper-scrollbar-drag {
  /*background: var(--kk-dgrey-color);*/
  height: 6px;         /* Dicke des gelben Balkens */
  border-radius: 6px;
  position: absolute;  /* vertikal zentrieren */
  
}

/* Optional zusammengefasst: beide Höhe anpassbar */
.secondary-nav-scrollbar .swiper-scrollbar,
.secondary-nav-scrollbar .swiper-scrollbar-drag {
  border-radius: 6px;
}

/* global */
*, ::after, ::before {
  box-sizing: border-box;
}


   /* !!!!!! Slider SWIPER !!!!!! */ 
 .swiper-slide {
    width: auto;
    flex-shrink: 0;
}

.swiper-button-next,
.swiper-button-prev {
    
    width: 20px;
    height: 48px;
    border-radius: 8px;
    opacity: 0.0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.swiper:hover .swiper-button-prev,
.swiper:hover .swiper-button-next {
    opacity: 0.8;
}
.swiper-button-next:hover,
.swiper-button-prev:hover {

              width: 30px;
              height: 72px;
              border-radius: 8px;
              opacity: 1 !important;
}

.swiper-button-prev i::before {
    content: "\f284"; /* Bootstrap Icon: chevron-left */
    font-family: "bootstrap-icons";
}

.swiper-button-next i::before {
    content: "\f285"; /* Bootstrap Icon: chevron-right */
    font-family: "bootstrap-icons";
}
.swiper-border .swiper{ padding: 10px !important; }



/* !!!!!!! Scroll Swiper !!!!!!! */

.scrollBox .swiper { 
              height: 25rem; 
} 

.scrollBox .swiper-slide { 
              height: auto; 
              box-sizing: border-box; 
              white-space: normal !important; 
} 

.scrollBox .secondary-nav-slide:hover { 
              transform: none !important; 
}


  
  /* !!!!!!! Rahmenstudio !!!!!!! */

.kk_singleMatMainDiv  { position: relative; width: 140px; }
.kk_singleMatPic      { padding-top: 0px; margin-right: 15px; padding-bottom: 5px; padding-left: 0px; }
.kk_singleMatName     { padding-top: 5px; }

.kk_matGroup          { cursor: pointer; font-size: medium; padding: 0px; line-height: 115%; }
  
  /* 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;
  }
  

  /* Rahmenlistungen im Content */
  .cc-frame-list-header {
    margin-bottom: 9px;
    margin-top: 9px;
  }
  
  div.cc-frame {
    background-color: transparent !important;
    margin: 9px 0 0 0;
  }
  
  div.cc-frame-border {
    border-right: 0 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: 0;
    padding: 0;
  }
  
  div.cc-frame div.cc-frame-img {
    padding-top: 13px;
    border-bottom: 0 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: 0;
  }
  
  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: 0;
  }
  
  div.cc-frame div.cc-frame-bottom div.cc-frame-bottom-desc-xs {
    font-size: smaller;
  }
  
  /* boostrap Popover-Header-Linien entfernen */
  .popover .popover-header {
    background-color: white !important;
    background: white !important;
    border-bottom: none !important;
    border-top: none !important;
    margin: 0 !important;
  }

  
  
  /* 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: 0;
    transition: all 0.5s;
  }
  
  .modul-panel-heading.active a:before {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    transform: rotate(-180deg);
  }
  
  .verdecken {
    display: none;
  }
  
  /* 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;
  }
  
  img.no-scale {
    width: auto;
    height: auto;
    max-width: none;
    max-height: none;
  }