let calhtml = `
    <style>
        body, table {
            font-family: Verdana, sans-serif;
            font-weight: lighter;
            font-size: 11px;
        }

        table {
            border-spacing: 1px;


        }

        td {
            padding: 4px 3px;
            text-align: center;
            border-collapse: collapse;
        }

        thead td {
            background: #eaeaea;
            font-weight: bold;
        }

        thead td:first-of-type {
            text-align: left;
            font-weight: bold;
            padding-left: 4px;
        }

        td.day {
            background: #98e197;
            color: #2a2a2a;
            min-width: 22px;
        }

        td.day.d {
            background: #eaeaea;
            opacity: 0.6;
        }

        td.day.x {
            background: #f67a7a;
        }

        td.day.e {
            background-image: linear-gradient(135deg, #F67A7A 48%, transparent 52%);
            background-color: #98E197;
        }

        td.day.s {
            background-image: linear-gradient(135deg, transparent 48%, #F67A7A 52%);
            background-color: #98E197;
        }

        td.wd6,
        td.wd7 {
            color: #cc0000;
        }

        td.appartment {
            color: #222;
            font-weight: bold;
            min-width: 197px;
            text-align: left
        }

        .mth:not(.visible) {
            display: none;
        }

        thead.links td {
            background: transparent;
            text-align: center;
            font-size: 11px;
            padding: 10px 0;
        }

        .links a {
            font-weight: normal;
            color: #000;
            text-decoration: none;
        }

        .links a:after {
            content: "|";
            margin: 0 2px;
        }

        .links a:last-of-type:after {
            content: "";
        }

        .calframe {
            width: 100%;
            overflow: scroll;
        }
    </style>
    <div class="calframe">
        <table>
            <thead class="links">
            <tr>
                <td colspan="32">
                    <a href="javascript:void(0)"
                                                                           onclick="switchmonth(\'m122025\');">Dez. 2025</a></td>
            </tr>
            </thead>
                        <thead
                class="mth m122025   visible">
            <tr>

                <td>Dezember 2025</td>
                <td>01</td><td>02</td><td>03</td><td>04</td><td>05</td><td>06</td><td>07</td><td>08</td><td>09</td><td>10</td><td>11</td><td>12</td><td>13</td><td>14</td><td>15</td><td>16</td><td>17</td><td>18</td><td>19</td><td>20</td><td>21</td><td>22</td><td>23</td><td>24</td><td>25</td><td>26</td><td>27</td><td>28</td><td>29</td><td>30</td><td>31</td>            </tr>
            </thead>
            <tbody
                class="mth m122025    visible">
                            <tr>
                    <td class="appartment">2.13 - NahERHOLUNGSGEBIET</td>
                    <td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day x wd2'>Di</td><td class='day x wd3'>Mi</td><td class='day x wd4'>Do</td><td class='day x wd5'>Fr</td><td class='day x wd6'>Sa</td><td class='day x wd7'>So</td><td class='day x wd1'>Mo</td><td class='day x wd2'>Di</td><td class='day x wd3'>Mi</td>                </tr>
                            <tr>
                    <td class="appartment">2.14 - Bergliebe</td>
                    <td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day x wd2'>Di</td><td class='day x wd3'>Mi</td><td class='day x wd4'>Do</td><td class='day x wd5'>Fr</td><td class='day x wd6'>Sa</td><td class='day x wd7'>So</td><td class='day x wd1'>Mo</td><td class='day x wd2'>Di</td><td class='day x wd3'>Mi</td>                </tr>
                            <tr>
                    <td class="appartment">3.13 - Schlafbereich</td>
                    <td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day x s wd2'>Di</td><td class='day x wd3'>Mi</td><td class='day x wd4'>Do</td><td class='day x wd5'>Fr</td><td class='day x wd6'>Sa</td><td class='day x wd7'>So</td><td class='day x wd1'>Mo</td><td class='day x wd2'>Di</td><td class='day x wd3'>Mi</td>                </tr>
                            <tr>
                    <td class="appartment">3.14 - Traumland</td>
                    <td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day d wd2'>Di</td><td class='day d wd3'>Mi</td><td class='day d wd4'>Do</td><td class='day d wd5'>Fr</td><td class='day d wd6'>Sa</td><td class='day d wd7'>So</td><td class='day d wd1'>Mo</td><td class='day x wd2'>Di</td><td class='day x wd3'>Mi</td><td class='day x wd4'>Do</td><td class='day x wd5'>Fr</td><td class='day x wd6'>Sa</td><td class='day x wd7'>So</td><td class='day x wd1'>Mo</td><td class='day x wd2'>Di</td><td class='day x wd3'>Mi</td>                </tr>
                        <tr>
                <td>&nbsp;</td>
            </tr>

                        </tbody>
        </table>
    </div>
    <script>

        function switchmonth(cla) {
            var ele = document.querySelectorAll(".mth");
            ele.forEach(function (e) {
                e.style.display = "none";
            })

            var ele = document.querySelectorAll("thead.mth." + cla);
            ele.forEach(function (e) {
                e.style.display = "table-header-group";
            })
            var ele = document.querySelectorAll("tbody.mth." + cla);
            ele.forEach(function (e) {
                e.style.display = "table-row-group";
            })
            return false;
        }
    </script>
    `;
    document.write(calhtml);