header {
    background-color: #212529;
}

header h1 {
    font-family: "Roboto Mono", monospace;
    font-size: 0;
    user-select: none;
}

.text-transparent {
    background-image: linear-gradient(to right, #ab3d7c, #9c3d86, #8a408f, #744397, #58469c, #4552a5, #2d5dac, #0067b0, #007bb7, #008cb4, #009bac, #17a9a0);
    -webkit-background-clip: text; /* Обрезка фона по контуру текста */
    background-clip: text;
    color: transparent; /* Делаем сам текст прозрачным */
}

/*header span {*/
/*    color: white;*/
/*    background-color: #212529;*/
/*}*/

/*span.hi-1 {*/
/*    background-color: #197278;*/
/*    color: darkslategray;*/
/*}*/

/*span.hi-2 {*/
/*    color: #007bff;*/
/*}*/

/*span.hi-3 {*/
/*    color: #d09b2c;*/
/*}*/

/*span.hi-4 {*/
/*    color: #212529;*/
/*    background-color: #764dc5;*/
/*}*/

/*span.hi-5 {*/
/*    color: #d74550;*/
/*}*/

/*span.hi-6 {*/
/*    color: #197278;*/
/*}*/

/*span.hi-7 {*/
/*    color: #007bff;*/
/*}*/

/*span.hi-8 {*/
/*    color: #212529;*/
/*    background-color: #d09b2c;*/
/*}*/

/*span.hi-9 {*/
/*    color: #764dc5;*/
/*}*/

/*span.hi-10 {*/
/*    color: #d74550;*/
/*}*/

/*span.hi-11 {*/
/*    color: #197278;*/
/*}*/

/*span.hi-12 {*/
/*    color: #007bff;*/
/*}*/

/*span.hi-13 {*/
/*    color: #d09b2c;*/
/*}*/

/*span.hi-14 {*/
/*    color: #764dc5;*/
/*}*/

/*span.hi-15 {*/
/*    color: #d74550;*/
/*}*/

/*span.hi-16 {*/
/*    color: #197278;*/
/*}*/

/*span.hi-17 {*/
/*    color: #007bff;*/
/*}*/

/*span.hi-18 {*/
/*    color: #d09b2c;*/
/*}*/

/*span.hi-19 {*/
/*    color: #212529;*/
/*    background-color: #764dc5;*/
/*}*/

/*span.hi-20 {*/
/*    background-color: #d74550;*/
/*    color: firebrick;*/
/*}*/

/*span.hi-21 {*/
/*    background-color: #197278;*/
/*    color: darkslategray;*/
/*}*/