/* =========================================================
   BUTTONS Sonderfarben
   ========================================================= */




.btnfuchsia, .btndarkorange, .btnchartreuse, .btnaquamarine, .btnaqua, .btnDodgerBlue,  .btnMediumSpringGreen,  .btnIndigo 
  {
    display: inline-block;
    color: #000;
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 12px;
    border: 1px solid #6bbf4e;
    transition: 0.2s ease-in-out;
    text-decoration: none;
  }

.btnfuchsia             { background-color: #FF00FF; }
.btndarkorange          { background-color: #FF8C00; }
.btnchartreuse          { background-color: #7FFF00; }
.btnaquamarine          { background-color: #7FFFD4; }
.btnaqua                { background-color: #00FFFF; }
.btnDodgerBlue          { background-color: #1E90FF; }
.btnMediumSpringGreen   { background-color: #00FA9A; }
.btnIndigo              { background-color: #4B0082; }

.btnfuchsia:hover,
.btndarkorange:hover,
.btnchartreuse:hover,
.btnaquamarine:hover,
.btnaqua:hover,
.btnDodgerBlue:hover,
.btnMediumSpringGreen:hover,
.btnIndigo:hover 
  {
    background-color: #ffffaa;
    border-color: #ff0000;
  }




/* =========================================================
   klassisch
   ========================================================= */


.btnKoralle, .btnCyan, .btnBlue, .btnBluehell, .btnYellow, .btnYellowhell, .btnRed, .btnRedhell,  .btnGreen,  .btnGreenhell 
  {
    display: inline-block;
    color: #000;
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 12px;
    border: 1px solid #6bbf4e;
    transition: 0.2s ease-in-out;
    text-decoration: none;
  }

.btnKoralle    { background-color: #ff7f50; }
.btnCyan       { background-color: #00ffff; }
.btnBlue       { background-color: #00ffff; }
.btnBluehell   { background-color: #aaffff; }
.btnYellow     { background-color: #ffff00; }
.btnYellowhell { background-color: #ffff88; }
.btnRed        { background-color: #ff0000; }
.btnRedhell    { background-color: #ffaaaa; }
.btnGreen      { background-color: #7fff00; }
.btnGreenhell  { background-color: #cfffcc; }

.btnKoralle:hover,
.btnCyan:hover,
.btnBlue:hover,
.btnBluehell:hover,
.btnYellow:hover,
.btnYellowhell:hover,
.btnRed:hover,
.btnRedhell:hover,
.btnGreen:hover,
.btnGreenhell:hover 
  {
    background-color: #ffffaa;
    border-color: #ff0000;
  }



/* =========================================================
   CLOSE-BUTTONS
   ========================================================= */

/* Schwarzer Close-Button */
/* Schwarzer Close-Button links oben */
.close-btn-black {
    background: #000000;
    color: #ffffff;
    border: 2px solid red;   /* ← DEIN SCHÖNER ROTER RAND */
    padding: 6px 12px;
    cursor: pointer;
    border-radius: 4px;

    position: fixed;
    top: 5mm;
    left: 5mm;

    z-index: 9999;           /* ← damit er über allem liegt */
}
.close-btn-black:hover {
    background: #333333;
    border-color: #ff4444;   /* optional: schöner Hover-Rand */
}



/* =========================================================
   InfoBox
   ========================================================= */
.btnInfoBox {
    background-color: #ffffaa;
    color: #000;
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 12px;
    border: 1px solid #6bbf4e;
    transition: 0.2s ease-in-out;
    text-decoration: none;
   }

.btnInfoBox:hover {
    background-color: #aaffff;
    border-color: #ff0000;
}

/* =========================================================
   back To Top
   ========================================================= */
#backToTop {
    position: fixed;
    right: 20px;
    bottom: 20px;
    padding: 4px 6px;
    background: #007bff;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

/* =========================================================
   back To Top rund
   ========================================================= */
#backToToprund {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 40px;
    height: 40px;
    background: #007bff;
    color: white;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    text-align: center;
    line-height: 40px;
    font-size: 22px;
    box-shadow: 0 0 6px rgba(0,0,0,0.3);
    z-index: 9999;
}

#backToToprund:hover {
    background: #0056b3;
}


.miniBtn {
    padding: 2px 6px;
    font-size: 10px;
    background: #aaffff;
    color: #fff;
    border: 1px solid #666;
    border-radius: 3px;
    cursor: pointer;
}
.miniBtn:hover {
    background: #ffff00;
}