@charset "UTF-8";
body { #background: #F9F9F9; font-family: 'Jura', sans-serif; color: #343434; rgba(0, 106, 14, 0.4) ; background-image: url("../IMG/tlo1.jpg");}

#body1 {position:absolute; float: right; right:0; height: 500px;z-index: -20;}
#targi {width: 200px; height: 700px; left: 0px; top: 85px; position: fixed; float: left;}
#strona {width: 1220px; margin: 0 auto; #background: url('/IMG/baner4.png'); background-repeat:no-repeat; position:relative;}

#yt1 {width: 200px; height: 113px;  float: left; position: relative; margin-top: 50px; margin-left: 260px; border: 1px solid black;}
#yt2 {width: 200px; height: 113px; float: left;  position: relative; margin-top: 50px; margin-left: 30px; border: 1px solid black;}
#yt3 {width: 200px; height: 113px; float: left;  position: relative; margin-top: 50px; margin-left: 30px; border: 1px solid black;}

#fbyou  {width: 50px; height: 104px;  position: fixed; #float: right; margin-top: 35px; right: 0px; }

#jezyk {width: 1000px; #height: 30px; #font-family: 'Gentium Book Basic', sans-serif;font-size:18px;letter-spacing:2px;position:relative;text-align:right;text-shadow: rgba(0, 0, 0, 0.506) 0px 0px 1px, rgba(255, 255, 255, 0.506) 0px 0px 3px; margin-top:10px; left: 100px; float: left; padding-top: 3px;}
#gwiazdor {width: 104px; height: 200px; position: absolute; #left: 90px; margin-top: 280px;float: right; }
#top1 {height: 75px; width: 400px; left: 90px; top: 30px; position:relative; float: left; #background: #F9F9F9;}
#top11 {height: 52px; width: 200px; padding-left: 5px; left: 125px; top: 30px; position:relative; float: left; #background: #F9F9F9;border-left: 1px solid black; color: black;}
#top111 {height: 52px; width: 200px; padding-left: 5px; left: 95px; top: 30px; position:relative; float: left; #background: #F9F9F9; border-left: 1px solid black;}
#top1111 {height: 52px; width: 200px; padding-left: 5px; left: 85px; top: 30px; position:relative; float: left; #background: #F9F9F9; border-left: 1px solid black;}

#top2 {#height: 328px; width: 980px; margin-left: 30px; top: 30px; position:relative;  background: #F9F9F9; float: left;}
#top3 {#height: 328px; width: 1000px; margin-left: 120px; top: 60px; margin-bottom: 20px; position:relative;  #background: #F9F9F9; float: left;}

#menu {width: 1000px; height: 35px; #font-family: 'Jura', sans-serif;font-size:25px;letter-spacing:2px;position:relative;#height:17px;text-align:center;text-shadow: white 1px 1px 3px; margin-top:65px; left: 85px; float: left; #background: #075698; #box-shadow: 3px 3px 8px #182019; font-weight: bold;}
#menu a {color: black;text-decoration:bold;display:block;float:left;padding:5px; float: center;}
#menu a:hover {color:#f0ff00; font-size:35px; text-align:center;} 
#menu a.active {color:F2C80C}
#menu ul {position:relative; left: 35px;#top:45px}
#menu li {float:left;list-style-type:none}
#menu #onas {width:147px} 
#menu #produkty {width:145px}
#menu #usługi {width:140px}
#menu #news {width: 190px;}
#menu #kontakt {width:132px}
#menu #certyfikaty {width:190px}

#slajd {margin-left: 100px; top: 20px;height:500px;width:1000px;overflow:hidden; position:relative; border: 1px solid black; border-radius: 2px; box-shadow: 3px 3px 8px #182019; float: left;}
#slajd #rzecz1 {position:absolute;left:0px;top:0px;z-index:10}
#slajd #opis1 {#left:300px;z-index:15;}
#slajd #rzecz2 {position:absolute;left:1100px;top:0px;z-index:20;left:1100px}
#slajd #opis2 {left:1550px;z-index:25;left:1600px}
#slajd #rzecz3 {position:absolute;left:0px;top:0px;z-index:30;left:1100px}
#slajd #opis3 {left:300px;z-index:35;left:1600px}
#slajd #rzecz4 {position:absolute;left:1100px;top:0px;z-index:40;left:1100px}
#slajd #opis4 {left:1550px;z-index:45;left:1600px}
#slajd #rzecz5 {position:absolute;left:0px;top:0px;z-index:50;left:1100px}
#slajd #opis5 {left:300px;z-index:55;left:1600px}
#slajd #rzecz6 {position:absolute;left:1100px;top:0px;z-index:60;left:1100px}
#slajd #opis6 {left:1550px;z-index:65;left:1600px}

#slajd .opis {position:absolute;font-size:50px;letter-spacing:4px; font-family: 'Jura', sans-serif;line-height:57px;top:420px;height:65px;width:380px;text-align:center;cursor:pointer;color:#fff; text-shadow: rgba(0, 0, 0, 0.506) 0px 0px 2px, rgba(255, 255, 255, 0.506) 0px 0px 3px; background: #003399; #padding-top:17px; box-shadow: 3px 3px 8px #182019;}

#slajd .small {font-family: 'Great Vibes', sans-serif; font-size:12px;letter-spacing:2px}
#slajd .black{color:#000}
#slajd .white{color:#fff}

.sherif {font-family: 'Playfair Display SC', serif;}

#idea {height:auto;text-align:center;font-family: 'Lato', sans-serif;font-size:12px;letter-spacing:2px;line-height:26px;border-bottom:solid 1px #B4E9DF;margin-bottom:10px}
#idea strong {font-size:24px;font-weight:normal;letter-spacing:5px;line-height:40px;position:relative}
#idea p {margin-top:50px}

#content {width:1000px; height: auto; top: 30px; left: 95px; position:relative; border:solid 1px #eee; background: rgba(255, 255, 255, 0.7);	filter: alpha(opacity=50); float: left; padding: 15px;}
#content h1 {font-family: 'Gentium Book Basic', 'Times New Roman', Times, serif;#text-align:center;font-weight:normal;padding:20px;font-size:30px; text-shadow: rgba(0, 0, 0, 0.506) 0px 0px 2px, rgba(255, 255, 255, 0.506) 0px 0px 3px;}
#content h2 {margin:20px 5px 3px 20px; font-family: 'Jura', sans-serif; font-size:20px;}
#content p {margin-left:20px; margin-right: 2px; margin-top: 7px; font-family: 'Jura', sans-serif; font-size:18px; #text-align:justify;}
ppp {margin-left:20px; margin-right: 10px; margin-top: 7px; font-family: 'Jura', sans-serif; font-size:16px; #text-align:justify;}
#content li {margin:5px 25px 5px 35px; font-family: 'Jura', sans-serif; font-size:16px; text-align:justify; text-indent: -13px;}
#content .text {margin:20px;font-family: 'Jura', sans-serif;font-size:18px;padding:10px 30px 30px 60px;#font-weight:300;letter-spacing:0.2px}
#content .text p {margin:20px; font-size:16px; font-family: 'Jura';}				 
#content .text h2 {margin:20px; font-family: 'Gentium Book Basic', sans-serif; font-size:20px}
#content .galeria {margin:20px;background:#fff;padding:10px 60px 20px 60px;text-align:center;margin-top:0px}
#content .galeria a img {margin:2px;margin-top:15px}
pp {text-align: right; font-family: 'Jura', sans-serif; font-size:12px; color: #bc1515;}

#contakt {width:600px; height: auto; top: 30px; left: 95px; position:relative; border:solid 1px #eee; #background: rgba(255, 255, 255, 0.7);	filter: alpha(opacity=50); float: left; padding: 15px; }
#contakt1 {width: 430px; margin-top: 540px; margin-left: 130px; font-family: 'Jura', sans-serif; font-size:28px; float: left; position:relative; color: black; text-align: right;}

#fb {margin-left: 250px;}

#mapa {margin-top:25px; padding: 10px; position:relative; #border:solid 1px #eee; }

#main_picture img {width:1200px;height:450px}

#content .date {font-family: 'Lato', sans-serif;font-size:14px;font-weight:300;text-align:center;margin-top:-5px;font-variant:small-caps}
.pochodzenie {}
.woda {}
.news {}
.perlage {}
.waterwine {}
.kontakt {}


#leads {font-family: 'Lato', sans-serif;width:1050px;margin:auto}
#leads h2 {text-align:center;font-size:12px;letter-spacing:3px;font-weight:normal;padding:15px}
#leads .item {width:320px;overflow:auto;position:relative;float:left;margin:15px;margin-top:0px}
#leads .item img{position:static;width:320px}
#leads .item div {margin:0px}
#leads .item .text {position:relative;width:290px;margin-left:15px;margin-top:-20px;background-color:#fff;overflow:auto;padding-top:0px;margin-bottom:15px}
#leads .item h3 {padding:0px;font-family: 'Playfair Display', serif;text-align:center;margin:15px;font-weight:normal}
#leads .item p {margin:20px;text-align:center;margin-top:30px;color:#777;font-size:12px;letter-spacing:2px;line-height:20px;font-variant:small-caps}
#leads  .n1 {background-color:#f5f5f5}
#leads  .n2 {background-color:#f5f5f5}
#leads  .n3 {background-color:#f5f5f5}

#footer {width: 1000px; color:black; letter-spacing:2px;position:relative;text-align: center; margin-top:45px; left: 100px; float: left; padding: 5px; #box-shadow: 1px 1px 1px #182019; border-top: 1px solid #dbd6d6;  font-size:12px;}

#ffooter {left: 30px; #top: 90px; width: 500px; position:relative; #font-family: 'Gentium Book Basic', sans-serif;font-size:14px;letter-spacing:2px;position:relative;#text-align:center;text-shadow: rgba(0, 0, 0, 0.506) 0px 0px 1px, rgba(255, 255, 255, 0.506) 0px 0px 1px; }

#copyright {width: 1000px; left: 90px; top: 15px; #font-family: 'Gentium Book Basic', sans-serif;font-size:10px;letter-spacing:2px;position:relative; text-align: center; text-shadow: rgba(0, 0, 0, 0.506) 0px 0px 1px, rgba(255, 255, 255, 0.506) 0px 0px 3px; float: left; color: #bc1515; margin-bottom:10px;}

.k1 {width: 250px; height: 350px; border:solid 1px #eee; background: rgba(255, 255, 255, 0.5); filter: alpha(opacity=50); margin: 10px; padding: 15px; #position:relative; float: left; text-align:center; font-size:16px; margin-top: 30px;}
.ik1 img {margin-bottom: 10px; width: 250px; transition: transform 0.5s; margin-top: 15px;}
.ik1 img:hover {transform: scale(1.25); padding: 2px; border:1px solid #ccc; -webkit-box-shadow: 0px 0px 6px 0px #bbb; -moz-box-shadow: 0px 0px 6px 0px #bbb; box-shadow: 0px 0px 6px 0px #bbb; position: relative;}

.k2 {width: 250px; height: 350px; border:solid 1px #eee; background: rgba(255, 255, 255, 0.5); filter: alpha(opacity=50); margin: 15px; padding: 15px; position:relative; float: left; margin-top: 30px;}
.ik2 img {margin-bottom: 10px; width: 250px; transition: transform 0.5s; margin-top: 15px;}
.ik2 img:hover {transform: scale(1.25); padding: 2px; border:1px solid #ccc; -webkit-box-shadow: 0px 0px 6px 0px #bbb; -moz-box-shadow: 0px 0px 6px 0px #bbb; box-shadow: 0px 0px 6px 0px #bbb; position: relative;}

#scroll {width: 500px; #height: 260px; position:relative; float: left;}
#scroll1 {width: 960px; height: 260px; position:relative; float: left; margin-left: 20px; top:10px; bottom:10px;}
#scroll2 {width: 960px; height: 370px; position:relative; float: left; margin-left: 20px; top:10px; bottom:10px;}
#scrollopis {width: 480px; #height: 260px; position:relative; float: left; #margin-top: 5px; text-align: right; left: 20px;}
#ss {top: 20px; position:relative; float: left; padding-bottom: 10px;}

le
#makeMeScrollable
		{
			width:100%;
			#height: 250px;
			position: relative;
			margin:5px;
		}
		
		
#makeMeScrollable div.scrollableArea img
		{
			position: relative;
			float: left;
			margin-left: 5px;
			padding: 0;
			-webkit-user-select: none;
			-khtml-user-select: none;
			-moz-user-select: none;
			-o-user-select: none;
			user-select: none;
		}

* {
	margin: 0;
	padding: 0;
}

body {
	
}

a{
	color: black;
	text-decoration: none;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}
	aa:hover,
	aa.selected {
		color: #0C0D0C;
	}

h11,h22,h44,h55,h66 {
	text-align: center;
	color: #ccc;
	text-shadow: #000 1px 1px 2px;
	margin-bottom: 5px;
}
	h11 {
		font-size: 18px;
	}
	h22 {
		font-size: 14px;
	}
.sociales {
	text-align: center;
	margin-bottom: 20px;
}

	#timeline {
		width: 900px;
		#height: 850px;
		overflow: hidden;
		#margin-top: 20px;
		margin-left: 100px;
		margin-bottom: 15px; 
		position: relative;
		background: url('../images/dot.gif') left 100px repeat-x;
	}
		#dates {
			width: 800px;
			height: 120px;
			overflow: hidden;
			}
			
			#dates li {
				list-style: none;
				margin-top: 5px;
				float: left;
				width: 130px;
				height: 100px;
				font-size: 24px;
				text-align: center;
				text-shadow: rgba(0, 0, 0, 0.506) 0px 0px 2px, rgba(255, 255, 255, 0.506) 0px 0px 3px;
				background: url('../images/biggerdot.png') center bottom no-repeat;
			}
				#dates a {
					line-height: 38px;
					padding-bottom: 10px;
					color: #0C0D0C;
				}
				#dates .selected {
			        font-size: 38px;
					color: #FFCC00;
					text-shadow: #000 1px 1px 2px;
				}
				
		#issues {
			width: 900px;
			#height: 550px;
			overflow: hidden;
		}	
			#issues li {
				width: 900px;
				#height: 550px;
				list-style: none;
				float: left;
			}
				#issues li.selected img {
					-webkit-transform: scale(1.1,1.1);
					-moz-transform: scale(1.1,1.1);
				    -o-transform: scale(1.1,1.1);
				    -ms-transform: scale(1.1,1.1);
				    transform: scale(1.1,1.1);
				}
				#issues li img {
					float: left;
					margin: 30px 30px 20px 50px;
					background: transparent;
					-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE 8 */   
					filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);/* IE 6 & 7 */      
					zoom: 1;
					-webkit-transition: all 2s ease-in-out;
					-moz-transition: all 2s ease-in-out;
					-o-transition: all 2s ease-in-out;
					-ms-transition: all 2s ease-in-out; 
					transition: all 2s ease-in-out;
					-webkit-transform: scale(0.7,0.7);
					-moz-transform: scale(0.7,0.7);
				    -o-transform: scale(0.7,0.7);
				    -ms-transform: scale(0.7,0.7);
				    transform: scale(0.7,0.7);
				}
				#issues li h1 {
					color: #ffcc00;
					font-size: 48px;
					#margin-top: 120px;
					text-shadow: #000 1px 1px 2px;
				}
				#issues li p {
					font-size: 17px;
					margin-right: 10px;
					font-weight: normal;
					line-height: 22px;
					text-shadow: #000 1px 1px 2px;
				}
		
		#grad_left,
		#grad_right {
			width: 100px;
			height: 350px;
			position: absolute;
			top: 0;
		}
			#grad_left {
		        left: 0;
		        background: url('../images/grad_left.png') repeat-y;
			}
			#grad_right {
		        right: 0;
		        background: url('../images/grad_right.png') repeat-y;
			}
		
		#next,
		#prev {
			position: absolute;
			top: 0;
			font-size: 70px;
			top: 330px;
			width: 22px;
			height: 38px;
			background-position: 0 0;
			background-repeat: no-repeat;
			text-indent: -9999px;
			overflow: hidden;
		}
			#next:hover,
			#prev:hover {
				background-position: 0 -76px;
			}
			#next {
				right: 0;
				background-image: url('../images/next.png');
			}
			#prev {
				left: 0;
				background-image: url('../images/prev.png');
			}
				#next.disabled,
				#prev.disabled {
					opacity: 0.2;
				}
				
				
				
#images{
    margin-left: 60px;
	margin-bottom: 25px;
}
#images img{
    float: left;
    #height:100px;
    margin:5px;
    padding:0px;
}
#ibox{
    position:absolute;
    overflow-y:none;
    background:#fff;
    border:1px solid #ccc;
    z-index:1001;
    display:none;
    padding:4px;
	-webkit-box-shadow: 0px 0px 6px 0px #bbb;
    -moz-box-shadow: 0px 0px 6px 0px #bbb;
    box-shadow: 0px 0px 6px 0px #bbb;
}
#ibox img{
    border:1px solid #444;
}
#ibox br{
    clear:both;
}