body {
	background-color: black;
	font-family: arial;
}
p.opis  {
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 0.1px;
	font-family: arial;
	text-align: left;
	margin: 0 10px 0 10px;
}
h2.fotografia {
	font-size: 13px;
	text-align: left;
	margin: 10px;
}
html {
	background-color: black;
}
#cala_strona {
	background: url("../grafika/top_glowna_tlo.png") repeat-x;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 301px;
	z-index: 0;
}
#cala_strona_min {
	background: url("../grafika/tlo_menu_galeria.png") repeat-x;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 111px;
	z-index: 1;
}
#calosc {
	background-color: white;
	margin-top: 100px;
	min-height: 200px;
	background: url("../grafika/tlo_tresc.jpg") ;
	position: absolute;
	z-index: 1;
	top: 199px;
	left: 0;
	width:100%;
}
#calosc_big {
	background-color: white;
	margin-top: 111px;
	min-height: 200px;
	background: url("../grafika/tlo_tresc.jpg") ;
	position: absolute;
	z-index: 0;
	top: 0;
	left: 0;
	width:100%;
}
#calosc_min {
	background-color: black;
	margin-top: 104px;
	min-height: 200px;
 /*	background: url("../grafika/tlo_tresc.jpg") ;*/
	position: absolute;
	z-index: 0;
	top: 388px;
	left: 0;
	width:100%;
}
#stopka {
position: relative;
 
 
	font-family: verdana, tahoma;

	background: url("../grafika/tlo_stopka.png") repeat-x;
 	background-color: black;
	width:100%;
	min-height: 112px;
}
#stopka_podmenu {
	width: 850px;
	margin: 0 auto 0 auto;
}
/*-- STOPKA ---*/
#stopka ul li a{
	font-size: 10px;
	text-decoration: none;
	padding: 0;
	margin: 0;
	margin-right: 20px;
	text-align: left;
}
li.stopkaPod ul li {
	padding: 0;
	margin: 0;
	text-align:left;
}
.stopka {
	float: left;
	padding: 0 6px 0 10px;
 	list-style:none;
	margin: 10px 0 10px 0;
	border-right:  solid 1px #313131;
}
 .stopkaGl a{
	color: #737373;
	font-weight: bold;
	font-size: 10px;
}
.stopka ul  {
	color: red;
	list-style-type: square;
	color: #4f4f4f;
	padding: 0 0 0 10px;
	margin: 0;
} 
.stopkaPod li {
	margin:  0 20px 0 8px;
	line-height: 13px;
	font-size: 10px;
}
.stopkaPod  li a{
	margin-left: 9px;
	font-family: verdana, arial, tahomacursive;
	font-size: 10px;
	color: #4f4f4f;
 }
.stopkaPod  li:hover{
	text-decoration: underline;
 }
 .copyright {
	float: right;
	font-size: 10px;
	color: #9e9e9e;
	margin:  10px 10px 0 0;
	font-weight: bold;
}




/*----------------------------*/





#top{
	width: 871px;

	margin: 17px auto 0 auto;

}

#logo { 
	width: 237px;
	height: 79px;
	float: left;
	margin-left: 0px;
	background:  url("../grafika/logo_ufi.png") no-repeat;	
	}
#tresc {
	width: 873px;
	margin: 0px auto 0 auto;
}


/* ---------------------------------------------------------------- */

#banner_top {
	width: 873px;
	height: 290px;
	background:  url("../grafika/banner_top.jpg") no-repeat;
}
#odnosniki_do_podstron {
	color: #6b6b6b;
	font-family: tahoma, verdana, sans serif;
	font-weight:  bold;
	font-size: 11px;
	position: relative;
	top: 270px;
	left:  15px;
}
 
#tresc_o_firmie_tekst p{
	padding: 36px 0 0 32px;
	text-align: left;
}

.niebieski {
	color: #0593d1;
	font-weight: bold;
	font-family: arial, tahoma, verdana, sans serif;
}
#tresc_zalety {
	color: #677074;
	float: left;
	width: 268px;
	height: 224px;
	background:  url("../grafika/zalety.jpg") no-repeat ;	
	font-family: arial, tahoma, verdana, sans serif;
	font-size: 11px;
	line-height: 20.2px;
	mARGIN-LEFT: 10PX;	
}
 
#kategoria_film ul , #kategoria_foto ul , #kategoria_webdesign ul , #kategoria_grafika ul {
	list-style: none;
	font-family: tahoma, verdana, sans serif;
	text-shadow:0 1px 0 white;
	color: #666666;
	font-size:  11px;
	padding: 105px 0 0 13px;
	line-height: 21px;
}
#kategoria_film ul li, #kategoria_foto ul li, #kategoria_webdesign ul li, #kategoria_grafika ul li {
		background:  url("../grafika/tlo_lista_film.png") no-repeat 0 7px;
		padding-left: 5px;
}
#kategoria_film ul li a, #kategoria_foto ul li a, #kategoria_webdesign ul li a, #kategoria_grafika ul li a {
color: #666666;
}
#kategoria_film {
	float: left;
	width: 217px;
	height: 242px;
	margin-left: 4px;
	background:  url("../grafika/kategorie_filmowanie.png") no-repeat;
	padding: 0;
}
#kategoria_foto {
	float: left;
	width: 217px;
	height: 242px;
		background:  url("../grafika/kategorie_fotografia.png") no-repeat;
}
#kategoria_webdesign {
	float: left;
	width: 217px;
	height: 242px;
		background:  url("../grafika/kategorie_webdesign.png") no-repeat;
}
#kategoria_grafika {
	float: left;
	width: 222px;
	height: 242px;
		background:  url("../grafika/kategorie_grafika.png") no-repeat;
}
.kategoria_wiecej {
	text-decoration: none;
position: relative;
left: 83px;
bottom: 4px;
font-size:  12px;	
font-family: tahoma, verdana, arial;
}

#prezentacja_prac {
	width: 873px;
	
	background:  url("../grafika/tlo_tresc_portfolio.png");
}
ul.zdjecia {
	float: left;
	
	margin-left: 0;
	margin-top:5px;
	list-style: none;
	display: inline;
}
li.zdjecie img {
	margin:  8px 0 0 7px;
	outline: none;
	border: none;
}
li.zdjecie{
	display: inline;
	float: left;
	width: 86px;
	height: 99px;
	background:  url("../grafika/tlo_zdjecia.png") no-repeat 0 0px;
	margin-right: 5px;
	margin-top:10px;
}
#zdjecie1 img {
	margin:  4px 0 0 4px;
}

#top_background {
	width: 871px;
	height: 270px;

	background:  url("../grafika/top_glowna_urzadzenia.png") no-repeat 450px 73px;
}

p.top_background_content {
	float: left;
	margin: 20px 300px 0 0px;
	width: 460px;
	font-family: verdana, tahoma, arial;
	text-shadow:0 1px 0 black;
	font-size: 11px;
	color: #b8b8b8;
	line-height: 18px;
}
#tresc_kategorie {
	
	margin-top: -9px;
	width: 877px;
	z-index: 200;
}
#galeria_stron_top {
	margin-top: -10px;
	width: 861px;
	height: 19px;
	z-index: 300;
	background:  url("../grafika/top_strony.jpg") repeat-x 0 0px;
}
#galeria_stron_tresc {

	width: 861px;
	min-height: 50px;
	z-index: 300;
	background:  url("../grafika/tlo_galeria_stron_tresc.jpg") repeat-y 0 0px;
}
#galeria_strony_tresc_lewa {
		position: absolute;
 
	margin-left: 12px;
	width: 235px;
	height:  auto;
	border-right: solid 1px #cecece;
	z-index: 1;
	text-align: left;
}
#galeria_strony_tresc_lewa img {
	width: 183px;
	position: relative;
	left: 0;
 margin: 5px 0 15px 6px;
 padding: 0;
}
#galeria_strony_tresc_lewa ul  {
	list-style: none;
	display: block;
	margin: 0;
	padding: 0;
}
#galeria_strony_tresc_lewa li {
	background:  url("../grafika/menu_strony_nieaktywne.jpg") no-repeat 0 0px;
	width: 236px;
	height: 40px;
 	font-size: 13px;
	text-align: left;
}
#galeria_strony_tresc_lewa li.active {
	background:  url("../grafika/menu_strony_active.jpg") no-repeat 0 0px;
	width: 236px;
	height: 40px;
	padding: 0;
	color: #39b6ec;
	font-family: verdana;
	font-weight: bold;
	font-size: 13px;
}
#wybor_projektu ul{
	margin-top:5px;
}
#wybor_projektu a {
	display: block;
	width: 222px;
	line-height: 35px;
	padding: 0 0 0px 30px;
	padding-left: 13px;
	text-decoration:  none;
		color: #7a7a7a;

}
 
 
#wybor_projektu a.active {
	color: #39b6ec; 	
 }
#galeria_strony_tresc_prawa {
	background:  url("../grafika/tlo_galeria_strony_tresc_prawa.jpg") repeat-x 0 0px;
	position: relative;
	left: 248px;
	z-index: 0;

	margin-left: -1px;
	border:  solid 1px #cecece;
	width: 596px;
	margin-bottom: 10px;
	background-color: white;
}
#galeria_stron_tresc p.wykaz {
	padding-left: 13px;
	text-align: left;
	line-height:  10px;
	font-family: tahoma, arial;
	font-size: 11px;
	color: #7a7a7a;
}
#galeria_stron_tresc p.klient {
	font-weight: bold;
	font-family: arial;
}
#galeria_stron_tresc p span.pogrubienie {
	font-weight: bold;
}
#galeria_stron_tresc p span.pogrubienie_klient {
	font-weight: bold;
	font-size: 12px;
}
#galeria_stron_tresc p span.nazwa_klienta {
	font-weight: bold;
	font-size: 12px;
	color: #39b6ec;
}
















#projekty { 
	float: left;
	width: 560px;  
	margin: -6px auto 0 10px; 
}
#projekty ul {
/*	width: 100%;*/
	overflow: hidden;
}
#projekty ul li {
	background: url('../grafika/nieaktywnyTab.png') no-repeat;
	width: 60px;
	height: 40px;
	float: left;
	display: block;
	padding-top: 5px;
	text-align: center;
	margin: 0;

}
#bookmarks { 
	margin-left: -10px;
	width: 280px;
}
#projekty li, a { 
	margin-right: 14px;
	font-size: 11px; 
 
	text-decoration: none; 
 padding-right: 5px;
	height:  30px; 
	width: 39px;
		outline: none;
		border: none;
}
#projekty img {
			outline: none;
		border: none;
}
#bookmarks ul li.active { 
	background: url('../grafika/aktywnyTab.png') no-repeat; 	
	border: solid 2px #39b6ec;
	text-decoration: underline;

}
#bookmarks ul li.active a { 
outline: solid 1px black;
 
}
#tab1, #tab2, #tab3, #tab4, #tab5, #tab6, #tab7 { 
	color: #fff; 
	padding: 2px; 

	display: none;
}
	
#tab1 { 
	display: block; 
}
#projekty_content {
	margin-top:  -5px;
	margin-left: 0px;
	margin-bottom: 10px;
	float: left;
	color: black;
	width: 575px;
 
	background: url("../grafika/tloOpis.jpg") repeat-x white;
/*border:  1px solid #39b6ec;*/
	line-height: 140%;
}
#projekty_content p {
	color: black;
	font-family: tahoma;
	font-size: 11px;
			}
			#dol {
				margin-top: -10px;
				margin-bottom: 20px;
				width: 861px;
				height: 29px;
				background: url("../grafika/dol.jpg") repeat-x white;
			}
#menu_galeria_projektow {
	width: 575px;
	min-height:  68px;
}
 
#menu_galeria_projektow span {
 	float: left;
 	margin-top: 14px;
 	color: #7a7a7a;
 	font-weight: bold;
 	font-family: tahoma;
 	font-size: 12px;
 	width: 14px;
}
#menu_galeria_projektow ul {
	padding: 0;
	margin: 0;
}
#menu_galeria_projektow span.przejdz_do_strony {
width: 130px;
}
#menu_galeria_projektow ul li.tab1 {
	margin: 0;
	padding: 0;

	min-height:  68px;
}
#menu_galeria_projektow ul li.tab2 {
	width: 295px;
	min-height:  68px;
}
#menu_galeria_projektow ul li.tab3 {
		margin: 0;
	padding: 0;
	width: 120px;
	min-height:  68px;
}
ul.wykaz_galerii_slubnych {
	display: inline;
	padding: 0;
	list-style: none;
}
ul.wykaz_galerii_slubnych li{
	float: left;
	width: 203px;
	display: inline;
margin: 20px 0 20px 7px;
	list-style: none;
	font-weight: bold;
	font-family: arial;
	font-size: 13px;
}
ul.wykaz_galerii_slubnych img {
	outline: none;
	border: none;
	text-decoration: none;

}
ul#wykaz_grafik {
	display: inline;
	margin: 14px;
	padding: 0;
	width: 593px;
	outline: none;

}
#wykaz_grafik li {
	margin-top: 10px;
	margin-left: 30px;
	width: 178px;
	display: inline; float: left; text-align: left;
		margin-bottom: 20px;
}
#wykaz_grafik img{

		outline: none;
		text-decoration: none;
		border: none;
}
a.link_przejdz_do_opisu {
		line-height: 25px;  color: #008cc9; font-size: 11px; font-weight: bold; font-family: tahoma; padding: 0; margin: 0;
}
a.link_przejdz_do_strony {
		background: url('../grafika/przejdz.jpg') no-repeat 0 7px;
	line-height: 15px;
	padding: 5px 0 0 20px; 
	margin: 3px 0 0 0; 
	color: #008cc9; 
	text-decoration: underline;
}
span.link_przejdz_do_strony_nieaktywny{
	text-decoration: line-through;
}
#tresc_kategorie ul li {
	padding-left: 17px;
}
a.strona_link img {
	border: none;
	outline: none;
}
#galeria_strony_tresc_prawa p{
	padding-bottom: 0;
	margin: 10px 0 0 0px;
	line-height: 12px;
	
}
span.wykaz_narzedzi{
	margin-left: 3px;
padding-left: 15px;
line-height: 19px;
background: url('../grafika/strzalka.png') no-repeat 0 3px;
}
#monitor {

	width: 476px;
	height: 432px;
	background: url('../grafika/monitor.png') no-repeat;
	margin:  15px auto 0 auto;
}
#monitor_strona img{
	margin-top: 14px;
}
#formularz_kontaktowy {
	width: 450px;

	border-right: solid 1px #e1e1e1;
	margin-left: 15px;
	margin-bottom: 16px;
}
.wierszFormularza_1 {
	padding-top: 5px;
}
p.formluarz_kontaktowy {
	width: 395px;
	margin-left: 17px;
	color: #838383;
	padding-bottom: 2px;
	font-family: tahoma;
	font-weight: bold;
 	text-shadow:0 1px 0 white;
 	border-bottom: solid 1px #e6e6e6;
}
ul.formluarz_kontaktowy {
	display: block;
	margin-left:  17px;
	padding:0;
}
li.formluarz_kontaktowy {
	color: #838383;
	text-shadow:0 1px 0 white;
	text-align: left;
	display: block;
	margin:0 0 10px 0;
	padding:0;
	font-weight: bold;
}
li.formluarz_kontaktowy input {
	border: solid 1px #e1e1e1;
	width: 410px;
}

.formularzKontaktowy span{
	font-size: 16px;
	color: green;
}

#divNieprawidlowy, #divNieprawidlowy2, #divNieprawidlowy3, #divPrawidlowy, #divPrawidlowy2, #divPrawidlowy3 {
	margin: 2px 2px 0 2px;
	float: left;
	height: 16px;
	width: 20px;
}
#divNieprawidlowy, #divNieprawidlowy2, #divNieprawidlowy3 {
	background-image: url(../grafika/blad.png);
	background-repeat: no-repeat;
	visibility: hidden;
}
#divPrawidlowy, #divPrawidlowy2, #divPrawidlowy3 {
	background-image: url(../grafika/sukces.png);
	background-repeat: no-repeat;
	display: none;
}
.labelFormularz {
	width: 130px;
}
label{
	line-height: 20px;
	color: black;
	font-family: tahoma, arial, sans-serif;
	float: left;
	width: 85px;
	font-size: 11px;
	text-align: right;
}
input:focus {
	background-color: white;
	border: 1px solid black;
}
textarea:focus {
	background-color: white;
	border: 1px solid black;
}
input, textarea{
	
	border: 1px solid #e1e1e1;
	color: black;
	background-color: white;
	margin-bottom: 5px;
}
textarea{
width: 300px;
height: 200px;
}
.inputFormularz input {
	width: 300px;
	text-align: left;
}
#dane_kontaktowe {
	font-family: tahoma;
	width: 370px;
	float: right;
	text-align: left;
	margin-left:  10px;
}
#dane_kontaktowe h1 {
	padding: 0;
	margin: 0;
	font-size: 14px;
	color: #40B4FD;
	margin-bottom: 2px;
	text-decoration: underline;
}
#dane_kontaktowe h2 {
	font-size: 11px;
	color: #7d7d7d;
	margin-bottom: 2px;

}
#dane_kontaktowe ul {
	margin: 0;
	padding: 0;
}
#dane_kontaktowe ul li.telefon {
background:  url("../grafika/mobile.jpg") no-repeat;
font-size: 11px;
list-style: none;	
padding: 0 0 0 30px;
margin-top: 10px;
color: #5e5e5e;
height:19px;
}
#dane_kontaktowe ul li.mail {
	margin: 10px 0 10px 0;
background:  url("../grafika/mail.jpg") no-repeat;
font-size: 11px;
height:19px;
list-style: none;	
padding: 0 0 0 30px;
color: #5e5e5e;
}
p.kontakt_informacja {
	height: 50px;
	font-size: 12px;
}
li.ulotka {
	width: 176px;
	height: 241px;
background:  url("../grafika/tlo_ulotki.png") no-repeat;	
}
li.ulotka a {
	margin: 8px 0 0 8px;
	padding-top: 8px;
}
li.ulotka a img {
	margin-top: 8px;
}

p.naglowek {
	text-align: left;
	margin: 0 5px 5px 16px;
	padding-top: 0;
}
p.naglowek a{
	outline: none;
	border: none;
	text-decoration: none;
}

span.galeria {
	padding-left: 32px;
	padding-bottom: 6px;
	padding-top: 2px;
	background: url("../grafika/naglowek_galerie.jpg") no-repeat;
	color: #40b5fe;	
	height: 27px;	
}
span.strony {
	display: block;
	padding-left: 62px;
	padding-bottom: 5px;
	padding-top: 2px;
	width: 767px;
	background: url("../grafika/ikona_naglowek_www.png") no-repeat;
	color: #40b5fe;	
	height: 35px;
	border-bottom: solid 1px #ededed;
}
span.grafika {
	display: block;
	padding-left: 62px;
	padding-bottom: 5px;
	padding-top: 1px;
	width: 767px;
	background: url("../grafika/ikona_naglowek_grafika.png") no-repeat;
	color: #40b5fe;	
	height: 35px;
	border-bottom: solid 1px #ededed;
}
span.fotografia {
	display: block;
	padding-left: 62px;
	padding-bottom: 5px;
	padding-top: 1px;
	width: 767px;
	background: url("../grafika/ikona_naglowek_fotografia.png") no-repeat;
	color: #40b5fe;	
	height: 35px;
	border-bottom: solid 1px #ededed;
}
span.kontakt {
	display: block;
	padding-left: 62px;
	padding-bottom: 5px;
	padding-top: 1px;
	width: 767px;
	background: url("../grafika/ikona_naglowek_kontakt.png") no-repeat;
	color: #40b5fe;	
	height: 35px;
	border-bottom: solid 1px #ededed;
}
span.kontakt a, span.grafika, span.strony, span.fotografia  {
	color: #40b4fd;
	font: bold 14px arial;
	line-height: 20px;
	margin-right: 6px;
	display: block;
	padding-top: 15px;
}
span.grafika a.naglowek_link_powrot{
	color: #40b4fd;
	font-size:14px;
	font-family: arial;
	padding:  0;
	line-height: 20px;
	text-align:  left;
}
span.fotografia a.naglowek_link_powrot{
	color: #40b4fd;
	font-size:14px;
	font-family: arial;
	padding:  0;
	line-height: 20px;
	text-align:  left;
}
span.kontakt a.naglowek_link_powrot{
	color: #40b4fd;
	font-size:14px;
	font-family: arial;
	padding:  0;
	line-height: 20px;
	text-align:  left;
}
span.strony a.naglowek_link_powrot{
	color: #40b4fd;
	font-size:14px;
	font-family: arial;
	padding:  0;
	line-height: 20px;
	text-align:  left;
}
a.naglowek_link_powrot {
		line-height: 30px;

}
span.grafika a.nieaktywny {
	font-weight: normal;
}
span.strony a.nieaktywny {
	font-weight: normal;
}
span.kontakt a.nieaktywny {
	font-weight: normal;
}
/* webdesign zasady */
ul.webdesign_zasady {
	margin: 0 0 0 15px;
	padding: 0;
	font-size: 11px;
}
.webdesign_zasady li {
	list-style: none;
	float: left;
	width: 270px;
	margin-bottom: 20px;
}
.webdesign_zasady li span {
	margin-right: 12px;
}
.webdesign_zasady h2 {
	font-size:  12px;
	padding: 1px 0 0 10px;
	margin: 0;
	text-align: left;
	line-height: 14px;
	color:#5e5e5e;
}
.webdesign_zasady p {
	text-align:  left;
	padding-left: 45px;
	color:#7A7A7A;
}
span.webdesign_zasady_projektowanie {
	background: url("../grafika/ikona_webdesign_projektowanie.png") no-repeat;
	height: 32px;
	width: 32px;
	float:  left;
}
span.webdesign_zasady_ciecie {
	background: url("../grafika/ikona_webdesign_ciecie.png") no-repeat;
	height: 32px;
	width: 32px;
	float:  left;
}
span.webdesign_zasady_seo {
	background: url("../grafika/ikona_webdesign_seo.png") no-repeat;
	height: 32px;
	width: 32px;
	float:  left;
}
span.webdesign_zasady_w3c {
	background: url("../grafika/ikona_webdesign_w3c.png") no-repeat;
	height: 32px;
	width: 32px;
	float:  left;
}
span.webdesign_zasady_terminowosc {
	background: url("../grafika/ikona_webdesign_terminowosc.png") no-repeat;
	height: 32px;
	width: 32px;
	float:  left;
}
span.wykaz_przegladarek {
	font-size: 12px;
	font-weight: bold;
	font-family: arial, verdana;
	float:  left;
	margin: 0 20px 0 20px;

	
}
ul.wykaz_przegladarek_lista {
float: left;
	display: inline;
	list-style: none;
	margin-left: 10px;
}
ul.wykaz_przegladarek_lista li {
	display: inline;

}
img.obrazek {
	float: left;
	margin: 20px 0 0 15px;
}
img.obrazek_kontakt {
	float: left;
	margin: 20px 50px 0 0;
}
p.opis_tworzenie_stron {
	font-family: arial;
	color:#7A7A7A;
	line-height: 18px;
	text-align: left;
	padding: 0 20px 30px;
	margin: 0;
}
ul.kontakt {
	float: left;
	margin-left: 20px;
}
p.opis_fotografia {
	font-family: arial;
	color:#7A7A7A;
	line-height: 18px;
	text-align: left;
	padding: 0 10px 15px;
	margin: 0;
}