:root {
    --color-blue: #3cbfeb;
    --color-filter-blue: brightness(0) saturate(100%) invert(66%) sepia(73%) saturate(762%) hue-rotate(162deg) brightness(94%) contrast(96%);

    --color-main: var(--color-blue);
    --color-filter-main: var(--color-filter-blue);
}

* {
    --svg-stop-1: #435972;
    --svg-stop-2: #536780;
    --svg-stop-3: #64768e;
    --svg-stop-4: #6d7f97;
    --svg-stop-5: #71829a;
    --svg-stop-6: #72849d;
    --svg-stop-7: #768aa7;
    --svg-stop-8: #7c95b8;
    --svg-stop-9: #86a4cf;
    --svg-stop-10: #8baddc;
}

:root.color-settings-bw {
    --color-greenish: var(--color-yellow);
    --color-red: var(--color-yellow);
}

:root.color-settings-by {
    --color-greenish: var(--color-main);
    --color-orange: var(--color-main);
    --color-filter-orange: var(--color-filter-main);
    --color-red: var(--color-main);
}

:root.color-settings-yb {
    --color-greenish: var(--color-fg);
    --color-red: var(--color-fg);
}

:root:not([class*="color-settings"]) .svg-adjustable {
    filter: var(--color-filter-main);
    stroke: var(--color-main);
}

html:not([class*="color-settings"]) header {
    background-color: initial;
}

nav, header > * {
    max-width: initial;
}

header .table,
nav {
    max-width: 1300px;
}

header div#banner {
    background-color: var(--color-light-gray);
}

header div#banner img {
    max-width: 1300px;
    margin: 0 auto;
}

section h2:first-child,
section h3:first-child,
section h4:first-child,
section h5:first-child,
section h6:first-child {
    text-align: initial;
}

:root:not([class*="color-settings"]) section h2,
:root:not([class*="color-settings"]) section h3,
:root:not([class*="color-settings"]) section h4,
:root:not([class*="color-settings"]) section h5,
:root:not([class*="color-settings"]) section h6 {
/*    background: linear-gradient(160deg, #435972, #8baddc);
    background-clip: border-box;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    margin-bottom: 0;*/
    color: var(--color-main);
}

.tad-bigger {
    font-size: 1.15rem;
}

nav {
    gap: 30px;
}

nav > a {
    background-color: initial;
    border-color: initial;
    line-height: 40px;
    letter-spacing: 0.1rem;
    padding: initial;
    color: initial;
    border: none !important;
}

nav > a[target] {
    background-color: var(--color-fg);
    border-color: var(--color-fg);
    color: var(--color-bg);
    margin-left: auto;
    margin-right: 0;
    padding: 0 45px;
}

:root:not([class*="color-settings"]) nav > a[target] {
    background-color: var(--color-red);
    border-color: var(--color-red);
}

section > * {
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
}

div.table.program {
    text-align: left !important;
}

div.table.program .label {
    grid-column: span 2;
}

div.table.program div.label span {
    display: inline-block;
}

div.table.program div.label > span:first-child,
div.table.program .spacer {
    width: 11ch;
}

#sponsorzy div.table {
    grid-template-columns: initial;
}

div.table .sponsor img {
    max-height: 120px;
    max-width: 90vw;
    height: 100px;
}

:root.color-settings-bw nav > a:not([target]),
:root.color-settings-by nav > a:not([target]) {
    color: var(--color-fg);
}

html.color-settings-by #sponsorzy .sponsor img.sponsor-mos,
html.color-settings-bw #sponsorzy .sponsor img.sponsor-mos {
    content: url('/templates/generic_spa_template/images/sponsors/mks-color-dark-bg-130.png');
}

html.color-settings-yb #sponsorzy .sponsor img.sponsor-mos {
    content: url('/templates/generic_spa_template/images/sponsors/mks-mono-light-bg-130.png');
}

@media screen and (max-width: 870px) {
    #sponsorzy div.table .sponsor img {
	height: initial;
	max-width: 40vw;
    }
}

@media screen and (max-width: 700px) {
    #sponsorzy div.table .sponsor img {
	max-width: 80vw;
    }
}
