@charset "utf-8";
/* CSS Document */
html, body {height: 100%;}

#wrap {min-height: 100%;}

#kontener_glowny {
	overflow:auto;
	padding-bottom: 75px;}  /* must be same height as the footer */

#footer {
	padding: 0.5em 0em 0em 0em;
	position: relative;
	margin-top: -75px; /* negative value of footer height */
	height: 75px;
	clear:both; 
	background-color: #196f00;
	text-align: center;
	} 
	
#footer {
	opacity: 0.5;
	-moz-opacity:0.5;
}
#footer div {
	display: inline-table;
}

#gora {
	font-family: Verdana, sans-serif;
	line-height: 30px;
	font-size: 14px;
	width: 100%;
	background: #196f00;


}
.gora-top{
	font-family: Arial, sans-serif;
	line-height: 30px;
	font-size: 17px;
	width: 100%;
	background: #000;
	opacity: 0.4;
	text-transform: uppercase;
	z-index: 9999;
	position: relative;
	-moz-box-shadow: 1px 0px 2px #000;
	-webkit-box-shadow: 1px 0px 2px #000;
	box-shadow: 1px 0px 2px #000;
}
.gora-top a{
	padding: 0px 10px;
	letter-spacing: 1px;
	color: #ddd;
	display: block;
	float: left;
}
.gora-top a:hover{
	color: #fff;
}

/*Opera Fix*/
body:before {
	content:"";
	height:100%;
	float:left;
	width:0;
	margin-top:-32767px;
}


body { margin: 0 0 0 0; padding: 0 0 0 0 }
div { position: relative; z-index: 1 }
#kontener_glowny { clear:both; margin: auto; width: 100%; max-width: 78.75em }
#naglowek { clear: both; margin: auto; width: 100%; max-width: 78.75em }

#logo { float: left; width: 50% }
#loga { float: right; width: 50%; text-align: right }
#loga div { display: inline-table }
#napis { clear: both; margin: auto; width: 100%; max-width: 78.75em }
#tresc { clear: both; margin: auto; width: 100%; max-width: 78.75em }
#menu div { display: inline }

#boksy { float: left; width: auto }
#boksy div { display: block }
#tekst { float: right; width: auto; text-align: right }

iframe { padding: 1em 0em 0em 0em }

.filmik { margin: auto; padding: 0em 0.1em 0em 0.1em; text-align: center}
.filmik { width: 290px; height: 210px }


}

@media only screen and (min-width: 801px) and (max-width: 1024px) {

	.filmik { width: 290px; height: 210px }
					
}
			
@media only screen and (min-width: 641px) and (max-width: 800px) {
	
	.filmik { width: 620px; height: 420px }
				
}
			
@media only screen and (min-width: 481px) and (max-width: 640px) {

	#logo { clear: both; float: none; width: 100% }
	#loga { clear: both; float: none; width:100%; text-align: center }
	#loga div { display: inline }
	#napis { clear: both; margin: auto; width: 100% }
	
	#tresc { clear: both; margin: auto; width: 100% }
	#boksy { clear: both; float: none; width: 100%; text-align: left }
	#boksy div { display: block }
	#tekst { clear: both; float: none; width: 100%; text-align: right }
	
	#kontener_glowny {
		overflow: hidden;
		padding-bottom: 150px;
	}  /* must be same height as the footer */

	#footer {
		margin-top: -150px; /* negative value of footer height */
		height: 150px;
		clear:both; 
	}
		#gora {
		margin-top: -150px; /* negative value of footer height */
		height: 150px;
		clear:both; 
	}
	
	.filmik { width: 460px; height: 320px }
				
}
			
@media only screen and (max-width: 480px) {

	#logo { clear: both; float: none; width: 100% }
	#loga { clear: both; float: none; width:100%; text-align: center }
	#loga div { display: inline }
	#napis { clear: both; margin: auto; width: 100% }
	#tresc { clear: both; margin: auto; width: 100% }
	#boksy { clear: both; float: none; width: 100%; text-align: left }
	#boksy div { display: block }
	#tekst { clear: both; float: none; width: 100%; text-align: right }
	
	#kontener_glowny {
		overflow: hidden;
		padding-bottom: 225px;
	}  /* must be same height as the footer */

	#footer {
		margin-top: -225px; /* negative value of footer height */
		height: 225px;
		clear: both; 
	}
	
	#gora {
		margin-top: -225px; /* negative value of footer height */
		height: 225px;
		clear: both; 
	}
	
	.filmik { width: 290px; height: 210px }