/* MENU GŁÓWNE */
#header {
    font-style: italic;
    float: left;
    font-family: 'Ubuntu', sans-serif;
    border: 5px outset black;
    width: 14%;
    font-size: 30px;
    margin-left: 15%;
    margin-top: 1%;
    color: rgb(82, 75, 75);
    text-align: center;
    margin-bottom: 20px;
}
*{
    margin: 0;
    padding: 0;
}

#content {
    margin-left: 36.5%;
    background-color: black; 
}
.men1{
    width: 140px; 
    background-color: white;
    }
.men2{
width: 100px; 
background-color: white;
}
ul {

 list-style: none;
 
}
ul li {
    position:relative;
    float:left;
    width: 300px;
    height: 60px;
    background-color:white;
    line-height: 60px;
    text-align: center;
    font-size: 22px;
    text-decoration: none;
    margin-top: 0%;
}
ul ul {
    position: absolute;
    top:95%;
    right: 0px;
    display: none ;
    }
    ul li:hover > ul {
        display: block;
     }
     #n1 {
        z-index: 3;
        }
        #n2{
            z-index: 2;
        }
a:link{
    color: black;
}
a:visited{
    color: black;
}
/* MENU GŁÓWNE */
#div2 {
    background-color: white;
    clear: both;
    padding: 6%;
}
#zdjecie1 {
    margin-left: 10%;
    float: left;
    margin-bottom: 5%;
    width: 40%;
    height: 40%;
}
#header2 {
    font-family: 'Ubuntu', sans-serif;
    font-size: 30px;
    color: black;
    float:right;
    margin-right: 10%;
    margin-top: 10%;
    width: 35%;  
}
#header3{
    
    font-family: 'Ubuntu', sans-serif;
    font-size: 38px;
    color: rgb(0, 0, 0);
    margin-top: -25%;
    margin-left: 0%;
}
#div3 {
    
    background-color: rgb(187, 203, 216);
    clear: both;
    padding: 20%;
    padding-bottom: 3%;
    font-size: 100px;
}
#zdjecie2 {
    margin-left: 14%;
    padding: 4%;
}
#zdjecie3 {
    margin-left: -5% ;
}
/* <!-- STOPKA --> */
#footer {
color: white;
font-family: 'Ubuntu', sans-serif;
background-color: rgb(34, 33, 33);
padding: 2%;
}
#f1 {
    float: left;
    margin-left: 10%;
    font-size: 20px;
    margin-top: -1%;
}
#f2 {
    float:left;
    margin-left: 17%;
    font-size: 30px;
    margin-top: -1%;
}
#f3 {
    margin-left: 75%;
    font-size: 20px;
    margin-top: -1%;
}
/* <!-- STOPKA --> */
 #container {
    max-width: 100%;
 }

 @media   (max-width: 1481px) {

    #header2 {
       font-size:   20px;
    }
    /* MENU GŁÓWNE */
    #header{
        width: 10%;
        margin-left: 10%;
        display: inline-block;
        font-size: 20px;
        text-align: center;
    }
        #content {
        margin-left: 25%;
    }
        /* MENU GŁÓWNE */
        /* <!-- STOPKA --> */
    #f2 {
        margin-left: 9%;
    }
    /* <!-- STOPKA -->  */
    }
    @media   (max-width: 1258px) {
        /* MENU GŁÓWNE */
        #content {
            margin-left: 19%;
        }

        #header {
            margin-left: 5%;
    }/* MENU GŁÓWNE */ 
     #header2 {
       font-size: 15px;
     }
     /* <!-- STOPKA --> */
     #f2 {
        margin-left: 8%;
     } 
     /* <!-- STOPKA --> */
    } 
    @media   (max-width: 952px) {

        #header2 {
           font-size: 20px;
            text-align: center;
            width: 50%;
            margin-top: -1%;
            margin-right: 25%;
            margin-bottom: 5%;
        }
     /* MENU GŁÓWNE */
        #header {
            width: 15%;
    } 
    #content {
        width: 15%;
        font-size: 15px;
        margin-left: 40%;
    }/* MENU GŁÓWNE */
    #zdjecie1 {
       margin-left: 20%;
       width: 60%;
    }     
    #zdjecie4 {
        float: right;
    }  
    /* <!-- STOPKA --> */
    #f3 {
        width: 40%;
        margin-left: 60%;
    }
    #f2 {
        margin-left: 3%;
        width:  45%;
    }
    #f1 {
        width: 20%;
    }
    /* <!-- STOPKA --> */
        }
        @media   (max-width: 602px) {
            /* MENU GŁÓWNE */
         ul li{

            font-size: 20px;
            margin-left: -40%;
         }
         #header{
            width: 18%;
         }   /* MENU GŁÓWNE */
         #n1{
            margin-left: -39%;
         }
         #n2{
            margin-left: -26%;
         }
         .men2{
             margin-left: -20%;
         }
         .men1{
             margin-left: 3%;
         }
         #zdjecie1 {
           width: 90%;
           margin-left: 7%;
         }
         #header2 {
            font-size: 15px;
            width: 70%;
            margin-right: 15%;
         }
         #header3 {
            font-size: 22px;
         }
         /* <!-- STOPKA --> */
         #f3 {
           font-size: 10px;
        }
        #f2 {
            font-size: 20px;
            margin-left: -4%;
            padding-left: 5px;
            padding-right: 5px;
        }
        #f1 {
            font-size: 10px;
            margin-left: 10%;
        }
        /* <!-- STOPKA --> */
        }
        @media (max-width:388px) {
            /* <!-- STOPKA --> */
        #f1 {
            margin-left: 5%;
        }
        #f2 { 
            margin-left: 5%;
            width: 45%;
            font-size: 15px;
        }
        /* <!-- STOPKA --> */
    }
    @media (max-width:414px) {
        /* MENU GŁÓWNE */
           ul li {
            margin-left: -10%;
            font-size: 18px;
           }
           #content{
               margin-left: 10%;
           }
           #header{
               width: 50%;
               margin-left:23%;
               margin-top: 3%;
           }
        }