@charset "utf-8";
body, h1, h2, h3, h4, h5, h6, div, p, a, img, ul, li {margin:0; padding:0;}

.fleft {float:left;}
.fright {float:right;}

@media screen and (min-width: 1281px) and (orientation: landscape) {
body {background-color:#2b2b2b; color:#ffffff; font-family: 'Open Sans', Arial, sans-serif; font-size:0.8vw;}
.main {width:100%; position:relative;}
.start {width:100%; background:url(images/plane.jpg) center center no-repeat; background-size:100% auto;}
.roleta {width:100%; background:url(images/roleta.png) top repeat; text-align:center; padding:11vw 0 9vw 0;}
.logo {background:url(images/logo_pp.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:2vw; left:5vw; width:10vw; height:6.5vw; display:block;}
.roleta h2 {font-size:2.8vw; line-height:3.5vw; font-weight:300; text-transform:uppercase; color:#fff; padding:0 0 1vw 0;}
.roleta h3 {font-size:0.8vw; font-weight:400; text-transform:uppercase; padding:0 0 5.8vw 0;}
a.emailbaton {font-size:0.8vw; text-transform:uppercase; border:1px solid #ffffff; color:#FFF; text-decoration:none; text-align:center; 
padding:1.3vw 1.9vw 1.3vw 3.7vw; background: url(images/ptaszek.png) no-repeat; background-size:0.8vw 0.8vw; background-position:2vw 1.5vw;}
a.emailbaton:hover {color:#34f379; border:1px solid #34f379; background: url(images/ptaszek2.png) no-repeat; background-size:0.8vw 0.8vw; 
background-position:2vw 1.5vw;}

.mainmenu {position:absolute; top:2.5vw; right:5.5vw;}
.mainmenu ul {list-style:none; margin:0; padding:0;}
.mainmenu li {display:inline; margin:0 0.5vw; font-size:0.7vw !important; text-transform:uppercase;}
.mainmenu a {text-decoration:none; color:rgba(255,255,255,1);}
.mainmenu a:hover {color:#34f379; text-decoration:none;}

.portfolio {width:100%; overflow:hidden;}
.portfolio ul {list-style:none;}
.portfolio li {width:25%; height:25vw; float:left;}
.portfolio a {position:relative;}
a.pfbaton img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:1; animation: overlay2 0.3s 1;}
a.pfbaton:hover img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:0.42; animation: overlay 0.3s 1;}

a.pfbaton div.pfopis {position:absolute; top:-13vw;; left:0; width:100%; opacity:0; animation: ukryj 0.3s 1;}
a.pfbaton:hover div.pfopis {position:absolute; top:-13vw; left:0; width:100%; opacity:1; animation: pokaz 0.3s 1;}
.baton6 {display:inline;}

.pftytul {font-size:1.3vw; font-weight:400; text-transform:uppercase; text-align:center; color:rgba(255,255,255,1);}
.pfkategoria {font-size:1.0vw; font-weight:400; text-align:center; color:#34f379;}

.portfolionavi {border-bottom:solid #34f379 0.26vw; width:100%; text-align:center; padding:5vw 0 0 0;}
.portfolionavi h2 {font-size:2.8vw; font-weight:300; text-transform:uppercase; color:#34f379;}
.portfolionavi h3 {font-size:0.8vw; font-weight:400; padding:0 0 3.5vw 0;}
.portfolionavi ul {list-style:none; margin:0.5vw;}
.portfolionavi li {display:inline; margin:0 0.5vw; font-size:0.8vw;}
.portfolionavi a {color:#fff; text-decoration:none;}
.portfolionavi a:hover {color:#34f379; text-decoration:none;}

.portfolionavi2 {width:100%; text-align:center; padding:12vw 0 0 0;}
.portfolionavi2 h2 {font-size:2.8vw; padding:0 0 10vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.portfolionavi2 ul {list-style:none; margin:0.5vw;}
.portfolionavi2 li {display:inline; margin:0 0.5vw; font-size:0.8vw;}
.portfolionavi2 a {color:#fff; text-decoration:none;}
.portfolionavi2 a:hover {color:#34f379; text-decoration:none;}

.portfoliotitle {width:100%; text-align:center; padding:12vw 0 0 0;}
.portfoliotitle h2 {font-size:2.8vw; padding:0 0 10vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}

.portfoliookno {width:100%; text-align:center; padding:5vw 0 4vw 0; margin:0;}
.portfoliookno2 {width:70vw; margin:0 auto; padding:0; text-align:center;}
.portfoliookno2 img {width:100%; border:none; margin:0 0 4vw 0; padding:0; float:left;}
.mediaplayer {margin:0 auto 4vw 0; padding:0; width:50vw;}


.inneprojekty {background-color:rgba(54,54,54,1); width:100%;}
.inneprojekty2 {width:62vw; height:25vw; margin:0 auto; padding:4vw 0;}
.inneprojekty2 h3 {font-size:2.1vw; padding:0 0 4vw 0; margin:0; font-weight:300; text-transform:uppercase; color:#ffffff; text-align:center;}
.inneprojekty2 a {margin:0; padding:0; text-align:center; text-decoration:none; color:rgba(255,255,255,1);}
.inneprojekty2 a:hover {color:#34f379;}
.inneprojekty2 h4 {font-size:1.2vw; padding:1vw 0 0 0; margin:0; font-weight:300; text-transform:uppercase;}
.inneprojekty2 img {width:20.66vw; border:none; margin:0; padding:0;}
div.innyprojekt {width:20.66vw; display:inline; margin:0; padding:0; float:left;}
div.mini {width:20.66vw; height:15vw; background-position:center center; background-size:cover; background-repeat:no-repeat;}
.innyprojekt a div.mini {opacity:1; animation: overlay2 0.3s 1;}
.innyprojekt a:hover div.mini {opacity:0.42; animation: overlay 0.3s 1;}

.kontaktheader {width:100%; text-align:center; padding:6vw 0 10vw 0;}
.kontaktheader h2 {font-size:2.8vw; padding:0 0 1.2vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.kontaktheader p {font-size:0.8vw; font-weight:300; color:#ffffff;}
.kontaktheader a {color:#34f379; text-decoration:none; text-transform:lowercase;}
.kontaktheader a:hover {text-decoration:none; color:#cdffc3;}
.logokontakt {background:url(images/logo_pp2.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:-6.5vw; left:40vw; width:20vw; height:13vw;}

.emailform {width:100%; height:20vw; text-align:center; padding:0vw 0 0vw 0; background-color:rgba(255,255,255,1); position:relative;}

.zakresuslug {width:100%; color:#000000; background-color:#34f379;}
.zakresuslug ul {width:75vw; margin:0 auto;}
.zakresuslug li {width:23vw; display:block; float:left; clear:none; text-align:center; list-style:none; padding:4.5vw 1vw 0 1vw;}
.zakresuslug h3 {font-size:1.2vw; font-weight:400; margin:0 0 0.8vw 0;}
.zakresuslug p {font-size:0.8vw; font-weight:400;}
.podsumowanie {width:100%; background:url(images/hand.jpg) center center no-repeat; background-size:cover; position:relative; height:26vw; overflow:hidden;}
.podsumowanie h2 {font-size:2.65vw; font-weight:300; display:block; text-align:left; width:68vw; margin:0 auto; padding:9vw 0; position:absolute; top:0; left:16vw;}
.film1 {width:100vw; position:absolute; top:-18vw; left:0;}
.copyright {width:100%;}
.copyright p {font-size:0.8vw; margin:1.5vw 1.5vw; }

.zamkniecie {width:10px; height:4.5vw; clear:both;}
}



@media screen and (min-width: 1025px) and (max-width: 1280px) and (orientation: landscape) {
body {background-color:#2b2b2b; color:#ffffff; font-family: 'Open Sans', Arial, sans-serif; font-size:1.1vw;}
.main {width:100%; position:relative;}
.start {width:100%; background:url(images/plane.jpg) center center no-repeat; background-size:100% auto;}
.roleta {width:100%; background:url(images/roleta.png) top repeat; text-align:center; padding:11vw 0 9vw 0;}
.logo {background:url(images/logo_pp.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:2vw; left:5vw; width:11.5vw; height:7.5vw; display:block;}
.roleta h2 {font-size:3.3vw; line-height:3.7vw; font-weight:300; text-transform:uppercase; color:#fff; padding:0 0 1.2vw 0;}
.roleta h3 {font-size:1.1vw; font-weight:400; text-transform:uppercase; padding:0 0 5.8vw 0;}
a.emailbaton {font-size:1.1vw; text-transform:uppercase; border:1px solid #ffffff; color:#FFF; text-decoration:none; text-align:center; 
padding:1.6vw 2.2vw 1.6vw 4.2vw; background: url(images/ptaszek.png) no-repeat; background-size:1vw 1vw; background-position:2vw 1.9vw;}
a.emailbaton:hover {color:#34f379; border:1px solid #34f379; background: url(images/ptaszek2.png) no-repeat; background-size:1vw 1vw; 
background-position:2vw 1.9vw;}

.mainmenu {position:absolute; top:2.5vw; right:5.5vw;}
.mainmenu ul {list-style:none; margin:0; padding:0;}
.mainmenu li {display:inline; margin:0 0.5vw; font-size:1vw; text-transform:uppercase;}
.mainmenu a {text-decoration:none; color:rgba(255,255,255,1);}
.mainmenu a:hover {color:#34f379; text-decoration:none;}

.portfolio {width:100%; overflow:hidden;}
.portfolio ul {list-style:none;}
.portfolio li {width:33.333%; height:33vw; float:left;}
.portfolio a {position:relative;}
a.pfbaton img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:1; animation: overlay2 0.3s 1;}
a.pfbaton:hover img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:0.42; animation: overlay 0.3s 1;}

a.pfbaton div.pfopis {position:absolute; top:-17.5vw;; left:0; width:100%; opacity:0; animation: ukryj 0.3s 1;}
a.pfbaton:hover div.pfopis {position:absolute; top:-17.5vw;; left:0; width:100%; opacity:1; animation: pokaz 0.3s 1;}
.baton6 {display:none;}

.pftytul {font-size:1.5vw; font-weight:400; text-transform:uppercase; text-align:center; color:rgba(255,255,255,1);}
.pfkategoria {font-size:1.2vw; font-weight:400; text-align:center; color:#34f379;}

.portfolionavi {border-bottom:solid #34f379 0.3vw; width:100%; text-align:center; padding:6vw 0 0 0;}
.portfolionavi h2 {font-size:3.3vw; font-weight:300; text-transform:uppercase; color:#34f379;}
.portfolionavi h3 {font-size:1.1vw; font-weight:400; padding:0 0 4.2vw 0;}
.portfolionavi ul {list-style:none; margin:0.6vw;}
.portfolionavi li {display:inline; margin:0 0.5vw; font-size:1.1vw;}
.portfolionavi a {color:#fff; text-decoration:none;}
.portfolionavi a:hover {color:#34f379; text-decoration:none;}

.portfolionavi2 {width:100%; text-align:center; padding:14.5vw 0 0 0;}
.portfolionavi2 h2 {font-size:3.3vw; padding:0 0 12vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.portfolionavi2 ul {list-style:none; margin:0.6vw;}
.portfolionavi2 li {display:inline; margin:0 0.5vw; font-size:1.1vw;}
.portfolionavi2 a {color:#fff; text-decoration:none;}
.portfolionavi2 a:hover {color:#34f379; text-decoration:none;}

.portfoliotitle {width:100%; text-align:center; padding:12vw 0 0 0;}
.portfoliotitle h2 {font-size:2.8vw; padding:0 0 10vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}

.portfoliookno {width:100%; text-align:center; padding:5vw 0 4vw 0; margin:0;}
.portfoliookno2 {width:80vw; margin:0 auto; padding:0;}
.portfoliookno2 img {width:100%; border:none; margin:0 0 5vw 0; padding:0; float:left;}
.mediaplayer {margin:0 auto 5vw 0; padding:0; width:62vw;}


.inneprojekty {background-color:rgba(54,54,54,1); width:100%;}
.inneprojekty2 {width:62vw; height:25vw; margin:0 auto; padding:4vw 0;}
.inneprojekty2 h3 {font-size:2.1vw; padding:0 0 4vw 0; margin:0; font-weight:300; text-transform:uppercase; color:#ffffff; text-align:center;}
.inneprojekty2 a {margin:0; padding:0; text-align:center; text-decoration:none; color:rgba(255,255,255,1);}
.inneprojekty2 a:hover {color:#34f379;}
.inneprojekty2 h4 {font-size:1.2vw; padding:1vw 0 0 0; margin:0; font-weight:300; text-transform:uppercase;}
.inneprojekty2 img {width:20.66vw; border:none; margin:0; padding:0;}
div.innyprojekt {width:20.66vw; display:inline; margin:0; padding:0; float:left;}
div.mini {width:20.66vw; height:15vw; background-position:center center; background-size:cover; background-repeat:no-repeat;}
.innyprojekt a div.mini {opacity:1; animation: overlay2 0.3s 1;}
.innyprojekt a:hover div.mini {opacity:0.42; animation: overlay 0.3s 1;}

.kontaktheader {width:100%; text-align:center; padding:8vw 0 13vw 0;}
.kontaktheader h2 {font-size:3.2vw; padding:0 0 1.3vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.kontaktheader p {font-size:1.1vw; font-weight:300; color:#ffffff;}
.kontaktheader a {color:#34f379; text-decoration:none; text-transform:lowercase;}
.kontaktheader a:hover {text-decoration:none; color:#cdffc3;}
.logokontakt {background:url(images/logo_pp2.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:-7.4vw; left:37vw; width:26vw; height:15vw;}

.emailform {width:100%; height:23vw; text-align:center; padding:0vw 0 0vw 0; background-color:rgba(255,255,255,1); position:relative;}

.zakresuslug {width:100%; color:#000000; background-color:#34f379;}
.zakresuslug ul {width:81vw; margin:0 auto;}
.zakresuslug li {width:25vw; display:block; float:left; clear:none; text-align:center; list-style:none; padding:4.5vw 1vw 0 1vw;}
.zakresuslug h3 {font-size:1.4vw; font-weight:400; margin:0 0 0.8vw 0;}
.zakresuslug p {font-size:1.1vw; font-weight:400;}
.podsumowanie {width:100%; background:url(images/hand.jpg) center center no-repeat; background-size:cover; position:relative; height:31vw; overflow:hidden;}
.podsumowanie h2 {font-size:2.9vw; font-weight:300; display:block; text-align:left; width:75vw; margin:0 auto; padding:11vw 0; position:absolute; top:0; left:13vw;}
.film1 {width:100vw; position:absolute; top:-16vw; left:0;}
.copyright {width:100%;}
.copyright p {font-size:1.1vw; margin:1.7vw 1.7vw; }

.zamkniecie {width:10px; height:4.5vw; clear:both;}
}



@media screen and (min-width: 721px) and (max-width: 1024px) and (orientation: landscape) {
body {background-color:#2b2b2b; color:#ffffff; font-family: 'Open Sans', Arial, sans-serif; font-size:1.5vw;}
.main {width:100%; position:relative;}
.start {width:100%; background:url(images/plane.jpg) center center no-repeat; background-size:115% auto;}
.roleta {width:100%; background:url(images/roleta.png) top repeat; text-align:center; padding:13vw 0 11vw 0;}
.logo {background:url(images/logo_pp.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:2vw; left:5vw; width:13vw; height:8.5vw; display:block;}
.roleta h2 {font-size:3.6vw; line-height:4.1vw; font-weight:300; text-transform:uppercase; color:#fff; padding:0 0 2.1vw 0;}
.roleta h3 {font-size:1.5vw; font-weight:400; text-transform:uppercase; padding:0 0 6.8vw 0;}
a.emailbaton {font-size:1.5vw; text-transform:uppercase; border:1px solid #ffffff; color:#FFF; text-decoration:none; text-align:center; 
padding:1.7vw 2.4vw 1.7vw 4.5vw; background: url(images/ptaszek.png) no-repeat; background-size:1.3vw 1.3vw; background-position:2vw 2.1vw;}
a.emailbaton:hover {color:#34f379; border:1px solid #34f379; background: url(images/ptaszek2.png) no-repeat; background-size:1.3vw 1.3vw; 
background-position:2vw 2.1vw;}

.mainmenu {position:absolute; top:2.5vw; right:5.5vw;}
.mainmenu ul {list-style:none; margin:0; padding:0;}
.mainmenu li {display:inline; margin:0 0.5vw; font-size:1.4vw; text-transform:uppercase;}
.mainmenu a {text-decoration:none; color:rgba(255,255,255,1);}
.mainmenu a:hover {color:#34f379; text-decoration:none;}

.portfolio {width:100%; overflow:hidden;}
.portfolio ul {list-style:none;}
.portfolio li {width:50%; height:47vw; float:left;}
.portfolio a {position:relative;}
a.pfbaton img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:1; animation: overlay2 0.3s 1;}
a.pfbaton:hover img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:0.42; animation: overlay 0.3s 1;}

a.pfbaton div.pfopis {position:absolute; top:-25vw;; left:0; width:100%; opacity:0; animation: ukryj 0.3s 1;}
a.pfbaton:hover div.pfopis {position:absolute; top:-25vw;; left:0; width:100%; opacity:1; animation: pokaz 0.3s 1;}
.baton6 {display:inline;}

.pftytul {font-size:1.9vw; font-weight:400; text-transform:uppercase; text-align:center; color:rgba(255,255,255,1);}
.pfkategoria {font-size:1.5vw; font-weight:400; text-align:center; color:#34f379;}

.portfolionavi {border-bottom:solid #34f379 0.5vw; width:100%; text-align:center; padding:7.5vw 0 0 0;}
.portfolionavi h2 {font-size:3.6vw; font-weight:300; text-transform:uppercase; color:#34f379;}
.portfolionavi h3 {font-size:1.5vw; font-weight:400; padding:0 0 5vw 0;}
.portfolionavi ul {list-style:none; margin:1.2vw;}
.portfolionavi li {display:inline; margin:0 0.5vw; font-size:1.5vw;}
.portfolionavi a {color:#fff; text-decoration:none;}
.portfolionavi a:hover {color:#34f379; text-decoration:none;}

.portfolionavi2 {width:100%; text-align:center; padding:17vw 0 0 0;}
.portfolionavi2 h2 {font-size:3.6vw; padding:0 0 14vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.portfolionavi2 ul {list-style:none; margin:1.2vw;}
.portfolionavi2 li {display:inline; margin:0 0.5vw; font-size:1.5vw;}
.portfolionavi2 a {color:#fff; text-decoration:none;}
.portfolionavi2 a:hover {color:#34f379; text-decoration:none;}

.portfoliotitle {width:100%; text-align:center; padding:13vw 0 0 0;}
.portfoliotitle h2 {font-size:3.2vw; padding:0 0 11vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}

.portfoliookno {width:100%; text-align:center; padding:6vw 0 5vw 0; margin:0;}
.portfoliookno2 {width:85vw; margin:0 auto; padding:0;}
.portfoliookno2 img {width:100%; border:none; margin:0 0 6vw 0; padding:0; float:left;}
.mediaplayer {margin:0 auto 6vw 0; padding:0; width:74vw;}

.inneprojekty {background-color:rgba(54,54,54,1); width:100%;}
.inneprojekty2 {width:66vw; height:30vw; margin:0 auto; padding:6vw 0;}
.inneprojekty2 h3 {font-size:2.5vw; padding:0 0 6vw 0; margin:0; font-weight:300; text-transform:uppercase; color:#ffffff; text-align:center;}
.inneprojekty2 a {margin:0; padding:0; text-align:center; text-decoration:none; color:rgba(255,255,255,1);}
.inneprojekty2 a:hover {color:#34f379;}
.inneprojekty2 h4 {font-size:1.5vw; padding:1.4vw 0 0 0; margin:0; font-weight:300; text-transform:uppercase;}
.inneprojekty2 img {width:22vw; border:none; margin:0; padding:0;}
div.innyprojekt {width:22vw; display:inline; margin:0; padding:0; float:left;}
div.mini {width:22vw; height:16.4vw; background-position:center center; background-size:cover; background-repeat:no-repeat;}
.innyprojekt a div.mini {opacity:1; animation: overlay2 0.3s 1;}
.innyprojekt a:hover div.mini {opacity:0.42; animation: overlay 0.3s 1;}

.kontaktheader {width:100%; text-align:center; padding:10vw 0 15vw 0;}
.kontaktheader h2 {font-size:3.6vw; padding:0 0 1.6vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.kontaktheader p {font-size:1.5vw; font-weight:300; color:#ffffff;}
.kontaktheader a {color:#34f379; text-decoration:none; text-transform:lowercase;}
.kontaktheader a:hover {text-decoration:none; color:#cdffc3;}
.logokontakt {background:url(images/logo_pp2.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:-9.2vw; left:35vw; width:30vw; height:18.5vw;}

.emailform {width:100%; height:23vw; text-align:center; padding:0vw 0 0vw 0; background-color:rgba(255,255,255,1); position:relative;}

.zakresuslug {width:100%; color:#000000; background-color:#34f379;}
.zakresuslug ul {width:80vw; margin:0 auto;}
.zakresuslug li {width:36vw; height:9.5vw; display:block; float:left; clear:none; text-align:center; list-style:none; padding:6vw 1vw 0 1vw;}
.zakresuslug h3 {font-size:1.7vw; font-weight:400; margin:0 0 0.8vw 0;}
.zakresuslug p {font-size:1.5vw; font-weight:400;}
.podsumowanie {width:100%; background:url(images/hand.jpg) center center no-repeat; background-size:cover; position:relative; height:32vw; overflow:hidden;}
.podsumowanie h2 {font-size:3.1vw; font-weight:300; display:block; text-align:left; width:78vw; margin:0 auto; padding:11vw 0; position:absolute; top:0; left:11vw;}
.film1 {width:100vw; position:absolute; top:-14vw; left:0;}
.copyright {width:100%;}
.copyright p {font-size:1.5vw; margin:2vw 2vw; }

.zamkniecie {width:10px; height:5.5vw; clear:both;}
}

@media screen and (max-width: 720px) and (orientation: landscape) {
body {background-color:#2b2b2b; color:#ffffff; font-family: 'Open Sans', Arial, sans-serif; font-size:1.8vw;}
.main {width:100%; position:relative;}
.start {width:100%; background:url(images/plane.jpg) center center no-repeat; background-size:140% auto;}
.roleta {width:100%; background:url(images/roleta.png) top repeat; text-align:center; padding:15vw 0 11vw 0;}
.logo {background:url(images/logo_pp.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:2.5vw; left:6vw; width:16vw; height:10vw; display:block;}
.roleta h2 {font-size:4.2vw; line-height:4.4vw; font-weight:300; text-transform:uppercase; color:#fff; padding:0 0 2.5vw 0;}
.roleta h3 {font-size:2.4vw; font-weight:400; text-transform:uppercase; padding:0 8vw 8vw 8vw;}
a.emailbaton {font-size:1.9vw; text-transform:uppercase; border:1px solid #ffffff; color:#FFF; text-decoration:none; text-align:center; 
padding:1.9vw 2.5vw 1.9vw 5vw; background: url(images/ptaszek.png) no-repeat; background-size:1.6vw 1.6vw; background-position:2vw 2.4vw;}
a.emailbaton:hover {color:#34f379; border:1px solid #34f379; background: url(images/ptaszek2.png) no-repeat; background-size:1.6vw 1.6vw; 
background-position:2vw 2.4vw;}

.mainmenu {position:absolute; top:3vw; right:6vw;}
.mainmenu ul {list-style:none; margin:0; padding:0;}
.mainmenu li {display:inline; margin:0 0.5vw; font-size:1.8vw; text-transform:uppercase;}
.mainmenu a {text-decoration:none; color:rgba(255,255,255,1);}
.mainmenu a:hover {color:#34f379; text-decoration:none;}

.portfolio {width:100%; overflow:hidden;}
.portfolio ul {list-style:none;}
.portfolio li {width:50%; height:47vw; float:left;}
.portfolio a {position:relative;}
a.pfbaton img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:1; animation: overlay2 0.3s 1;}
a.pfbaton:hover img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:0.42; animation: overlay 0.3s 1;}

a.pfbaton div.pfopis {position:absolute; top:-25vw;; left:0; width:100%; opacity:0; animation: ukryj 0.3s 1;}
a.pfbaton:hover div.pfopis {position:absolute; top:-25vw;; left:0; width:100%; opacity:1; animation: pokaz 0.3s 1;}
.baton6 {display:none;}

.pftytul {font-size:2.5vw; font-weight:400; text-transform:uppercase; text-align:center; color:rgba(255,255,255,1);}
.pfkategoria {font-size:2vw; font-weight:400; text-align:center; color:#34f379;}

.portfolionavi {border-bottom:solid #34f379 0.6vw; width:100%; text-align:center; padding:9vw 0 0 0;}
.portfolionavi h2 {font-size:4.2vw; font-weight:300; text-transform:uppercase; color:#34f379;}
.portfolionavi h3 {font-size:1.8vw; font-weight:400; padding:0 0 8vw 0;}
.portfolionavi ul {list-style:none; margin:1.2vw;}
.portfolionavi li {display:inline; margin:0 0.5vw; font-size:1.8vw;}
.portfolionavi a {color:#fff; text-decoration:none;}
.portfolionavi a:hover {color:#34f379; text-decoration:none;}

.portfolionavi2 {width:100%; text-align:center; padding:17vw 0 0 0;}
.portfolionavi2 h2 {font-size:4.2vw; padding:0 0 14vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.portfolionavi2 ul {list-style:none; margin:1.2vw;}
.portfolionavi2 li {display:inline; margin:0 0.5vw; font-size:1.8vw;}
.portfolionavi2 a {color:#fff; text-decoration:none;}
.portfolionavi2 a:hover {color:#34f379; text-decoration:none;}

.portfoliotitle {width:100%; text-align:center; padding:15vw 0 0 0;}
.portfoliotitle h2 {font-size:3.8vw; padding:0 0 13vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}

.portfoliookno {width:100%; text-align:center; padding:6vw 0 0vw 0; margin:0;}
.portfoliookno2 {width:100vw; margin:0 auto; padding:0;}
.portfoliookno2 img {width:100%; border:none; margin:0 0 6vw 0; padding:0; float:left;}
.mediaplayer {margin:0 auto 6vw 0; padding:0; width:84vw;}

.inneprojekty {background-color:rgba(54,54,54,1); width:100%;}
.inneprojekty2 {width:90vw; height:35vw; margin:0 auto; padding:6vw 0;}
.inneprojekty2 h3 {font-size:2.6vw; padding:0 0 6vw 0; margin:0; font-weight:300; text-transform:uppercase; color:#ffffff; text-align:center;}
.inneprojekty2 a {margin:0; padding:0; text-align:center; text-decoration:none; color:rgba(255,255,255,1);}
.inneprojekty2 a:hover {color:#34f379;}
.inneprojekty2 h4 {font-size:1.8vw; padding:1.4vw 0 0 0; margin:0; font-weight:300; text-transform:uppercase;}
.inneprojekty2 img {width:30vw; border:none; margin:0; padding:0;}
div.innyprojekt {width:30vw; display:inline; margin:0; padding:0; float:left;}
div.mini {width:30vw; height:20vw; background-position:center center; background-size:cover; background-repeat:no-repeat;}
.innyprojekt a div.mini {opacity:1; animation: overlay2 0.3s 1;}
.innyprojekt a:hover div.mini {opacity:0.42; animation: overlay 0.3s 1;}

.kontaktheader {width:100%; text-align:center; padding:10vw 0 12vw 0;}
.kontaktheader h2 {font-size:4vw; padding:0 0 2.5vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.kontaktheader p {font-size:2.1vw; font-weight:300; color:#ffffff;}
.kontaktheader a {color:#34f379; text-decoration:none; text-transform:lowercase;}
.kontaktheader a:hover {text-decoration:none; color:#cdffc3;}
.logokontakt {background:url(images/logo_pp2.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:-8vw; left:37vw; width:26vw; height:17vw;}

.emailform {width:100%; height:20vw; text-align:center; padding:0vw 0 0vw 0; background-color:rgba(255,255,255,1); position:relative;}

.zakresuslug {width:100%; color:#000000; background-color:#34f379;}
.zakresuslug ul {width:100vw; margin:0 auto;}
.zakresuslug li {width:46vw; height:12vw; display:block; float:left; clear:none; text-align:center; list-style:none; padding:10vw 1vw 0 1vw;}
.zakresuslug h3 {font-size:2.6vw; font-weight:400; margin:0 0 1vw 0;}
.zakresuslug p {font-size:1.9vw; font-weight:400;}
.podsumowanie {width:100%; background:url(images/hand.jpg) center center no-repeat; background-size:cover; position:relative; height:39vw; overflow:hidden;}
.podsumowanie h2 {font-size:3.8vw; font-weight:300; display:block; text-align:left; width:78vw; margin:0 auto; padding:11vw 0; position:absolute; top:0; left:11vw;}
.film1 {width:100vw; position:absolute; top:-8vw; left:0;}
.copyright {width:100%;}
.copyright p {font-size:1.8vw; margin:2vw 3vw; }

.zamkniecie {width:10px; height:7.5vw; clear:both;}
}

@media screen and (orientation: portrait) {
body {background-color:#2b2b2b; color:#ffffff; font-family: 'Open Sans', Arial, sans-serif; font-size:2.2vw;}
.main {width:100%; position:relative;}
.start {width:100%; background:url(images/plane.jpg) center center no-repeat; background-size:170% auto;}
.roleta {width:100%; background:url(images/roleta.png) top repeat; text-align:center; padding:21vw 0 11vw 0;}
.logo {background:url(images/logo_pp.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:2.5vw; left:6vw; width:20vw; height:13vw; display:block;}
.roleta h2 {font-size:5vw; line-height:5vw; font-weight:300; text-transform:uppercase; color:#fff; padding:0 0 2.5vw 0;}
.roleta h3 {font-size:3vw; font-weight:400; text-transform:uppercase; padding:0 8vw 8vw 8vw;}
a.emailbaton {font-size:2.4vw; text-transform:uppercase; border:1px solid #ffffff; color:#FFF; text-decoration:none; text-align:center; 
padding:1.9vw 3.5vw 1.9vw 7vw; background: url(images/ptaszek.png) no-repeat; background-size:2vw 2vw; background-position:3vw 2.7vw;}
a.emailbaton:hover {color:#34f379; border:1px solid #34f379; background: url(images/ptaszek2.png) no-repeat; background-size:2vw 2vw; 
background-position:3vw 2.7vw;}

.mainmenu {position:absolute; top:3vw; right:6vw;}
.mainmenu ul {list-style:none; margin:0; padding:0;}
.mainmenu li {display:inline; margin:0 0.5vw; font-size:2.2vw; text-transform:uppercase;}
.mainmenu a {text-decoration:none; color:rgba(255,255,255,1);}
.mainmenu a:hover {color:#34f379; text-decoration:none;}

.portfolio {width:100%; overflow:hidden;}
.portfolio ul {list-style:none;}
.portfolio li {width:50%; height:47vw; float:left;}
.portfolio a {position:relative;}
a.pfbaton img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:1; animation: overlay2 0.3s 1;}
a.pfbaton:hover img.obrazek {width:100%; height:100%; margin:0; padding:0; border:none; opacity:0.42; animation: overlay 0.3s 1;}

a.pfbaton div.pfopis {position:absolute; top:-25vw;; left:0; width:100%; opacity:0; animation: ukryj 0.3s 1;}
a.pfbaton:hover div.pfopis {position:absolute; top:-25vw;; left:0; width:100%; opacity:1; animation: pokaz 0.3s 1;}
.baton6 {display:none;}

.pftytul {font-size:2.5vw; font-weight:400; text-transform:uppercase; text-align:center; color:rgba(255,255,255,1);}
.pfkategoria {font-size:2.2vw; font-weight:400; text-align:center; color:#34f379;}

.portfolionavi {border-bottom:solid #34f379 0.6vw; width:100%; text-align:center; padding:12vw 0 0 0;}
.portfolionavi h2 {font-size:5vw; font-weight:300; text-transform:uppercase; color:#34f379;}
.portfolionavi h3 {font-size:2.2vw; font-weight:400; padding:0 0 11vw 0;}
.portfolionavi ul {list-style:none; margin:1.2vw;}
.portfolionavi li {display:inline; margin:0 0.5vw; font-size:2.2vw;}
.portfolionavi a {color:#fff; text-decoration:none;}
.portfolionavi a:hover {color:#34f379; text-decoration:none;}

.portfolionavi2 {width:100%; text-align:center; padding:17vw 0 0 0;}
.portfolionavi2 h2 {font-size:4.2vw; padding:0 0 14vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.portfolionavi2 ul {list-style:none; margin:1.2vw;}
.portfolionavi2 li {display:inline; margin:0 0.5vw; font-size:2.2vw;}
.portfolionavi2 a {color:#fff; text-decoration:none;}
.portfolionavi2 a:hover {color:#34f379; text-decoration:none;}

.portfoliotitle {width:100%; text-align:center; padding:15vw 0 0 0;}
.portfoliotitle h2 {font-size:3.8vw; padding:0 0 13vw 0; font-weight:300; text-transform:uppercase; color:#ffffff;}

.portfoliookno {width:100%; text-align:center; padding:6vw 0 0vw 0; margin:0;}
.portfoliookno2 {width:100vw; margin:0 auto; padding:0;}
.portfoliookno2 img {width:100%; border:none; margin:0 0 6vw 0; padding:0; float:left;}
.mediaplayer {margin:0 auto 6vw 0; padding:0; width:90vw;}

.inneprojekty {background-color:rgba(54,54,54,1); width:100%;}
.inneprojekty2 {width:90vw; height:35vw; margin:0 auto; padding:6vw 0;}
.inneprojekty2 h3 {font-size:2.6vw; padding:0 0 6vw 0; margin:0; font-weight:300; text-transform:uppercase; color:#ffffff; text-align:center;}
.inneprojekty2 a {margin:0; padding:0; text-align:center; text-decoration:none; color:rgba(255,255,255,1);}
.inneprojekty2 a:hover {color:#34f379;}
.inneprojekty2 h4 {font-size:2.2vw; padding:1.4vw 0 0 0; margin:0; font-weight:300; text-transform:uppercase;}
.inneprojekty2 img {width:30vw; border:none; margin:0; padding:0;}
div.innyprojekt {width:30vw; display:inline; margin:0; padding:0; float:left;}
div.mini {width:30vw; height:20vw; background-position:center center; background-size:cover; background-repeat:no-repeat;}
.innyprojekt a div.mini {opacity:1; animation: overlay2 0.3s 1;}
.innyprojekt a:hover div.mini {opacity:0.42; animation: overlay 0.3s 1;}

.kontaktheader {width:100vw; height:30vh; text-align:center; padding:10vh 0; margin:0;}
.kontaktheader h2 {font-size:5vw; padding:0 0 2.5vh 0; font-weight:300; text-transform:uppercase; color:#ffffff;}
.kontaktheader p {font-size:2.5vw; font-weight:300; color:#ffffff;}
.kontaktheader a {color:#34f379; text-decoration:none; text-transform:lowercase;}
.kontaktheader a:hover {text-decoration:none; color:#cdffc3;}
.logokontakt {background:url(images/logo_pp2.png) center no-repeat; background-size:80% auto; display:block; text-indent:-3000px; overflow:hidden; 
position:absolute; top:-16.9vw; left:20vw; width:60vw; height:34vw;}

.emailform {width:100%; height:39vh; text-align:center; padding:0vw 0 0vw 0; background-color:rgba(255,255,255,1); position:relative;}

.zakresuslug {width:100%; color:#000000; background-color:#34f379;}
.zakresuslug ul {width:100vw; margin:0 auto;}
.zakresuslug li {width:46vw; height:14vw; display:block; float:left; clear:none; text-align:center; list-style:none; padding:10vw 1vw 0 1vw;}
.zakresuslug h3 {font-size:2.6vw; font-weight:400; margin:0 0 1vw 0;}
.zakresuslug p {font-size:2.2vw; font-weight:400;}
.podsumowanie {width:100%; background:url(images/hand.jpg) center center no-repeat; background-size:cover; position:relative; height:44vw; overflow:hidden;}
.podsumowanie h2 {font-size:3.8vw; font-weight:300; display:block; text-align:left; width:78vw; margin:0 auto; padding:14vw 0; position:absolute; top:0; left:11vw;}
.film1 {width:100vw; position:absolute; top:-5vw; left:0;}
.copyright {width:100%; height:2vh;}
.copyright p {font-size:2.2vw; margin:4vh 4vh; }

.zamkniecie {width:10px; height:8vw; clear:both;}
}




@keyframes overlay {
  from {opacity:1;}
  to {opacity:0.42;}
}
@keyframes overlay2 {
  from {opacity:0.42;}
  to {opacity:1;}
}
@keyframes pokaz {
  from {opacity:0;}
  to {opacity:1;}
}
@keyframes ukryj {
  from {opacity:1;}
  to {opacity:0;}
}

.zielony {color:#34f379;}