.oboksiebie{  
	display: inline-flex;	
    display:-webkit-flex;
	display: -ms-flexbox;
	flex-flow: row wrap;
	justify-content: center; /* Wyrównujemy wszystkie elementy, które są w śrdoku diva do środka :) [Poziomo] */
	align-items: center;  /*// Wyrównujemy wszystkie elementy, które są w śrdoku diva do środka :)[Pionowo] */	
	/*padding: 5% 0px; */
	padding: 0px; 
	/*align-self: flex-start; *//* wyrównanie do góry */
	/*justify-content: space-around;*/
	/*display:flex; (jedno pod drugim)*/
	/*display:inline-flex; (w 1 lini)*/
	/*	
    row - wartość domyślna; elementy wyświetlane od lewej w kolejności takiej jak podana w pliku HTML
    row-reverse - elementy wyrównane do prawej i w odwrotnej kolejności
    column - elementy wyświetlane od góry do doły, w podanej w HTML kolejności
    column-reverse - elementy wyrównane do dołu, w odwrotnej kolejności
    wrap - jeśli brak miejsca, nie mieszczące się w linii elementy przenoszone są kolejnej linii
    nowrap - w tym przypadku nie ma przenoszenia do nowej linii
    wrap-reverse - przenoszenie do nowej linii, a do tego odwrócona kolejność
	align-self:center;
	*/
	
}

#slider {  
  overflow: hidden;
  width:100%;
  height: 200px;
  background: white;
}

#slider ul {
  position: relative;
  margin: 0;
  padding: 0;  
  list-style: none;
  width:100%;
}

#slider ul li {
  position: relative;
  margin: 0;
  padding: 0;
  width:100%;
  height: 180px;  
  text-align: center;
  line-height: 180px;
}



img {border: 0; transition-duration:2s;}
img:hover {
	/*
	margin-left:-5px;
	margin-top:-5px;
	-moz-box-shadow: 0px 0px 10px #888;
	-webkit-box-shadow:  0px 0px 10px #888;
	box-shadow: 0px 0px 10px #888;
	*/
}

body {font-family: tahoma, Arial, Helvetica, sans-serif; background-color: white; color: black; font-size:12px; }

h1 {
font-weight: bold; font-size: 14px; color: black; text-shadow:7px 5px 10px #000000;
}
h2 {
font-size: 14px; text-shadow:7px 5px 8px #000000;
}


#menu {
list-style-type: none;
padding: 0px;
margin: 0px;
-moz-border-radius: 10px;
border-radius: 10px;
width: 100%;
}
.link_menu {
text-decoration: none;
color: white;
font-weight: bold;
font-size: 16px;
}

.menu_opcja:hover {
/*background:RGB(192, 30, 16);*/
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f3c5bd+0,e86c57+52,ea2803+54,ff6600+92,c72200+100 */

font-size: 17px;
}

.menu_opcja {
text-shadow: 1px 1px 1px black;
padding-top:15px;
text-align: center;
height: 35px;
float: left;
min-width:200px;
width: 33.33%;
/* width: 25%;
background: RGB(176, 14, 0);*/

transition-duration:2s;
background: #4169E1;
}



a { text-decoration: none; }
a:hover { text-decoration: underline; }

.przycisk_sklep {
	text-decoration: none;
	font-size:10px;
	padding: 10px 50px;

	-moz-border-radius: 5px;
	border-radius: 5px;
	/*background: RGB(240, 117, 14);*/
	color: white;
	border: 1px solid #ccc;
	font-size: 16px;
	font-weight: bold;

	transition-duration:2s;
	background: #4169E1;
}
.przycisk_sklep:hover {
	text-decoration: none;
	border: 2px solid #ccc;
}

.dniotwarcia {
	color:RGB(176, 14, 0); 
	font-size: 12px;
}
.dniotwarcia:hover {color:red; }

.lideokno{
	height: 100px;
	padding-left:50px; width: 100%; background: white; -moz-border-radius: 10px; border-radius: 10px; border: 1px solid silver;
/*	
	-webkit-box-shadow: 10px 10px 37px -1px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 37px -1px rgba(0,0,0,0.75);
box-shadow: 10px 10px 37px -1px rgba(0,0,0,0.75);
*/
-moz-border-radius: 10px;
border-radius: 10px;


-moz-box-shadow: 0px 0px 10px #888;
-webkit-box-shadow:  0px 0px 10px #888;
box-shadow: 0px 0px 10px #888;
}

#top {
border-bottom-width: 1px; border-bottom-style:solid; border-bottom-color: black;	
font-weight: bold;
font-size: 14px;
text-align: center;
width: 100%; min-height: 30px; left: 0; top: 0; position: absolute;
background:#4169E1;
z-index:2000;
}

#koszyk {
	min-width:200px; width:15%; 
	margin-top: 20px; 
	padding: 10px; 
	background: white; 
}
#rodzaj {
	min-width:200px; width:15%; 
	margin-top: 20px; 
	padding: 10px; 
	background: white; 
}
#produkty{
	margin-top: 20px; 
	padding: 10px; 
	background: white;
	max-width: 60%;
}
.produkt {	 
	 margin: 10px 0px 0px 10px;
}
.img_produkt {
	float: left; width: 30%; max-width: 400px; height: 30%; max-height: 400px; margin:10px;
}
.cena_produkt{
	float: right; width: 240px; margin: 10px 20px;
}
.cena_koszyk{
	float: right; width:50%; margin-bottom: 10px;  text-align: center; min-width:500px;
}
.szcz_produkt{
	float: left; width: 30%; margin: 10px 20px; font-size: 14px;
}
.cena_koszyk_opc{
	float: left; text-align: center; margin:10px; 
}
#account{
 width:48%; float: left; 
}
#address{
 width:48%; float: right; 
}
@media screen and (max-width:995px) {
	#koszyk {display: none; }
	#top_opcja {display: none;}
	#logo {display: none;}
	.img_produkt {
	width: 300px; height: 300px; 
	}
	.szcz_produkt{width: 100%; text-align:left; margin: 15px 0 0 0; margin-left:10%;}
	.cena_koszyk{width: 100%; text-align:center; }
	 .cena_produkt{margin-top: 50px; margin-right: 100px;}
}
@media screen and (max-width:850px) {
	#slideshow {display: none;}	
	.menu_opcja {width: 100%; float: none; }
	/*.img_produkt {width: 90%; height: 90%; margin: 0 auto; float: none; 		*/
	.img_produkt {width: 100px; height: 100px;  margin: 0 auto; float: none;	}
	.cena_produkt{width: 100%; text-align:center;margin: 10px;}
	.szcz_produkt{margin-left:0;}
}
@media screen and (max-width:1450px) {	
	#account, #address {float: none; margin: 0 auto; width: 90%; height: auto;}
}
@media screen and (max-width:600px) {
	.cena_koszyk{min-width:200px;}
	
}
@media screen and (max-width:400px) {
	.cena_koszyk_opc{
		float: none; margin: 0 auto; 
	}
	.cena_produkt{margin-top: 20px; margin-right: 0px;}
}
@media screen and (max-width:1290px) {
	#rodzaj {width: 100%;}
	.menu2on, .menu2off {float: left; min-width: 150px;}
	.parmok, .parmlip {float: left; padding:10px;}  
	#produkty{width: 100%; margin: 15px 0 0 0;}
}


#tresc {
margin:30px; 

padding: 30px;
overflow: hidden;
margin: 0 auto;
min-height: 500px;
/*max-width: 1180px;*/
max-width: 1300px;
position: relative;
background:RGB(238, 238, 238);
-moz-border-radius: 10px;
border-radius: 10px;
width:device-width;

-moz-box-shadow: 0px 0px 10px #888;
-webkit-box-shadow:  0px 0px 10px #888;
box-shadow: 0px 0px 10px #888;
}

#include {
width: 100%;
Padding: 10px; 
margin-top: 20px;
}

.select {
   width: 50px;
   height: 24px;
   overflow: hidden;
   /*background: url(img/select2.jpg) no-repeat right #ddd;*/
   border: 1px solid #ccc;
   -moz-border-radius: 5px;
   border-radius: 5px;
  
background: url("../img/select2.jpg") no-repeat right rgb(221, 221, 221);
background: -moz-linear-gradient(90deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);
background: -webkit-linear-gradient(90deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);
background: -o-linear-gradient(90deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);
background: -ms-linear-gradient(90deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);
background: linear-gradient(180deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);

   }
 .input {
width: 250px;
 height: 34px;
   overflow: hidden;
   /*background: url(img/select2.jpg) no-repeat right #ddd;*/
   border: 1px solid #ccc;
   border-radius: 5px;
   
 background: rgb(221, 221, 221);
background: -moz-linear-gradient(90deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);
background: -webkit-linear-gradient(90deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);
background: -o-linear-gradient(90deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);
background: -ms-linear-gradient(90deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);
background: linear-gradient(180deg, rgb(221, 221, 221) 30%, rgb(205, 205, 205) 70%);

 }

.oferta {
	width: 98%;
	height: 170px;
	margin: 0 auto;
	
	-moz-border-radius: 10px;
border-radius: 10px;
/*background:RGB(247, 247, 247);*/
border: 1px solid #ccc;
 overflow: hidden;
 
 background: rgb(255, 255, 255);
background: -moz-linear-gradient(90deg, rgb(255, 255, 255) 30%, rgb(230, 230, 230) 70%);
background: -webkit-linear-gradient(90deg, rgb(255, 255, 255) 30%, rgb(230, 230, 230) 70%);
background: -o-linear-gradient(90deg, rgb(255, 255, 255) 30%, rgb(230, 230, 230) 70%);
background: -ms-linear-gradient(90deg, rgb(255, 255, 255) 30%, rgb(230, 230, 230) 70%);
background: linear-gradient(180deg, rgb(255, 255, 255) 30%, rgb(230, 230, 230) 70%);

 }
 
  .oferta_foto {
float: left;
width: 150px;
height: 100%;	
background:white;
text-align: center;
}

.linia_pion {
float: left;
width: 1px;
height: 100%;	
background:#ccc;
}
.oferta_opis {
width: 180px;
float: left;
margin: 30px 20px;
color: RGB(0, 104, 188);
font-size: 16px;
overflow: hidden;
}
.oferta_opis2 {
width: 160px;
float: left;
margin: 10px 10px;
color: RGB(176, 14, 0);
font-size: 14px;
overflow: hidden;
}
.oferta_opis3 {
width: 190px;
float: left;
margin: 10px 10px;
font-size: 14px;
overflow: hidden;
}
.oferta_opis4 {
float: left;
margin: 10px 10px;
overflow: hidden;
}
.kup {
padding: 10px 50px;

-moz-border-radius: 5px;
border-radius: 5px;
/*background: RGB(240, 117, 14);*/
color: white;
border: 1px solid #ccc;
font-size: 16px;
font-weight: bold;

transition-duration:2s;
background: #4169E1;
}


/*
 .menu2on, .menu2off {color:black; padding: 10px;}
 .menu2on {background:RGB(238, 238, 238);}
 .menu2off {background:white;} 
 */
 .menu2on, .menu2off {color: black; padding: 10px; margin:3px 0;}
 .menu2on {font-weight:bold;  border-left-width: 2px; border-left-style:solid; border-left-color: orange;}
 .menu2off {border-left-width: 2px; border-left-style:solid; border-left-color: blue;}
  .menu2off:hover {background: #EEEEEE; border-left-color: orange;} 
  
  .submenu2on, .submenu2off {color: black; padding: 7px; margin:3px 3px;}
 .submenu2on {font-weight:bold; border-left-width: 2px; border-left-style:solid; border-left-color: orange;}
 .submenu2off {border-left-width: 2px; border-left-style:solid; border-left-color: blue;}
  .submenu2off:hover {background: #EEEEEE; border-left-color: orange;}
 
 .submenu3on, .submenu3off {color: black; padding: 4px; margin:3px 6px;}
 .submenu3on {font-weight:bold; border-left-width: 2px; border-left-style:solid; border-left-color: orange;}
 .submenu3off {border-left-width: 2px; border-left-style:solid; border-left-color: blue;}
  .submenu3off:hover {background: #EEEEEE; border-left-color: orange;}
 
 .parmok {font-size: 14px; padding-left:10px; color:black;}
 .parmlip {font-size: 14px; padding-left:10px; color:silver;}
 
 .bon {	 width: 70px; height: 70px; }
 .boff { width: 70px; height: 70px; }
 
 .bmenu {
	border: 1px solid #333333;
	background-color: black; 
	border-radius: 5px; 
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); 
	height:42px; 
	width:42px; 
 }
 
 
 