body {
background: url(../img/beton1.jpg);
background-position: top center;
background-repeat: repeat;

font-family: "Open Sans",sans-serif;
color: #7C7C7C;
}

* { 
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;         /* Opera/IE 8+ */
}

.contener{
width: 1140px;
margin-left: auto;
margin-right: auto;
}

#jezyk {
position: absolute;
z-index: 1200;
width: 400px;
height: 40px;
top: -150px;
left: 50%;
margin-left: 300px;
}

#jezyk ul {
display: block;
width: 90px;
}

#jezyk ul li {
display: block;
float: left;
width: 30px;
height: 20px;
margin-right: 6px;
position: relative;
}

#jezyk ul li a, #jezyk ul li a i {
display: block;
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
} 

i.pl {
background: url(../img/pl.png);
background-position: center center;
background-repeat: no-repeat;
background-size: 100%;
}

i.sk {
background: url(../img/sk.png);
background-position: center center;
background-repeat: no-repeat;
background-size: 100%;
}

i.cs {
background: url(../img/cs.png);
background-position: center center;
background-repeat: no-repeat;
background-size: 100%;
}


.naglowek{
width: 100%;
float: left;
clear: both;
background: url(../img/swiatlo2.png);
background-position: top center;
background-repeat: no-repeat;
background-size: 80%;
position: relative;
height: 200px;
}


.naglowek .logo{
position: absolute;
z-index: 2;
top: 20px;
width: 300px;
height: 110px;

left: 50%;
margin-left: -150px;

}

.logo span{
display: block;
width: 100%;
height: 120px;
position: absolute;
z-index: 1;
top: 95px;
left: 0;
text-align: center;
text-transform: uppercase;
color: #AAA;
font-family: "Passion One",cursive;
font-size: 26px;
text-shadow: 1px -1px 1px #000, -1px 1px 1px #000;

text-shadow: none;
color: #7C7C7C;

color: #4AA44A;
} 

.nawigacja{
width: 100%;
height: 100px;
float: left;
clear: both;
position: relative;
padding-top: 20px;
}

.nawigacja-kontener{
width: 1150px;
height: 100px;
background-color: black;
position: absolute;
z-index: 1000;
top: 0;
left: 50%;
margin-left: -575px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
}

.nawigacja-kontener ul.main {
display: block;
width: 100%;
height: 100%;

webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;

background: #4c4c4c; /* Old browsers */
background: -moz-linear-gradient(top,  #4c4c4c 0%, #2d2d2d 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(100%,#2d2d2d)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* IE10+ */
background: linear-gradient(to bottom,  #4c4c4c 0%,#2d2d2d 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#2d2d2d',GradientType=0 ); /* IE6-9 */


-moz-box-shadow: 0 0 20px 0 black;
-webkit-box-shadow: 0 0 20px 0 black;
box-shadow: 0 0 20px 0 black;

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,d3d3d3+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #d3d3d3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#d3d3d3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#d3d3d3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d3d3d3',GradientType=0 ); /* IE6-9 */


-moz-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);

}


.nawigacja-kontener ul.main li {
display: block;
width: 12.5%;
height: 100%;
float: left;
position: relative;
}

.nawigacja-kontener ul.main li a {
display: block;
width: 100%;
height: 100%;
position: relative;
z-index: 1;
text-decoration: none;
text-align: center;
line-height: 100px;
font-style: italic;
font-size: 18px;
font-weight: normal;
color: #D9DAA5;
text-shadow: -1px -1px 3px #A5A571, 1px 1px 2px #000;
border-right: 1px solid black;
overflow: hidden;
color: green;
text-shadow: none;
border-right: 1px solid #D6D6D6;
}

@media only screen and (max-width : 767px) {
.nawigacja-kontener ul.main li ul {
	display: block;
	position: relative;
}
.margin80 {
	margin-top: 100.3%;
}

.margin149 {
	margin-top: 0%;
}

.nawigacja-kontener ul.main {
	height: 124.2%; 
}
.nawigacja-kontener ul.main li ul li a i {
    opacity: 0 !important;
}
.nawigacja-kontener ul.main li ul li a:hover i, .nawigacja-kontener ul.main li ul li.active a i {
    opacity: 1 !important;
}
}
@media only screen and (min-width : 768px) {
.nawigacja-kontener ul.main li ul {
	display: none;
	height: 100%;
}
.nawigacja-kontener ul.main li:hover ul {
	display: block;
}
.nawigacja-kontener ul.main li ul li{
    z-index: 1;
    background-color: #d3d3d3;
	width: 150%;
	border-top: 1px solid #C8C8C8;
	height: 80px;
}
.nawigacja-kontener ul.main li ul li a{
    width: 100%;
	height: 80px;
	line-height: 20px;
	padding-top: 20px;
}
.nawigacja-kontener ul.main li ul li a i {
    opacity: 0 !important;
}
.nawigacja-kontener ul.main li ul li a:hover i, .nawigacja-kontener ul.main li ul li.active a i {
    opacity: 1 !important;
}
}
.nawigacja-kontener ul.main li.first a {
-webkit-border-top-left-radius:15px;
-webkit-border-bottom-left-radius: 15px;
-moz-border-radius-topleft: 15px;
-moz-border-radius-bottomleft: 15px;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;

}

.nawigacja-kontener ul.main li.last a {
-webkit-border-top-right-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-moz-border-radius-topright: 15px;
-moz-border-radius-bottomright: 15px;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
border-right: none;

}
.nawigacja-kontener ul.main li a:hover, .nawigacja-kontener ul.main li.active a{
background-color: rgba(255, 255, 255, 0.05);
}

.nawigacja-kontener ul.main li a i{
display: block;
position: absolute;
z-index: 1;
width: 100%;
height: 1vw;
top: 0;
left: 0;
background-color: #AEAF7C;
opacity: 0;

background-color: #4AA44A;
}

.nawigacja-kontener ul.main li a:hover i, .nawigacja-kontener ul.main li.active a i{
opacity: 1;
}

#animacja {
width: 100%;
height: 450px;
position: relative;
float: left;
}

#animacja .swiatlo {
width: 1200px;
height: 200px;
position: absolute;
z-index: -2;

top: 125px;
left: 0;

-webkit-box-shadow: 0px 0px 155px 0px rgba(255, 255, 255, 0.3);
-moz-box-shadow:    0px 0px 155px 0px rgba(255, 255, 255, 0.3);
box-shadow:         0px 0px 155px 0px rgba(255, 255, 255, 0.3);


}

.animacja{
margin-top: -50px;
width: 1200px;
float: left;
clear: both;
height: 450px;
position: absolute;
left: 50%;
margin-left: -600px;

-moz-box-shadow: 0 0 20px 0 black;
-webkit-box-shadow: 0 0 20px 0 black;
box-shadow: 0 0 20px 0 black;

webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;

-moz-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
background-color: white;
}

.animacja .img {
width: 100%;
height: 450px;
background: url(../img/animacja/1.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: 100%;
}

.animacja .img.img2 {
background: url(../img/animacja/2.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: 100%;
}

.animacja .img.img3 {
background: url(../img/animacja/3.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: 100%;
}

.bx-wrapper .bx-viewport {
margin-bottom: 0;
width: 100%;
height: 450px !important;
background-color: black;

background-color: white;
}

.animacja .belka {
display: block;
width: 800px;
height: 100px;
position: absolute;
z-index: -1;
bottom: -60px;
left: 50%;
margin-left: -400px;

background: #303030; /* Old browsers */
background: -moz-linear-gradient(top,  #303030 0%, #232323 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#303030), color-stop(100%,#232323)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #303030 0%,#232323 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #303030 0%,#232323 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #303030 0%,#232323 100%); /* IE10+ */
background: linear-gradient(to bottom,  #303030 0%,#232323 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#303030', endColorstr='#232323',GradientType=0 ); /* IE6-9 */


-moz-box-shadow: 0 0 20px 0 black;
-webkit-box-shadow: 0 0 20px 0 black;
box-shadow: 0 0 20px 0 black;

webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;

-moz-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,d3d3d3+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #d3d3d3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#d3d3d3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#d3d3d3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d3d3d3',GradientType=0 ); /* IE6-9 */


}

.animacja .tekst {
display: block;
width: 100%;
height: 70px;
position: absolute;
z-index: 1;
bottom: 0;
left: 0;
background: #4c4c4c; /* Old browsers */
background: -moz-linear-gradient(top,  #4c4c4c 0%, #2d2d2d 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(100%,#2d2d2d)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* IE10+ */
background: linear-gradient(to bottom,  #4c4c4c 0%,#2d2d2d 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#2d2d2d',GradientType=0 ); /* IE6-9 */
opacity: 0.84;

line-height: 70px;
text-align: center;

font-size: 28px;
color: #DDDEAA;
text-shadow: 1px 1px 4px #000;

-moz-box-shadow: 0 0 20px 0 black;
-webkit-box-shadow: 0 0 20px 0 black;
box-shadow: 0 0 20px 0 black;

text-shadow: none;
opacity: 1;
color: #4AA44A;

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,d3d3d3+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #d3d3d3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#d3d3d3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#d3d3d3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d3d3d3',GradientType=0 ); /* IE6-9 */


-moz-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);

}

.bx-wrapper .bx-pager {
    color: #666;
    padding-top: 10px;
    width: auto;
    height: 40px;
    left: 50%;
    margin-left: -385px;
    bottom: 0;
    margin-bottom: -50px;
}

.bx-wrapper .bx-pager.bx-default-pager a {
    display: block;
    width: 24px;
    height: 24px;
    margin: -10px 2px 0 0;
    outline: 0px none;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;

background: url(../img/sliderguzik.png);
background-position: center center;
background-repeat: no-repeat;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {
background: url(../img/sliderguzik2.png);
background-position: center center;
background-repeat: no-repeat;
}

#animacja .bx-next {
width: 48px;
height: 48px;
margin: 0;
left: 50%;
top: auto;
margin-left: 23px;
bottom: -54px;
background: url(../img/nastepna.png);
background-position: top left;
background-repeat: no-repeat;
}

#animacja .bx-prev {
width: 48px;
height: 48px;
margin: 0;
left: 50%;
top: auto;
margin-left: -23px;
bottom: -54px;
background: url(../img/poprzednia.png);
background-position: top left;
background-repeat: no-repeat;
}

#animacja .bx-next:hover, #animacja .bx-prev:hover {
background-position: bottom left;
}

.zajawka {
padding-left: 20px;
padding-right: 20px;
margin-top: 40px;
display: block;
float: left;
width: 100%;
padding-top: 30px;
padding-bottom: 30px;
position: relative;
}

.zajawka .linia {
display: block;
width: 1100px;
height: 2px;
position: absolute;
z-index: 1;
bottom: 0;
left: 20px;
border-bottom: 2px dotted #4C4C4C;

border-bottom: 2px dotted gray;
opacity: 0.2;
}

.zajawka .lewa, .obrazek {
float: left;
width: 320px;
height: 220px;


webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

-moz-box-shadow: 0 0 20px 0 black;
-webkit-box-shadow: 0 0 20px 0 black;
box-shadow: 0 0 20px 0 black;

-moz-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);

position: relative;

overflow: hidden;
}

.zajawka .lewa a, .obrazek a {
width: 100%;
height: 100%;
display: block;
position: absolute;
z-index: 1;
left: 0;
top: 0;
}

.zajawka .lewa a img, .obrazek a img {
width: 100%;
height: auto;
}

.zajawka .prawa {
float: left;
width: 740px;
margin-left: 40px;
}

h1 {
font-family: "Varela",sans-serif;
font-weight: normal;
letter-spacing: 1px;
font-size: 38px;
color: #C0C08A;
text-shadow: 1px 1px 4px #000;
margin-bottom: 20px;

color: #4AA44A;
text-shadow: none;
}

h3 {
    font-family: "Varela",sans-serif;
    font-weight: normal;
    letter-spacing: 1px;
    font-size: 22px;
    color: #C0C08A;
    text-shadow: 1px 1px 4px #000;
    margin-bottom: 20px;

color: #4AA44A;
text-shadow: none;
font-weight: 400;    
}

h3 a {
    color: #4AA44A;
	text-decoration: none;
}

 p {
font-size: 15px;
line-height: 20px;
margin-bottom: 20px;
text-align: justify;
}

.przycisk {
margin: 0 0 0 0;
padding: 0 15px 0 15px;
height: 45px;
display: block;
float: right;
font-size: 19px;
font-weight: normal;
font-style: italic;

line-height: 40px;
color: #D9DAA5;
text-decoration: none;
outline: none;
text-shadow: -1px -1px 3px #A5A571, 1px 1px 2px black;

background: #4c4c4c; /* Old browsers */
background: -moz-linear-gradient(top,  #4c4c4c 0%, #2d2d2d 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(100%,#2d2d2d)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* IE10+ */
background: linear-gradient(to bottom,  #4c4c4c 0%,#2d2d2d 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#2d2d2d',GradientType=0 ); /* IE6-9 */


-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;

-moz-box-shadow: 0 0 1px 0 #000;
-webkit-box-shadow: 0 0 1px 0 #000;
box-shadow: 0 0 1px 0 #000;

outline: none;
border: none;

-moz-box-shadow: 0 0 1px 0 rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 0 1px 0 rgba(0,0,0, 0.3);
box-shadow: 0 0 1px 0 rgba(0,0,0, 0.3);

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,d3d3d3+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #d3d3d3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#d3d3d3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#d3d3d3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d3d3d3',GradientType=0 ); /* IE6-9 */


text-shadow: none;
color: #4AA44A;
}

.przycisk:hover {
cursor: pointer;
opacity: 0.7;
}

/* zajawki */

.zajawki {
margin-top: 40px;
float: left;
width: 100%;
}

.obrazek {
float: left;
width: 100%;
height: 220px;
position: relative;
margin-bottom: 30px;
}

.zajawki .element {
width: 33.33%;
float: left;
padding-left: 20px;
padding-right: 20px;
}

.clear {
width: 1100px;
float: left;
clear: both;
border-bottom: 2px dotted #4C4C4C;
margin-bottom: 40px;
margin-top: 20px;
margin-left: 20px;

border-bottom: 2px dotted gray;
opacity: 0.2;
}

.opis .clear {
margin-left: 0;
}

.zajawki ul, .opis ul {
display: block;
float: left;
text-align: inherit;
}

.zajawki ul li, .opis ul li {
display: block;
float: left;
margin-bottom: 10px;
position: relative;
padding-left: 30px;
min-height: 20px;
width: 100%;
clear: both;
}

.zajawki ul li i, .opis ul li i {
display: block;
width: 15px;
height: 15px;
position: absolute;
z-index: 1;
top: 2px;
left: 0;
background: url(../img/ok.png);
background-position: center center;
background-size: 100%;
background-repeat: no-repeat;
}

.zajawki ul li p, .opis ul li p {
margin: 0;
text-align: inherit;
}

.shade {
display: block;
width: 100%;
height: 100%;
background-color: black;
opacity: 0;
position: absolute;
z-index: 1;
top: 0;
left: 0;

-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

.lupa {
display: block;
width: 100px;
height: 100px;
position: absolute;
z-index: 2;
top: 50%;
left: 50%;
margin-left: -50px;
margin-top: -50px;
opacity: 0;

background: url(../img/lupa.png);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;

-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

a:hover .shade {
opacity: 0.3;

-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

a:hover .lupa {
opacity: 1;

-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

#stopka {
    display: flex;
    flex-direction:row;
margin-top: 40px;
width: 100%;
clear: both;
font-size: 19px;
font-weight: normal;
font-style: italic;
padding-top: 10px;
color: #D9DAA5;
text-decoration: none;
outline: none;
text-shadow: -1px -1px 3px #A5A571, 1px 1px 2px black;
text-align: center;

background: #4c4c4c; /* Old browsers */
background: -moz-linear-gradient(top,  #4c4c4c 0%, #2d2d2d 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(100%,#2d2d2d)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #4c4c4c 0%,#2d2d2d 100%); /* IE10+ */
background: linear-gradient(to bottom,  #4c4c4c 0%,#2d2d2d 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#2d2d2d',GradientType=0 ); /* IE6-9 */

-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;

-moz-box-shadow: 0 0 20px 0 #000;
-webkit-box-shadow: 0 0 20px 0 #000;
box-shadow: 0 0 20px 0 #000;	

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,d3d3d3+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #d3d3d3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#d3d3d3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#d3d3d3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d3d3d3',GradientType=0 ); /* IE6-9 */


-moz-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);

text-shadow: none;
color: #4AA44A;	
}
#stopka p{ 
text-align: center;
}
#stopka a {
color: #4aa44a;
text-decoration: none;
}
/*O firmie */

.opis {
width: 100%;
float: left;
padding-left: 20px;
padding-right: 20px;
}

.opis .lewa, .opis .prawa {
float: left;
width: 50%;
}


.opis .lewa {
padding-right: 20px;
}

.opis .prawa {
padding-left: 20px;
}

h4 {
display: block;
width: 100%;
text-align: center;
margin-top: 0;
margin-bottom: 40px;
font-size: 22px;
line-height: 28px;
}

/* Galeria */

#galeria {
float: left;
width: 1200px;
margin-left: -30px;
position: relative;
}

h1 {
margin-top: 30px;
margin-bottom: 30px;
}

#galeria h1 {
margin-left: 10px;
}

#galeria .prawa {
position: absolute;
z-index: 1;
top: 40px;
right: 10px;
}

#galeria .topup {
display: block;
float: left;
width: 380px;
position: relative;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 20px;

webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

-moz-box-shadow: 0 0 20px 0 black;
-webkit-box-shadow: 0 0 20px 0 black;
box-shadow: 0 0 20px 0 black;

overflow: hidden;

-moz-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
}

#galeria .topup img {
width: 100%;
height: auto;
}

/* kontakt */

.dane-kontaktowe {
float: left;
width: 50%;
position: relative;
padding-top: 138px;
padding-right: 10px;
}

.dane-kontaktowe h1 {
display: block;
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 1200px;
}

.dane-kontaktowe p {
font-size: 16px;
margin-bottom: 20px;
}

.dane-kontaktowe p strong {
color: #C0C08A;
text-shadow: 1px 1px 4px #000;

text-shadow: none;
}

.formularz-kotnaktowy {
float: left;
width: 50%;
padding-top: 90px;
padding-left: 10px;
}

legend {
width: 100%;
text-align: center;
font-size: 14px;
height: 20px;
display: block;
margin-top: 10px;
margin-bottom: 10px;
}

.field {
display: block;
width: 100%;
height: 35px;
margin-bottom: 10px;
position: relative;
}

.prawa .field {
height: 120px;
} 

.field label {
display: block;
float: left;
width: 20%;
}

.field input, .field textarea {
width: 100%;
display: block;
float: left;
height: 100%;
border: none;
outline: none;
padding-left: 10px;
padding-right: 10px;
background-color: #383838;
line-height: 35px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

-moz-box-shadow: inset 1px 1px 4px 1px black;
-webkit-box-shadow: inset 1px 1px 4px 1px black;
box-shadow: inset 1px 1px 4px 1px black;
color: #C0C08A;
border-bottom: 1px solid #333535;
border-right: 1px solid #333535;
opacity: 0.8;
resize: none;
font-size: 18px;

-moz-box-shadow: inset 1px 1px 4px 1px rgba(0,0,0, 0.3);
-webkit-box-shadow: inset 1px 1px 4px 1px rgba(0,0,0, 0.3);
box-shadow: inset 1px 1px 4px 1px rgba(0,0,0, 0.3);

border-bottom: 1px solid #CFCFCF;
border-right: 1px solid #CFCFCF;
}

label.error {
position: absolute;
z-index: 2;
display: block;
width: 100%;
top: 0;
left: 0;
text-align: right;
padding-right: 20px;
font-size: 14px;
color: red;
line-height: 35px;
}

.field input:focus, .field textarea:focus {
background-color: #242424;	
}

.mapa, .mapa iframe {
float: left;
width: 100%;
height: 400px;
} 

.mapa {
margin-top: 30px;	

webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

-moz-box-shadow: 0 0 20px 0 black;
-webkit-box-shadow: 0 0 20px 0 black;
box-shadow: 0 0 20px 0 black;


-moz-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);
box-shadow: 0 0 20px 0 rgba(0,0,0, 0.3);

overflow: hidden;
}

::-webkit-input-placeholder {
opacity: 1;
}

:-moz-placeholder { /* Firefox 18- */
opacity: 1;
}

::-moz-placeholder {  /* Firefox 19+ */
opacity: 1;
}

:-ms-input-placeholder {  
opacity: 1;
}

/* Oferta */

.oferta {
float: left;
width: 100%;
border-top: 2px dotted #4C4C4C;
margin-bottom: 20px;
padding-top: 20px;

border-top: 2px dotted #D6D6D6;
}

.oferta .lewa {
width: 35%;
float: left;
}

.oferta .prawa {
display: block;
width: 60%;
float: left;
margin-left: 5%;
}

.oferta img {
width: 90%;
height: auto;
}

table {
width: 100%;
}

table tr td {
padding: 5px;
font-size: 14px;
}

.podtytul td {
font-weight: 700;
color: #AEAF7C;
font-size: 16px;
padding-bottom: 20px;
padding-top: 60px;
}

.formularz-kotnaktowy {
position: relative;
}

#podziekowanie {
float: left;
display: none;
}

#preloader  {
display: none;
width: 100%;
height: 100%;
position: absolute;
z-index: 1;
top: 0;
left: 0;

background: url(../img/bx_loader.gif);
background-position: center center;
background-repeat: no-repeat;
}

.pelny {
float: left;
width: 100%;
}

.ogloszenie {
float: left;
width: 100%;
clear: both;
margin-bottom: 30px;
}

.data {
float: left;
width: 100%;
display: block;
font-size: 14px;
margin-bottom: 10px;
}

.ogloszenie a {
text-decoration: none;
font-size: 16px;
color: #C0C08A;
}

.ogloszenie a i {
display: inline-block;
width: 16px;
height: 16px;
background-color: yellow;
display: none;
}

.listikon {
float: left;
width: 100%;
margin-bottom: 2vw;
}

.listikon li {
float: left;
list-style: none;
width: 50%;
}

.listikon li img {
width: 100%;
height: auto;
}

.zajawka.marginbottom {
float: left;
width: 100%;
margin-bottom: -2vw;
width: calc(100% + 2vw);
margin-left: -1vw;
}

.logoue {
width: 135px;
height: 80px;
position: absolute;
z-index: 100;
top: -100px;
right: 50%;
margin-right: -500px;
background: url(../img/ue.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: 100%;
}

#logoue2 {
width: 200px;
height: 200px;
position: absolute;
z-index: 100;
top: -100px;
left: 50%;
margin-left: -500px;
}

.blog-entry-post  {
float: left;
width: 50%;
clear: both;
margin-bottom: 30px;
}

.blog-entry-post a {
text-decoration: none;
font-size: 16px;
color: #C0C08A;
}

.blog-entry-post a i {
display: inline-block;
width: 16px;
height: 16px;
background-color: yellow;
display: none;
}

//Doda� �ukasz Kurzarzyk z Sunrsie System 26-08-2021
#stopka .info p{
 padding-top: 10px;
}
#stopka .fb, #stopka .info{
    width:50%;
}
#stopka .fb{
    overflow:hidden;
}
@media(max-width: 1200px){
    #stopka {
        flex-direction:column !imporant;
    }
  #stopka .fb, #stopka .info{
      width:100%;
  }

}