@font-face
 {font-family: existence;
 src: url('fonts/Existence-Light.otf'),
      url('fonts/Existence-Light.PFB'),
      url('fonts/Existence-Light.PFM'),
      url('fonts/Existence-Light.ttf'),
      url('fonts/Existence-StencilLight.otf'),
      url('fonts/Existence-UnicaseLight.otf');
 }
 
 
 
/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
 
.fade-in {
    opacity:0;  /* make things invisible upon start */
    -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;
 
    -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
 
    -webkit-animation-duration:0.3s;
    -moz-animation-duration:0.3s;
    animation-duration:0.3s;
}
 
 
 
.fade-in.one {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
animation-delay: 0.2s;
}
 

 
 
 
 
p {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
body {
	background: url("images/bgr2.jpg") #fff;
	background-repeat: repeat;
	overflow-y: scroll;
}
#wrapper {
	margin: 0 auto;
	margin-top: 50px;
	width: 910px;
}
#top {
	position: relative;
}

#logo {

	background: url('images/logo1.png');
	width: 357px;
	height: 35px;
	float: left;
}
#slogan {
	top: 24px;
	left: 607px;
	font-family: existence; 
	font-size: 10pt;
	letter-spacing: 1px;
	color: #464646;
	position: absolute;
}
#slider {
	margin: 15px 0px 15px 0px;
	width: 810px;
	height: 300px;
	float: left;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}
#menu {
	top: 45px;
	left: 825px;
	width: 100px;
	height: 190px;
	position: absolute;
}	
#menu ul, ul li {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}		
#menu a {
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
}
#menu a:hover {     
	color:#ec008c;
}
#menu a span.gr {     
	font-family: calibri; 
	font-size: 10pt;
	color:#ec008c;
	display: none;
}
#menu a.active span.gr {     
	font-family: calibri; 
	font-size: 10pt;
	color:#ec008c;
	display: inline;
}
#menu a.active {     
	color:#000;
}
/* ............................................................. ikonki */

#ikonki {
	top: 310px;
	margin-left: 825px;
	width: 0px;
	height: 0px;
	position: fixed;
	background: transparent;
}	 
#iko1 a {
	top: 0px;
	left: 0px;
	width: 29px;
	height: 29px;
	position: absolute;
	background: url("images/ico42.png");
	background-repeat: no-repeat;
	    transition: transform .25s ease;
}

#iko1 a:hover {
	background: url("images/ico41.png");
	background-repeat: no-repeat;
	    transform: scale(1.1);
}	 
#iko2 a {
	top: 30px;
	left: 30px;
	width: 29px;
	height: 29px;
	position: absolute;
	background: url("images/ico32.png");
	background-repeat: no-repeat;
	transition: transform .25s ease;
}

#iko2 a:hover {
	background: url("images/ico31.png");
	background-repeat: no-repeat;
		    transform: scale(1.1);
}	
#iko3 a {
	top: 60px;
	left: 0px;
	width: 29px;
	height: 29px;
	position: absolute;
	background: url("images/ico12.png");
	background-repeat: no-repeat;
	transition: transform .25s ease;
}

#iko3 a:hover {
	background: url("images/ico11.png");
	background-repeat: no-repeat;
		    transform: scale(1.1);
}	
#iko4 a {
	top: 60px;
	left: 30px;
	width: 29px;
	height: 29px;
	position: absolute;
	background: url("images/ico22.png");
	background-repeat: no-repeat;
	transition: transform .25s ease;
}

#iko4 a:hover {
	background: url("images/ico21.png");
	background-repeat: no-repeat;
		    transform: scale(1.1);
}	






/* ............................................................. projekty */

/* ............................................................. menu_pro0 */
#menu_pro0 {
	border-style:solid;
	border-width:1px;
	border-left: 0px;
	border-right: 0px;
	border-bottom: 0px;
	padding: 10px 0px 15px 0px;
	margin-bottom: 15px;
	position: relative;
	width: 200px;
	float: left;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
}



#menu_pro0 ul, ul li {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}		
#menu_pro0 a {
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
}
#menu_pro0 a:hover {     
	color:#ec008c;
}
#menu_pro0 a span.gr {     
	font-family: calibri; 
	font-size: 10pt;
	color:#ec008c;
	display: none;
}
#menu_pro0 a.active span.gr {     
	font-family: calibri; 
	font-size: 10pt;
	color:#ec008c;
	display: inline;
}
#menu_pro0 a.active {     
	color:#000;
}	



/* ............................................................. menu_pro1 */
#menu_pro1 {
	border-style:solid;
	border-width:1px;
	border-left: 0px;
	border-right: 0px;
	border-bottom: 0px;
	padding: 10px 0px 15px 0px;
	margin-bottom: 15px;
	width: 200px;
	float: left;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
}



#menu_pro1 ul, ul li {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}		
#menu_pro1 a {
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
}
#menu_pro1 a:hover {     
	color:#ec008c;
}
#menu_pro1 a span.gr {     
	font-family: calibri; 
	font-size: 10pt;
	color:#ec008c;
	display: none;
}
#menu_pro1 a.active span.gr {     
	font-family: calibri; 
	font-size: 10pt;
	color:#ec008c;
	display: inline;
}
#menu_pro1 a.active {     
	color:#000;
}	



/* ............................................................. menu_pro2 */
#menu_pro2 {
	border-style:solid;
	border-width:1px;
	border-left: 0px;
	border-right: 0px;
	border-bottom: 0px;
	padding: 10px 0px 15px 0px;
	margin-bottom: 15px;
	width: 410px;
	float: left;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
}



#menu_pro2 ul, ul li {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}		
#menu_pro2 a {
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
}
#menu_pro2 a:hover {     
	color:#ec008c;
}
#menu_pro2 a span.gr {     
	font-family: calibri; 
	font-size: 10pt;
	color:#ec008c;
	display: none;
}
#menu_pro2 a.active span.gr {     
	font-family: calibri; 
	font-size: 10pt;
	color:#ec008c;
	display: inline;
}
#menu_pro2 a.active {     
	color:#000;
}	
/* ............................................................. disp_pro */

#disp_line {

	position: relative;
	width: 810px;
	height: 1px;
	float: left;
	border-bottom: 1px solid black;
	margin-top: -20px;
}

#disp_pro {
	border-style:solid;
	border-width:1px;
	border-left: 0px;
	border-right: 0px;
	border-bottom: 0px;
	border-top: 0px;
	padding: 15px 0px 15px 0px;
	margin-bottom: 0px;
	margin-top: -20px;
	position: relative;
	width: 825px;
	float: left;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
}

#disp_pro div {
	display: block;
	float: left;
	width: 260px;
	height: 170px;
	margin-right: 15px;
	margin-bottom: 15px;
			}
#disp_pro img {
	display: block;
	float: left;
	width: 260px;
	height: 170px;
	margin-right: 15px;
	margin-bottom: 15px;
			}
#disp_pro  .spantytul {
	display: block;
	float: left;
	width: auto;
	height: 16px;
	padding: 10px 10px 10px 10px !important;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 16px;
	color:#ec008c;
	background: white;
	margin-bottom: 10px;
			}

#disp_pro  .spancaptia {
	display: block;
	float: left;
	width: 260px;
	height: 58px;
	padding: 10px 10px 10px 10px !important;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 12px;
	color:#464646;
	background-color:rgba(255,255,255,0.6);
	margin-bottom: 10px;
			}

			
#disp_pro  .spanwiecej {
	display: block;
	float: left;
	width: 260px;
	height: 16px;
	padding: 10px 10px 10px 10px !important;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 12px;
	color:#ec008c;
	background: white;
	margin-bottom: 0px;
			}

	
/* ............................................................. aktualnosci */
#aktualnosci {
	padding: 0px 0px 0px 0px;
	margin-bottom: 15px;
	position: relative;
	width: 810px;
	height: 170px;
	float: left;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 8pt;
	color:#464646;
	background-color: white;
	-moz-box-shadow: 0 0 5px #888;
 -webkit-box-shadow: 0 0 5px#888;
 box-shadow: 0 0 5px #888;
}	
#aktgrafika {
	width: 510px;
	height: 170px;
}
#akttytul {
	font-size: 12pt;
	color:#464646;
	width: 300px;
	height: 25px;
	position: relative;
	top: 15px;
	left: 525px;
	margin-top: -170px;
}
#aktopis {
	width: 270px;
	height: 115px;
	display: block;
	overflow-y: scroll;
	position: relative;
	padding-right: 5px;
	top: 15px;
	left: 525px;
}
/* ............................................................. o nas */
#onas {
	display: block;
	clear: both;
	width: 810px;
	height: 720px;
	position: relative;
}

#person1 {
	position: relative;
	top: 0px;
	left: 0px;
}	

#person1 #foto {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 170px;
	width: 340px;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}

#person1 #imie {
	position: absolute;
	top: 0px;
	left: 355px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 12pt;
	color:#464646;
	background: white;
	padding: 5px;
}

#person1 #opis1 {
	position: absolute;
	top: 30px;
	left: 355px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#ec008c;
	padding: 5px;
}

#person1 #opis2 {
	position: absolute;
	top: 60px;
	left: 215px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
	padding: 5px;
}

#person2 {
	position: relative;
	top: 175px;
	left: 0px;
}	

#person2 #foto {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 170px;
	width: 340px;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}

#person2 #imie {
	position: absolute;
	top: 0px;
	left: 355px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 12pt;
	color:#464646;
	background: white;
	padding: 5px;
}

#person2 #opis1 {
	position: absolute;
	top: 30px;
	left: 355px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#ec008c;
	padding: 5px;
}

#person2 #opis2 {
	position: absolute;
	top: 60px;
	left: 215px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
	padding: 5px;
}





#person3 {
	position: relative;
	top: 350px;
	left: 0px;
}	

#person3 #foto {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 170px;
	width: 340px;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}

#person3 #imie {
	position: absolute;
	top: 0px;
	left: 355px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 12pt;
	color:#464646;
	background: white;
	padding: 5px;
}

#person3 #opis1 {
	position: absolute;
	top: 30px;
	left: 355px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#ec008c;
	padding: 5px;
}

#person3 #opis2 {
	position: absolute;
	top: 60px;
	left: 215px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
	padding: 5px;
}







#person4 {
	position: relative;
	top: 525px;
	left: 0px;
}	

#person4 #foto {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 170px;
	width: 340px;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}

#person4 #imie {
	position: absolute;
	top: 0px;
	left: 355px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 12pt;
	color:#464646;
	background: white;
	padding: 5px;
}

#person4 #opis1 {
	position: absolute;
	top: 30px;
	left: 355px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#ec008c;
	padding: 5px;
}

#person4 #opis2 {
	position: absolute;
	top: 60px;
	left: 215px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
	padding: 5px;
}


#onasopis {
	position: relative;
	padding: 10px;
	top: 0px;
	left: 558px;
	width: 230px;
	height: 675px;
	background: white;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
	-moz-box-shadow: 0 0 5px #888;
 -webkit-box-shadow: 0 0 5px#888;
 box-shadow: 0 0 5px #888;
}	

#onastytul {
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 12pt;
	color:#ec008c;
	padding-bottom: 15px;
}

#onastxt {
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
	height: 630px;
}












/* ............................................................. oferta */
#oferta {
	display: block;
	clear: both;
	width: 810px;
	height: 720px;
	position: relative;
}

#ofertaf1 {
	position: relative;
	top: 0px;
	left: 470px;
}	

#ofertaf1 #foto {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 170px;
	width: 340px;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}


#ofertaf2 {
	position: relative;
	top: 175px;
	left: 470px;
}	

#ofertaf2 #foto {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 170px;
	width: 340px;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}







#ofertaf3 {
	position: relative;
	top: 350px;
	left: 470px;
}	

#ofertaf3 #foto {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 170px;
	width: 340px;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}








#ofertaf4 {
	position: relative;
	top: 525px;
	left: 470px;
}	

#ofertaf4 #foto {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 170px;
	width: 340px;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}




#ofertaopis {
	position: relative;
	padding: 10px;
	top: 0px;
	left: 0px;
	width: 435px;
	height: 675px;
	background: white;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
	-moz-box-shadow: 0 0 5px #888;
 -webkit-box-shadow: 0 0 5px#888;
 box-shadow: 0 0 5px #888;
}	

#ofertatytul {
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 12pt;
	color:#ec008c;
	padding-bottom: 15px;
}

#ofertatxt {
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
	height: 630px;
}
/* ............................................................. kontakt */
#kontakt {
	padding: 0px 0px 0px 0px;
	margin-bottom: 15px;
	position: relative;
	width: 455px;
	height: 420px;
	float: left;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 8pt;
	color:#464646;
	background-color: white;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}	

#kontakttytul {
position: absolute;
top: 10px;
left: 10px;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 12pt;
	color:#ec008c;
}

#kontaktdane1 {
position: absolute;
top: 50px;
left: 10px;
letter-spacing: 1px;
text-decoration:none;
font-family: existence; 
font-size: 10pt;
color:#464646;
}

#kontaktdane2 {
position: absolute;
top: 50px;
left: 250px;
letter-spacing: 1px;
text-decoration:none;
font-family: existence; 
font-size: 10pt;
color:#464646;
display: none;
}

#mapka {
position: relative;
top: 0px;
left: 470px;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px#888;
	box-shadow: 0 0 5px #888;
}

#kontaktformularz {
position: absolute;
top: 170px;
left: 10px;
letter-spacing: 1px;
text-decoration:none;
font-family: existence; 
font-size: 10pt;
color:#464646;
}

.form {
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#464646;
	width: 360px;
	background-color: fff;
	overflow: hidden;
 }


.button {
    background: #fff;
	letter-spacing: 1px;
	text-decoration:none;
	font-family: existence; 
	font-size: 10pt;
	color:#ec008c;
	border: none;
 }
 
.button:hover {
	color:#464646;
 }
 
textarea {

}
 
 
 
 
 
 
 
 
 


/* ............................................................. footer */
#footer {
	width: 770px;
	height: 60px;
	font-family: existence; 
	font-size: 9pt;
	letter-spacing: 1px;
	color: #464646;
	clear: both;
	}	
#footer a {
	text-decoration: none;
	color: #464646;
	}