body {
	font:  tahoma;/*, Verdana, Arial, Helvetica, sans-serif;*/
	background: #42413C;
	margin: 0;
	padding: 0;
	color: #000;
}

/* ~~ Selektory elementów i znaczników ~~ */
ul, ol, dl,li { /* Ze względu na różnice w zachowaniu przeglądarek, dobrą praktyką jest używanie marginesów i odstępów wewnętrznych o zerowej szerokości dla elementów typu lista. Aby ułatwić sobie zachowanie spójności, można określić pożądane wartości albo tutaj, albo w parametrach elementów listy (LI, DT, DD). Pamiętaj, że wszelkie wprowadzone tu wartości zostaną przeniesione kaskadowo na listy klasy .nav, chyba że utworzysz bardziej wyspecjalizowany selektor. */
	padding: 10;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* Usunięcie górnego marginesu pozwala obejść problem związany z uciekaniem marginesów z bloku DIV, w którym są zawarte. Pozostały margines dolny zapewni odstęp od kolejnych elementów. */
	padding-right: 15px;
	padding-left: 15px; /* Dodanie bocznych odstępów wewnętrznych (właściwość „padding”) do elementów umieszczanych wewnątrz bloku DIV — zamiast do samego bloku DIV — pozwala uniknąć konieczności przeprowadzania obliczeń położenia w modelu blokowym. Alternatywną metodą jest użycie zagnieżdżonego bloku DIV z odstępami wewnętrznymi po bokach. */
}
a img { /* Ten selektor usuwa domyślną, niebieską ramkę, wyświetlaną przez niektóre przeglądarki wokół obrazków otoczonych łączem. */
	border: none;
}
a{
font-weight: 700;
}
/* ~~ Ostylowanie łączy serwisu musi być definiowane w podanej tu kolejności. Dotyczy to również grupy selektorów odpowiedzialnych za efekt „hover” (zmianę wyglądu łącza po umieszczeniu nad nim kursora) ~~ */
a:link {
	color: #000;
	text-decoration: none;
	font-weight:: 800; /* Jeśli nie zamierzasz tworzyć łączy o wyjątkowo nietypowym wyglądzie, najlepiej zachować wyróżnienie graficzne w postaci podkreślenia, które pozwala na szybkie zidentyfikowanie łącza. */
}
a:visited {
	color: #000;
	text-decoration: none;
}
a:active, a:focus { /* Ta grupa selektorów jest odpowiedzialna za stworzenie efektu „hover” przy nawigacji za pomocą klawiatury, identycznego z efektem uzyskiwanym przez użytkownika korzystającego z myszy. */
	text-decoration: none;
	color: #000;
	font-weight:: 800;
}
a:hover {
	text-decoration: underline;
	color: #A00C00;
	font-weight: 900;
    font-size:19px;
}
/* ~~ Ten kontener o stałej szerokości otacza pozostałe bloki DIV ~~ */
.container {
	width: 800px;
	background: #FFF;
	margin: 0 auto; /* Wartość „auto” dla marginesów bocznych wraz z podaną wartością szerokości zapewnia wyśrodkowanie układu. */
}
.container
/* ~~ Nagłówek nie ma określonej szerokości. Rozciągnie się na pełną szerokość układu. Zawiera zastępczy obraz, który trzeba zastąpić łączem do własnego logo. ~~ */
.header {
	background: #433185;
}
.menu {
	background: #433185;
	text-align:center;
	/*word-spacing: 100px;*/
	color: #fffff;
	text-decoration: none ;
	font-weight: 300;
	font-size:20px;
}

.big{
	text-align:center;
	text-decoration: none ;
	font-weight: 300;
	font-size:20px;
}

/*.menu.table{*/
.table{
border-collapse: separate;
border-spacing: 2px;
vertical-align: middle;
}
td{
padding-right: 15px;
padding-left: 15px;
}


.table.listing{
border-collapse: separate;
border-spacing: 2px;
vertical-align: middle;
background-color:green;
}
td{
padding-right: 15px;
padding-left: 15px;
}
/* ~~ Informacje dotyczące układu ~~ 

1) Odstępy wewnętrzne (właściwość „padding”) dodaje się tylko na górze i/lub na dole bloku DIV. Elementy wewnątrz tego bloku DIV mają odstępy wewnętrzne po bokach. Pozwala to uniknąć konieczności skomplikowanego obliczania położenia w modelu blokowym. Należy pamiętać, że jeśli zdefiniujesz odstępy wewnętrzne lub krawędzie po bokach dla bloku DIV, to zostaną one dodane do zdefiniowanej szerokości bloku. Dlatego ostateczna szerokość całego bloku będzie inna. Możesz również usunąć odstępy wewnętrzne z elementu zawartego w bloku DIV i umieścić go w kolejnym bloku DIV bez zdefiniowanej szerokości, ale z podanymi odstępami wewnętrznymi.

*/

.content {
    padding-left: 5px;
	/*padding: 10px 0;*/
}

/* ~~ Stopka ~~ */
.footer {
	padding: 10px 0;
	background: #433185;
	font-size:12px;
	font-weight:bold;
	text-align:right;	
}

/* ~~ Różne klasy float/clear ~~ */
.fltrt {  /* Ta klasa umożliwia tworzenie elementów pływających z prawej strony (właściwość „float:right”). Element pływający musi poprzedzać w kodzie element, obok którego ma się znajdować na stronie. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* Ta klasa umożliwia tworzenie elementów pływających z lewej strony (właściwość „float:left”). Element pływający musi poprzedzać w kodzie element, obok którego ma się znajdować na stronie. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* Tę klasę można wykorzystać w znaczniku <br /> lub pustym bloku DIV, który stanowi ostatni element za ostatnim pływającym blokiem DIV (wewnątrz bloku o identyfikatorze #container), jeśli usunięto blok #footer lub przeniesiono go poza blok #container. */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

#formularz {
        width:360px; /* ustawiamy szerokość formularza */
        margin:0 auto; /* jeżeli nasz formularz ma ustawioną szerokość wyśrodkowujemy go */
        background-color:#fff; /* dodajemy kolor tła naszemu formularzowi */
        border:2px solid #ccc; /* dodajemy obramowanie o szerokości 2px */
        border-radius:10px; /* zaokrąglamy tło naszego formularza */
		padding:20px; /* dodajemy margines wewnątrz naszego formularza */
        margin-top:20px; /* dodajemy margines górny naszego formularza */
}

#formularz label {
    display:block;/* ustawiamy by label rozpoczynał się od nowej linii*/
    margin-bottom:5px;/* dodajemy margines dolny */
    font-weight:bold; /* pogrubiamy czcionkę */
    text-transform: uppercase; /* zamieniamy wszystkie litery na duże */
    font-size:12px; /* ustawiamy wielkość czcionki */
    color:#555555; /* ustawiamy kolor czcionki */
}

#formularz textarea,
#formularz input {
	padding:5px; /* dodajemy margines wewnątrz naszego pola */
	border-radius:3px; /* dodajemy zaokraglone rogi */
	border:1px solid #ccc; /* dodajemy obramowanie */
	margin-bottom:25px; /* dodajemy margines dolny */
	width:345px; /* ustalamy szerokość */
}

#formularz input#order{
	padding:5px; /* dodajemy margines wewnątrz naszego pola */
	border-radius:3px; /* dodajemy zaokraglone rogi */
	border:1px solid #ccc; /* dodajemy obramowanie */
	margin-bottom:25px; /* dodajemy margines dolny */
	width:245px; /* ustalamy szerokość */
	height:345px;
}

#formularz input#submit {
	width:355px; /* ustalamy szerokość */
	cursor:pointer; /* zmieniamy kursor */
	margin-bottom:0px;/* resetujemy margines dolny */
}

#formularz p.copy {
	color:#555555; /* ustawiamy kolor czcionki */
	margin-bottom:0px; /* resetujemy margines dolny */
	font-size:12px; /* ustawiamy rozmiar czcionki */
	text-align: center; /* wyśrodkowywujemy tekst */
}

#formularz p.copy a {
	color:#555555;/* ustawiamy kolor czcionki */ 
	text-decoration: none; /* usuwamy podkreślenie linku */
	font-weight:bold; /* pogrubiamy czcionkę */
}