@charset "UTF-8";

* {
    margin: 0;
    /*margines zewnetrzny*/
    padding: 0;
    /*margines wewnętrzny*/
    font-family: 'PT Serif', serif;
    /*link do czcionki*/
    box-sizing: border-box;
    /*automatycznie dodstsowuje wewnętrzne szerokości danych sekcji do szerokości strony*/
}

body {
    background-color: #f5f5f5;
    /*kolor tła*/
    max-width: 1200px;
    /*szerokość strony*/
    margin: 0 auto;
    /*margines zewnetrzny*/
    border: 1px solid black;
    /*obramowanie*/
}

header {
    background-color: #DCDCDC;
    /*kolor tła*/

}

header img {
    max-width: 100%;
    /*które ustawia maksymalną szerokość elementu. Jeśli ustawimy ją na 100% będzie to oznaczało, 
        że maksymalna szerokość obrazka nie może przekroczyć szerokości rodzica*/
    /*width: 70%;*/
    /*wielkość  elementu*/
    display: block;
    /*Sprawia, że element generuje pudełko elementu blokowego.(jest bardziej przewidywalny)*/
    margin: 0 auto;
    /*margines zewnetrzny*/
}

nav {
    background-color: #FFD8AC;
    /*kolor tła*/
    padding: 2px 10px;
    /*margines wewnętrzny*/
    font-weight: bold;
    /*waga czcionki*/
    font-size: 16px;
    /*wysokość czcionki*/
    border: 1px solid black;
    border-bottom: 1px solid black;
    border-left: 0px;
    border-right: 0px;
    /*obramowanie*/
    margin: 0px;
    /*margines zewnetrzny*/
}

a.menu {
    display: inline-block;
    /*Sprawia, że element generuje pudełko elementu blokowego, jakby było pojedynczym pudełkiem liniowym*/
    padding: 7px 0px;
    /*margines wewnętrzny*/
    color: black;
    /*klor czcionki - czarny*/
    text-decoration: none;
    /*brak dekoracji tekstu -tu brak podkreślenia*/
    text-align: left;
    /*ustawienie tekstu lewy*/

}

a.menu:hover

/*zmina koloru po najechaniu kursora*/
    {
    background-color: #cf9967;
    /*kolor tła*/
}

h1

/* Nazwy działów żółte tłó */
    {
    text-align: center;
    /*ustawienie tekstu centralnie*/
    padding: 8px;
    /*margines wewnętrzny*/
    background-color: #f6ebb2;
    /*kolor tła*/
    font-size: 19px;
    /*wysokość czcionki*/
    border: 1px solid black;
    border-left: 0px;
    border-right: 0px;
    /*obramowanie*/
    letter-spacing: 0.5px;
    /*odstępy między literami*/
    word-spacing: 1.8px;
    /*odstępy między wyrazami*/
    color: #A52A2A;
    /*klor czcionki - czerwonawy*/
}

h2

/* definicje, twierdzenia, własnośći */
    {
    text-align: left;
    /*ustawienie tekstu od lewej*/
    padding: 3px 0px 0px 0px;
    /*margines wewnętrzny*/
    font-style: italic;
    /*tekst pochylony*/
    text-decoration-line: underline;
    /*dekoracji tekstu -tu podkreślenie*/
    font-size: 17px;
    /*wysokość czcionki*/
    color: #1db31c;
    /*klor czcionki - zielony*/
}


h3

/* interpretacja geometrycna */
    {
    text-align: center;
    /*ustawienie tekstu od lewej*/
    padding: 3px 0px 0px 0px;
    /*margines wewnętrzny*/
    font-weight: bold;
    /*tekst pochylony*/
    font-size: 19px;
    /*wysokość czcionki*/
    color: #0026ff;
    /*klor czcionki - niebieski*/
}

h4

/* Nazwy działów żółte tłó */
    {
    text-align: center;
    /*ustawienie tekstu centralnie*/
    padding: 8px;
    /*margines wewnętrzny*/
    background-color: #f6ebb2;
    /*kolor tła*/
    font-size: 19px;
    /*wysokość czcionki*/
    border: 1px solid black;
    border-left: 0px;
    border-right: 0px;
    /*obramowanie*/
    letter-spacing: 0.5px;
    /*odstępy między literami*/
    word-spacing: 1.8px;
    /*odstępy między wyrazami*/
    color: #A52A2A;
    /*klor czcionki - zielony*/
}

h5

/* grupy zadań szare tło w zadaniach */
    {
    text-align: center;
    /*ustawienie tekstu centralnie*/
    padding: 6px;
    /*margines wewnętrzny*/
    background-color: #e4e4e4;
    /*kolor tła*/
    font-size: 17px;
    /*wysokość czcionki*/
    border: 1px solid black;
    border-left: 0px;
    border-right: 0px;
    /*obramowanie*/
    letter-spacing: 0.6px;
    /*odstępy między literami*/
    word-spacing: 1.5px;
    /*odstępy między wyrazami*/
    color: black;
    /*klor czcionki - czarny*/
}





div.przyklad {
    padding: 0px 0px 0px 0px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
    font-weight: bold;
    /*waga czcionki*/
    text-decoration-line: underline;
    /* podkreślenie tekstu centralnie*/
}



div.rozh6 {
    padding: 10px 0px 8px 0px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
    font-weight: bold;
    /*waga czcionki*/
    text-decoration-line: underline;
    /* podkreślenie tekstu centralnie*/
}

a.podstrony {
    display: block;
    /*Sprawia, że element generuje pudełko elementu blokowego.*/
    padding: 10px 25px;
    /*margines wewnętrzny*/
    text-decoration: none;
    /*brak dekoracji tekstu -tu brak podkreślenia*/
    color: #000;
    /*klor czcionki - czarny*/
    margin: 0px 0px;
    /*margines zewnetrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
    background-color: white;
    /*kolor tła*/
    font-weight: 500;
    /* waga czcionki, pogrubiona*/



    border-top: 0px;
    border-bottom: 1px solid black;
    border-left: 0px;
    border-right: 0px;
    /*obramowanie*/

}

a.podstrony:hover

/*zmina koloru po najechaniu kursora*/
    {
    background-color: #EBEBEB;
    /*kolor tła*/
}

section {
    background-color: white;
    /*kolor tła*/
    line-height: 1.5;
}


main {
    background-color: white;
    /*kolor tła*/
    line-height: 1.5;
}


aside {
    width: 96%;
    /*wielkość  elementu*/
    text-align: center;
    /*ustawienie tekstu centralnie*/
    margin: 30px auto 18px auto;
    /*margines zewnetrzny*/
    padding: 10px 15px;
    /*margines wewnętrzny*/
    border: 1px solid black;
    /*obramowanie*/
    border-radius: 12px;
    /*zaokrąglenia w ramce*/
    font-size: 18px;
    /*wysokość czcionki*/
    font-style: italic;
    /*czcionka pochylona*/
    background-color: #d8e78e;
}

article {
    width: 96%;
    /*wielkość  elementu*/
    text-align: left;
    /*ustawienie tekstu od lewej*/
    background-color: #e4e4e4;
    /*kolor tła*/
    margin: 25px auto 0px auto;
    /*margines zewnetrzny*/
    padding: 15px 18px 20px 18px;
    /*margines wewnętrzny*/
    border: 1px solid black;
    /*obramowanie*/
    border-radius: 12px;
    /*zaokrąglenia w ramce*/
    font-size: 17px;
    /*wysokość czcionki*/
}

div.ramka {
    width: 96%;
    /*wielkość  elementu*/
    text-align: left;
    /*ustawienie tekstu z lewej*/
    background-color: white;
    /*kolor tła*/
    margin: 30px auto 0px auto;
    /*margines zewnetrzny*/
    padding: 10px 17px 20px 17px;
    /*margines wewnętrzny*/
    border: 1px solid black;
    /*obramowanie*/
    border-radius: 12px;
    /*zaokrąglenia w ramce*/
    font-size: 17px;
    /*wysokość czcionki*/

}

section.ramka {
    width: 96%;
    /*wielkość  elementu*/
    text-align: left;
    /*ustawienie tekstu z lewej*/
    background-color: white;
    /*kolor tła*/
    margin: 30px auto 0px auto;
    /*margines zewnetrzny*/
    padding: 10px 17px 20px 17px;
    /*margines wewnętrzny*/
    border: 1px solid black;
    /*obramowanie*/
    border-radius: 12px;
    /*zaokrąglenia w ramce*/
    font-size: 17px;
    /*wysokość czcionki*/

}

hr {
    width: 100%;
    height: 1px;
    color: black;
    margin: 10px auto;
    /*margines zewnetrzny*/

}


div.ramka2 {
    width: 100%;
    /*wielkość  elementu*/
    background-color: white;
    /*kolor tła*/
    margin: 0px;
    /*margines zewnetrzny*/
    padding: 0px;
    /*margines wewnętrzny*/
    border: 0px solid black;
}


div.ramka img {
    max-width: 100%;
    /*które ustawia maksymalną szerokość elementu. Jeśli ustawimy ją na 100% będzie to oznaczało, 
        że maksymalna szerokość obrazka nie może przekroczyć szerokości rodzica*/
    display: block;
    /*Sprawia, że element generuje pudełko elementu blokowego.(jest bardziej przewidywalny)*/
    margin: 20px auto;
    /*margines zewnetrzny*/
    height: auto;
    /*To w wypadku, gdy obrazek ma zapisaną w kodzie wielkość, której nie możemy zmienić*/
}

div.tekst {
    margin: 5px auto 0px auto;
    /*margines zewnetrzny*/
    padding: 15px 20px 0px 20px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
}

section.tekst {
    margin: 5px auto 0px auto;
    /*margines zewnetrzny*/
    padding: 15px 20px 0px 20px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
}



div.tekst img {
    max-width: 100%;
    /*które ustawia maksymalną szerokość elementu. Jeśli ustawimy ją na 100% będzie to oznaczało, 
        że maksymalna szerokość obrazka nie może przekroczyć szerokości rodzica*/
    display: block;
    /*Sprawia, że element generuje pudełko elementu blokowego.(jest bardziej przewidywalny)*/
    margin: 20px auto;
    /*margines zewnetrzny*/
    height: auto;
    /*To w wypadku, gdy obrazek ma zapisaną w kodzie wielkość, której nie możemy zmienić*/
}


table {
    max-width: 96%;
    height: auto;
    border: 2px solid black;
    /*obramowanie*/
    border-collapse: collapse;
    /*łączy ze soba obramowania komurek i tabeli*/
    margin: 28px auto 5px auto;
    /*margines zewnetrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
}

td {
    border: 1px solid black;
    /*obramowanie*/
    padding: 10px 13px;
    /*margines wewnętrzny*/
    text-align: center;
    /*ustawienie tekstu centralnie*/
}

th {
    background-color: #e4e4e4;
    /*kolor tła*/
    border: 1px solid black;
    /*obramowanie*/
    padding: 10px 13px;
    /*margines wewnętrzny*/
    text-align: center;
    /*ustawienie tekstu centralnie*/
}

footer {
    text-align: center;
    /*ustawienie tekstu centralnie*/
    border-top: 1px solid black;
    /*obramowanie*/
    background-color: #e4e4e4;
    /*kolor tła*/
    margin: 0px;
    /*margines zewnetrzny*/
    padding: 0px;
    /*margines wewnętrzny*/
}

p {
    padding: 14px 0px 0px 0px;
    /*margines wewnętrzny*/
}

div.srodek {
    text-align: center;
    /*ustawienie tekstu centralnie*/
    font-size: 17px;
    /*wysokość czcionki*/
}



div.lewy {
    /* do lewej leko przesuniety */
    padding: 10px 0px 0px 30px;
    font-size: 17px;
    /*wysokość czcionki*/
}


div.zadania

/*zadanie w częci teori*/
    {
    margin: 0px auto;
    /*margines zewnetrzny*/
    padding: 0px 20px 0px 22px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
    border: 0px solid black;
    /*obramowanie*/
}

div.zad

/*zadanie w częci zadań*/
    {
    margin: 0px auto;
    /*margines zewnetrzny*/
    padding: 0px 20px 15px 22px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
    border-bottom: 2px dashed black;
}

div.rozwiazanie

/*rozwiązaniach w części zadań*/
    {
    margin: 1px auto;
    /*margines zewnetrzny*/
    padding: 0px 20px 10px 22px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
}

div.roz

/*zadanie w częci zadań*/
    {
    margin: 0px auto;
    /*margines zewnetrzny*/
    padding: 13px 20px 13px 22px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
    border-top: 1px dotted black;
}

div.roz img {
    max-width: 100%;
    /*które ustawia maksymalną szerokość elementu. Jeśli ustawimy ją na 100% będzie to oznaczało, 
        że maksymalna szerokość obrazka nie może przekroczyć szerokości rodzica*/
    display: inline-block;
    margin: -25px auto;
    height: auto;
    /*To w wypadku, gdy obrazek ma zapisaną w kodzie wielkość, której nie możemy zmienić*/
}

div.rozg

/*zadanie w częci zadań*/
    {
    margin: 0px auto;
    /*margines zewnetrzny*/
    padding: 15px 25px 15px 25px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/

}

div.odpowiedz

/*odpowiedzi w części zadań*/
    {
    margin: 0px auto;
    /*margines zewnetrzny*/
    padding: 12px 80px 10px 20px;
    /*margines wewnętrzny*/
    font-size: 17px;
    /*wysokość czcionki*/
    border-top: 2px dashed black;
}

div.odpowiedz img {
    max-width: 100%;
    /*które ustawia maksymalną szerokość elementu. Jeśli ustawimy ją na 100% będzie to oznaczało, 
        że maksymalna szerokość obrazka nie może przekroczyć szerokości rodzica*/
    margin-left: auto;
    margin-right: auto;

}


span.linia1

/*linia w części zadań biała*/
    {
    display: inline-block;
    /*Sprawia, że element generuje pudełko elementu blokowego, jakby było pojedynczym pudełkiem liniowym*/
    padding: 6px 30px 6px 4px;
    font-size: 17px;
    /*wysokość czcionki*/
}

span.linia2

/*linia w części zadań czara*/
    {
    background-color: #e4e4e4;
    /*kolor tła*/
    padding: 4px;
    display: inline-block;
    margin: 7px 0;
    font-size: 16px;
    /*wysokość czcionki*/
}

div.linia {
    margin: 0x auto;
    text-align: center;
}

div.linia img {
    max-width: 90%;
    /*które ustawia maksymalną szerokość elementu. Jeśli ustawimy ją na 100% będzie to oznaczało, 
        że maksymalna szerokość obrazka nie może przekroczyć szerokości rodzica*/
    display: inline-block;
    margin: 20px 25px 0px 20px;
    height: auto;
    /*To w wypadku, gdy obrazek ma zapisaną w kodzie wielkość, której nie możemy zmienić*/
}

div.przerwa

/*Przerwa między zadaniami*/
    {
    padding: 0px;
    /*margines wewnętrzny*/
    background-color: #e4e4e4;
    /*kolor tła*/
    border: 1px solid black;
    border-left: 0px;
    border-right: 0px;
    /*obramowanie*/
}

div.stopa

/* przejście na następna strone i przejścia w tekście*/
    {
    margin: 0px auto 0px auto;
    /*margines zewnetrzny*/
    padding: 6px 18px;
    /*margines wewnętrzny*/
    font-size: 16px;
    /*wysokość czcionki*/
    border-top: 1px solid black;
    /*obramowanie*/
    background-color: #ddea9f;
    /*kolor tła*/
}

a.przejscia:hover {
    background-color: #aec41f;
    /*kolor tła*/
}




nav li {
    display: inline;
    /* Ustawia elementy w jednej linii */
    margin: 0 2px;
    /* Odstęp między elementami */
}


nav li::after {
    content: ">>";
    /* Dodaje znak ">" po każdym elemencie */
    margin-left: 6px;
}

nav li:last-child::after {
    content: "";
    /* Usuwa ">" po ostatnim elemencie */
}

li {
    margin-left: 20px;

}