
#contgal {
	position: absolute;
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
//	overflow: hidden;	
	height: 100%;
	width: 100%;
	left: 0; top: 0;
	background-color:  ; 
}
#contphot {
	position: relative;
	display: block;
	height: 100%;
	width: 100%;
	-webkit-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
	background-color:  ; 
}

.cont-fotka {
	position: absolute;
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
	z-index: 0;
	height: 100%;
	width: 100%;
	opacity: 0.0;
	transition: opacity 1.0s ; 
	-webkit-transition: opacity 1.0s ; 
	-moz-transition: opacity 1.0s ; 
	-o-transition: opacity 1.0s ; 
	-ms-transition: opacity 1.0s ; 
	background-color:  ; 
}
.fotka {
	position: absolute;
	display: inline-block;
	max-height: calc(100% - 32px);
	max-width: 100%;
	top: calc(0px - 32px);
	bottom: 0px; 
	left: 0px; 
	right: 0px;
	margin: auto;
	background-color: ; 
}
.opis{
	position: absolute;
	display: inline-block;
	bottom: 0px;	
	left: 0px; right: 0px;
	min-height: 1%;
	padding: 3px 3px 4px 3px;
	max-width: 100%;
	text-align: center;
	text-shadow: 1px 1px 1px black;
	color: rgb(190,190,190);
	font-size: 12px;
	background-color: rgba(0,0,0,0.3);
}
.cont-pkt {
	z-index: 10;
	-webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;	
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
	margin: 3px 0 -6px 0;
	width: 100%;
	background-color:  ; 
}
.pkt {
	display: block;
	float: left;
	z-index: 11;
	cursor: pointer;
	border-style: solid;
	border-width: 0px;
	border-color: black;
	height: 12px;
	width: 12px;	
	margin: 1px 1px 1px 1px ;
	background-color: rgb(15,15,15);
}

.pkt:hover {
	background-color: rgb(40,40,40);
}
.move-L, .move-R {
	display: block;
	position: absolute;
	top: 0px;
	width: 30%;
	height: 100%;
	z-index: 6;
	opacity: 0;
	cursor: pointer;
	transition: opacity 1s ;
	-webkit-transition: opacity 1s ;
	-moz-transition: opacity 1s ;
	-o-transition: opacity 1s ;
	-ms-transition: opacity 1s ;
	}
.move-L { left: 0px; }
.move-R { right: 0px; }

#contgal:hover .cont-fotka .move-L ,
#contgal:hover .cont-fotka .move-R { 
	opacity: 0.8;
	transition: opacity 1s ;
	-webkit-transition: opacity 1s ;
	-moz-transition: opacity 1s ;
	-o-transition: opacity 1s ;
	-ms-transition: opacity 1s ;
}
.move-L:hover .arrow-L {
	border-color: transparent RGB(255,255,255) transparent transparent;
	_border-color: #000000 #ffffff #000000 #000000;
}
.move-R:hover .arrow-R {
	border-color: transparent transparent transparent RGB(255,255,255);
	_border-color: #000000 #000000 #000000 #ffffff;
}
.arrow-L, .arrow-R {
	position: absolute;
	top: 50%;
	top: calc(50% - 20px);
	width: 0;
	height: 0;
	border-style: solid;
	line-height: 0px;
	_filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000');
}
.arrow-L {
	border-width: 20px 14px 20px 0;
	border-color: transparent RGB(180,180,180) transparent transparent;
	_border-color: #000000 #969696 #000000 #000000;
}
.arrow-R {
	right: 0;
	border-width: 20px 0 20px 14px;
	border-color: transparent transparent transparent RGB(180,180,180);
	_border-color: #000000 #000000 #000000 #969696;
}
input {
	display: none;
}
input#sla1:checked ~ #contgal #fot1,
input#sla2:checked ~ #contgal #fot2,
input#sla3:checked ~ #contgal #fot3,
input#sla4:checked ~ #contgal #fot4,
input#sla5:checked ~ #contgal #fot5,
input#sla6:checked ~ #contgal #fot6,
input#sla7:checked ~ #contgal #fot7,
input#sla8:checked ~ #contgal #fot8 {
	z-index: 5;
	opacity: 1.0;
	transition: opacity 1.0s ; 
	-webkit-transition: opacity 1.0s ; 
	-moz-transition: opacity 1.0s ; 
	-o-transition: opacity 1.0s ; 
	-ms-transition: opacity 1.0s ; 
}
input#sla1:checked ~ #contgal .cont-pkt label#pkt1,
input#sla2:checked ~ #contgal .cont-pkt label#pkt2,
input#sla3:checked ~ #contgal .cont-pkt label#pkt3,
input#sla4:checked ~ #contgal .cont-pkt label#pkt4,
input#sla5:checked ~ #contgal .cont-pkt label#pkt5,
input#sla6:checked ~ #contgal .cont-pkt label#pkt6,
input#sla7:checked ~ #contgal .cont-pkt label#pkt7,
input#sla8:checked ~ #contgal .cont-pkt label#pkt8 {
	background-color: rgb(80,80,80);
}

/*   --------------   Podstrony poza galeriami -----------------------   */
/*   --------------   INTRO   ----------------   */
		
	.fotka { max-height: 100%; top: 0px; }
	.move-L, .move-R , .cont-pkt { display: none; }
	#contgal { overflow: visible;	}
	.opis { left: 0px; right: auto;	bottom: -42px; font-size: 26px;}
	#navig { width: 290px;}
	@media all and (max-width: 933px) {.opis {font-size: 22px;}}

</style>