/*STYLE CSS*/
@import url('https://fonts.googleapis.com/css2?family=Finger+Paint&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

/*KOLORY*/

:root{
    --kolor-jasny: #FEFBF4;
    --kolor-ciemny: #000000;
    --kolor-uzupelniajacy: #261706;
}

/*SELEKTORY GLOBALNE*/
*{
    transition: 1s;
    box-sizing: border-box;
}
html{
    scroll-behavior: smooth;
}
body{
    font-family: "Inter", sans-serif;
}
input{
    font-family: inherit;
}
a{
    text-decoration: none;
}
img{
    max-width: 100%;
    height: auto;
    display: block;
}
p{
    line-height: 160%;
    font-weight: 100px;
    font-size: 18px;
    margin-bottom: 15px;
}
h1{
    font-family: "Finger Paint", sans-serif;
    font-size: 80px;
    margin-bottom: 40px;
    margin-top: 100px;
    /* background-color: violet; */
}
h1:hover{
    color: var(--kolor-uzupelniajacy)
}
h2{
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 40px;
    /*background-color:cadetblue;*/
    /* max-width: 600px; */
    text-align: left;
    align-items:first baseline;
    max-width: 1200px;
    width: 100%;
    padding-right: 40%;
    padding-top: 5vh;
}
h2:hover{
    color: var(--kolor-uzupelniajacy);
}
h4{
    font-weight: bold;
    font-size: 36px;
    margin-bottom: 40px;
}

/*NAWIGACJA*/
nav{

    background-color: var(--kolor-uzupelniajacy);
    padding: 10px;
    /*flex contener*/
    display: flex;
    justify-content: center;
    position: fixed;
    width: 100%;
    z-index: 1; 
}
nav ol{ 

    max-width: 1200px;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    gap: 2vw;

}
nav ol li{

    flex: 1;
}
nav ol li a{
   
    color: #D4B7A5;
    padding: 10px;
    display: block; /*paddingi wplywaja na otoczenie boxy maja 100% szwrokosci*/
    text-align: center;
    font-weight: bold;
    font-size: 16px;

}

nav ol li a:hover{
    background-color: var(--kolor-jasny);
    color: var(--kolor-ciemny);
    border-radius: 40px;

}

/*WSZYSTKIE SEKCJE*/
section{
    min-height: 90vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    scroll-margin-top: 56px;
    padding: 0px 20px;
}
.zawartosc{
    max-width: 1200px;
    width: 100%;
    padding: 0 20px;
    /*background-color: red;*/
}

/*POSZCZEGOLNE SEKCJE*/

#pierwsza{
    padding-top: 100px;
    min-height: 70vh;
    background-color: var(--kolor-jasny);
}

#pierwsza .zawartosc{
    min-height: 70vh;
    display: flex;
    gap: 10px;
    align-items: flex-end;
    flex-wrap: wrap;
    justify-content: center;
    /* background-color: aquamarine; */
    /*height: 873px;*/
}
#pierwsza article{
    /* background-color: pink; */
    flex: 1 1 300px;
}
.lewa{
    padding-bottom: 10vh;
}
#pierwsza article img{}


#druga{
    background: url(../img/tlo.png) no-repeat center center / cover fixed;
    color: var(--kolor-jasny);
}
#druga .zawartosc{
    min-height: 70vh;
    display: flex;
    gap: 10px;
    align-items: flex-end;
    flex-wrap: wrap;
    justify-content: center;
    /*background-color: aquamarine;*/
}
#druga article{
    flex: 1 1 300px;
    /*padding: 10px;*/  
}
#druga article img{
    /*background-color: yellowgreen;*/
}
.tekstlewa{
    margin-bottom: 10vh;
}
#trzecia{
    background-color: var(--kolor-jasny);
}
#trzecia .zawartosc{
    display: flex;
    gap: 10px;
    align-items: flex-start;
    flex-wrap:wrap;
    justify-content: center;

}
#trzecia article{
    flex: 1 1 250px;
    padding: 10px;
}
#trzecia article img{
    /*background-color: yellowgreen;*/
}

#czwarta{
    background-color: var(--kolor-jasny);
}
#czwarta .zawartosc{
    display: flex;
    gap: 10px;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: center;
 
}
#czwarta article{

    flex: 1 1 300px;
    padding: 10px;
}
#czwarta article img{
    /*background-color: yellowgreen;*/
}
#piata{
    background-color: var(--kolor-jasny);
}
#piata .zawartosc{

    display: flex;
    gap: 10px;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: center;
 
}
#piata h2{
}
#piata article{
    flex: 1 1 300px;
    padding: 10px;
}
#piata article img{
    /*background-color: yellowgreen;*/
}
#szosta{
    background: url(../img/tlo.png)no-repeat center center / cover fixed ;
    color: var(--kolor-jasny);
}
#szosta .zawartosc{
    display: flex;
    gap: 10px;
    align-items: flex-end;
    flex-wrap: wrap;
    justify-content: center;
    /*background-color: aquamarine;*/
}
#szosta article{
    flex: 1 1 300px;
}
#szosta article img{
    /*background-color: yellowgreen;*/
}
.lewa{
    padding-bottom: 10vh;
}
/* STOPKA */
#stopka{
    background-color: var(--kolor-uzupelniajacy);
    color: var(--kolor-jasny);
    min-height: 20vh;
}
#stopka .zawartosc{
    
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}
#stopka article{
 
    flex: 1 1 300px;
}
#stopka article h4{}
#stopka article p{}
#stopka article p a{
    color: var(--kolor-podstawowy);
}
/* STOPKA */

#stopka{
    background-color: var(--kolor-uzupelniajacy);
    color: var(--kolor-jasny);
    min-height: 20vh;
    padding: 60px 20px;
}

#stopka .zawartosc{
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}
#stopka article{
    flex: 1 1 300px;
}
#stopka article p a{
    color: var(--kolor-podstawowy);
}
#stopka input{
    border-radius: 20px;
}
h6{
    padding: 2vh;
}