@charset "utf-8";
/* CSS Document */

html {
	width:100%;
	height:100.1%;
	font-size:100.1%;
}

body{
	background:url(/images/bg.png) top left repeat-x #f9f9f9;
	font:0.7em Tahoma, Verdana, Arial, Helvetica, sans-serif;
	letter-spacing:.09em;
	width:100%;
	height:100%;
}

body,h1,h2,h3,h4,h5,h6,p,form,fieldset,ul,img {
	margin:0;
	padding:0;
	color:#4f4f4f;	
}


/* General
--------------------------------------------------*/
h1,h2,h3,h4,h5,h6,p,ul{
	padding-bottom:1.2em;
}

h1, h2{
	font-size:1.25em;
	color:#99cc00;
}
h3{
	font-size:1.1em;	
}
a{
	color:#0054a6;
	font-weight:bold;
}
a.noUnderline{
	text-decoration:none;
}
a:hover{
	color:#f28e48;
	background:none;
}
a img{
	border:none;
}
img {
	vertical-align:bottom;
}
ul{
	list-style:none;
}
ul li{
	background:url(/images/bullet.gif) left 9px no-repeat;
	padding-left:20px;
}

ul.bigBullet li{
	background:url(/images/bigBullet.gif) left center no-repeat;
	padding-left:20px;
}
ul.smallBullet li{
	background:url(/images/smallBullet.gif) 2px 10px no-repeat;
	padding-left:20px;
}

ul li.noBullet, ul.noBullet li{
	background:none;
}

.dist{
	/*color:#f28e48;*/
	color:#ff0097;
}
.distGreen{
	color:#99cc00;
}
.clear{
	clear:both;
	line-height:0px;
}
.line{
	height:1.2em;
	background:url(/images/greyDashedLine.gif) top left repeat-x;
}
a.small{
	font-size:9px;
	color:#4f4f4f;
}
.left{
	float:left;
}
.right{
	float:right;
}
.pt{
	padding-top:1.2em;
}
.pb{
	padding-bottom:1.2em;
}
.tcenter{
	text-align:center;
}
.tright{
	text-align:right;
}
.tleft{
	text-align:left;
}
.subHeader{
	font-size:1.1em;
	padding-left:2em;
	background:url(/images/subHeaderBullet.gif) left center no-repeat;
}

/*table*/
table.default{
	width:100%;
	border-collapse:collapse;
}
table.default tr{

}
table.default tr.odd{
	background:#e7e8e3;
}
table.default th{
	background:#99cc00;
	padding:10px 10px;
	color:#ffffff;
}
table.default td{
	padding:5px 10px;
	vertical-align:top;
	text-align:left;
}


/* container
--------------------------------------------------*/
#container{
	width:1000px;
	margin:0 auto;
	position:relative;
}

#waves{
	width:2000px;
	height:110px;
	position:absolute;
	top:0;
	right:388px;
	background:url(/images/wavesBg.png) right top no-repeat;
}


#designSteps{
	width:2000px;
	height:251px;
	position:absolute;
	top:155px;
	right:384px;
	background:url(/images/designStepsBg.png) left top repeat-x;
}
#designStepsFlash{
	width:600px;
	height:251px;
	float:right;	
}


/* header
--------------------------------------------------*/
#header{
	width:100%;
	height:152px;
	position:relative;
	z-index:10;
}

#logo{
	display:block;
	width:347px;
	height:152px;
	position:absolute;
	top:0;
	right:0;
	background:url(/images/logo.png) left top no-repeat;
}


#topNav{
	width:600px;
	height:60px;
	background:url(/images/topNavBg.png) left top no-repeat;
	position:absolute;
	top:0;
	left:20px;
	padding:0;
}	
#topNav li{
	list-style:none;
	background:none;
	padding:0;
	float:left;
}
#topNav li a{
	display:block;
	height:60px;
	background:url(/images/topNavBg.png) 0 -120px no-repeat;
}

#tn1{
	width:58px;
}
#tn1:hover{
	background-position:0 -60px;
}

#tn2{
	width:86px;
}
#tn2:hover{
	background-position:-58px -60px;
}

#tn3{
	width:90px;
}
#tn3:hover{
	background-position:-144px -60px;
}

#tn4{
	width:102px;
}
#tn4:hover{
	background-position:-234px -60px;
}

#tn5{
	width:98px;
}
#tn5:hover{
	background-position:-336px -60px;
}

#tn6{
	width:81px;
}
#tn6:hover{
	background-position:-336px -60px;
}



/* content
--------------------------------------------------*/
#content{
	line-height:1.8em;
	padding:9px 20px;
}


/* Rightcolumn
--------------------------------------------------*/
#rightColumn{
	float:right;
	width:327px;
}

#rightColumn .box{
	width:100%;
	padding-bottom:7px;
	background:url(/images/footerBoxBg.gif) left bottom no-repeat;
}
#rightColumn .box .header{
	width:100%;
	height:33px;
	padding-bottom:12px;
}


#contactBox .header{
	background:url(/images/contactBoxHeaderBg.png) left top no-repeat;
}
#contactBox .content{
	background:url(/images/contactBoxBg.png) right bottom no-repeat;
	padding-bottom:8px;
}
#contactBox li{
	background-image:url(/images/w2b.gif);
}
#contactBox li.bullet{
	background-image:url(/images/bullet.gif);
	background-position:20px 9px;
	padding-left:40px;
}
#contactBox .e a img{
	width:107px;
	height:15px;
}
#contactBox .e a{
	background:url(/images/biuroBg.gif) left top no-repeat;
	position:relative;
	top:-2px;
}	
#contactBox .e a:hover{
	background-position:left -15px;
}


#latestProjectsBox{
	margin-top:30px;	
}

#latestProjectsBox .header{ 
	background:url(/images/latestProjectsBoxHeaderBg.png) left top no-repeat;
}
#latestProjectsBox .content{
	text-align:center;
	padding:0 20px;
	padding-bottom:10px;
}
#latestProjectsBox .content img{
	padding:10px 0 25px 0;	
}
#latestProjectsBox .content .programistic{
	text-align:left;
}


#portfolioNavBox{
	margin-top:30px;	
}

#portfolioNavBox .header{ 
	background:url(/images/portfolioBoxHeaderBg.png) left top no-repeat;
}
#portfolioNavBox .content{
	text-align:center;
	padding:0 20px;
	padding-bottom:10px;
}
#portfolioNavBox .content img{
	padding:10px 0;	
}
#portfolioNavBox li{
	text-align:left;
}


#restBox{
	margin-top:30px;
}
#restBox .content{
	padding:0 20px;
}
#restBox .subHeader{
	margin-bottom:1.2em;
}
#restBox p, #restBox ul{
	padding-left:26px;
}
#restBox ul{
	margin-top:-7px;
}
#restBox p{
	padding-bottom:20px;
}


/* Leftcolumn
--------------------------------------------------*/
#leftColumn{
	float:left;
	width:591px;
	padding-left:0;	
	text-align:justify;
}


/* Footer
--------------------------------------------------*/
#footerWrapper{
	background:url(/images/footerBg.gif) top left repeat-x;	
	width:100%;
	height:101px;
}
#footer{
	margin:0 auto;	
	width:1000px;
	height:101px;
	text-align:center;
}

#footer ul {
	margin:0;
	padding:0;
	padding-top:40px;
	text-align:center;
}
#footer ul li {
	display:inline;
	background-position:5px 4px;
	padding-left:21px;
}
#footer ul li.firstChild{
	padding-left:0;
	background:none;
}
#footer ul li a {
	color:#f2f3ed;
	text-decoration:none;
	font-weight:normal;
}
#footer ul li a:hover {
	color:#99CC00;
	text-decoration:underline;
}

#footerText{
	color:#878990;
	font-size:.9em;
	padding-top:20px;	
}
#footerText strong{
	font-weight:100;
}


/* Index
--------------------------------------------------*/
#index{
	padding-top:260px;	
}

#indexH{	
	padding-bottom:24px;
}

#index .offer{
	width:591px;
	background:url(/images/firstOfferRow.png) left top no-repeat;
	margin-left:-3px;
	letter-spacing:0;
	margin-bottom:1.5em;
}

.offer .row{
	width:191px;
	height:23em;
	float:left;
	margin-right:9px;
	display:inline;
}
.offer .header{
	height:76px;
	position:relative;
}
.offer .header .more, .offer .header .portfolio{
	display:block;
	width:60px;
	height:14px;
	position:absolute;
	top:53px;
	left:9px;
}
.offer .header .portfolio{
	left:70px;
}

.offer .third{
	margin-right:0;
}
.offer .row .content{	
	padding:0 5px;
	padding-top:13px;
}
.offer .row h3{
	font-size:12px;
	padding:0;
	padding-bottom:3px;
}
.offer .row p{
	color:#a59f97;
	line-height:1.5em;
}
.offer .row p.noMP{
	padding:0;
}

.offer .first h3{
	color:#a59f97;
}
.offer .second h3{
	color:#91d3c9;
}
.offer .third h3{
	color:#79d2ea;
}
	
#index .offer2{
	background:url(/images/secondOfferRow.png) left top no-repeat;
}	

.offer2 .first h3{
	color:#c8a8e2;
}
.offer2 .first b.color{
	color:#c8a8e2;
}
.offer2 .second h3{
	color:#f3bde1;
}
.offer2 .third h3{
	color:#fdbbc7;
}


/* Kontakt
--------------------------------------------------*/
form{
	width:100%;
}
form p{
	padding:1.2em 0 0 0;
}
form input{
	border:solid 1px #e5e5e5;
	width:260px; height:15px;
	padding:10px 5px;
	background:#ffffff;
	font-weight:bold;
	color:#000000;
}
form textarea{
	background:#ffffff;
	border:solid 1px #e5e5e5;
	width:260px; height:180px;
	padding:10px 5px;	
	font-weight:bold;
	color:#000000;	
}
form label{
	font-weight:bold;
	font-size:13px;
	color:#ffa800;
	padding-left:5px;
}
form .element{
	padding-bottom:10px;
}
form .element label{
	width:150px;
	display:inline-block;
}

#contactForm{

}
#contactForm .element{
	float:left;
}
#contactForm .emailContainer{
	width:290px;
}
#contactForm .nameContainer{
	width:270px;
	padding-left:20px;
}
#contactForm .emailContainer input,
#contactForm .nameContainer input{
	width:270px;
}
#contactForm .titleContainer input{
	width:580px;
}
#contactForm textarea{
	width:580px;
}
	
#komunikat{
	position:absolute;
	top:50%;
	left:25%;
	width:40%;
	height:5em;
	border:solid 4px #f28e48;
	background-color:#FFFFFF;
	text-align:center;
	padding:1em;
	visibility:hidden;
}

#mailInfoText{
	padding-top:1em;
	font-weight:bold;
}

#phoneNumbers{
	width:536px;
	height:196px;
	background:url(/images/phoneNumbers.png) left top no-repeat;
	position:relative;
	padding-bottom:20px;
}
#phoneNumbers .openingHours{
	width:210px;
	position:relative;
	top:100px;
	left:2px;
}

#mails{
	width:536px;
	height:212px;
	background:url(/images/mails.png) left top no-repeat;
	position:relative;
	padding-bottom:45px;
}
#mails .mailsInfoText{
	width:210px;
	position:relative;
	top:120px;
	left:5px;
}


/* Portfolio
--------------------------------------------------*/
.folio{
	padding-bottom:2em;
}
.folio .line{
	height:3px;
}
.folioTitle{
	height:2em;
	font-weight:bold;
}
.folioTitleTitle{
	float:left;
}
.folioTitleLink{
	float:right;
}

.folioImg{
	float:left;
	margin:1.75em;	
	margin-right:0;
	border:solid 1px #999999;
	display:inline;
}
.folioImg img{
	border:solid 3px #ffffff;
}

.folioText{
	float:right;
	width:22em;
	padding:1.75em 0 0 0;	
}


/* skrypty
--------------------------------------------------*/
#skrypty table td{
	width:280px;
	font-weight:bold;
}



/* banery
--------------------------------------------------*/
.banner{

}
.banner a{
	border:solid 1px #999999;
	display:inline-block;
}
.banner a img{
	border:solid 3px #ffffff;
}