@import url('https://fonts.googleapis.com/css?family=Baloo+Thambi|Exo+2|Notable|Raleway|Bad+Script|Titillium+Web:200i,900|Varela+Round|Work+Sans:300');
.napis_logo{font-family: 'Varela Round', sans-serif; position: relative; top: 10%; 
font-weight: 700;}
.rej_log{font-family: 'Exo 2', sans-serif; font-size: 15px;}
.shop_bag{width:20px; height:20px;}
.mega_promocja{font-family: 'Titillium Web', sans-serif;}
#shopping_bag_span{position: relative;text-align:right; top: 0; font-family: 'Exo 2';
 margin-right: 2%;}
#calosc{ width:96%; position: absolute; top: 1%; left:2%;right:2%;}
#naglowek{position: relative; top: 50%; }
#kontener{position: relative;  height: auto;}
#kontener_produkt_lewy{position: relative;   width: 18%; height: 800px; float:left;
  padding:0; margin: 0; font-size: 10px; text-align: left; margin-left:0;}
#kontener_produkt_lewy div {position: relative; left: 0; margin-left:0px; font-family: 'Notable';
 font-size:15px;}
#podgrupra_produkt_prawy{width: 40%; float: left; border: 1px solid red; height: 300px; 
padding: 10px;
margin-top: 10px; background-color: black; opacity: 0.6;  margin-left: 30px; 
color: white; text-align: center; font-family:'Exo 2'; font-size: 30px; font-weight: 600;}

#podgrupra_produkt_prawy_dwa{width: 40%; float: left; border: 1px solid red; height: 300px;
 padding: 10px;
margin-top: 10px; background-color: black; opacity: 0.7; z-index:50; margin-left: 30px;
color: white; text-align: center; font-family:'Exo 2'; font-size: 30px; font-weight: 600;}

#podgrupra_produkt_prawy_trzy{width: 40%; float: left; border: 1px solid red; height: 300px; padding: 10px;
margin-top: 10px; background-color: black; opacity: 0.7; z-index:50; margin-left: 30px;
color: white; text-align: center; font-family:'Exo 2'; font-size: 30px; font-weight: 600;}

#podgrupra_produkt_prawy_cztery{ width: 40%; float: left; border: 1px solid red; height: 300px; padding: 10px;
margin-top: 10px; background-color: black; opacity: 0.7; z-index:50; margin-left: 30px;
color: white; text-align: center; font-family:'Exo 2'; font-size: 30px; font-weight: 600;}


#kontener_produkt_prawy img { height: 200px; }
#ramka_img{background-color: silver; border-radus:3px; text-align: center; }

#promocja{position: relative; height:600px;  text-align: center; width: 100%;}
#promocja_lewy{ position: relative;   width: 49%; height: 480px; float:left; 
}
#zdjecie_promocja_lewy{ position: relative;  height: 450px; float: left; width: 45%;
}
#opis_promocja_lewy{position: relative;float:right;height: 450px; width: 45%; 
 font-family: 'Work Sans', sans-serif; font-size: 20px; font-weight: 800;
text-align: center; border-right: .02em solid silver; }
.rabat_50{border: 2px solid blue; width: 50px; height: 50px; border-radius: 10px; background-color: blue; padding: 10px; position: relative; top: 50px; text-align: center; color :white;}
.koszyk_promocja{border: 2px solid green; width: 50px; height: 50px; border-radius: 10px; background-color: green; padding: 10px; position: relative; top: 130px; text-align: center; color :white;}

.nowa_cena{font-family:'Raleway'; font-size: 40px; font-weight: 800; position: relative; top: 90px; text-align: center;}
.stara_cena{font-family:'Raleway'; font-size: 30px;  position: relative; top: 100px; text-align: center; color: red; font-size: 20px;}
.cecha_produktu{position: relative; top: 160px; font-family: 'Exo 2'; font-size: 15px;}
#promocja li{list-style-type: circle; font-family: 'Raleway'; font-size: 12px; }
#promocja_prawy{position: relative;   width: 49%; height: 480px; float:right; 
float:left; }

#zdjecie_promocja_prawy{ position: relative;  height: 450px; float: left; width: 45%;
}
#opis_promocja_prawy{position: relative;float:right;height: 450px; width: 45%; 
 font-family: 'Work Sans', sans-serif; font-size: 20px; font-weight: 800;
text-align: center;}




#kontener_produkt_prawy{position: relative; width: 80%; height: auto;  float: right; 
  }

#stopka{  height: 500px; 
background-color: black; opacity: 0.6; font-family: 'Varela Round' text-align: center;}
#naglowek{font-family: 'Baloo Thambi', cursive; font-size: 30px; height: 200px; }
#naglowek_kontakt{position: absolute; right: 2%; top: 12%;}
.fa-phone-square{font-size: 30px;}
.fa-envelope{font-size: 30px;}
.logo_napis{font-family: 'Notable', font-weight: 800; font-size: 40px; sans-serif;}
.napis_2_czlon{font-family: 'Notable', font-size: 40px; font-weight: 800; 
color: blue;sans-serif;}
#szukajka{position: absolute; left: 40%; bottom:20%;}
input {height: 50px; font-family:'Varela Round', sans-serif; font-size: 48px; }
#szukajka img {width:40px; height: 40px;}
ul{font-size: 30px; font-family: 'Notable'; padding-bottom: 20px; text-align: left;}
li{font-size: 30px; font-family: 'Raleway'; padding: 10px; list-style-type: none; padding: 10px; }
li:hover{font-size: 30px; font-family: 'Raleway'; padding: 10px; 
list-style-type: square; cursor:pointer; font-weight: 600; color: blue;}
.drugi_czlon{font-family: 'Bad Script'; font-size: 50px; font-weight: 500;}
#stopka_linki{position: absolute; bottom: 10px; left: 10%; height: 80px; 
width: 80%; border-radius: 5px; background-color: silver; text-align: center; 
align: center; font-family:'Bad Script'; font-size: 20px; color: black; padding: 10px;}

 #social{position: relative; left: -45%; height: 250px; width: 45%; border-radius: 5px;
 background-color: silver;border:1px solid black; font-size: 20px; font-family:'Baloo Thambi'; 
 color: black; top: 10%; text-align: right; padding-rtop: 30px; padding-right: 30px; float: right; font-size: 10px; }
 
 #newsletter{position: relative; left: 65%; height: 250px; width: 25%; border-radius: 5px;
 background-color: silver;border:1px solid black; font-size: 20px; font-family:'Baloo Thambi'; 
 top: 10%; text-align: right; padding-right: 30px; color: black; float: left;  }
 #social input{height: 30px;}
 #social input {font-size: 20px;}
 
 .active{font-size: 30px; font-family: 'Raleway'; padding: 10px; 
list-style-type: square; font-weight: 600; color: green;}
#rejestracja_box{position: absolute; top: 6%; left: 10%; width:80%; 
background-color: white; z-index:70; height: 400px; border: 4px solid black; border-radius:5px;
display:none;}
#close_rejestracja_box{position: absolute; top:5px; right: 5px; width:30px; height:30px; 
text-align: center; }
#close_rejestracja_box:hover{cursor:pointer;   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
#close_rejestracja_box img {width:30px; height: 30px; text-align: center; margin-right: 5px;}
#kolumna_1_rejestracja {background-color: silver; width: 25%; height:97%; text-align: right; padding-right:5px; 
position: relative; left: 5px; float: left; top:5px; font-family: 'Exo 2';}
#kolumna_1_rejestracja input {font-size: 16px; height: 30px;}
#kolumna_2_rejestracja {background-color: silver; width: 40%; height:97%; 
text-align: right; padding-right:5px; opacity:0.3;
position: relative; top:5px; float: left; font-family: 'Exo 2';}
#kolumna_2_rejestracja input {font-size: 16px; height: 30px;}
#kolumna_3_rejestracja {background-color: ; width: 30%; height:97%; 
text-align: right; padding-right:5px; 
position: relative; top:5px; float: left; font-family: 'Exo 2';}
#kolumna_3_rejestracja input {font-size: 16px; height: 30px;}
#kolumna_3_rejestracja img {width: 50px; height: 50px; display:none;}
.logo1{font-size: 30px; font-family:'Baloo Thambi'; padding: 10px; border:1px solid blue;}
.logo2{font-size: 30px; font-family:'Baloo Thambi'; background-color: blue; padding: 10px; color: white;}
#dol_logo{position: absolute; bottom:55px; right:15px; margin:0; height:40px;}
#potwierdz_kod{background-color: green;  color: white; padding: 20px; 
text-align: center; border-radius: 5px; width: 50%; position : relative; left: 40%; top: 1%;
}
.register_ok{ background-color: silver; padding:20px; border:2px solid white; 
border-radius:5px; position: relative; top:20px; display:none;}

#komunikat_rejestracja_ok img {height: 50px; wight:50px; display: none;}
#komunikat_rejestracja_bad img {height: 50px; wight:50px; display:none;}
.register_bad{ background-color: red; padding:20px; border:2px solid white; 
border-radius:5px; position: relative; color: white;  top:-10px; display: none; }

.komunikaty_register{background-color: gold; padding : 8px; border-radius: 5px; 
color : black; position: relative; bottom:-20px; display:none;}

#potwierdz_kod{cursor:pointer;}
.register_ok:hover{cursor:pointer;}

#logowanie_box{position: absolute; top: 6%; right: 2%; width:30%; 
background-color: white; z-index:70; height: 400px; border: 4px solid black; border-radius:5px;
display:none; padding: 10px;}
#close_logowanie_box{position: absolute; top:5px; right: 5px; width:30px; height:30px; 
text-align: center; }
#close_logowanie_box:hover{cursor:pointer;   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
#close_logowanie_box img {width:30px; height: 30px; text-align: center; margin-right: 5px;}

#loguj{background-color: green;  color: white; padding: 20px; 
text-align: center; border-radius: 5px; width: 50%; position : relative; left: 37%; top: 5%;
}
#loguj:hover{cursor:pointer;}
#kolumna_1_logowanie {background-color: white; width: 90%; height:97%; text-align: right; padding-right:5px; 
position: relative; left: 5px; float: left; top:5px; font-family: 'Exo 2';}
#kolumna_1_logowanie input {font-size: 15px; height: 30px;}

.logo1{font-size: 30px; font-family:'Baloo Thambi'; padding: 10px; border:1px solid blue;}
.logo2{font-size: 30px; font-family:'Baloo Thambi'; background-color: blue; padding: 10px; color: white;}
#dol_logo2{position: relative; top:5px; right:15px; margin:0; height:40px; font-family:'Baloo Thambi'; 
font-size: 10px;}
#dol_logo2 h4{ font-size: 18px; font-family: 'Varela Round';}
#dol_logo h4{ font-size: 14px; font-family: 'Varela Round';}
#dol_logo3 h3{ font-size: 10px; font-family: 'Varela Round';}
.logo11{font-size: 15px; font-family:'Baloo Thambi'; padding: 5px; border:1px solid blue;}
.logo22{font-size: 15px; font-family:'Baloo Thambi'; background-color: blue; padding: 5px; color: white;}
#dol_logo3{position: absolute; bottom:30px; right:15px; margin:0; height:25px; font-family:'Baloo Thambi'; 
font-size: 15px;}

#loguj_stan{background-color: silver; border-radius:5px; color:black; padding: 10px; display: none; 
width: auto; height: 20px; border: 2px solid white; text-align: center; position: absolute; right:1%;}
.zamow{width:20px; height:20px;}
.koszyk_promocja:hover{cursor:pointer;}
#tip_koszyk
	{
   
	padding    :10px;
	font-family:'Exo 2';
    font-size  :12pt;
	position: absolute;
    display: none;
    border-radius: 5px;
   height: 20px; width:150px;
    background-color: #fff1c6;
	border: 2px solid orange;
	z-index:900;
	
	
	}
	#koszyk{position: absolute; top: 5%; left:20%; width:75%; height: 300px; 
	border:4px solid black; z-index:150; background-color: white; font-size: 8px; font-family: 'Exo 2'; 
	 display:none;}
	
	#koszyk table{ margin-left: 10px;}
	#koszyk table th {background-color: silver; text-align: center; opacity: 0.7;}
	.usun_z_koszyka_zalogowany:hover{cursor:pointer;}
	.usun_z_koszyka_nie_zalogowany:hover{cursor:pointer;}
	#koszyk table td{padding: 10px;}
	#zamknij_koszyk{position: absolute; top: 1%; right: 1%;}
	#zamknij_koszyk img{width:25px; height:25px;}
	#zamknij_koszyk:hover{cursor:pointer;}
	#suma_koszyk{position: absolute; bottom:30px; left: 5%; font-family: 'Exo 2'; font-size: 14px;}
	.realizuj_koszyk{width: 50px; height: 30px; border-radius: 5px; background-color: green; 
	 padding: 10px; color: white;}
	 #dane_kupujacy{ position:absolute; left: 30%; width: 65%; height: 250px; border-radius:5px;}
	 #dane_kupujacy h3{font-family: 'Exo 2'; font-size: 20px;}
	 
	 #dol_logo_koszyk{position: absolute; bottom:45px; right:65px; margin:0; height:30px;}
.logo1_koszyk{font-size: 20px; font-family:'Baloo Thambi'; padding: 10px; border:1px solid blue;}
.logo2_koszyk{font-size: 20px; font-family:'Baloo Thambi'; background-color: blue; padding: 10px; color: white;}
	 #dol_logo_koszyk h4{font-size: 10px; font-family: 'Varela Round';}
	 #zaloguj_z_koszyka{ background-color: silver; border-radius:5px; position: absolute; top:20px; 
	 left: 48%; height: 150px; width: 40%; font-family: 'Varela Round'; font-size: 12px; 
	  padding: 10px;}
	  #zarejestruj_z_koszyka{border-radius:5px; position: absolute; top:20px; left:2%; height: 150px; 
	  width: 40%; padding: 10px;font-family: 'Varela Round'; font-size: 12px; border: 2px solid silver;}
	 .srodek_koszyk{position: relative; top:40px; }
	 
	 
 #koszyk_krok1{position: absolute; top: 5%; left:20%; width:75%; height: 300px; 
	border:4px solid black; z-index:150; background-color: white; font-size: 8px; font-family: 'Exo 2'; 
	 display:none;}
		#koszyk_krok1 table{ margin-left: 10px;}
	#koszyk_krok1 table th {background-color: silver; text-align: center; opacity: 0.7;}
	.usun_z_koszyka_zalogowany_krok1:hover{cursor:pointer;}
	.usun_z_koszyka_nie_zalogowany_krok1:hover{cursor:pointer;}
	#koszyk table_krok1 td{padding: 10px;}
	#zamknij_koszyk_krok1 {position: absolute; top: 0px; right: 0px; padding:0px; 
	}
	
	
	#zamknij_koszyk_krok1 img{width:20px; height:20px;}
	
	#zamknij_koszyk_krok1:hover{cursor:pointer;}
	#suma_koszyk_krok1{position: absolute; bottom:30px; left: 5%; font-family: 'Exo 2'; font-size: 14px;}
	
	.realizuj_koszyk_krok1{width: 50px; height: 30px; border-radius: 5px; background-color: green; 
	 padding: 10px; color: white;}
	 #dane_kupujacy_krok1{ position:absolute; left: 30%; width: 69%; height: 280px; border-radius:5px;
	 top: 1px;}
	 #dane_kupujacy_krok1 h3{font-family: 'Exo 2'; font-size: 16px;}
	 
	 #dol_logo_koszyk_krok1{position: absolute; bottom:20px; right:65px; margin:0; height:30px;}
.logo1_koszyk_krok1{font-size: 20px; font-family:'Baloo Thambi'; padding: 10px; border:1px solid blue;}
.logo2_koszyk_krok1{font-size: 20px; font-family:'Baloo Thambi'; background-color: blue; padding: 10px; 
color: white;}
	 #dol_logo_koszyk_krok1 h4{font-size: 10px; font-family: 'Varela Round';}
  #zarejestruj_z_koszyka_zalogowany_krok1{position: absolute; top:-5px; left:2%; height: 250px; 
	  width: 95%; padding: 10px;font-family: 'Varela Round'; font-size: 12px; border-left: 0.2pt dotted silver;}
	  #zarejestruj_z_koszyka_zalogowany_krok1 input {font-size: 14px; height: 20px; padding: 4px;}
	 .srodek_koszyk_krok1{position: relative; top:40px; }
	#dostawa_adres{position: absolute; left: 55%; top: 5px; width:40%;  
	height:200px; padding: 5px; border-left: 0.2pt dotted silver;
	}
	
	
	 
	  #zarejestruj_z_koszyka_zalogowany{position: absolute; top:5px; left:2%; height: 250px; 
	  width: 95%; padding: 10px;font-family: 'Varela Round'; font-size: 12px; border-left: 2px solid silver;}
	  #zarejestruj_z_koszyka_zalogowany input {font-size: 14px; height: 18px; padding: 10px;}
	 .srodek_koszyk{position: relative; top:40px; }
	 
	 
	 .zarejestruj_z_koszyka{ background-color: gold; padding:20px; border:2px solid white; 
border-radius:5px; position: relative; top:20px; }
	 .zaloguj_z_koszyka{ background-color: green; padding:20px; border:2px solid white; 
border-radius:5px; position: relative; top:20px; }
.zarejestruj_z_koszyka:hover{cursor:pointer; font-weight: 800;}
.zaloguj_z_koszyka:hover{cursor:pointer; font-weight: 800;}	
.lbl {width: 150px; padding: 3px; display: block;}
.realizuj_koszyk:hover{cursor:pointer; font-weight: 800;}
#lupa_szukaj:hover{cursor:pointer;} 
.ilosc_nip img{width:10px; height: 10px;}
#os_komunikat{display:none;  }
.os_komunikat_blad{background-color: red; position: relative; top:20px; padding: 10px; 
color: black;  width: 30px; height: 20px; border-radius:5px;}
.os_komunikat_ok{background-color: green; position: relative; bottom:10px; padding: 10px; 
color: black;  width: 50px; height: 20px; border-radius:5px;}
#ppp{position: absolute; bottom:60px; left: 10px; font-family: 'Exo 2'; font-size: 10px; padding: 2px; 
background-color: silver; border-radius: 5px;}
.firma_komunikat{display:none;}
.firma_komunikat_blad{background-color: red; position: relative; top:20px; padding: 10px; 
color: black;  width: 30px; height: 20px; border-radius:5px;}
.firma_komunikat_ok{background-color: green; position: relative; top:20px; padding: 10px; 
color: black;  width: 50px; height: 20px; border-radius:5px;}
.ukryj_adres_zmiana{display:none; padding: 10px;}
.zatwierdz_zmiane_adresu{height: 15px; width:60px; border:1px solid black; border-radius:5px; 
text-align: center; padding: 5px; background-color: blue;margin-top: 10px; color: white;}
.zatwierdz_zmiane_adresu:hover{font-weight:800; cursor:pointer; border: 2px solid black;}
.zatwierdz_zmiane_adresu_os{height: 15px; width:60px; border:1px solid black; border-radius:5px; 
text-align: center; padding: 5px; background-color: blue;margin-top: 10px; color: white;}
.zatwierdz_zmiane_adresu_os:hover{font-weight:800; cursor:pointer; border: 2px solid black;}
	.prawy_szuk{border: 2px solid black; height: 40px; width: 300px; position: absolute; right: 20px;
	padding: 20px; font-size: 15px;}
	.prawy_szuk input{font-size: 15px; height: 30px; width: 200px; padding: 10px; }	
.finding{background-color: blue; width:100px; height:25px; border-radius:6px; padding: 10px; color: white;}
	.finding:hover{cursor:pointer;}
	
	.srodkowy_szuk{ height: 40px; width: 400px; position: absolute; right: 380px;
	 font-size: 15px; text-align: right;}
	 
	 .lewy_szuk{ height: 40px; width: 120px; position: absolute; right: 700px; top: 100px;
	 font-size: 15px; text-align: right; }
	
	.srodkowy_szuk img {width:60px; height: 60px; padding:0px;
	margin-top:10px;}
	.srodkowy_szuk img:hover{cursor:pointer;  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1); z-index:800; background-color: white;} 
	
	.left_col{width: auto; margin-left: 30%;  text-align: center; align: center;}
.small_function{width: 15%; height: 40px; border: 1px solid black; padding:10px; float: left; }
.small_function:hover{cursor:pointer; -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1); z-index:800; background-color: white;}
.male_fotki{width:30px; height:30px; padding: 5px;}
.srednie_fotki{width:100px; height:100px; padding: 20px;}

.male_ceny{font-size: 10px; font-family: 'Notable'; clear:both;}
.male_ceny input{font-size: 15px; height: 20px; padding:2px;}
.maly_btn{font-size: 20px; height: 30px; width: 50%; padding:2px; text-align: center;}
.maly_btn:hover{cursor:pointer;}
.tytul{font-family:'Exo 2'; font-size: 25px; padding: 10px; margin: 5px; color: black; text-decoration:none; font-weight: 600;}
	.tytul a{text-decoration:none;} 
	.zaznaczona{border: 1px solid silver; box-shadow: 3px 3px grey;}
	.zaznaczona_typ{border-bottom: 3px solid blue; }
	.niezaznaczona{border: none; box-shadow: 0px 0px transparent;}
	.koszyk_promocja2{border: 2px solid green; width: 50px; height: 50px; border-radius: 10px; 
	background-color: green; padding: 10px; position: relative; top: 30px; text-align: center; color :white;
	font-family: 'Exo 2';}
     .koszyk_promocja2:hover{font-weight:800; cursor:pointer;}
	 .silver_div{border:2px solid silver; background-color: gainsboro  ;}
	  .white_div{background-color: white; border: 1px solid silver;}
	  #ilosc_typow{font-size: 10px; font-family:'Exo 2';}
	  #podglad_obrazow{width:60%; height:70%; position: fixed; bottom:15%; right: 20%; border:4px solid black;
	  z-index: 900; 
	  background-color: white; display:none; border-radius: 2px;}
	 .zamknij_podglad_obrazow{position: absolute; top: 2px; right:2px; width: 20px; height: 20px;
	 border:1px solid silver;background-image: url('fotki/not_ok.png');
	 background-repeat: no-repeat;background-position: center; background-size: 100%;}
	 .zamknij_podglad_obrazow:hover{border: 2px solid silver; cursor:pointer;}
	 .img_podglad_obrazow:hover{cursor:pointer;}
	 #zdjecie_glowne{position: absolute; top:10px; left:2px; width: 50%; height: 80%; }
	 #opis_prawy{position: absolute; top: 30px; right: 2px; width: 45%; height: 90%;
	  }
	  #zdjecie_poboczne{position: absolute; bottom:2px; left:2px; width: 95%; height: 15%; 
	  padding:10px; }
	  
.wgraj_to_zdjecie:hover{cursor:pointer;}
.kody1d{width: 42%; position: absolute; top: 70px; right:5px; height: 50px;border-top: 2px solid blue; font-size: 12px; font-family: 'Exo 2';}
.kody2d{width: 42%; position: absolute; top: 130px; right:5px; height: 40px;border-top: 2px solid blue;  font-size: 14px; font-family: 'Exo 2';}
.kodyinne{width: 42%; position: absolute; top: 180px; right:5px; height: 30px;border-top: 2px solid blue;  font-size: 14px; font-family: 'Exo 2';}
.podglad_kodu{width: 42%; position: absolute; top: 220px; right:5px; height: 180px;
background: url('upload/kody/2/ean13.png');background-repeat: no-repeat;background-position: center; background-size: 50%;}
.kolumnowy_widok{width:200px; height:400px; float: left; padding: 10px; border: 1px solid blue; }
.zaznaczono_sort{border: 1px solid blue; padding: 10px;}
.odznaczono_sort{border: none; padding: 10px;}
.odznaczono_sort:hover{cursor: pointer;}
.zaznaczono_sort:hover{cursor: pointer; }
.kolumnowy_widok:hover{cursor:pointer; background-color: #F8F8F8;}
.no_style{text-decoration:none; color: black;}
h1{font-family:'Exo 2';}
h2{font-family:'Exo 2';}