*{
    margin: 0;
    padding: 0;
}
#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;
}

#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;
        }

#footer {
    clear: both;
    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%;
}

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

        #header {
            margin-left: 5%;
    }
     #f2 {
        margin-left: 8%;
     } 
}

    @media   (max-width: 952px) {
        #header {
            width: 15%;
    } 
    #content {
        width: 15%;
        font-size: 15px;
        margin-left: 40%;
    }
    #f3 {
        width: 40%;
        margin-left: 60%;
    }
    #f2 {
        margin-left: 3%;
        width:  45%;
    }
    #f1 {
        width: 20%;
    }
}
        @media   (max-width: 602px) {
            /* MENU GŁÓWNE */
         ul li{

            font-size: 20px;
            margin-left: -40%;
         }
         #n1{
            margin-left: -39%;
         }
         #n2{
            margin-left: -26%;
         }
         .men2{
             margin-left: -20%;
         }
         .men1{
             margin-left: 3%;
         }
         #header{
            width: 20%;
         }
         #f3 {
           font-size: 10px;
        }
        #f2 {
            font-size: 17px;
            margin-left: -4%;
            padding-left: 5px;
            padding-right: 5px;
        }
        #f1 {
            font-size: 10px;
            margin-left: 10%;
        }
        }
        @media (max-width:388px) {
        #f1 {
            margin-left: 5%;
        }
        #f2 { 
            margin-left: 5%;
            width: 45%;
            font-size: 15px;
        }
    }

    @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%;
           }
        }
a:link{
    color: black;
    text-decoration: none;
}
a:visited{
    color: black;
}
#kontener
{
    clear: both;
    font-family: 'Ubuntu', sans-serif;
    font-size: 28px;
    margin-bottom: 45%;
}
h2
{
    clear: both;
    font-family: 'Ubuntu', sans-serif;
    margin-top: 6%;
    font-size: 50px;
    letter-spacing: 5px;
    float: left;
    margin-left: 32%;
    color: black;
}

/* ikona i dane pocztowe */

.zdjecie1
{
   
   margin-top: 2%;
    text-align: center;
    width: 50%;
    float: left;
}

.zdjecie2
{
    margin-top: 2%;
    text-align: center;
    float: right;
    width: 50%;
}
@media (max-width:1400px){
    h2{
        font-size: 40px;
        margin-left: 30%;
    }
}
@media (max-width:900px){
    h2{
        font-size: 30px;
        margin-left: 20%;
    }
}
@media (max-width:500px){
    h2{
        font-size: 18px;
        margin-left: 12%;
    }
    .zdjecie1{
        font-size: 15px;
    }
    .zdjecie2{
        font-size: 15px;
    }
}