html, body {height:100%}

body {
	padding: 0;
	margin: 0;
	background-color: #232730;
	width: 100%;
  	display: table;
	font-family: Verdana, Arial, Times New Roman, Helvetica, sans-serif;
}


* {padding: 0px;
	margin: 0px;}

  	
div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: ''; content: none;}
/* remember to define focus styles! */
:focus {outline: 0;}
/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}
	
	
/* ------------------- elementy wspólne ---------------------------*/

img {
border: 0px;
}

a {
	text-decoration: none;
	color: #465a0e;
	font-size: 13px;
	font-weight: bold;
}

a:hover {
	color: #9ab73f;
}

a.w-tekscie {
	text-decoration: underline;
	color: #ffffff;
	font-size: 14px;
	font-weight: bold;
}

a.w-tekscie:hover {
	color: #9ab73f;
}

a.mail {
	text-decoration: none;
	color: #70ab1f;
	font-size: 16px;
	font-weight: bold;
}

a.mail:hover {
	color: #9ab73f;
}

.bold {
font-weight: bold;
}

p {
	font-size: 13px;
	color: #ffffff;
	line-height: 18px;
	padding: 0px 0px 10px 0px;
	text-align: justify;
}

p.zakres-uslug {
	font-size: 13px;
	color: #ffffff;
	line-height: 18px;
	padding: 0px 0px 24px 0px;
	text-align: justify;
}

p.kontakt {
	font-size: 16px;
	color: #ffffff;
	line-height: 26px;
	padding: 10px 0px 24px 0px;
	text-align: left;
}

h1 {
	font-size: 20px;
	color: #ffffff;
	padding: 10px 0px 0px 0px;
	text-align: left;
}

h2 {
	font-size: 17px;
	color: #70ab1f;
	padding: 14px 0px 6px 0px;
	text-align: left;
	font-weight: bold;
}

ul.oferta {
list-style: none;
padding: 20px 0px 0px 80px;
font-size: 16px;
	color: #ffffff;
}

ul.oferta li {
padding: 14px 0px 0px 0px;
}

ul.oferta-podstrony {
list-style: none;
padding: 0px 0px 0px 40px;
font-size: 13px;
	color: #ffffff;
}

ul.oferta-podstrony  li {
padding: 6px 0px 0px 0px;
}

.clear {
  clear: both;
}

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

#bottom_pasek {
min-height: 100%;
height: auto !important;
height: 100%;
background:  url(grafika/pasek-stopka.gif) bottom left repeat-x;
}

#calosc {
	width: 980px;
	padding: 0px;
	margin: 0px auto;	
}


/* ------------------------ GÓRA - wspólna dla wszytskich podstron----------------------------- */

#gora {
	width: 980px;
	height: 134px;
}

a#index {
	width: 340px;
	height: 134px;
	float: left;
	background-image: url(grafika/logo.jpg);
   display:block;
   overflow:hidden;
   text-indent:-999px;
   text-decoration:none;
}

/* -------------------------------  menu  --------------------- */

#menu {
	width: 616px;
	height: 74px;
	padding: 60px 0px 0px 24px;
	overflow: hidden;
	float: right;
	background-color: #232730;
}

	#menu ul, #menu  ul li {
	display: block;
	list-style: none;
	margin: 0px;
	padding: 0px;
}

#menu ul {
	float: left;
}

#menu ul li {
	float: left;
}

#menu ul a {
	text-decoration: none;
	display: block;
	color: #ebecee;
	padding: 0px 20px 0px 20px;
	font-size: 16px;
	font-weight: bold;
}

#menu ul a:hover {
	color: #675591;
	
}



/* ------------------------------  środek - główna   --------------------- */
#srodek-glowna {
	width: 980px;
}


#kol-lewa {
	width: 340px;
	height: 772px;
	overflow: hidden;
	float: left;
	background-image: url(grafika/pasja-tworzenia.jpg);
}

#kol-prawa {
	width: 640px;
	overflow: hidden;
	float: right;
}
	
#realizacje-anim {
	width: 629px;
	height: 196px;
	overflow: hidden;
	float: left;
	background-image: url(grafika/realizacje.jpg);
}

#obok-realizacje {
	width: 11px;
	height: 196px;
	overflow: hidden;
	float: right;
	background-image: url(grafika/obok-realizacje.jpg);
}

#co-oferujemy {
	width: 640px;
	height: 150px;
	overflow: hidden;
	clear: both;
	background-image: url(grafika/co-oferujemy.jpg);
}

#tekst {
	width: 600px;
	height: 426px;
	padding: 0px 10px 0px 30px;
	overflow: hidden;
	background-image: url(grafika/tekst.jpg);
}


#wiecej-info {
	top: 54px;
	left: 380px;
	width: 190px;
	height: 22px;
	position: relative;
}

a#wiecej-informacji {
	text-decoration: none;
	color: #70ab1f;
	font-size: 17px;
}

a#wiecej-informacji:hover {
	color: #675591;
}

#stopka-glowna {
	width: 980px;
   height: 19px;
	padding: 0px 0px 0px  0px;
   background-image: url(grafika/stopka-glowna.jpg);	
 }

/* ----------------------------------------podstrony ------------------------------------------*/
#srodek-podstrony {
	width: 980px;
	background-image: url(grafika/pasek-tlo.gif);	
}


#kol-lewa-podstrony {
   float: left;
   width: 340px;
}

#pasek-oferta {
	top: 88px;
	left: 284px;
	width: 56px;
	height: 280px;
	position: relative;
	background-image: url(grafika/pasek-oferta.gif);
}


#pasek-realizacje {
	top: 88px;
	left: 284px;
	width: 56px;
	height: 280px;
	position: relative;
	background-image: url(grafika/pasek-realizacje.gif);
}
 
#pasek-firma {
	top: 88px;
	left: 284px;
	width: 56px;
	height: 280px;
	position: relative;
	background-image: url(grafika/pasek-firma.gif);
}

#pasek-kontakt {
	top: 88px;
	left: 284px;
	width: 56px;
	height: 280px;
	position: relative;
	background-image: url(grafika/pasek-kontakt.gif);
}
 
 
#kol-prawa-podstrony {
  float: right;
   width: 600px;
	padding: 20px 20px 0px 20px;
}



#stopka {
	width: 560px;
   height: 350px;
	padding: 0px 20px 0px  400px;
   background-image: url(grafika/stopka.jpg);	
 }