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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;}

body {font-family: 'Oswald', arial, sans-serif;background-color: gainsboro;}

@media only screen and (min-width: 120px) and (max-width: 319px) {
    
nav {background-color: rgba(129, 200, 206, 0.82); text-align: center; width: 99vw; height: 30vw; position: fixed;}
nav a {width: 18vw; height: 12vw; margin: 0 0 0 0; display: inline-block; font-size: 0.66rem; vertical-align: middle;}
    
artykul {min-height: 100vh; width: 90vw; margin-left: 5vw; background-color: white; display: block; overflow-y: auto; overflow-x: hidden;}
ramka {width: 80vw; height: auto; margin-left: 6vw; background-color: blue; color: white; display: block; font-size: 1rem; margin-top: 1.3vw;}

parallax1 { background-image: url("tla/blekitnyocean1.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax2 { background-image: url("tla/blekitnyocean2.jpg"); height: 33hv; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax3 { background-image: url("tla/blekitnyocean3.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax4 { background-image: url("tla/blekitnyocean4.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax5 { background-image: url("tla/blekitnyocean5.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax6 { background-image: url("tla/blekitnyocean6.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax7 { background-image: url("tla/blekitnyocean7.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax9 { background-image: url("tla/blekitnyocean9.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}

section1 {height: 60vh; width: 100vw; background-color: white; display: block; overflow-y: auto;}
section2 {height: 70vh; width: 100vw; background-color: white; display: block; overflow-y: auto;}
section3 {height: 80vh; width: 100vw; background-color: white; display: block; overflow-y: auto;}
section4 {height: 90vh; width: 100vw; background-color: white; display: block; overflow-y: auto;}
section5 {height: 100vh; width: 100vw; background-color: white; display: block; overflow-y: auto;}
    
quote {background-color: #101d9b; display: block; width: 88vw; height: 9vh; margin-left: 6vw;}
div.fb-page {width: 100vw; height: 50vh;}
    
fadeup {height: 3vh; width: 100vw; background-image: linear-gradient(rgb(255, 255, 255), rgba(255, 255, 255, 0)); display: block;}
fadedown {height: 3vh; width: 100vw; background-image: linear-gradient(rgba(255, 255, 255, 0), rgb(255, 255, 255)); display: block; margin-top: 27vh;}
    
img.logo {width: 50vw; margin: 2vh 25vw 0 25vw;}
img.ca {float: right; height:8vh; padding: 1vw 1vw 1vw 4vw;}
img.ce {width: 88vw; margin: 1vh 6vw 1vh 6vw;}
img.przerywnik {width: 94vw; margin: 0.5vh 3vw 0.5vh 3vw;}
img.bio {float: right; width:30vw; padding: 1vw 6vw 0 3vw;}
img.jezyk {width: 20vw; height: 20vw;}
rel {display: inline-block; width: 40vw; height: 60vw; vertical-align: top; margin-right: 1vw;}
img.pf {width: 40vw; height: 30vw; margin: -1vw -3vw 1vw 0vw;}
p.opisr {font-size: 0.9rem; width: 40vw; height: 30vw; display: block; overflow-y: auto;margin-top: -1vw;}
h2 {font-size: 2.9vh; color: darkblue; text-align: center; margin: 1vh 6vw 1vh 6vw;}
h3 {font-size: 2.2vh; color: darkblue; text-align: center; margin: 1vh 6vw 1vh 6vw;}
p {font-size: 1.8vh; color: darkblue; margin: 1vh 6vw 1vh 6vw; text-align: justify;}
a {font-size: 1.9vh; color: darkblue; margin: 1vh 6vw 1vh 6vw;}
b {background-color: rgb(255, 245, 0);}
p.cytat {font-size: 1.9vh; color: lightcyan; margin: 0.5vh 2vw 1vh 2vw; padding: 0.5vh 1vh 1vh 1vh; text-align: justify; font-style: italic;}
ul {font-size: 1.8vh; color: darkblue; margin: 1vh 6vw 1vh 10vw; list-style-image: url(img/kropka.png)}
iframe {width: 90vw; height: 200px; margin: 1vh 5vw 0 5vw;}
}

@media only screen and (min-width: 320px) and (max-width: 440px) {
    
nav {background-color: rgba(129, 200, 206, 0.82); text-align: center; width: 100vw; height: 25vw; position: fixed;}
nav a {width: 19vw; height: 12vw; margin: 0 0 0 0; display: inline-block; font-size: 0.66rem; vertical-align: middle;}

artykul {min-height: 100vh; width: 90vw; margin-left: 5vw; background-color: white; display: block; overflow-y: auto; overflow-x: hidden;}
ramka {width: 80vw; height: auto; margin-left: 6vw; background-color: blue; color: white; display: block; font-size: 1rem; margin-top: 1.3vw;}

parallax1 { background-image: url("tla/blekitnyocean1.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax2 { background-image: url("tla/blekitnyocean2.jpg"); height: 33hv; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax3 { background-image: url("tla/blekitnyocean3.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax4 { background-image: url("tla/blekitnyocean4.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax5 { background-image: url("tla/blekitnyocean5.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax6 { background-image: url("tla/blekitnyocean6.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax7 { background-image: url("tla/blekitnyocean7.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax9 { background-image: url("tla/blekitnyocean9.jpg"); height: 33vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}

section1 { width: 100vw; background-color: white; display: block; overflow-y: auto;}
section2 { width: 100vw; background-color: white; display: block; overflow-y: auto;}
section3 { width: 100vw; background-color: white; display: block; overflow-y: auto;}
section4 { width: 100vw; background-color: white; display: block; overflow-y: auto;}
section5 { width: 100vw; background-color: white; display: block; overflow-y: auto;}
    
quote {background-color: #101d9b; display: block; width: 88vw; height: 9vh; margin-left: 6vw;}
div.fb-page {width: 100vw; height: 50vh;}
    
fadeup {height: 3vh; width: 100vw; background-image: linear-gradient(rgb(255, 255, 255), rgba(255, 255, 255, 0)); display: block;}
fadedown {height: 3vh; width: 100vw; background-image: linear-gradient(rgba(255, 255, 255, 0), rgb(255, 255, 255)); display: block; margin-top: 27vh;}
    
img.logo {width: 70vw; margin: 20vh 2vw 0 15vw;}
img.ca {float: right; height:8vh; padding: 1vw 1vw 1vw 4vw;}
img.ce {width: 88vw; margin: 1vh 6vw 1vh 6vw;}
img.przerywnik {width: 94vw; margin: 0.5vh 3vw 0.5vh 3vw;}
img.bio {float: right; width:30vw; padding: 1vw 6vw 0 3vw;}
img.jezyk {width:8vw; height: 8vw; margin: 0 0 0 1vw;}

rel {display: inline-block; width: 42vw; height: 82vw; vertical-align: top; margin-right: 3vw;}
img.pf {width: 42vw; height: 32vw; margin: -1vw -3vw 1vw 0vw;}
p.opisr {font-size: 0.8rem; width: 40vw; height: 40vw; display: block; overflow-y: auto;margin-top: -1vw;}

list {background-color: rgba(102, 201, 209, 0.52); display: block;}
list:hover {background-color: gainsboro; display: block;}
img.lista {height: 16vw; display: inline-block;}
list p {width: 60vw; font-size: 0.8rem; color: darkblue; margin: 1vh 4vw 1vh 9vw; display: inline-block; vertical-align: top; line-height: 1rem;}
h1 {font-size: 3vh; color: darkblue; text-align: center; margin: 1vh 6vw 1vh 6vw;}
h2 {font-size: 2.9vh; color: darkblue; text-align: center; margin: 1vh 6vw 1vh 6vw;}
h3 {font-size: 2.2vh; color: darkblue; text-align: center; margin: 1vh 6vw 1vh 6vw;}
p {font-size: 0.9rem; color: darkblue; margin: 1vh 6vw 1vh 6vw; text-align: justify;}
a {font-size: 1.9vh; color: darkblue; margin: 1vh 6vw 1vh 6vw;}
a.przycisk {width: 26vw; text-align: center; padding-bottom: 0.5vw; font-size: 1rem; text-decoration: none; margin: 1vw 0 4vw 36vw; display: inline-block; background-color: yellow; border: 3px; border-style: solid; border-color: darkblue;}
b {background-color: rgb(255, 245, 0);}
p.cytat {font-size: 1.9vh; color: lightcyan; margin: 0.5vh 2vw 1vh 2vw; padding: 0.5vh 1vh 1vh 1vh; text-align: justify; font-style: italic;}
ul {font-size: 1.8vh; color: darkblue; margin: 1vh 6vw 1vh 10vw; list-style-image: url(img/kropka.png)}
iframe {width: 340px; height: 265px; margin: 1vh 6vw 0 3vw;}

ramka {width: 43vw; height: 30vw; overflow: hidden; display: inline-block; margin-left: 1vw;}
ramka img {width: 43vw; height: 30vw; transition: transform .7s ease;}
ramka:hover img{transform: scale(1.15);}
ramka2 {width: 88vw; display: inline-block; margin-left: 1vw;}
    
p.data {font-size: 0.7rem; color: darkblue; margin: 0vh 0vw 0vh 3.1vw; text-align: left;}
h4 {font-size: 1.2rem; color: darkblue; text-align: left; margin: 1vh 2vw 1vh 3vw; display: inline-block; width: 55vw;}
h5 {font-size: 0.9rem; color: darkblue; text-align: left; margin: 0.5vh 0.5vw 1vh 3vw; display: inline-block; width: 55vw; height: 13vw;}
img.blog {display: inline-block; width: 25vw; float: right; vertical-align: top; margin: 1vh 5vw 0 0;}
a.przyciskb {width: 22vw; text-align: center; padding-bottom: 0.5vw; font-size: 1rem; text-decoration: none; margin: 0 0 1vw 3vw; display: inline-block; background-color: yellow; border: 3px; border-style: solid; border-color: darkblue;}
bialalinia {width: 90vw; height: 5vw; display: block;}    

}

@media only screen and (min-width: 441px) and (max-width: 800px) {

nav {background-color: rgba(102, 201, 209, 0.62); text-align: center; width: 100vw; height: 12vw; position: fixed;}
nav a {width: 19vw; height: 4.4vw; margin: 0.5vw 0 0 0; display: inline-block; font-size: 0.75rem; vertical-align: middle;}
nav a:hover {width: 19vw; margin: 0.5vw 0 0 0; display: inline-block; vertical-align: middle; color: yellow;}

artykul {min-height: 100vh; width: 90vw; margin-left: 5vw; background-color: white; display: block; overflow-y: auto; overflow-x: hidden;}
ramka {width: 80vw; height: auto; margin-left: 6vw; background-color: blue; color: white; display: block; font-size: 1.1rem; margin-top: 1.3vw;}

parallax1 { background-image: url("tla/blekitnyocean1.jpg"); height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax2 { background-image: url("tla/blekitnyocean2.jpg"); height: 28hv; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax3 { background-image: url("tla/blekitnyocean3.jpg"); height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax4 { background-image: url("tla/blekitnyocean4.jpg"); height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax5 { background-image: url("tla/blekitnyocean5.jpg"); height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax6 { background-image: url("tla/blekitnyocean6.jpg"); height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax7 { background-image: url("tla/blekitnyocean7.jpg"); height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax9 { background-image: url("tla/blekitnyocean9.jpg"); height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}

section1 {width: 100vw; background-color: white; display: block; overflow-y: auto;}
section2 {width: 100vw; background-color: white; display: block; overflow-y: auto;}
section3 {width: 100vw; background-color: white; display: block; overflow-y: auto;}
section4 {width: 100vw; background-color: white; display: block; overflow-y: auto;}
section5 {width: 100vw; background-color: white; display: block; overflow-y: auto;}
    
quote {background-color: #101d9b; display: block; width: 88vw; height: 12vh; margin-left: 6vw;}
div.fb-page {width: 100vw; height: 50vh;}
    
fadeup {height: 3vh; width: 100vw; background-image: linear-gradient(rgb(255, 255, 255), rgba(255, 255, 255, 0)); display: block;}
fadedown {height: 3vh; width: 100vw; background-image: linear-gradient(rgba(255, 255, 255, 0), rgb(255, 255, 255)); display: block; margin-top: 22vh;}
    
img.logo {width: 60vw; margin: 18vh 10vw 0 20vw;}
img.ca {float: right; height:11vh; padding: 0.5vw 1vw 0.5vw 4vw;}
img.ce {width: 88vw; margin: 1vh 6vw 1vh 6vw;}
img.przerywnik {width: 94vw; margin: 0.5vh 3vw 0.5vh 3vw;}
img.bio {float: right; width:30vw; padding: 1vw 6vw 0 3vw;}
img.jezyk {width: 6vw; height: 6vw; margin: 0vw 2vw 2vw 2vw;}
rel {display: inline-block; width: 19vw; height: 22vw; vertical-align: top; margin-right: 1vw;}
img.pf {width: 19vw; height: 12vw; margin: -1vw -3vw 1vw 0vw;}
p.opisr {font-size: 0.9rem; width: 19vw; height: 10vw; display: block; overflow-y: auto;margin-top: -1vw;}
h2 {font-size: 3rem; color: darkblue; text-align: center; margin: 1vh 6vw 1vh 6vw;}
h3 {font-size: 2.4rem; color: darkblue; text-align: center; margin: 1vh 6vw 1vh 6vw;}
p {font-size: 1.4rem; color: darkblue; margin: 1vh 6vw 1vh 6vw; text-align: justify;}
a {font-size: 1.9vh; color: darkblue; margin: 1vh 6vw 1vh 6vw;}
a.przycisk {width: 25vw; text-align: center; padding-bottom: 0.5vw; font-size: 1.4rem; text-decoration: none; margin: 3vw 0 1vw 36vw; display: block; background-color: yellow; border: 3px; border-style: solid; border-color: darkblue;}
b {background-color: rgb(255, 245, 0);}
b {background-color: rgb(255, 245, 0);}
b {background-color: rgb(255, 245, 0);}
p.cytat {font-size: 1.5rem; color: lightcyan; margin: 0.5vh 2vw 1vh 2vw; padding: 0.5vh 1vh 1vh 1vh; text-align: justify; font-style: italic;}
ul {font-size: 1.4rem; color: darkblue; margin: 1vh 6vw 1vh 10vw; list-style-image: url(img/kropka.png)}
iframe {width: 82vw; height: 300px; margin: 1vh 6vw 0 6vw;}

ramka {width: 43vw; height: 30vw; overflow: hidden; display: inline-block; margin-left: 1vw;}
ramka img {width: 43vw; height: 30vw; transition: transform .7s ease;}
ramka:hover img{transform: scale(1.15);}
ramka2 {width: 88vw; display: inline-block; margin-left: 1vw;}
    
p.data {font-size: 1rem; color: darkblue; margin: 0vh 0vw 0vh 3.1vw; text-align: left;}
h4 {font-size: 2rem; color: darkblue; text-align: left; margin: 1vh 2vw 1vh 3vw; display: inline-block; width: 55vw;}
h5 {font-size: 1.2rem; color: darkblue; text-align: left; margin: 0.5vh 0.5vw 1vh 3vw; display: inline-block; width: 55vw; height: 13vw;}
img.blog {display: inline-block; width: 25vw; float: right; vertical-align: top; margin: 1vh 5vw 0 0;}
a.przyciskb {width: 12vw; text-align: center; padding-bottom: 0.5vw; font-size: 1.2rem; text-decoration: none; margin: 0 0 1vw 3vw; display: inline-block; background-color: yellow; border: 3px; border-style: solid; border-color: darkblue;}
bialalinia {width: 90vw; height: 5vw; display: block;}
}

@media only screen and (min-width: 801px) and (max-width: 1600px) {
    
nav {background-color: rgba(102, 201, 209, 0.62); text-align: center; width: 90vw; height: 7vw; position: fixed;}
nav a {width: 16vw; height: 3.5vw; margin: 0.5vw 0 0 0; display: inline-block; font-size: 1rem; vertical-align: middle;}
nav a:hover {width: 16vw; height: 3.5vw; margin: 0.5vw 0 0 0; display: inline-block; font-size: 1rem; vertical-align: middle; color: yellow;}

artykul {min-height: 100vh; width: 90vw; margin-left: 5vw; background-color: white; display: block; overflow-y: auto; overflow-x: hidden;}
ramka {width: 80vw; height: auto; margin-left: 6vw; background-color: blue; color: white; display: block; font-size: 1.2rem; margin-top: 1.3vw;}
    
parallax1 { background-image: url("tla/blekitnyocean1.jpg"); width: 90vw; margin-left: 5vw;height: 38vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax2 { background-image: url("tla/blekitnyocean2.jpg"); width: 90vw; margin-left: 5vw;height: 38hv; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax3 { background-image: url("tla/blekitnyocean3.jpg"); width: 90vw; margin-left: 5vw;height: 38vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax4 { background-image: url("tla/blekitnyocean4.jpg"); width: 90vw; margin-left: 5vw;height: 38vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax5 { background-image: url("tla/blekitnyocean5.jpg"); width: 90vw; margin-left: 5vw;height: 38vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax6 { background-image: url("tla/blekitnyocean6.jpg"); width: 90vw; margin-left: 5vw;height: 38vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax7 { background-image: url("tla/blekitnyocean7.jpg"); width: 90vw; margin-left: 5vw;height: 38vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax9 { background-image: url("tla/blekitnyocean9.jpg"); width: 90vw; margin-left: 5vw;height: 38vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}

section1 {width: 90vw; margin-left: 5vw; background-color: white; display: block; overflow-y: auto; overflow-x: hidden;}
section2 {width: 90vw; margin-left: 5vw; background-color: white; display: block; overflow-y: auto;}
section3 {width: 90vw; margin-left: 5vw; background-color: white; display: block;}
section4 {width: 90vw; margin-left: 5vw; background-color: white; display: block; overflow-y: auto;}
section5 {width: 90vw; margin-left: 5vw; background-color: white; display: block; overflow-y: auto;}
    
quote {background-color: #101d9b; display: block; width: 68vw; height: 12vh; margin-left: 6vw;}
div.fb-page {width: 98vw; height: 50vh;}
    
fadeup {height: 3vh; width: 90vw; background-image: linear-gradient(rgb(255, 255, 255), rgba(255, 255, 255, 0)); display: block;}
fadedown {height: 3vh; width: 90vw; background-image: linear-gradient(rgba(255, 255, 255, 0), rgb(255, 255, 255)); display: block; margin-top: 32vh;}
    
img.logo {width: 30vw; margin: 15.5vh 10vw 0 30vw;}
img.ca {float: right; height:11vh; padding: 0.5vw 1vw 0.5vw 4vw;}
img.ce {width: 78vw; margin: 1vh 4vw 1vh 6vw;}
img.przerywnik {width: 74vw; margin: 0.5vh 1vw 0.5vh 3vw;}
img.bio {float: right; width:24vw; padding: 1vw 4vw 0 2vw;}
img.jezyk {width: 3.3vw; height: 3.3vw; margin: -1vw 0 0 0;}
rel {display: inline-block; width: 28vw; height: 34vw; vertical-align: top; margin: 0 0.5vw 0 1vw; overflow: hidden;}
img.pf {width: 28vw; height: 20vw; transition: transform .7s ease; margin: -1vw 0 -1vw -6vw;}
img.pf:hover {transform: scale(1.15); }
p.opisr {font-size: 0.9rem; width: 27.5vw; height: 12vw; display: block; overflow-y: auto; margin-left: 0.2vw; margin-top: 1vw;}
list {background-color: rgba(102, 201, 209, 0.52); display: block;}
list:hover {background-color: gainsboro; display: block;}
img.lista {height: 6vw; display: inline-block;}
list p {width: 60vw; font-size: 1.4rem; color: darkblue; margin: 1vh 4vw 1vh 9vw; display: inline-block; vertical-align: top; line-height: 4rem;}
h1 {font-size: 2.6rem; color: darkblue; text-align: center; margin: 1vh 4vw 4vh 6vw;}
h2 {font-size: 2.3rem; color: darkblue; text-align: center; margin: 2vh 4vw 5vh 6vw;}
h3 {font-size: 2rem; color: darkblue; text-align: center; margin: 1vh 4vw 1vh 6vw;}
p {font-size: 1.4rem; color: darkblue; margin: 1vh 4vw 1vh 6vw; text-align: justify;}
a {font-size: 1.9vh; color: darkblue; margin: 1vh 6vw 1vh 6vw;}
a.przycisk {width: 16vw; text-align: center; padding-bottom: 0.5vw; font-size: 1.6rem; text-decoration: none; margin: 1vw 0 1vw 36vw; display: block; background-color: yellow; border: 3px; border-style: solid; border-color: darkblue;}
b {background-color: rgb(255, 245, 0);}
a.przycisk:hover {width: 16vw; text-align: center; padding-bottom: 0.5vw; font-size: 1.6rem; text-decoration: none; margin: 1vw 0 1vw 36vw; display: block; background-color: white; border: 3px; border-style: solid; border-color: darkblue;}
b {background-color: rgb(255, 245, 0);}
p.cytat {font-size: 1.5rem; color: lightcyan; margin: 0.5vh 2vw 1vh 2vw; padding: 0.5vh 1vh 1vh 1vh; text-align: justify; font-style: italic;}
ul {font-size: 1.4rem; color: darkblue; margin: 1vh 4vw 1vh 10vw; list-style-image: url(img/kropka.png)}
iframe {width: 72vw; height: 400px; margin: 1vh 4vw 0 6vw;}

ramka {width: 43vw; height: 30vw; overflow: hidden; display: inline-block; margin-left: 1vw;}
ramka img {width: 43vw; height: 30vw; transition: transform .7s ease;}
ramka:hover img{transform: scale(1.15);} 
ramka2 {width: 88vw; display: inline-block; margin-left: 1vw; background-color: lightblue;}

p.data {font-size: 1rem; color: darkblue; margin: 0vh 0vw 0vh 3.1vw; text-align: left;}
h4 {font-size: 2rem; color: darkblue; text-align: left; margin: 1vh 2vw 1vh 3vw; display: inline-block; width: 55vw;}
h5 {font-size: 1.2rem; color: darkblue; text-align: left; margin: 0.5vh 0.5vw 1vh 3vw; display: inline-block; width: 55vw; height: 13vw;}
img.blog {display: inline-block; width: 25vw; float: right; vertical-align: top; margin: 1vh 5vw 0 0;}
a.przyciskb {width: 12vw; text-align: center; padding-bottom: 0.5vw; font-size: 1.2rem; text-decoration: none; margin: 0 0 1vw 3vw; display: inline-block; background-color: yellow; border: 3px; border-style: solid; border-color: darkblue;}
bialalinia {width: 90vw; height: 5vw; display: block;}
    
}

@media only screen and (min-width: 1601px) and (max-width: 4444px) {
    
nav {background-color: rgba(102, 201, 209, 0.62); text-align: center; width: 80vw; height: 7vw; position: fixed;}
nav a {width: 15vw; height: 3.5vw; margin: 0.5vw 0 0 0; display: inline-block; font-size: 1.3rem; vertical-align: middle;}
nav a:hover {width: 15vw; height: 3.5vw; margin: 0.5vw 0 0 0; display: inline-block; font-size: 1rem; vertical-align: middle; color: yellow;}
    
artykul {min-height: 100vh; width: 80vw; margin-left: 5vw; background-color: white; display: block; overflow-y: auto; overflow-x: hidden;}
ramka {width: 80vw; height: auto; margin-left: 6vw; background-color: blue; color: white; display: block; font-size: 1.2rem; margin-top: 1.3vw;}
    
parallax1 { background-image: url("tla/blekitnyocean1.jpg"); width: 80vw; margin-left: 10vw;height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax2 { background-image: url("tla/blekitnyocean2.jpg"); width: 80vw; margin-left: 10vw;height: 28hv; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax3 { background-image: url("tla/blekitnyocean3.jpg"); width: 80vw; margin-left: 10vw;height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax4 { background-image: url("tla/blekitnyocean4.jpg"); width: 80vw; margin-left: 10vw;height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax5 { background-image: url("tla/blekitnyocean5.jpg"); width: 80vw; margin-left: 10vw;height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax6 { background-image: url("tla/blekitnyocean6.jpg"); width: 80vw; margin-left: 10vw;height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax7 { background-image: url("tla/blekitnyocean7.jpg"); width: 80vw; margin-left: 10vw;height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}
parallax9 { background-image: url("tla/blekitnyocean9.jpg"); width: 80vw; margin-left: 10vw;height: 28vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; display: block;}

section1 {height: 120vh; width: 80vw; margin-left: 10vw; background-color: white; display: block; overflow-y: auto; overflow-x: hidden;}
section2 {height: 70vh; width: 80vw; margin-left: 10vw; background-color: white; display: block; overflow-y: auto;}
section3 {min-height: 110vh; width: 80vw; margin-left: 10vw; background-color: white; display: block;}
section4 {height: 90vh; width: 80vw; margin-left: 10vw; background-color: white; display: block; overflow-y: auto;}
section5 {height: 80vh; width: 80vw; margin-left: 10vw; background-color: white; display: block; overflow-y: auto;}
    
quote {background-color: #101d9b; display: block; width: 88vw; height: 12vh; margin-left: 6vw;}
div.fb-page {width: 98vw; height: 50vh;}
    
fadeup {height: 3vh; width: 80vw; background-image: linear-gradient(rgb(255, 255, 255), rgba(255, 255, 255, 0)); display: block;}
fadedown {height: 3vh; width: 80vw; background-image: linear-gradient(rgba(255, 255, 255, 0), rgb(255, 255, 255)); display: block; margin-top: 22vh;}
    
img.logo {width: 40vw; margin: 14vh 10vw 0 20vw;}
img.ca {float: right; height:11vh; padding: 0.5vw 1vw 0.5vw 4vw;}
img.ce {width: 68vw; margin: 1vh 4vw 1vh 6vw;}
img.przerywnik {width: 74vw; margin: 0.5vh 1vw 0.5vh 3vw;}
img.bio {float: right; width:30vw; padding: 1vw 6vw 0 3vw;}
img.jezyk {width: 3vw; height: 3vw; margin: -0.8vw 3vw 3vw 3vw;}
rel {display: inline-block; width: 19vw; height: 22vw; vertical-align: top; margin-right: 1vw;}
img.pf {width: 19vw; height: 12vw; margin: -1vw -3vw 1vw 0vw;}
p.opisr {font-size: 0.9rem; width: 19vw; height: 10vw; display: block; overflow-y: auto;margin-top: -1vw;}
h2 {font-size: 3.2rem; color: darkblue; text-align: center; margin: 1vh 4vw 1vh 6vw;}
h3 {font-size: 2.6rem; color: darkblue; text-align: center; margin: 1vh 4vw 1vh 6vw;}
p {font-size: 1.8rem; color: darkblue; margin: 1vh 4vw 1vh 6vw; text-align: justify;}
a {font-size: 1.9vh; color: darkblue; margin: 1vh 4vw 1vh 6vw;}
a.przycisk {width: 16vw; text-align: center; padding-bottom: 0.5vw; font-size: 1.6rem; text-decoration: none; margin: 1vw 0 1vw 34vw; display: inline-block; background-color: yellow; border: 3px; border-style: solid; border-color: darkblue; display: block;}
b {background-color: rgb(255, 245, 0);}
a.przycisk:hover {width: 16vw; text-align: center; padding-bottom: 0.5vw; font-size: 1.6rem; text-decoration: none; margin: 1vw 0 1vw 36vw; display: inline-block; background-color: white; border: 3px; border-style: solid; border-color: darkblue;}
b {background-color: rgb(255, 245, 0);}
b {background-color: rgb(255, 245, 0);}
p.cytat {font-size: 1.5rem; color: lightcyan; margin: 0.5vh 2vw 1vh 2vw; padding: 0.5vh 1vh 1vh 1vh; text-align: justify; font-style: italic;}
ul {font-size: 1.4rem; color: darkblue; margin: 1vh 4vw 1vh 10vw; list-style-image: url(img/kropka.png)}
iframe {width: 66vw; height: 36vw; margin: 1vh 4vw 0 6vw;}

ramka {width: 43vw; height: 30vw; overflow: hidden; display: inline-block; margin-left: 1vw;}
ramka img {width: 43vw; height: 30vw; transition: transform .7s ease;}
ramka:hover img{transform: scale(1.15);}
ramka2 {width: 88vw; display: inline-block; margin-left: 1vw;}

p.data {font-size: 1rem; color: darkblue; margin: 0vh 0vw 0vh 3.1vw; text-align: left;}
h4 {font-size: 2rem; color: darkblue; text-align: left; margin: 1vh 2vw 1vh 3vw; display: inline-block; width: 55vw;}
h5 {font-size: 1.2rem; color: darkblue; text-align: left; margin: 0.5vh 0.5vw 1vh 3vw; display: inline-block; width: 55vw; height: 13vw;}
img.blog {display: inline-block; width: 25vw; float: right; vertical-align: top; margin: 1vh 5vw 0 0;}
a.przyciskb {width: 12vw; text-align: center; padding-bottom: 0.5vw; font-size: 1.2rem; text-decoration: none; margin: 0 0 1vw 3vw; display: inline-block; background-color: yellow; border: 3px; border-style: solid; border-color: darkblue;}
bialalinia {width: 90vw; height: 5vw; display: block;}

}