@font-face {
    font-family: fairfaxhd;
    src: url('/fonts/Fairfax.ttf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: fairfaxhd;
    src: url('/fonts/FairfaxBold.ttf');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: fairfaxhd;
    src: url('/fonts/FairfaxItalic.ttf');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: fairfaxhd;
    src: url('/fonts/FairfaxItalic.ttf');
    font-weight: bold;
    font-style: italic;
}

html {
    scrollbar-color: var(--primary) var(--secondary);
    scrollbar-width: thin;
    /* --- zmienne --- */
    --primary: #6FA287;
    --secondary: #2B303A;
    --bright: #FFFBFE;
}

body {
    font-family: fairfaxhd, monospace;
    font-size: 18px;
    color: white;
    background-color: var(--secondary);
}

pre {
    font-family: fairfaxhd, monospace;
    line-height: 100%;	
    width: 750px;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
}

p {
    font-family: fairfaxhd, monospace;
    line-height: 100%;
    text-align: left;
    width: 750px;
    margin-left: auto;
    margin-right: auto;
}

a {
    /* używany do stylizacji hiperłączy */
    color: inherit;
    text-decoration-line: none;
    font-weight: bold;
    font-style: normal;
}

a:hover {
    color: var(--primary);
    font-style: italic;
    font-weight: normal;
}

img {
    /* używany do stylizacji obrazków */
    width: 80ch;
    height: auto;
    padding-top: 1em;
    padding-bottom: 0em;
}
.navbar {
    overflow: hidden;
    background-color: transparent;
    position: sticky;
    top: 0;
    background-color: var(--secondary);
    /* width: 100%; */
    height: 13em;
}

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dashed var(--bright);
    margin-bottom: -1px
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 38ch;
    background-color: var(--secondary);
    color: var(--bright);
    text-align: right;
    position: absolute;
    z-index: 1;
    top: -2ch;
    right: 0ch;
    opacity: 0;
    transition: opacity 0.15s ease-in-out;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
    font-weight: normal;
    font-style: italic;
}