/* Reset
------------------------------------------------------------ */
@font-face
{
font-family:Rr;
src: url(../../fonts/Raleway-Regular.ttf);
}
@font-face
{
font-family:Rb;
src: url(../../fonts/Raleway-Bold.ttf);
}
@font-face
{
font-family:Ri;
src: url(../../fonts/Raleway-Italic.ttf);
}
@font-face
{
font-family:Rbi;
src: url(../../fonts/Raleway-BoldItalic.ttf);
}
@font-face
{
font-family:Rl;
src: url(../../fonts/Raleway-Light.ttf);
}
@font-face
{
font-family:Rli;
src: url(../../fonts/Raleway-LightItalic.ttf);
}

* { margin: 0; padding: 0; }
html { overflow-y: scroll;}
body { 
background:#fcfcfc; 
font-family:"Century Gothic",Rr;	
min-height: 100vh;
display: flex;
flex-direction: column;
font-size:18px;
}
ol, ul { list-style: none; margin: 0;}
ul li { margin: auto; padding: auto; font-family:"Century Gothic",Rr;}
a, img { outline: none; border:none; color: #000;text-decoration:none;}
p { margin:10px 0; line-height: 24px;color:#404246;}
img { display: block;}
p img {width:100%;}
.r {float:right;}
.l {float:left;}	
.trzytrzecie  td{width:32%;vertical-align:middle;}
.trzytrzecie img {width:98%;}
#wrapper {
	position:relative;
	width: 100%;	
	padding:auto;
	height:auto;
	flex: 1;
	} 
#header{
	position:relative;
    display: block;
	}
#header{position:relative;margin:auto;max-width:90%;height:280px;}

.footer{
   padding: 20px 0;
   display:inline-block;
   height:auto;
   min-height:100px;
   color:#e01020;
   background-color:#eee;
}
.footer p {display:inline;margin:auto;padding:auto;}
.footer #f_left {width:48%;display:inline-block;float:left;text-align:right;padding:0 1% 0 0;border-right:1px dotted #999;}
.footLogo {background:url('../../gfx/logoS.png') no-repeat center center;width:200px;height:100px;display:block;margin-left:4%;}
.footer #f_txt_big_l {font-size:29px;}
.footer p {text-transform:uppercase;font-size:14px;}
.footer #f_right {width:48%;display:inline-block;text-align:left;padding:0 0 0 1%}
.footer #f_right b{font-size:14px;}	

a.infos h1  {
 letter-spacing:1px;font-size: 18px;color:#e01020;
  border-radius:5px;
  opacity:1;
  position:relative;
  -webkit-transition: all 0.5s;
  -moz-transition:  all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition:  all 0.5s;
  transition:  all 0.5s;
}
a.infos:hover h1  {color:#902;opacity:0.9; }
	

/* Logo H1 */
#logo {
	float:left;
	width:220px;
	height:220px;
	background:url("../../gfx/logoM.png") no-repeat center center;
	margin:1%;
	box-shadow:0px 0px 12px #fff,inset 0px 0px 20px #ddd;
	border-radius:2px;
	-webkit-transition: all 0.5s;
	  -moz-transition:  all 0.5s;
	  -ms-transition: all 0.5s;
	  -o-transition:  all 0.5s;
	  transition:  all 0.5s;
	}
	
#logo:hover{
	box-shadow:0px 0px 12px #bbb;
	}	
/* Nav */
#nav {
	position:relative;
	width:70%;
	display:block;
	margin:auto;
	padding:100px 0 0 0;
    /*transform: translateY(-140px); */
	text-align:center;
	}
	
#nav li {
	display: inline-block;
	padding:4px 16px;
	font-size:1.5em;
	-webkit-transition: all 0.5s;
	-moz-transition:  all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition:  all 0.5s;
	transition:  all 0.5s;
	}
 #nav li a {color:#444; 
		-webkit-transition: all 0.5s;
		-moz-transition:  all 0.5s;
		-ms-transition: all 0.5s;
		-o-transition:  all 0.5s;
		transition:  all 0.5s;
		
		
  }
#nav li  a:hover  {color:#e01020;}
#nav li.r1 a:hover  {
	color:#e01020;
	padding:0px 16px;
	}
.gapR {border-right:1px dotted #bbb;}
.gapL {border-left:1px dotted #bbb;}
.icon {display:none;}
#langdiv{
	position:absolute;
	right:2px;top:2px;
	width:5%;
	display:block;
	height:20px;
}
#langdiv p {color:#999;font-size:14px;display:inline;}
#langdiv p.act {color:#31f;font-size:14px;display:inline;}


#skipTo {
	display: none;
	}
	#skipTo li {
		background: #b1fffc;
		}

/* Banner */			
#banner {
	display:block;
	width: 100%;
	height:auto;
	}
/*===== BLOCK ===*/
#block {
	overflow:hidden;
	position:relative;
	margin:0 11%;padding:2px;
	text-align:justify;
	height:auto;
	padding-bottom:auto;
	}


#block h1 {position:relative;width:auto;padding:10px;margin:10px 0;font-size:40px;color:#b0b8b4;border-bottom:2px solid #989e9b;font-weight:normal;}
#block h2 {position:relative;width:auto;padding:10px;margin:10px 0;font-size:34px;color:#b0b8b4;border-bottom:2px solid #989e9b;font-weight:normal;}
#block h3 {position:relative;width:auto;padding:10px;margin:10px 0;font-size:26px;color:#b0b8b4;border-bottom:2px solid #989e9b;font-weight:normal;}
#block h2.title {border-top:4px solid #989e9b;}


#txtcont {float:right;width:84%;}
.lead {height:auto;padding:1%;}
.lead p {line-height:24px;font-size:22px;}
.text{height:auto;font-size:18px;padding:1%;}
.text p {line-height:24px;}
.text ul {margin-left:3%;}
.text li {line-height:28px;}
.brd-r {border-right:1px dotted #d0d2d4;}
.brd-l {border-left:1px dotted #d0d2d4;}

#block .tyt{
	display:block;
	padding:10px;
	margin:4px 0;
	color:#505256;
	font-size:28px;
	letter-spacing:2px;
	text-align:left;
	border-top:1px solid #b0b2b4;
	}
#block .tyt:hover {
color:#e01020;
}	
#block .artcont {overflow:hidden;display:block;margin:8px 0px;padding:4px;}


/*===== eot BLOCK ===*/
#nav .icon{display:none;width:100%;height:24px;border:1px solid #555;}	
#nav ul {margin-bottom:20px;}	
	
	
/* =============================================================================== */
/*=====  GALERIA  ===*/

.container_gal{display:inline-block;text-align:center;width:100%;}

.img-crop{
	display:inline-block;
    overflow: hidden;
    margin: auto;
    position: relative;
	margin:-1px 1px;
	opacity:1;
	-webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-ms-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
}

.kaf{

    width: 298px;
    height: 298px;
    
}

.big {
min-width: 100%;
height: 480px;
}

.img-crop img{
    position: absolute;
    margin: auto; 
    min-height: 100%;
    min-width: 100%;
	
    /* For the following settings we set 100%, but it can be higher if needed 
    See the answer's update */
    left: -100%;
    right: -100%;
    top: -100%;
    bottom: -100%;
	
	-moz-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s;
}
.img-crop:hover {opacity:0.6; zoom: 1;}
.img-crop:hover img {
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  }
#filtr {
	 background: #323438 none repeat scroll 0 0;

    font-size: 1.3em;
    height: auto;
    margin: 10px 0;
    padding: 10px 0;
    position: relative;
    text-align: left;
    width: auto;
	border-bottom:1px solid #aaa;
	}
	#filtr a {padding:4px 10px;color: #909294;}
	#filtr a:hover {color: #e30;}
	#filtr a.act {color: #e30;}

.fixme {
width:100%;
z-index:100;
}
/*======================================================*/
					/* TABELKI */
/*======================================================*/
table {width:100%;}
tr,td {vertical-align:top;}
td p{margin-left:2%;line-height:18px;}
td img {margin:6%;}

.td_img {width:20%;}
.td_img  img{width:95%;}
.td_txt {max-width:78%;}


/*=================================================================================================*/
/*=================================================================================================*/
/*=================================================================================================*/
/*=================================================================================================*/

/* Media Queries */
@media screen and (max-width: 640px) {
	#header {
    height: 90px;
	position: relative;
	max-width: 98%;
	}
	#skipTo {
		display: block;
		}
	#block {
	overflow:hidden;
	position:relative;
	margin:1% 2%;padding:2px;
	text-align:justify;
	min-height:50px;
	}
	#block .tyt{
	font-size:1em;
	}
	#nav {
		padding:1px;
		margin:1px;
	}

	.icon {
		position:absolute;
		display:block;
		width:80px;
		height:80px;
		bottom:0;
		right:0;
		text-indent: -9999px;
		background: url("../../gfx/menuico.svg");
		background-position-x: center;
		background-position-y: center;
	}

	#header #nav, #main, #aside {
		float: left;
		clear: left;
		margin: 0 0 10px; 
		width: 100%;
		}
	
	#nav ul {display:none;margin-bottom:2px;}
	
	#header #nav li {
			margin: 0;
			display: block;
			margin-bottom: 5px;
			box-shadow:inset 0px 0px 20px #eee;
			background-color:none;
			font-size: 1.3em;
			}
	#header #nav a {
				display: block;
				padding: 6px;
				text-align: center;
				font-weight:strong;
				color:#687;
			/*	border-bottom:1px dotted #999; */
				}
	#header #nav li a	{color:#666;border:none;}
	
	#header h1 {
					height: 40px;
					width: 96%;

					text-align:center;
					display: block;
					font-size:28px;
					color:#eee;
					text-shadow:0 0 4px #777;
					letter-spacing:5px;
					}
	.gapR {border-right:none;}
	.gapL {border-left:none;}
	.lead {width:100%;}
	.lead p {line-height:16px;font-size:14px;display:block;}
	.text{width:100%;height:auto;font-size:12px;padding:1%;border:none;}
	.text p {line-height:14px;}
	
	
	#logo {
			display:inline;
			width:166px;
			height:96px;
			background:url("../../gfx/logoS.png") no-repeat center center;
			margin:auto;
			padding:auto;
			text-align:center;
			margin:4px;
		}
		
	#filtr {
	background: #424446 none repeat scroll 0 0;
    font-size: 0.7em;
    height: auto;
    margin: 6px 0;
    padding: 6px 0;
    position: relative;
    text-align: left;
    width: auto;
	}
	#filtr a {padding:2px 1%;color: #b0b2b4;}
	
	#txtcont {clear:both; width:100%;}
	
	/*.footer {width:89%;}*/
	.footer #f_txt_big_l {font-size:19px;}
	.footer p {text-transform:uppercase;font-size:10px;}	
	.footer #f_right b{font-size:10px;}
	.footLogo {background:url('../../gfx/logoS.jpg') no-repeat center center;width:125px;height:100px;display:block;margin-left:6s%;}
}




/*=================================================================================================*/
/*=================================================================================================*/
/*=================================================================================================*/
/*=================================================================================================*/



@media screen and (min-width: 640px) and (max-width: 1024px) {
	#header {
    height: 140px;
	position: relative;
	}
	
	#block {
	overflow:hidden;
	position:relative;
	margin:1% 2%;padding:2px;
	text-align:justify;
	min-height:50px;
	}
	
	#logo {
		float:left;
		width:100px;
		height:122px;
		background:url("../../gfx/logoM.png") no-repeat center bottom;
		margin:1%;
	}
	
	#nav {
	width:75%;
	padding:40px 0 0 0;
    /*transform: translateY(-140px); */
	text-align:center;
	}
	
	#nav li {
		padding:0 14px;
		font-size:1.2em;
		-webkit-transition: all 0.5s;
		-moz-transition:  all 0.5s;
		-ms-transition: all 0.5s;
		-o-transition:  all 0.5s;
		transition:  all 0.5s;
	}
	
	#filtr {
	 background: #424446 none repeat scroll 0 0;
    font-size: 0.7em;
    height: auto;
    margin: 6px 0;
    padding: 6px 0;
    position: relative;
    text-align: left;
    width: auto;
	}
	#filtr a {padding:2px 1%;color: #b0b2b4;}
	/*.footer {width:89%;}*/
	.footer #f_txt_big_l {font-size:19px;}
	.footer p {text-transform:uppercase;font-size:10px;}	
	.footer #f_right b{font-size:10px;}

}