/*
Theme Name: PIDI 2012
Theme URI: http://pidi.pl/
Author: PIDI | Damian Stebel, Paweł Pawlas
Author URI: http://pidi.pl/
Description:  Szablon strony firmowej PIDI
Version: 1.0
*/

/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

html, body, 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, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
:focus {/* remember to define focus styles! */
	outline: 0;
}
body {
	background: #fff;
	line-height: 1;
}
ol, ul {
	list-style: none;
}
table {/* tables still need 'cellspacing="0"' in the markup */
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	font-weight: normal;
	text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
a img {
	border: 0;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
strong{font-weight: bold;}


::-moz-selection {background: #83ab17; color: #fff;}
::selection {background: #83ab17; color: #fff;}

body {background: url(gfx/bg.png) #f8f8f8 repeat-x; font-family: Tahoma, sans-serif;  font-size:12px;  line-height:18px; color:#24211c;}
input, textarea, select {font-family: Tahoma, sans-serif;  font-size:12px;}

h1, h2, h3, h4, h5, h6 {font-family: 'Ubuntu Condensed', Arial, Tahoma, sans-serif; line-height: normal; text-shadow:1px 1px 1px #fff;}

* {margin:0 auto;}
a {text-decoration: none; color:#323232;}
a:hover {text-decoration:underline;}

#top {width: 100%; min-width: 978px; height: 125px; margin:0 0 20px;}
 #top > div {width:978px; margin:0 auto;}
 #top .logo {width:400px; float:left; height: 86px; padding:16px 0 0 10px; text-align: left}
 #top .logo h1 {color: #78418D; font-size: 15px;}
 #top .logo img {display: block; margin: 0;}
 #top .lang {float:right; font-weight: bold; width:450px;}
 #top .lang a {width:29px; height:22px; display:block; float:right; color:#fff; position: relative; background: url(gfx/lang1.png) top; text-align: center; font-size:11px; padding:3px 0 0; margin:0 0 0 -8px; z-index:0;}
  #top .lang a:hover {background: url(gfx/lang1.png) bottom; text-decoration: none; z-index:2;}
 #top .lang a.active {width:35px; height:24px; background: url(gfx/lang2.png) top; z-index: 1; padding:4px 0 0;}
  #top .lang a.active:hover {background: url(gfx/lang2.png) top;}

 #top .menu {float:right; width:500px; line-height:normal;}
 #top .menu ul, #menubar .menu ul {float:right; font-family: 'Ubuntu Condensed', Arial, Tahoma, sans-serif; padding:10px 20px 0 0;}
 #top .menu li, #menubar .menu li {display: block; float:left; margin:0 10px;}
 #top .menu li a, #menubar .menu li a {padding:3px; height:42px; color:#24211c; font-size:18px; font-weight: bold; text-transform: uppercase; display: block; float:left;}
 #top .menu li a span, #menubar .menu li a span {display:block; font-size:11px; height:13px; font-weight: normal; color:#a1a1a1;}
  #top .menu li a:hover, #menubar .menu li a:hover {text-decoration: none; color:#4a165e;}
  #top .menu li a:hover span {color:#a1a1a1;}
  #top .menu li.current-menu-item a {text-decoration: none; color:#4a165e;}
  #top .menu li.current-menu-item a span {color:#a1a1a1;}

#menubar {width: 100%; min-width: 978px; height: 83px; position: fixed; top:0; left:0; background: url(gfx/bg_belka.png) repeat-x; z-index: 999; display:none; line-height:normal;}
 #menubar > div {width:978px; display:none; margin:0 auto;}
 #menubar .logo {width:76px; height: 46px; float:left; margin:3px 0 0 22px;}
 #menubar .menu {float:right;}
 #menubar .menu ul {padding:7px 20px 0 0;}
 #menubar .menu li a {color:#f8f8f8;}
  #menubar .menu li a:hover, #menubar .menu li.current-menu-item a{color:#83ab17;}
  #menubar .menu li a:hover span {color:#a1a1a1;}

#slider {width:100%; min-width: 978px; overflow: hidden; font-family: 'Ubuntu Condensed', Arial, Tahoma, sans-serif; margin:0 0 10px;}
 #slider > div {width:978px; margin:0 auto;}
 #slides {width:978px; height:369px; position: relative;}
 #slides .slide {width:978px; height: 369px; margin:0 10px 0 0; position:absolute; top:0;}
 #slides .slide img {position:absolute; top:0; left:0;}
 #slides .slide a {text-decoration: none;}
 #slides .slide .info {position: absolute; left:45px; bottom:20px; z-index: 9;}
 #slides .slide .info h3 {font-size:36px; color:#fff; background: url(gfx/bg_slider.png); float:left; clear: both; margin:0 0 2px; padding:1px 3px; text-shadow:none;}
 #slides .slide .info p {font-size:24px; color:#fff; background:  url(gfx/bg_slider.png); float:left; clear: both; padding:7px 3px;}
  #slides .slide .info a:hover h3 {background: url(gfx/bg_slider3.png);}
  #slides .slide .info a:hover p {background:  url(gfx/bg_slider3.png);}
 
 #slider .buttons {float:right; margin:10px 0 0 0;}
 #slider .buttons a.arrow {display: block; float:right; width:23px; height: 23px; margin:0 3px;}
 #slider .buttons a.arrow.larr {background: url(gfx/arrows.png) no-repeat 0 0;}
  #slider .buttons a.arrow.larr:hover {background: url(gfx/arrows.png) no-repeat 0 -23px;}
 #slider .buttons a.arrow.rarr {background: url(gfx/arrows.png) no-repeat -23px 0;}
  #slider .buttons a.arrow.rarr:hover {background: url(gfx/arrows.png) no-repeat -23px -23px;}
 
 #slider #loader {width:978px; height: 1px;}
 #slider #loader div {float:left; height: 1px; background:  url(gfx/bg_slider.png);}
 
#content {width:100%; min-width: 978px; margin:35px 0 45px; overflow: hidden;}
 #content > div {width:978px; margin:0 auto;}
 
 
 #content a.more {width:23px; height: 23px; display: block; float:right; color:#83ab17; font-weight: bold; background: url(gfx/moreh.png) no-repeat;}
 
 #content .title {font-size:27px; color:#52325e; text-transform: uppercase; line-height: 22px; margin:0 0 6px;}
 #content .title span {color:#83ab17; font-size:18px; display: block; font-weight: normal; line-height: 18px;}
 #content .clear {clear:both;}
 
 #content .title a {color:#52325e; text-decoration: none;}
 #content .title a span {color:#83ab17;} 

 #content .title a:hover {color:#78418d; text-decoration: none;}
 #content .title a:hover span {color:#83ab17;} 
 
 #content .box2 {width:474px; float:left; margin:10px 0 40px 5px;}
  #content .box2 + .box2 {margin:10px 0 40px 25px;}
  #content .box2:nth-child(3n+1) {clear:left; margin:10px 0 40px 5px;}
  #content .box2 p{text-align:justify;}
  
 #content .box3 {width:306px; float:left; margin:0 0 0 5px;} 
  #content .box3 + .box3 {margin:0 25px;}
  #content .box3 + .box3 + .box3 {margin:0 5px 0 0;}
 #content.homepage .box3 {cursor: pointer}
 #content.homepage .box3:hover .title {color:#78418d; text-decoration: none;}
  #content.homepage .box3:hover p {color: #555}
 #content.homepage .box3 a:hover {text-decoration: none}
 
 #content .box4 {width:222px; float:left; margin:10px 0 30px 0;}
  #content .box4 + .box4 {margin:10px 0 30px 30px;}
  #content .box4 + .box4 + .box4 {margin:10px 0 30px 30px;}
  #content .box4 + .box4 + .box4 + .box4 {margin:10px 0 30px 30px;}
  
 #content .box3 .left_box {width:84px; float:left; text-align: center;}
 #content .box3 .left_box img {float:none;}
 #content .box3 .right_box {width:222px; float:left;}
 #content .box3 p {margin:5px 0 0; text-align: justify;}
 
 #content .clients {width:474px; float:left; margin:40px 30px 0 0}
 #content .clients .title {margin:10px 0 20px 15px;}
 #content .clients li {width:141px; height:75px; display: block; float:left; margin:7px; background: #fff; border:1px solid #ebebeb; }
 #content .clients li img {margin:0 auto;}
  #content .clients li a {opacity:0.7; display: block;}
 
 #content .facebox {width:474px; float:left; margin:40px 0 0;}
 #content .facebox .title {margin:10px 0 20px 15px; }
 
 #content .left {width:708px; margin:18px 30px 0 0; float:left;}
 #content .right {width:240px; float:left;}
 #content .left .title {margin:0 0 30px 15px;}
 #content .right .title {margin: 0 0 30px;}
 
 #content .left.project_details {margin:0 30px 0 0;}
 #content .left.project_details .title {margin:0 0 2px 5px;}
 
 #content .left .case_studies {width:680px; margin:0 0 30px;}
 #content .left .case_studies .case {overflow: hidden; margin:13px 0 0;}
 #content .left .case_studies .case img.screen {float:left;}
 #content .left .case_studies .case .img_wrapper {float:left;}
 #content .left .case_studies .case .info {margin:0 0 0 5px; width:190px; padding:10px 0 0 10px; border-top:1px solid #e6e6e6; float:right;}
 #content .left .case_studies .case h3 {font-size:18px; text-transform: uppercase; color:#24211c; margin:0 0 5px;}
 #content .left .case_studies .case p {color:#6e6e6e; font-size:11px;}
 #content .left .case_studies .case a.more{visibility:hidden;}
  #content .left .case_studies .case:hover h3 a{color:#4a165e;}
  #content .left .case_studies .case:hover a.more{visibility:visible;} 
   #content .left .case_studies .case h3 a:hover {color:#83ab17; text-decoration: none;}
  
 #content .projects {width:699px; padding:30px 9px 0 0;}
 #content  .projects .project {width:307px; height: 140px; float:left; margin:0 42px 0 0;}
 #content  .projects .project h3 {float:left; font-size:18px; text-transform: uppercase; margin:3px 0 0; width:160px; line-height: 18px;}
 #content  .projects .project h3 a:hover {color:#83ab17; text-decoration: none;}
 #content  .projects .project a.link {color:#4a165e; text-decoration: none;}
  #content  .projects .project a.link:hover {text-decoration: underline;}
 #content  .projects .project a.more, #content .left .projects .project a.link{visibility:hidden;}
  #content  .projects .project:hover a.more, #content .left .projects .project:hover a.link {visibility:visible;}

  
 #content .right .testimonial {width:237px; padding:0 3px 0 0; text-align: right; line-height: 15px; margin:0 0 40px;}
 #content .right .testimonial p {font-style:italic; color:#838383; font-size:11px; line-height: 17px; text-align: left; margin:0 0 3px;}
 #content .right .testimonial p img {float:left; margin:0 10px 0 0;}
 #content .right .testimonial strong {display:block; font-size: 15px; text-transform: uppercase; font-family: 'Ubuntu Condensed', Arial, Tahoma, sans-serif;} 
 #content .right .testimonial span {display:block; font-size:12px; color:#999; margin:2px 0 3px; line-height: 13px;}
 #content .right .testimonial a {color:#52325e; font-weight: bold; font-size:11px;}
 
 #content .big_photo {width:978px; margin:0 0 20px;}
 #content .project_details .title {float:left; width:560px;}
 #content .project_details a.online {width:55px; height: 38px; padding:17px 0 0; margin:-10px 0 0; background: url(gfx/round.png) no-repeat; display: block; float:right; text-align: center; color:#fff; font-weight: bold; font-size:11px;}
  #content .project_details a.online:hover {text-decoration:none;}
 #content .project_details .info {clear: both; }
 #content .project_details .info .like {width:550px; float:left;}
 #content .project_details .desc {padding:0 0 20px; float:none; width:708px; overflow: hidden;}
 #content .project_details .desc p {margin:20px 0 0; text-indent: 25px; clear: both; text-align: justify;}
 #content .project_details .desc p img {padding:7px; background: #fff; margin:10px;  border:1px solid #ebebeb; }
 #content  img.alignleft {float:left; margin:0 15px 0 0; padding:7px; background: #fff;  border:1px solid #ebebeb; }
 #content  img.alignright {float:right; margin:0 0 0 15px; padding:7px; background: #fff;  border:1px solid #ebebeb; }


 #content  .projects.other {padding:25px 0 0; border-top:1px solid #e6e6e6; margin:30px 0 0;  float:none; clear:both; width: auto}
 #content  .projects.other .title {margin:0 0 25px;}
 #content  .projects.other .project {width: 307px; margin: 0 15px 0 0;}
 
 #content .clients.other {width: auto}
 #content  .clients.other .title {margin:0 0 25px;}

 #content .right .technology .title {margin: 15px 0;}
 #content .right .technology img {margin:2px 2px 2px 2px;}
 
 #content .offert {width:978px; clear: both;}
 #content .offert .title {margin:0 0 30px;}
 
 #content .aboutus {width:978px; overflow:hidden; padding:7px 0 40px;}
 #content .aboutus .title {margin:-7px 0 30px;}
 #content .aboutus p {margin:0 0 15px; text-align:justify;}
 #content .aboutus .alignright {margin:0 10px 0 20px}
 #content img.icon {float:left; margin:0 10px 3px 0;}
 #content .box2.clients .title {margin:0 0 6px;}
 
 #content .process {width:978px; clear: both; padding:50px 0 0;}
 #content .process .title {margin:0 0 20px;}
 #content .process .box4 .title {font-size:20px; margin:10px 0 0;}
 #content .process .box4 .title span {font-size: 16px;}
  #content .process.tech img{margin:2px 3px;}
  
 
 #content .services {width:978px; clear: both; padding:60px 0 0;}
 #content .services .title {margin:0 0 30px;}
  #content .services .box4:nth-child(5n+1) {clear: left; margin: 10px 0 30px 0 !important;}
 #content .services .box4 h3 {font-size:14px; color:#52325e; text-transform: uppercase; margin:0 0 7px}
 
 #content .offert .box3 .left_box {width:65px; float:left; text-align: center;}
 #content .offert .box3 .left_box img {float:left;}
 #content .offert .box3 .right_box {width:241px; float:left;}
 #content .offert .box3 .title {font-size:24px; margin:0 0 10px;}
 #content .offert .box3 .title span {font-size:17px;}
 
 #content .contact_address {width:326px; float:left; margin:0 50px 0 10px;}
 #content .contact_address strong {margin:7px 0 4px; display: block;}
 #content .contact_form {width:589px; float:left;}
 #content .contact_form .title, #content .contact_address .title {margin:0 0 20px;}
 
 #footer {width:100%; min-width:978px; border-top:1px solid #e6e6e6; background: url(gfx/bg_foot.png) repeat-x; clear: both; overflow: hidden; padding:18px 0 10px; color:#a2a2a2; font-size:11px; line-height: 15px;}
   #footer a {color:#a2a2a2;}
 #footer > div {width:978px; margin:0 auto;}
 #footer .copy {width:300px; float:left; padding:0 0 0 6px;}
 #footer .copy img {display:block; margin:3px 0;}
 #footer .address {width:168px; float:left;}
 #footer .phone {width:195px; float:left;}
 #footer .face {width:306px; float:left;}
 #footer strong {display:block; margin:3px 0;}
 #referencja .title {font-size:27px; color:#52325e; text-transform: uppercase; line-height: 22px; margin:0 0 2px;}
 #referencja img.thumb{float:left; margin:0 10px 10px 0;}
 #referencja p {margin:8px 0 0;} 
 #referencja .firma {color:#777; line-height:13px; margin:3px 0;}
 
  div.tooltip-body {cursor:default; background: url(gfx/toolb.png) no-repeat bottom; color: #fff;font-size: 11px;padding:0 0 5px;position: absolute;z-index:2000;text-shadow:none; overflow: hidden;}
  div.tooltip-body > div {padding:3px 7px; background: url(gfx/bg_slider.png);  border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; overflow: hidden;}
  
.wpcf7 input[type=text] {-moz-box-shadow: inset 2px 2px 6px #321d3a; -webkit-box-shadow: inset 2px 2px 6px #321d3a; box-shadow: inset 2px 2px 6px #321d3a; height: 24px; width:238px; color:#dbdbdb; font-weight: bold; padding:2px 6px;background: #52325e; border: 1px solid #fff;  border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;}
.wpcf7 .select select {background: transparent;-webkit-appearance: none; width: 238px; height: 22px !important; padding:6px 0 0; border:0; color:#dbdbdb; font-weight: bold;}
.wpcf7 .select {-moz-box-shadow: inset 2px 2px 6px #321d3a; clear: left; -webkit-box-shadow: inset 2px 2px 6px #321d3a; box-shadow: inset 2px 2px 6px #321d3a; height: 28px; width:242px; padding:0 4px; background:url(gfx/select.png) no-repeat right #52325e; border: 1px solid #fff;  border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;}
.wpcf7 .select select {padding-right:0px;vertical-align:top !important;text-align:left;height:auto;}
.wpcf7 .select option {padding:3px 0; background: #e9e9e9; color:#000;}
.wpcf7 .ctk {float:left; width:294px; padding:10px 0 12px;}
.wpcf7 .ctt {padding:10px 0; float:left;}
.wpcf7 .ctt textarea {width:533px; max-width:533px; height: 116px; padding:6px; -moz-box-shadow: inset 2px 2px 6px #321d3a; overflow: hidden; -webkit-box-shadow: inset 2px 2px 6px #321d3a; box-shadow: inset 2px 2px 6px #321d3a;color:#dbdbdb; font-weight: bold;background: #52325e; border: 1px solid #fff;  border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;}
span.wpcf7-not-valid-tip { position: absolute; top: -28px !important; z-index: 3 !important;font-size: 11px !important; right:3px !important; color:#c42026 !important; padding:0 20px 0 0 !important; text-align: right !important; width:auto; left:0 !important; border: 0 !important; background: url(gfx/validerr.png) no-repeat right transparent !important;}
.wpcf7 .submit {clear:left; width:549px; text-align: right;}
.wpcf7 .submit input[type=submit] {cursor: pointer; float:right; background: url(gfx/bgbttn.png) repeat-x #a7a7a7; height: 29px; padding:0 10px; color:#fff; font-weight: bold; font-size:11px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border:0;}
.wpcf7 .submit input[type=submit]:hover {background: #83ab17;}
div.wpcf7 img.ajax-loader {margin:6px 7px 0 0 !important;}


img.logo_klient{float:right; border: 1px solid #EBEBEB; background: #fff;}
a.online_link{margin: 0 0 2px 5px;}
a.online_link2 {margin: 0 0 2px 5px; clear:left; float:left;}

#cboxPrevious {background: url(gfx/prev.png) no-repeat top; width:18px; height: 18px;}
#cboxNext {background: url(gfx/next.png) no-repeat top; width:18px; height: 18px; left:22px !important;}
#cboxPrevious:hover {background: url(gfx/prev.png) no-repeat bottom;}
#cboxNext:hover {background: url(gfx/next.png) no-repeat bottom}


.testimonial_page{width:600px; margin:0 auto;}
.testimonial_page > h2{margin-bottom:20px !important;}
.testimonial_page img{float:left; margin: 0 10px 0 0;}
.testimonial_content{}
.testimonial_content p{text-align:justify;}
.testimonial_content h2{font-size: 19px; text-transform: uppercase; font-family: 'Ubuntu Condensed', Arial, Tahoma, sans-serif;}
.testimonial_content span{display:block; font-size:12px; color:#999; line-height: 13px; margin:0 0 10px 0;}


#cboxCurrent {left:45px !important;}