html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}

ol, ul {
list-style: none;
}

table {
border-collapse: separate;
border-spacing: 0;
}

table, tr, th, td {
border-collapse: collapse;
border-spacing: 0;
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;        
}

blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}

blockquote, q {
quotes: "" "";
}

body {
font: normal 15px Tahoma, Arial, Helvetica, sans-serif;
color: #f8f8f8;
background-color: #87888A;
width: 100%;
font-family: 'Open Sans';
}

a {
color: #262626;
text-decoration: none;
cursor: pointer;
outline: none;
}

strong {
font-weight: bold;
}

.clear {
clear: both;
}

div {
margin: 0;
padding: 0;
position: relative;
max-width: 1920px;
margin: 0 auto;
}

img {
width: 100%;
height: auto;
display: block;
}

#atelier {
width: 100%;
margin: 0 auto;
}

#atelier h1 {
position: absolute;
top: 5%;
right: 5%;
font-size: 25px;
}

#atelier h2 {
position: absolute;
bottom: 38%;
left: 10%;
font-size: 42px;
}

#zajecia {

}

#zajecia .nauka {
position: absolute;
top: 15%;
left: 8%;
padding-right: 13%;
}

#zajecia .nauka h3 {
font-size: 28px;
margin-bottom: 20px;
}

#zajecia .nauka p {
padding: 1em 0;
font-size: 28px;
}

#zajecia .nauka ul li {
list-style-type: disc;
margin-left: 20px;
font-size: 28px;
line-height: 150%;
}

#omnie {

}

#omnie .info {
position: absolute;
top: 20%;
left: 8%;
}

#omnie .info h4 {
font-size: 30px;
margin-bottom: 20px;
}
#omnie .info p {
font-size: 28px;
line-height: 150%;
}

#kontakt {

}

#kontakt .lokalizacja {
position: absolute;
top: 15%;
left: 8%;
}

#kontakt .lokalizacja p {
font-size: 33px;
padding: 0.5em 0;
line-height: 150%;
}

#kontakt p.link {
position: absolute;
right: 10%;
bottom: 2%;
font-size: 12px;
}

#kontakt p.link a {
color: white;
text-decoration: none;
}

#kontakt p.link a:visited {
color: white;
text-decoration: none;
}

#kontakt p.link a:hover {
color: white;
text-decoration: none;
}


@media screen and (max-width: 1279px) {

#zajecia .nauka {
    top: 10%;
}
#zajecia .nauka ul li {
    font-size: 25px;
}










}


@media screen and (max-width: 1150px) {
#zajecia .nauka ul li {
    font-size: 20px;
}


#kontakt .lokalizacja {
    position: absolute;
    top: 10%;
    left: 8%;
    padding-right: 8%;
}







}


@media screen and (max-width: 980px) {
#zajecia {
background-image: url(karolina-zdunek-atelier.jpg);
background-size: cover;
background-position: center center;
}

#zajecia img {
display: none;
}

#zajecia .nauka h3 {
    font-size: 22px;
}

#zajecia .nauka p {
    padding: 0.5em 0;
    font-size: 22px;
}
#zajecia .nauka {
position: relative;
    left: 0;
    top: 0;
	padding: 80px;
}

#omnie {
background-image: url(nauka-malarstwa-warszawa.jpg);
background-size: cover;
background-position: center center;
}

#omnie img {
display: none;
}

#omnie .info {
position: relative;
    left: 0;
    top: 0;
	padding: 80px;
}

#omnie .info h4 {
    font-size: 24px;

}

#omnie .info p {
    font-size: 24px;

}

#kontakt .lokalizacja p {
    font-size: 25px;
}

#kontakt {
background-image: url(nauka-rysunku-warszawa.jpg);
background-size: cover;
background-position: center center;
}

#kontakt img {
display: none;
}

#kontakt .lokalizacja {
position: relative;
    left: 0;
    top: 0;
	padding: 80px;
}

#kontakt p.link {
    position: relative;
    right: 0;
    bottom: 0;
    font-size: 12px;
    padding: 30px 30px 0 30px;
	text-align: center;
}
#kontakt {
    padding-bottom: 20px;
}
}




@media screen and (max-width: 768px) {

#atelier h2 {
font-size: 25px;
}

#atelier h1 {
font-size: 20px;
}

#zajecia .nauka {

	padding: 40px;
}

#omnie .info {
	padding: 40px;
}

#kontakt .lokalizacja {
	padding: 40px;
}






}



@media screen and (max-width: 479px) {

#atelier h2 {
bottom: 10%;
}

#atelier h1 {
    font-size: 20px;
    padding: 5% 10%;
}

#zajecia .nauka ul li {
    font-size: 18px;
}

#zajecia .nauka {

	padding: 30px;
}
#zajecia {
background-position: 60% center;
}

#omnie .info {
	padding: 30px;
}

#kontakt .lokalizacja {
	padding: 30px;
}

#kontakt .lokalizacja p {
    font-size: 20px;
}

}

@media screen and (max-width: 320px) {
#kontakt .lokalizacja p {
    font-size: 18px;
}

}