* {
   font-family: 'georgia';
   flex: 1 1 300px;
   gap: 20px;
  
   
p{
                max-width: 100%;
                width: 80%;
                margin: 0 auto;
                padding: 10px;
                line-height: 1.5;
                box-sizing:border-box;
                
}


            
            @media (max-width:768px){
                
                .kontener{
                    grid-template-columns: 1fr;
                      }
                      .prawy{
                        display: flex;
                        flex-wrap: wrap;
                        flex: none;
                        width: 100%;
                        box-sizing: border-box;
                        margin-right: 5%;
                        
                   
    
                    }
                    
                    #text{
                        transform: scale(0.7);
                        margin-top: -30px;
                        letter-spacing: 0.5px;
                        text-align: left;
                        flex: 2;
                        width: 100%;
                        margin-left: -30%;
                        margin-bottom: 40%;
                        overflow: hidden;
                    }
                    
                    header{
                        font-size: 1rem;
                        max-height: 90%;
                        flex: 1;
                        word-wrap: break-word;
                        
                    }
                    
                    p {
                    max-width: 100%;
                    font-size: 60%;
                    
                }
                
        }
                @media (max-width:480px){
                   
                    .kontener{
                        grid-template-columns: 1fr;
                          }
                          .prawy{
                            display: flex;
                            flex-wrap: wrap;
                            flex: none;
                            width: 100%;
                            box-sizing: border-box;
                            margin-right: 5%;
                            
                       
        
                        }
                        
                        #text{
                            transform: scale(0.7);
                            margin-top: -30px;
                            letter-spacing: 0.5px;
                            text-align: left;
                            flex: 2;
                            width: 100%;
                            margin-left: -30%;
                            margin-bottom: 40%;
                            overflow: hidden;
                        }
                        
                        header{
                            font-size: 1rem;
                            max-height: 90%;
                            flex: 1;
                            word-wrap: break-word;
                            
                        }
                        
                        p {
                        max-width: 100%;
                        font-size: 60%;
                    
                }
                
            }
            
            

}


body{
    margin: auto;
    background-color: #d2ccba;
    
}

header{
    background: #ffffff;
    text-align: center;
    padding: 10px;
    width: auto;
    clear: both;
    height: 90px;
    font-size: 220%;
    border-width: 4px;
    z-index: 2;
    text-shadow: 2px 2px 2px white;
    transition: transform 0.8s ease-in-out;
    z-index: 1000; 
    position: relative;
    overflow: hidden;
    
}


footer{ 
    background-color: #000000;
    height: 1px;
    clear: both;
}

.duh{
    height: 600px;
    padding: 10px;
    color: #ffffff; 
    font-size: x-large;
    border-bottom: 1px solid #000000;
    text-align: center;
    background-image: url(tlo.jpg);
    background-size: cover;
    text-justify: auto;
    background-repeat: repeat;
    background-position: center;
 
}

.doh{
    height: 350px;
    background-color: rgb(63, 55, 55);
    padding: 10px;
    color: white;
    border-bottom: 1px solid black;
    font-size: large;
}

.prawy {
    background-color: #d2ccba;
    height: 640px;
    width: 40%;
    padding-top: 100px;
    float: right;
    background-image: url(zdj.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
}

.pasek{
    height: 1px;
    background-color: #000000;
}

.srodkowy {
    height: 640px;
    width: 50%;
    text-align: center;
    padding-top: 100px;
    float: left;
    font-size: x-large;
    z-index: 2;
    text-shadow: 1px 1px 1px white; 
    overflow: hidden;
}

#o {
    width: 115px;
    text-align: left;
    margin-right: 100%;
}

#text{
    position: absolute;
    top: 30px;
}

#l{
    height: 80px;
    width: 100px;
    text-align: center;
}

a:hover{
    color: orangered;
}

a:link{
    color: orangered;
}

.anchor{
    position: relative;
    padding-top: 50px;
    height: 50px;
    text-decoration: none;
    margin-top: -60px;
}

.link{
    text-decoration: none;
    font-weight: bold;
}
html {
    scroll-behavior: smooth;
}

#navbar{
    position: fixed;
    width: 100%;
    background-color: rgb(255, 255, 255);
    padding: 10px;
    transition: top 0.3s;
    
}
header::after{
    content: '';
    display: block;
    width: 100%;
    height: 0.5px;
    background-color: black;
    position: absolute;
    left: 0;
    bottom: 0;
    font-size: 100%;
}
a { color: black; }

#zdj{
    max-height: 100%;
    max-width: 100%;
}

#zdj1{
    height: 40%;
    font-size: 100%;
    
}

#tlo{
    display: block; 
    visibility: visible;
    
}
.p { 
    text-shadow: 2px 2px 2px black; 
}

#img{
    margin-right: 5%;
    margin-top: -5%;
    float: right;
    height: 20%;
}

#navbar {
    top: 0; 
}