#container:fullscreen {
    background-color: #444; 
}
#container:-webkit-full-screen {
    background-color: #444; 
}
#container:-moz-full-screen {
    background-color: #444; 
}




#outer {height: auto !important; overflow: hidden; position: relative; }
#outer[id] {display: table; position: static;}

#middle {position: absolute; top: 50%;} /* for quirk explorer only*/
#middle[id] {display: table-cell; vertical-align: middle; width: 100%; position: static;}


#gallery { 
/*	padding: 0 42px; */
	margin: 40px auto; 
	min-width: 600px; max-width:1500px; 
	background-color: inherit;
	text-align: center;
}

/*
#gallery_in { 
	background-color: darkblue;
}
*/

/*
	#gallery div {
		width: 33.3vw;
		padding: 3px 3px 3px 3px;
	}
*/

#gallery a {
	margin: 0px;
	padding: 0px;
}

#gallery .img {
	float: left;
	padding: 3px;
}



#gallery img {
	box-shadow: 3px 3px 6px #333;
/*	margin: 3px;	*/
	padding: 0px;
	border: 2px solid #333;
	width: 100%;

	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
}

#gallery span {
	/* display: block; */
	font-family:  sans-serif;
	font-size: 0.7em;
	letter-spacing: 0.9pt;
	height: 1.5em;
}

#gallery span input:not([type=submit]):not([type=file]) {
   background: #888;
   border: 1px solid #333;
   width: 120px;
}

@media only screen and (max-width: 1500px) { 
	#gallery {
		padding: 0 20px;
	}
}


@media only screen and (max-width: 1380px) { 
	#gallery {
		padding: 0 10px;
	}
}


@media only screen and (max-width: 1024px) { 
	#gallery div {
		width: 24%;
	}
}

@media only screen and (max-width: 860px) and (orientation:portrait) { /* IPAD */
/* 	body { background-color: red; } */

	#gallery {
		min-width: 0px; max-width:860px;
		padding: 0 0;
		margin: 5px auto;
		width: 100%;
	}

	#gallery img {
		width: 100%;
		margin: 0px;
		padding: 0px; 
		border: 0px solid #333;

	}
	#gallery div {
		width: 32vw;
/*		padding: 3px 3px 3px 3px;*/
	}


}

@media only screen and (max-width: 860px) and (orientation:landscape) { /* komórki poziomo */
/* 	body { background-color: red; }  */
	#gallery div {
		width: 16.4%;
	}


}

@media only screen and (max-width: 480px) { 
/*	body { background-color: blue; }  */
	#gallery div {
		width: 33%;
	}
}


@media only screen and (max-width: 320px) { 
	#gallery div {
		width: 49%;
	}
}

@media only screen and (max-width: 160px) { 
	#gallery div {
		width: 98%;
	}
}

#gallery div {
	transition:.5s
}



@media only screen and (pointer:fine) {
	#gallery div:hover { z-index: 2; transform:scale(1.3); -webkit-transform:scale(1.3); transition:.2s; -webkit-transition:0.2s;  }
	#gallery a:hover img { box-shadow:0 0 3px 2px #333;  transition:.2s; -webkit-transition:0.2s; }
}




@media only screen and (max-width: 700px) { 
	h1 {
		font-size: 1.2em;
		min-width: calc(100% - 20px); 
		margin: 15px 5% 10px 5px;


	}

	h2 {
		font-size: 0.8em;
		margin: 5px auto 15px 20px;
	}
}