/* reset css */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img,button{border:0;}
address,caption,cite,code,dfn,em,strong,th,var,i{font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight: normal;}
q:before,q:after{content:'';}
a {font-size:12px; color:#969696; text-decoration:none; outline:none}

/* ustawienia globalne*/
body, html {background: #FFF; font-family: Arial, Georgia, Verdana, Helvetica, sans-serif; font-size:12px; margin:0; padding:0}

p{color:#333333}
textarea, input, select {font-family: Arial, Georgia, Verdana, Helvetica, sans-serif; font-size:12px; float:left; border: solid 1px #4B4B4B}
legend {display:none;}
button {cursor:pointer;}
label {cursor:pointer;}
strong {font-weight:bold;}
b{color:#8B8B8B}

/* linki */
a.a_r {float: right; color: #969696; text-transform: lowercase; padding-right: 12px; background: url(../img/a_r.gif) no-repeat right 50%; margin-top: 15px }
a.link{font-size:12px; color:#02A2F5; text-decoration:none; outline:none}

.dp {width: 999px; margin: 0 auto}

#t {width: 100%; padding: 50px 0 30px 0; overflow: hidden}
	#t .l {width: 320px; float: left}
	#t .l a.ld {text-transform: uppercase; letter-spacing: 0.17em; font-size: 10px; color: #333333}
	#t .l h1 {background: url(../img/logo.gif) no-repeat; width: 275px; height: 33px; padding-bottom: 7px }
	#t .l h1 a {display: block; width: 100%; height: 100%; text-indent: -20000px}
	#t form {float: right; margin-top: 31px}
	#t form fieldset {float: right}
	#t form input {width: 230px; height: 18px; padding: 2px; border: solid 1px #C2C2C2; color: #C6C6C6; margin-right: 10px}
	#t form button, #t form button:hover {border: none; background: #01A4F8; text-transform: uppercase; color: #fff; padding: 3px}
	#t form button:hover {background: #8b8b8b;}
	


#baner {margin:-1px 0 0; width:60000px;}	 
#baner .kontener {height: 380px; width:998px; margin-bottom:15px}
#baner .ramka {height:380px;position:absolute;width:998px;z-index:40;border: solid 1px #9E9E9E;}
#baner .ramka .obraz{height:380px;overflow:hidden;position:absolute;width:998px;}
#baner .ramka img {margin:0;position:absolute;}	 
	 
#m {width: 100%; border-top: solid 1px #C2C2C2; border-bottom: solid 1px #C2C2C2; padding:10px 0; overflow: hidden; margin-bottom: 15px}
	#m ul {width: 100%}
	#m  ul li {float: left; color: #333333; font-size: 12px; text-transform: uppercase; margin: 0 27px; display: inline}
	#m  ul li a, #m  ul li.s a, #m  ul li a:hover {color: #333333; background: none}
	#m  ul li.s a, #m  ul li a:hover {background: #F3F3F3}

#b {width: 997px; height: 380px; border: solid 1px #9E9E9E; overflow: hidden; margin-bottom: 15px}
/*	#b img {visibility: hidden}*/
	#b div { width: 967px; background: #000; opacity:0.7; height: 40px; position: absolute; margin-left:0px; margin-top: 0px; padding: 10px 15px 0 15px; }
	#b div ins {float: left; overflow: hidden; width: 500px}
	#b div ins p {color: #FFF; text-transform: uppercase; font-weight: bold}
	#b div ins .l {float: left; margin-right: 30px}
	#b div ins a {color: #01A4F8} 
	#b div ul {float: right; margin-top: 7px}
	#b div ul li, #b div ul li.s {float: left; width: 13px; height: 17px; background: url(../img/kropek.gif) no-repeat left top; padding:2px 0 0 6px; color: #fff; margin-left: 9px; cursor: pointer}
	#b div ul li.s {background-position: left bottom; color: #040505}
	#b a.erl {display:block; width: 100%; height: 330px}
	
#s {width: 999px; height: 99px; overflow: hidden; background: #F3F3F3; padding: 18px 0; margin-bottom: 15px}
	#s ul {width: 100%; overflow: hidden; padding-left: 25px;}
	#s ul li {float: left; width: 206px; height: 99px; border-right: solid 1px #D5D5D5; margin-bottom:19px; padding: 0 15px 0 15px;}
	
	#s div {width: 126px; height: 88px; padding: 10px 0 0 80px; overflow: hidden}
	#s h2 {font-size: 16px; color: #333333; text-transform: uppercase; font-weight: bold; line-height: 13px; padding-bottom: 12px}
	#s h2 a {color: #333333;}
	#s p {font-size: 11px; color: #878787}
	#s p a {color: #878787}
		
	#s .ico1 {background: url(../img/s-ico-1.gif) no-repeat left 50%; }
	#s .ico2 {background: url(../img/s-ico-2.gif) no-repeat left 50%; }
	#s .ico3 {background: url(../img/s-ico-3.gif) no-repeat left 50%; }
	#s .ico4 {background: url(../img/s-ico-4.gif) no-repeat left 50%; }
	#s .ico5 {background: url(../img/s-ico-5.gif) no-repeat left 50%; }
	#s .ico6 {background: url(../img/s-ico-6.gif) no-repeat left 50%; }
	#s .ico7 {background: url(../img/s-ico-7.gif) no-repeat left 50%; }
	#s .ico8 {background: url(../img/s-ico-8.gif) no-repeat left 50%; }
	#s .ico9 {background: url(../img/s-ico-9.gif) no-repeat left 50%; }
	
	#s img.l, #s img.r {position: absolute; cursor: pointer; margin-left: 0px}
	#s img.r {margin-left: 972px}
	
#c {width: 100%; overflow: hidden; }
	.cms {width: 100%; }
	.cms  strong{color: #01A4F8}
	.cms ul li {background: url(../img/box-li-white.gif) no-repeat 0 50%; padding-left: 17px; margin-top: 3px}
	.cms ol {list-style-type: decimal; list-style-position: inside}
	.cms p.picture {text-align: center; padding: 10px 0 20px 0 }
	
	.mt25 {margin-top: 25px}
	.fr{float: right !important}
		
	#cl{width: 195px; padding:0px; float: left; padding-top:20px}
	.clfaq{width: 360px!important}
	#cl ul{width:100%; float:left}
	#cl ul li {border-bottom:1px dotted #f3f3f3; list-style-position:outside;list-style-type:none;padding:7px 0;}
	#cl ul li a{background: url(../img/pkt.gif) no-repeat 4px 3px; padding-left: 17px; margin-top: 3px}
	#cl a, #cl a.s {color: #333333; line-height: 22px; font-weight:bold}
	#cl a.s {font-weight: bold; color:#01A4F8}
	#cl ol {padding-left:10px}
	#cl ol li {padding:1px 0; border:none}
	#cl ol li a{background: url(../img/pkt2.gif) no-repeat 4px 7px; padding-left: 12px; margin-top: 3px; color:#8B8B8B; font-weight:normal}
	#cl ol li a.s {font-weight: normal; color:#01A4F8}
	
	#cr {float: right; width: 777px; padding: 20px 0 20px 0}
	.crfaq{width: 610px!important}
	#cr h3 {font-size: 16px; color: #333333; text-transform: uppercase; font-weight: bold; padding-bottom: 22px}
	#cr ul {width: 100%; overflow: hidden}
	#cr ul li  { float: left; background: url(../img/box-li-white.gif) no-repeat 0 2px; padding-left: 17px; margin-top: 7px; clear:both }
	#cr b.blue{color:#01A4F8}
	
	#cr .txt{width:457px; float:left}
	
	
	#cr .screeny{float:left; margin-left:20px; width:300px}
	 #cr .screeny img{float: right; border:1px solid #F3F3F3; margin:0px 0px 20px 0px;}
	 
	
	.typy{width: 999px; background: url(../img/oferta-all.gif) no-repeat; overflow: hidden;}
	.typy a {display: block; width: 111px; height: 100px; float: left; text-indent: -20000px; background: url(../img/oferta-all.gif) no-repeat; }
	
	.typy a.t1 {background-position: 0 0}
	.typy a.t2 {background-position: -110px 0}
	.typy a.t3 {background-position: -221px 0}
	.typy a.t4 {background-position: -333px 0}
	.typy a.t5 {background-position: -446px 0}
	.typy a.t6 {background-position: -557px 0}
	.typy a.t7 {background-position: -668px 0}
	.typy a.t8 {background-position: -779px 0}
	.typy a.t9 {background-position: -890px 0}
	
	.typy a.t1:hover {background-position: 0 -100px}
	.typy a.t2:hover {background-position: -110px  -100px}
	.typy a.t3:hover {background-position: -221px  -100px}
	.typy a.t4:hover{background-position: -333px -100px}
	.typy a.t5:hover{background-position: -446px  -100px}
	.typy a.t6:hover {background-position: -557px -100px}
	.typy a.t7:hover {background-position: -668px  -100px}
	.typy a.t8:hover {background-position: -779px  -100px}
	.typy a.t9:hover {background-position: -890px  -100px}
	
	.typy a.t1s {background-position: 0 bottom}
	.typy a.t2s{background-position: -110px bottom}
	.typy a.t3s{background-position: -221px bottom}
	.typy a.t4s{background-position: -333px bottom}
	.typy a.t5s{background-position: -446px bottom}
	.typy a.t6s {background-position: -557px bottom}
	.typy a.t7s {background-position: -668px bottom}
	.typy a.t8s {background-position: -779px bottom}
	.typy a.t9s {background-position: -890px bottom}
	
	/* strona glowna*/
	#sgl {width: 594px; float: left; padding-right: 15px}
	#sgl h1 {font-size: 18px; font-weight: bold; color: #333333; padding: 10px 0; clear: both; text-transform: uppercase}
	
	#sgr {width: 390px; float: right; overflow: hidden}
	#sgr .box {width: 366px; padding: 17px 12px 12px 12px; background: #F3F3F3; margin-bottom: 15px; overflow: hidden}
	#sgr .box h3 {font-weight: bold; font-size: 18px; text-transform: uppercase; padding-bottom: 7px}
	#sgr .box ul {width: 366px;}
	#sgr .box ul li, #sgr .box ul li.f  { float: left; width: 166px; background: url(../img/box-li.gif) no-repeat 0 50%; padding-left: 17px; margin-top: 3px }
	#sgr .box ul li.f {width: 349px !important}
	#sgr .dark {background: #333333 !important}
	#sgr .dark h3 {font-style: italic;}
	#sgr .dark h3, #sgr .dark p {color: #fff}
	#sgr .light{background: none !important; border: solid 1px #F3F3F3}
	
	/* szczegoly realizacji */
	#szczegoly {overflow: hidden; padding-top: 10px}
	#szczegoly #foto {width: 662px; height: 535px; overflow: hidden; border: solid 1px #C6C6C6; float: left}
	#szczegoly #l {width: 315px; float: right}
	#szczegoly #l strong {color: #01A4F8}
	#szczegoly #l ul {width: 100%; overflow: hidden}
	#szczegoly #l ul li  { float: left; width: 298px; background: url(../img/box-li-white.gif) no-repeat 0 50%; padding-left: 17px; margin-top: 3px }
	#szczegoly #l .ikonki {width: 100%; padding-bottom:15px; overflow: hidden}
	#szczegoly #l .ikonki div { background: url(../img/projekt-all.gif) no-repeat; width: 37px; float: left; height:24px}
	#szczegoly #l .ikonki .ico1{ background-position: 0 0}
	#szczegoly #l .ikonki .ico2{ background-position: -37px 0}
	#szczegoly #l .ikonki .ico3{ background-position: -74px 0}
	#szczegoly #l .ikonki .ico4{ background-position: -111px 0}
	#szczegoly #l .ikonki .ico5{ background-position: -148px 0}
	#szczegoly #l .ikonki .ico6{ background-position: -185px 0}
	#szczegoly #l .ikonki .ico7{ background-position: -222px 0}
	#szczegoly #l .ikonki .ico8{ background-position: -259px 0}
	#szczegoly #l .ikonki .ico9{ background-position: -296px 0}
	
	/* oferta */
	#oferta{ width: 100%; overflow: hidden; padding-top: 10px}
	#oferta div {width: 300px; height: 58px; float: left; border: solid 1px #F7F7F7; margin-top: 17px; padding: 10px 0 0 80px}
	#oferta div h2{font-weight: bold; text-transform: uppercase; padding-bottom: 3px}
	#oferta div a {color: #333333}
	
	#oferta .ico1 {background: url(../img/oferta-ico-1.gif)}
	#oferta .ico2 {background: url(../img/oferta-ico-2.gif)}
	#oferta .ico3 {background: url(../img/oferta-ico-3.gif)}
	#oferta .ico4 {background: url(../img/oferta-ico-4.gif)}
	#oferta .ico5 {background: url(../img/oferta-ico-5.gif)}
	#oferta .ico6 {background: url(../img/oferta-ico-6.gif)}
	#oferta .ico7 {background: url(../img/oferta-ico-7.gif)}
	#oferta .ico8 {background: url(../img/oferta-ico-8.gif)}
	#oferta .ico9 {background: url(../img/oferta-ico-9.gif)}
	#oferta .ico10 {background: url(../img/oferta-ico-10.gif)}
	#oferta .ico11 {background: url(../img/oferta-ico-11.gif)}
	
	/* realizacje */
	#realizacje {width: 100%; padding-top: 25px}
	#realizacje .o {width: 319px; height: 250px; float: left; margin: 0 0 21px 21px; text-align: center}
	#realizacje .o .box {background: url(../img/realiz-bg.gif) no-repeat; width: 307px; height: 208px; overflow: hidden; padding: 6px;margin-bottom:3px}
	#realizacje .f {margin-left: 0px !important}
	#realizacje .o a, #realizacje .o a:hover {font-style: italic; font-weight: bold; font-size: 14px; color: #8b8b8b}
	#realizacje .o a:hover { color: #333333}
	#realizacje .fraza { width: 979px; padding: 20px 0 20px 20px; margin-bottom: 20px; background: #DFDFDF}
	
	/* hosting */
	.host-box, .host-box2{width:355px; height:235px; border: 1px solid #e8e8e8; float:left; background: url(../img/serwer.gif) no-repeat bottom right; padding:10px; margin-bottom:20px}	
	.host-box2{margin-left:20px}

	.host-box span{width:315px; height:29px; float:left; margin:7px 0px 10px}
	.host-box span.standard{background: url(../img/standard.gif) no-repeat}
	.host-box span.medium{background: url(../img/medium.gif) no-repeat}	
	.host-box span.large{background: url(../img/large.gif) no-repeat}
	.host-box span.max{background: url(../img/max.gif) no-repeat}
	.host-box em{font-size:36px; font-weight:bold; color:#cccccc; }
	.host-box table{border:none; width:200px; margin-top:8px}
	.host-box table td.pier{width:135px}
	.host-box table td.bold{font-weight:bold}
		
	
	
	
#f {width: 100%; border-top: solid 1px #C2C2C2; border-bottom: solid 1px #C2C2C2; padding:10px 0; overflow: hidden; margin-top: 15px}
	#f ul {float: left}
	#f ul li, #f ul li.l  {float: left; text-transform: uppercase; background: url(../img/f-li.gif) no-repeat right 50%; padding: 0 17px 0 10px}
	#f ul li.l {background: none !important}
	#f ul li a {color: #C2C2C2; font-size: 10px;}
	#f a.rss {background: url(../img/rss.gif) no-repeat left 50%; padding: 2px 0 1px 20px; font-size: 10px; color: #333333; float: right}
#fc {padding: 8px 0 15px 0; color: #C2C2C2; font-size: 10px; }

#komunikat {width: 460px; border: solid 2px #FE2C9E; padding: 20px; background: #fff; z-index: 200; margin-left: 244px;  }
	#komunikat h1 {font-weight: bold; color: #FE2C9E; text-transform: uppercase; padding-bottom: 5px}
	#komunikat p {padding-bottom: 15px}
	#komunikat button {margin-left: 217px}
	
/* stronicowanie */
.pag {clear:both; margin-left:0px; padding-top: 30px; margin-bottom: 6px; text-align: center }
.pag ul {overflow: hidden }
	.pag li {float:left;padding:4px 6px;font-size: 16px;}
	
	.pag li a, .pag li a:hover  { font-size: 16px; color: #767676; text-decoration:none;margin-top:0px; outline:none; }
	.pag li.s{ color: #FFF;  background: #DFDFDF; font-weight: bold}
	
	.pag li.prev a, .pag li.prev a:hover {background:url(../img/prev.gif) no-repeat left 50%; float:left; padding: 0 0 0 11px; display: block; width: 1px }
	.pag li.next a, .pag li.next a:hover {background:url(../img/next.gif) no-repeat right 50%; float:left; padding: 0 11px 0 0; display: block; width: 1px }

	.opag {width: 700px; float: left; margin-top: 30px; margin-left: 10px}
	
#s_pag { width: 975px; border-top: solid 1px #C2C2C2; border-bottom: solid 1px #C2C2C2; padding: 10px 12px; overflow: hidden}
	#s_pag a, #s_pag a.prev, #s_pag a.next {display: block; width: 108px; height: 18px; background: url(../img/s_pag-gb.gif) no-repeat 0 0; padding: 2px 0 0 26px; color: #333333}
	#s_pag a.prev {float: left}
	#s_pag a.next {float: right; background-position: right top; padding: 2px 0 0 18px; width: 116px}
	
ul.form{width:100%; float:left; margin-top:30px}
	ul.form li, ul.form li.next, ul.form li.tex{margin-bottom:15px; display:inline; float:left; background:none !important; width:310px !important}
	ul.form li.next{ margin-left:60px}
	ul.form li.tex{ width:700px !important}
	ul.form li em{width:65px; float:left}
	ul.form li input {border:1px solid #e8e8e8; float:left; height:15px; padding:3px;width:235px; color:#636363}
	ul.form li textarea{border:1px solid #e8e8e8; float:left; height:150px; padding:3px;width:622px; color:#636363}
	ul.form li button{height:20px; width:134px; margin-left:561px; margin-top:30px; background: url(../img/s_pag-gb2.gif) no-repeat 0 0; padding: 0px 0 0 14px; color: #333333}	
	

