.navigation {
    padding: 20px;

}

.navigation select {
    width: 100%;
    padding: 8px;
    font-size: 16px;
    border: none;
    border-radius: 4px;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.navigation h2 {
    margin-top: 0;
}




.logo {
    position: absolute;
    top: -2%;
    right: 0%;
    width: 20%;
    z-index: 999;
}

h1, h2 {
    color: #007bff;
    margin-top: 0;
}

form {
    margin-bottom: 20px;
}

select {
    padding: 8px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 300px;
    margin-right: 10px;
}

input[type="submit"] {
    padding: 8px 16px;
    font-size: 16px;
    cursor: pointer;
    background-color: #007bff;
    color: #fff;
    border: none;
    border-radius: 5px;
}

pre {
    white-space: pre-wrap;
    font-size: 16px;
    background-color: #fff;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #ccc;
}

.highlight {
    font-weight: bold;
}

.highlight-1 { color: blue; }
.highlight-2 { color: red; }
.highlight-3 { color: green; }
.highlight-4 { color: orange; }
.highlight-5 { color: purple; }
.highlight-6 { color: brown; }
.highlight-7 { color: #ff00ff; }
.highlight-8 { color: #ff8000; }
.highlight-9 { color: #808080; }
.highlight-10 { color: #008080; }
.highlight-11 { color: #800080; }
.highlight-12 { color: #800000; }
.highlight-13 { color: #008000; }
.highlight-14 { color: #000080; }
.highlight-15 { color: #ffff00; }