body {
    background-image: url("./obrazy/tło.gif");
    color: #d8d8d8;
    max-width: 1400px;
    padding: 8px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
}

/* header { */
/*     background-color: #fff; */
/*     color: black; */
/* } */

header {
    /* N-Nawigator */
    border: 4px groove white;
    display: flex;
    background-color: black;
    margin-bottom: 16px;
    border-image: url("/obrazy/okna/nawigator/ramka-okna.png") 5 round;
    height: 81px;
}

#nawigator {
    background-color: #6b627c;
    /*     padding: 4px; */
    width: 100%;
    border-top: 2px solid #969696;
    border-right: 1px solid #969696;
}

#nawigator .lewy {
    content: " ";
    width: 21px;
    height: 79px;
    background-image: url("/obrazy/okna/nawigator/uchwytL.png");
    float: left;
}

#nawigator .prawy {
    content: " ";
    width: 21px;
    height: 79px;
    background-image: url("/obrazy/okna/nawigator/uchwytP.png");
    float: right;
}

.kontener {
    float: left;
    height: 79px;
    display: flex;
    flex-direction: column;
}

.P {
    float: right;
}

.kontener .ikony {
    box-sizing: border-box;
    border: 2px groove gray;
    border-image: url("/obrazy/okna/nawigator/ramka-guzikow.png") 2 round;
    height: 63px;
    overflow: hidden;
    float: left;
    background-color: #7a728c;
}

.kontener .ikony .ikona {
    float: left;
}

.kontener .ikony a {
    display: block;
    width: 48px;
    height: 48px;
    content: " ";
    margin: 4px 7px 0 7px;
    float: left;
}

.kontener .ikony a .pokazywacz {
    visibility: hidden;
    position: absolute;
    display: inline-block;
}

.kontener .ikony a:hover .pokazywacz {
    visibility: visible;
    border: 2px groove white;
    background-color: black;
    padding: 0.25em;
    color: white;
    /* position: relative;
    right: 50%;
    z-index: 1;*/
}

.guziki-menu {
    float: left;
}

.guziki-menu .menu {
    content: " ";
    float: left;
    background-image: url("/obrazy/okna/nawigator/menu.png");
    height: 16px;
    width: 63px;
}

.podkontener {
    height: 79px;
}

.robocze {
    width: fit-content;
    background-color: #7a728c;
    box-sizing: border-box;
    border: 2px solid #969696;
    border-image: url("/obrazy/okna/nawigator/ramka-roboczych.png") 2 round;
    box-sizing: border-box;
    height: 79px;
}

.robocze a img {
    max-height: 40px;
    border: 2px white ridge;
    padding: 2px;
    float: left;
}

h1#tytul {
    display: block;
    margin: 0;
    margin-top: 17px;
    padding: 0 4px;
    border: 3px #595f4b inset;
    border-image: url("/obrazy/okna/zielone/wciete.png") 3 round;
    background: #767e63;
    font-family: "Courier New", Courier, monospace, mono;
    font-weight: normal;
    font-size: 30px;
    height: 40px;
    box-sizing: border-box;
    line-height: 36px;
    float: left;
}

.robocze .ikony {
    float: left;
    margin: 0 16px 0 8px;
}

.robocze .ikony a {
    display: block;
    content: " ";
    width: 24px;
    margin-top: 6px;
    height: 24px;
}

.exit {
    background-image: url("/obrazy/ikony/cde/FpExit.png");
}

.hh {
    background-image: url("/obrazy/ikony/cde/FpHh.png");
}

.kludka {
    background-image: url("/obrazy/ikony/cde/FpKludka.png");
}

.pulpity {
    background-image: url("/obrazy/ikony/cde/FpPulpity.png");
}

.rss {
    margin-right: 8px;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: auto;
}

.ukryc {
    display: none;
}

a img {
    /* Z jakiegoś powodu bez tego hiperłącze ma inną wysokość, niż obrazek */
    display: block;
}

/* main { */
/*     width: fit-content; */
/*     margin-left: auto; */
/*     margin-right: auto; */
/* } */


/* Okna */

.okno {
    margin-bottom: 2em;
}

#bok .okno {
    margin-bottom: 1em;
}

.okno .tytul-okna {
    /*     float: left; */
    margin: 0;
    height: 20px;
    overflow: hidden;
    font-size: 18px;
    font-family: "Courier New", Courier, monospace, mono;
    margin-left: 60px;
    text-align: center;
    position: relative;
    right: 40px;
    box-sizing: border-box;
    border: 1px outset white;
}

.okno .tytul-okna::before {
    content: var(--tytul-okna);
}

/*ZIELONE*/
.okno.zielone {
    border: 4px ridge #767e63;
    border-image: url("/obrazy/okna/zielone/ramka-okna.png") 5 round;
    -moz-border-image: url("/obrazy/okna/zielone/ramka-okna.png") 5 round;
    -webkit-border-image: url("/obrazy/okna/zielone/ramka-okna.png") 5 round;
    -o-border-image: url("/obrazy/okna/zielone/ramka-okna.png") 5 round;
    background: black;
}

.okno.zielone .zo-pasek {
    background: #767e63;
    color: white;
    font-weight: bold;
}

.okno.zielone .tytul-okna {
    border: 1px outset #767e63;
    border-image: url(/obrazy/okna/zielone/ramka-tytułu.png) 1 round;
    -moz-⁩border-image: url(/obrazy/okna/zielone/ramka-tytułu.png) 1 round;
    -webkit-⁩border-image: url(/obrazy/okna/zielone/ramka-tytułu.png) 1 round;
    -o-border-image: url(/obrazy/okna/zielone/ramka-tytułu.png) 1 round;
}

.okno.zielone div.zo-pasek .ikon {
    background-image: url(/obrazy/okna/zielone/guzik-ikon.png);
}

.okno.zielone div .maks {
    background-image: url(/obrazy/okna/zielone/guzik-max.png);
}

.okno.zielone div .menu {
    background-image: url(/obrazy/okna/zielone/guzik-menu.png);
}

.okno.zielone a {
    color: #4992a7;
}

.info-wpis {
    float: left;
    width: 100%;
    margin-bottom: 1em;
}

.info-wpis h3 {
    float: left;
    margin: 0;
}

.info-wpis date {
    float: right;
}

.zo-pasek {
    width: 100%;
    float: left;
    margin-top: 0;
    box-sizing: border-box;
    height: 20px;
    margin-bottom: 0.5em;
    color: white;
}

.zo-guzik {
    display: block;
    width: 20px;
    height: 20px;
    background-color: gray;
    content: "";
    float: left;
    position: relative;
    z-index: 3;
}

.zo-guzik.ikon {
    float: right;
    bottom: 20px;
}

.zo-guzik.maks {
    float: right;
    bottom: 20px;
}

.srodek {
    box-sizing: border-box;
    padding: 0.5em;
    margin-top: 1em;
}

.naglowek {
    width: 100%;
    padding: 0 0.5em;
    float: left;
    box-sizing: border-box;
    padding-bottom: 0.5em;
}

.naglowek h2 {
    float: left;
    margin: 0;
}

.naglowek time {
    float: right;
/*     padding-right: 1em; */
}

.naglowek .hr {
    border-bottom: 1px solid gray;
    width: 100%;
    height: 1px;
    float: left;
}

.naglowek a {
    text-decoration: none;
}

#wpisy {
    width: 70%;
}

article img {
    float: right;
    border: 2px ridge black;
    padding: 2px;
    max-width: 250px;
    max-height: 250px;
    margin: 0.5em;
    margin-right: 0;
}

#stopka-stronniczego {
    float: left;
    width: 100%;
}

#wpisy .okno.zielone {
    width: 100%;
    float: left;
}

#bok {
    width: 29%;
    float: right;
}

/* Okno ASI */
.okno.asi {
    border: 4px ridge #c24d02;
    border-image: url("/obrazy/okna/asi/ramka-okna.png") 5 round;
    -moz-border-image: url("/obrazy/okna/asi/ramka-okna.png") 5 round;
    -webkit-border-image: url("/obrazy/okna/asi/ramka-okna.png") 5 round;
    -o-border-image: url("/obrazy/okna/asi/ramka-okna.png") 5 round;
    background: black;
}

.okno.asi .zo-pasek, .okno.asi .zo-guzik {
    background: #c24d02;
    color: white;
    font-weight: bold;
}

.okno.asi .tytul-okna {
    border: 1px outset #c24d02;
    border-image: url(/obrazy/okna/asi/ramka-tytułu.png) 1 round;
    -moz-⁩border-image: url(/obrazy/okna/asi/ramka-tytułu.png) 1 round;
    -webkit-⁩border-image: url(/obrazy/okna/asi/ramka-tytułu.png) 1 round;
    -o-border-image: url(/obrazy/okna/asi/ramka-tytułu.png) 1 round;
}

.okno.asi div.zo-pasek .ikon {
    background-image: url(/obrazy/okna/asi/guzik-ikon.png);
}

.okno.asi div .maks {
    background-image: url(/obrazy/okna/asi/guzik-max.png);
}

.okno.asi div .menu {
    background-image: url(/obrazy/okna/asi/guzik-menu.png);
}

.okno.asi a {
    color: #4992a7;
}

/* Commonality */
.okno.strony {
    border: 4px ridge #c6b3a9;
    border-image: url("/obrazy/okna/com/ramka-okna.png") 5 round;
    -moz-border-image: url("/obrazy/okna/com/ramka-okna.png") 5 round;
    -webkit-border-image: url("/obrazy/okna/com/ramka-okna.png") 5 round;
    -o-border-image: url("/obrazy/okna/com/ramka-okna.png") 5 round;
}


div.okno.strony .zo-pasek, .okno.strony .zo-guzik {
    background: #c6b3a9;
}

div.okno.strony h2 {
    border: 1px outset #c6b3a9;
    border-image: url(/obrazy/okna/com/ramka-tytułu.png) 1 round;
    -moz-⁩border-image: url(/obrazy/okna/com/ramka-tytułu.png) 1 round;
    -webkit-⁩border-image: url(/obrazy/okna/com/ramka-tytułu.png) 1 round;
    -o-border-image: url(/obrazy/okna/com/ramka-tytułu.png) 1 round;
}

/*
div.okno.strony div.zo-pasek .ikon {
    background-image: url(./obrazy/okna/com/guzik-ikon.png);
}

div.okno.strony div .maks {
    background-image: url(./obrazy/okna/com/guzik-max.png);
}
*/

div.okno.strony div .menu {
    background-image: url(/obrazy/okna/com/guzik-menu.png);
}

.okno.strony a {
    color: #4992a7;
}

/* Szare */

.okno.szare {
    border: 4px ridge #56585a;
    border-image: url("/obrazy/okna/szare/ramka-okna.png") 5 round;
    -moz-border-image: url("/obrazy/okna/szare/ramka-okna.png") 5 round;
    -webkit-border-image: url("/obrazy/okna/szare/ramka-okna.png") 5 round;
    -o-border-image: url("/obrazy/okna/szare/ramka-okna.png") 5 round;
}

.okno.szare .zo-pasek, .okno.szare .zo-guzik {
    background: #56585a;
}

.okno.szare .tytul-okna {
    border: 1px outset #56585a;
    border-image: url(/obrazy/okna/szare/ramka-tytułu.png) 1 round;
    -moz-⁩border-image: url(/obrazy/okna/szare/ramka-tytułu.png) 1 round;
    -webkit-⁩border-image: url(/obrazy/okna/szare/ramka-tytułu.png) 1 round;
    -o-border-image: url(/obrazy/okna/szare/ramka-tytułu.png) 1 round;
}

.okno.szare div .menu {
    background-image: url(/obrazy/okna/szare/guzik-menu.png);
}

.okno.szare a {
    color: #4992a7;
}

.Stronniczy {
    background-color: black;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

.Stronniczy .tytul-okna {
    right: 0;
    margin: 0;
    font-weight: bold;
    padding: 0 1em;
}

.numery {
    margin-bottom: 0.5em;
    text-align: center;
}